
    
    *,::before,::after {
    box-sizing:border-box;
    }
    
    * {
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color:transparent;
    }
    
    
    /* Setup
    ================================================== */
    
    .container { position:relative; margin:0 auto; }
    .column { width:inherit; }
    .galaxy-container-height
    {
        height:320px;
    }
    #video-content-main
    {
    }
    .galaxy-container-height-fullscreen
    {
        height:100vh !important;
    }
    .galaxy-bg-lheight
    {
        line-height:320px;
    }
    .galaxy-bg-lheight-fullscreen
    {
        line-height:100vh;
    }
    #galaxy-container
    {
      position: relative; width:100%; /*height:100vh;*/
      background:linear-gradient(-45deg, #19deea, #9c4feb);
      /*background: url(image/ted-talk-3.png) no-repeat center center fixed; */
      opacity:1
    }
    .full-contain{
      width: 100%;
    padding: 0 20px 10px;
    /*background: url(image/TED-logo.png) repeat center center fixed; */
    }
    .main-player-container{
      /*background-color:#0665a2; linear-gradient(-45deg, #19deea, #9c4feb);*/
      color:#111;
      border-radius: 5px;
    }
    #main_video
    {
        background: #111;
    }
    .main_video_height
    {
        width:100%;
        height:99vh
    }
    /* Typography / Links
    ================================================== 
    
    p { color:#fff; display:block; font-size:.9rem; font-weight:400; margin:0 0 2px; }
    
    a,a:visited { color:#8cc3e6; outline:0; text-decoration:underline; }
    a:hover,a:focus { color:#bbdef5; }
    p a,p a:visited { line-height:inherit; }
    */
    
    /* Misc.
    ================================================== */
    
    .add-bottom { margin-bottom:2rem !important; }
    .left { float:left; }
    .right { float:right; }
    .center { text-align:center; }
    .hidden { display:none; }
    
    .no-support {
    margin:2rem auto;
    text-align:center;
    width:90%;
    }
    
    
    /* Audio Player Styles
    ================================================== */
    
    audio {
    display:none;
    }
    
    #audiowrap,
    #plwrap {
    margin:0 auto;
    /*max-height: 450px;
    overflow: scroll;
    */
    }
    
    #tracks {
    font-size:0;
    position:relative;
    text-align:center;
    margin-bottom: 4px;
    }
    
    #nowPlay {
    display:block;
    font-size:0;
    }
    
    #nowPlay span {
    display:inline-block;
    /*font-size:1.05rem;*/
    font-size:13px;
    vertical-align:top;
    }
    
    #nowPlay span#npAction {
    padding:10px;
    width:30%;
    }
    
    #nowPlay span#npTitle {
    padding:10px;
    text-align:right;
    width:70%;
    }
    
    #plList li {
    cursor:pointer;
    display:block;
    margin:0;
    padding:10px 0;
    }
    
    #plList li:hover {
    background-color:rgba(0, 0, 0, .1);
    
    }
    
    .plItem {
    position:relative;
    }
    
    .plTitle {
    left:50px;
    overflow:hidden;
    position:absolute;
    right:65px;
    text-overflow:ellipsis;
    top:0;
    white-space:nowrap;
    }
    
    .plNum {
    padding-left:21px;
    width:25px;
    }
    
    .plLength {
    padding-left:21px;
    position:absolute;
    right:21px;
    top:0;
    }
    
    .plSel,
    .plSel:hover {
    /*background-color:rgba(0, 0, 0, .6);*/
    background-color:rgb(40, 167, 69);
    color:#fff;
    cursor:default !important;
    }
    
    #tracks a {
    border-radius:3px;
    color:#111;
    cursor:pointer;
    display:inline-block;
    font-size:2.3rem;
    height:42px;
    line-height:100%;
    margin:0 5px;
    padding:4px 12px;
    text-decoration:none;
    transition:background .3s ease;
    }
    
    #tracks a:hover,
    #tracks a:active {
    background-color:rgba(0, 0, 0, .1);
    color:#fff;
    }
    
    #tracks a::-moz-focus-inner {
    border:0;
    padding:0;
    }
    
    
    /* Plyr Overrides
    ================================================== */
    
    .plyr--audio .plyr__controls {
    background-color:transparent;
    border:none;
    color:#111;
    font-family:"Source Sans Pro", arial, sans-serif;
    padding:8px 0px;
    width:100%;
    }
    #plList
    {
        padding-left:0;
    }
    a.plyr__controls__item.plyr__control:hover,
    .plyr--audio .plyr__controls button:hover,
    .plyr--audio .plyr__controls button.tab-focus:focus,
    .plyr__play-large {
    background-color:rgba(0, 0, 0, .1);
    }
    
    .plyr__progress--played,
    .plyr__volume--display {
    color:rgba(0, 0, 0, .1);
    }
    
    .plyr--audio .plyr__progress--buffer,
    .plyr--audio .plyr__volume--display {
    background-color:rgba(0, 0, 0, .1);
    }
    
    .plyr--audio .plyr__progress--buffer {
    color:rgba(0, 0, 0, .1);
    }
    
    .plyr--full-ui input[type="range"] {
    /*width:calc(100% - 39px);
    width: 100%;*/
    }
    
    .plyr__controls .plyr__controls__item.plyr__time {
    font-size:14px;
    margin-left:7px;
    }
    
    .lyrics-box-mp3
    {
        width: 100%;
        position: absolute;
        top: 30%;
        left: 0;
        z-index: 1030;
        background: transparent;
        height:70%;
    }
    .auto_note_box_mp3{
        padding: 6px 4px;
        border-radius: 4px;
        float: left;
        max-width: 240px;
        margin: 2px;
    }
    .auto_note_mp3_text {
    color: #fff;
    overflow-y: scroll;
    float: left;
    font-size: 15px;
    }
    
    .user_note_box_mp3 {
        background: rgba(0,0,0,.3);
        padding: 6px 10px;
        border-radius: 5px;
        margin-right: 4px;
        border: 1px solid #9c4feb;
        max-width: 240px;
        float: left;
        max-height: 75px;
        overflow-y: scroll;
        }
    .auto_note_mp3_2
    {
        padding: 0px;
        border-radius: 10px;
        line-height: 18px;
        color:#FFDC00;
        font-size: 15px;
        font-weight: bold;
    }
    .lyrics-style-mp3-4
    {
        opacity: 0.7;
        color: #fff;
        margin: 0px;
        text-align: center;
        background: none;
        border-radius: 2px;
        font-size: 15px;
        line-height: 30px;
    }
    .word-note-mp3
    {
        line-height: 100%;
    }
    #auto_word{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #main-content-mp3-1
    {
        height:20%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #main-content-mp3-2
    {
        height:80%;
    }
    .player-menu-custom-1
    {
        width: 40px;
        position: absolute;
        top: 0;
        left: 0;
        padding: 4px 0px;
        z-index: 1003;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .video-menu-custom-1
    {
        width: 40px;
        position: absolute;
        top: 0;
        left: 0;
        padding: 4px 0px;
        z-index: 1003;
        height: calc(100vh - 45px);
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .player-menu-custom-sub-1
    {
        padding: 8px 4px;
        margin: 0 auto;
        height: fit-content;
        width: fit-content;
        background: linear-gradient(-45deg, #19deea, #9c4feb);
        border-radius: 15px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .mp3-control-devison
    {
        width: 30px;
        height: 2px;
        /* width: 2px; */
        border: 1px solid #ccc;
        float: left;
        cursor: pointer;
        margin: 10px 0px;
    }
    .mp3-icon-control
    {
        width:30px;height:30px;font-size:20px;background:#fff; border-radius:10px;float: left; cursor: pointer;
    }
    .mp3-box-control-content
    {
        padding:5px 10px;width:140px;background: #fff;border-radius: 5px;
        position:absolute;top:0; left: 26px;
        display: none;
    }
    #mp3-pick-word-container:hover .mp3-box-control-content
    {
        display: block;
    }
    .mp3-box-control-content a
    {
        color:#111;font-size: 13px;
    }
    /* Media Queries
    ================================================== */
    
    @media only screen and (max-width:600px) {
        #nowPlay span#npAction { display:none; }
        #nowPlay span#npTitle { display:block; text-align:center; width:100%; }
    }
    