.audiotitle > h1 {color: #FFFFFF;font-size: 2em;height: 70px;overflow: hidden;position: absolute;text-align: center;text-overflow: ellipsis;top: 0;white-space: nowrap;width: 100%;left: 0;}
.superTitle {background: none repeat scroll 0 0 #5F5F5F;color: #FFFFFF;display: block;font-size: 1.2em;font-weight: bold;height: 44px;padding-left: 10px;padding-top: 9px;position: relative;text-align: left;width: 100%;}
/* Playlist Styling */
.sm{margin-left:0;margin-top:10px;margin-bottom:10px;padding:0;}
.playlist li, .sm li {background: none repeat scroll 0 0 #CFCFCF;cursor: pointer;height: 44px;overflow: hidden;position: relative;text-overflow: ellipsis;white-space: nowrap;-webkit-transition: all 200ms ease;-moz-transition: all 200ms ease;-ms-transition: all 200ms ease;-o-transition: all 200ms ease;transition: all 200ms ease;}
.sm li{margin:0;}
.liSuperTitle{background: rgba(0,0,0,0.4) !important;}
.plItemani:hover{color:rgba(255,255,255,0.8);}
.plItemani {left: 0px;position: relative;overflow:hidden;text-overflow: ". . .";white-space: nowrap;-webkit-transition: all 400ms ease;-moz-transition: all 400ms ease;-ms-transition: all 400ms ease;-o-transition: all 400ms ease;transition: all 400ms ease;}
.playlist span{text-align:center;margin:1px;}
.trackthumb {background: none repeat scroll 0 0 #5F5F5F;color: #FFFFFF;cursor: pointer;display: inline-block;font-size: 2em;position: relative;text-align: center;top: -1px;width: 50px;z-index: 20;-webkit-transition: opacity 400ms ease;-moz-transition: opacity 400ms ease;-ms-transition: opacity 400ms ease;-o-transition: opacity 400ms ease;transition: opacity 400ms ease;}
.trackTitle, .trackTitle_spaced {cursor: pointer;left: 60px;position: absolute;top: 11px;}
.trackTitle:before, .trackTitle_spaced:before{background:#222;height:10px;width:2px;position:relative;}
.trackTitle_spaced{top:-12px;}
.trackLength{font-size:0.5em;position:absolute;left:80px;top:-46px;width:50px;padding:0px;margin:0px;display:block;}
.splash{background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);width:100%;color: rgba(255, 255, 255, 0.2);position:relative;top:0;text-align: center;z-index:300;height:50vh;}
/* Media Controls */
.media_controls {background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);bottom: 0;color: #888888;height: 44px;left: 0;padding-top: 3px;position: absolute;text-align: center;text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);width: 100%;z-index: 100;}
.mp-audio-container > .media_controls {top: 2px;padding-top:0;}
.media_buttons{font-size: 20px;top: 4px;min-width:44px;position:relative;-webkit-transition: all 200ms ease;-moz-transition: all 200ms ease;-ms-transition: all 200ms ease;-o-transition: all 200ms ease;transition: all 200ms ease;}
.mp-kill_switch {cursor: pointer;display: block;font-size: 2em;position: absolute;right: 0;text-align: center;top: 0;width: 50px;}
.mp-kill_switch i{color: rgba(255, 255, 255, 0.5);cursor:pointer;}
.mp-kill_switch i:hover{color: rgba(255, 255, 255, 0.9);}
#mp-annotation_button{}
.annotation_height{height:auto !important;}
.rmp {margin-bottom: 20px;overflow: hidden;padding: 0 0 0 15px;}
video {max-width: 75vw;}
.mmedia_container {display: table;left:0;height: 100%;position: fixed;width: 100%;z-index: 100000;top:0;display: flex;display: -webkit-flex;display: -ms-flexbox;-webkit-box-flex-direction: row;-webkit-flex-direction: row;-ms-flex: row;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;align-content: center;-webkit-align-content: justify-content: center;-webkit-justify-content: center;-ms-justify: center;align-items:center;-webkit-align-items:center;}
.youtube {margin-bottom: -5px;position: relative;z-index: 100000;}
.mp-youtube-container {position: relative;padding-bottom: 56.25%;padding-top: 25px;height: 0;}
.mp-youtube-positioner {width: 70%;}
.mp-audio-container > .media_controls {padding-right: 50px;text-align: right;background: none;color:#fff;}
.mp-loading {color: #fff;font-size: 2em;height: 44px;line-height: 44px;position: absolute;text-align: right;bottom: 0;padding-right: 10px;left: 0;z-index: 2000;width: 100%;animation-name: blinker;animation-timing-function: linear;animation-iteration-count: infinite;-webkit-animation-name: blinker;-webkit-animation-duration: 1s;-webkit-animation-timing-function: linear;-webkit-animation-iteration-count: infinite;}
.mp-external-container {z-index: 10000;position: relative;text-align:center;}
.mp-close-audio {font-size: 1.5em;position: absolute;right: -3px;}
.mp-audio-container > .audiotitle > h1 {color: #FFFFFF;font-size: 1em;height: 70px;left: 61px;overflow: hidden;position: absolute;text-align: left;text-overflow: ellipsis;top: -6px;white-space: nowrap;max-width: 31%;}
.sm li:hover {background: #f65801;color: #fff;}
.mp-youtube-container iframe,.mp-youtube-container object,.mp-youtube-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.mp-audio-container {background: none repeat scroll 0 0 #f65801;display: none;height: 44px;left: 0;position: absolute;top: 0;width: 100%;z-index: 10;}
.mp-reveal-audio{  animation: slideIn 1s ;-o-animation: slideIn 1s;-webkit-animation: slideIn 1s;-moz-animation: slideIn 1sanimation-fill-mode:forwards;-webkit-animation-fill-mode:forwards; /* Safari and Chrome */-moz-animation-fill-mode:forwards; /* Safari and Chrome */}
@keyframes slideIn {0% {left:-105%;} 100% {left:0;}}
@-webkit-keyframes slideIn {0% {left:-105%;} 100% {left:0;}}
@-moz-keyframes slideIn {0% {left:-105%;} 100% {left:0;}}
@-o-keyframes slideIn {0% {left:-105%;} 100% {left:0;}}
.progress_timer, .sprogress_timer{margin-left:20px;position: relative;top: 5px;}
.progress_duration, .sprogress_duration{position: relative;top: 5px;}
.progress_duration:before, .sprogress_duration:before{content: "/";padding-left:5px;padding-right:5px;}
.media_controls > .fa-play {padding-right:14px;}
.largeTimer {color: rgba(255, 255, 255, 0.2);font-size: 5em;padding-bottom: 15vh;padding-top: 15vh;position: relative;}
.mp-play_logo-large {color: #FFFFFF;display: none;font-size: 8vw;height: 126px;opacity: 0.2;position: absolute;text-align: center;top: 45vh;width: 100%;left: 0;}
.playlist_media_type:hover > .mp-play_logo-large{opacity: 0.4;}
/*--------------Annotations-----------------------*/
.trackAnnotation {font-size: 0.5em;font-weight: bold;left: 62px;position: absolute;top: 26px;}
.mp-annotations {background: none repeat scroll 0 0 rgba(0, 0, 0, 0.1);height: 25vh;top: 100%;width: 100%;z-index: 100;overflow:hidden;}
.audiotitle .mp-annotations {
background: rgba(255,255,255,0.2);
height: 100%;
top: 0;
width: 25%;
position: absolute;
left: -25%;
z-index: 100;
overflow: hidden;
color: #fff;
webkit-transition: left 500ms ease;-moz-transition: left 500ms ease;-o-transition: left 500ms ease;transition: left 500ms ease;
}
.audiotitle>.mp-annotations>ul {background: none;}
.audiotitle>.mp-annotations>ul>li {background: none;}
.audiotitle>.mp-annotations>ul>.flash_active {background: #fff;color: #333;}
.audiotitle .annotations_push{left:0;}
.preload_annotation {background: none repeat scroll 0 0 rgba(0, 0, 0, 0.2);cursor: pointer;list-style: none outside none;margin: 5px;padding-bottom: 10px;padding-left: 10px;padding-top: 10px;position: relative;}
.mp-annotations ul {margin: 0;padding: 5px;position: relative;top: -1px;background: #f65801;color:#fff;}
.mp-annotations ul li {background: #f65801;}
.flash_active:last-of-type{background:red;}
.topofthelist{color:rgba(255,255,255,0.5);}
.mp-annotations ul .flash_active{background:#fff; color:#333;}
/*--------------------------Animated Splash-----------------------------*/
.splash{text-align: center;white-space:nowrap;overflow:hidden;}
.ani_logo {animation: 0.3s ease 0s normal none 1 animatedLogo;-o-animation: 0.3s ease 0s normal none 1 animatedLogo;-webkit-animation: 0.3s ease 0s normal none 1 animatedLogo;-moz-animation: 0.3s ease 0s normal none 1 animatedLogo;color: rgba(255, 255, 255, 0.3);font-size: 2.5em;left: 0;position: relative;text-align: center;top: 43%;width: 100%;}
@o-keyframes animatedLogo {0% {color:rgba(255,255,255,0);font-size:50vw;opacity:0;width:100vw;left:-25vw;top:0;text-shadow: 4px 4px 30px rgba(255, 255, 255, 0.8);}90%{opacity:0.5;color:rgba(255,255,255,0);text-shadow: 4px 4px 23px rgba(255, 255, 255, 0.5);}100% {color:rgba(255,255,255,0.53);font-size:2vw;opacity:1;width: 100%;text-shadow: 0px 0px 21px rgba(150, 150, 150, 0);}}
@-moz-keyframes animatedLogo {0% {color:rgba(255,255,255,0);font-size:50vw;opacity:0;width:100vw;left:-25vw;top:0;text-shadow: 4px 4px 30px rgba(255, 255, 255, 0.8);}90%{opacity:0.5;color:rgba(255,255,255,0);text-shadow: 4px 4px 23px rgba(255, 255, 255, 0.5);}100% {color:rgba(255,255,255,0.53);font-size:2vw;opacity:1;width: 100%;text-shadow: 0px 0px 21px rgba(150, 150, 150, 0);}}
@-webkit-keyframes animatedLogo {0% {color:rgba(255,255,255,0);font-size:50vw;opacity:0;width:100vw;left:-25vw;top:0;text-shadow: 4px 4px 30px rgba(255, 255, 255, 0.8);}90%{opacity:0.5;color:rgba(255,255,255,0);text-shadow: 4px 4px 23px rgba(255, 255, 255, 0.5);}100% {color:rgba(255,255,255,0.53);font-size:2vw;opacity:1;width: 100%;text-shadow: 0px 0px 21px rgba(150, 150, 150, 0);}}
@keyframes animatedLogo {0% {color:rgba(255,255,255,0);font-size:50vw;opacity:0;width:100vw;left:-25vw;top:0;text-shadow: 4px 4px 30px rgba(255, 255, 255, 0.8);}90%{opacity:0.5;color:rgba(255,255,255,0);text-shadow: 4px 4px 23px rgba(255, 255, 255, 0.5);}100% {color:rgba(255,255,255,0.53);font-size:2vw;opacity:1;width: 100%;text-shadow: 0px 0px 21px rgba(150, 150, 150, 0);}}

/*-------------------------Animated Blink -------------------------------*/
.blink {animation-name: blinker;animation-duration: 2s;animation-timing-function: linear;animation-iteration-count: infinite;-webkit-animation-name: blinker;-webkit-animation-duration: 1s;-webkit-animation-timing-function: linear;-webkit-animation-iteration-count: infinite;}
@-moz-keyframes blinker {0% { opacity: 1.0; }50% { opacity: 0.5; }100% { opacity: 1.0; }}
@-webkit-keyframes blinker {0% { opacity: 1.0; }50% { opacity: 0.5; }100% { opacity: 1.0; }}
@keyframes blinker {0% { opacity: 1.0; }50% { opacity: 0.5; }100% { opacity: 1.0; }}
/*--------------------------Modal-----------------------------*/
.modal_media{position: relative;z-index: 1000000;}
.mp-fullscreen{background:rgba(0,0,0,0.9);width:100vw;height:100vh;position:fixed;top:0;left:0;z-index: 100000;}
/*--------------------------DEFAULT-----------------------------*/
.sprogress {border-radius: 0;margin-bottom: 0;margin-left: 10px;margin-right: 10px;position: relative;top: 10px;width: 29vw;}
/*-------------------------- Fert Fox -----------------------------*/
input.progress[type='range']::-moz-range-track,input.sprogress[type='range']::-moz-range-track {-moz-appearance: none;border: none;margin-left:20px;background-color: #888;height: 20px;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-ms-transition: all 500ms ease;-o-transition: all 500ms ease;transition: all 500ms ease;color: #fff; border-radius:0;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;position: relative;top: 9px;} 
input.progress[type='range']::-moz-range-thumb,input.sprogress[type='range']::-moz-range-thumb {-webkit-appearance: none;width:10px;height: 20px;border:none;border-radius: 0;background: #ffffff;}
/*-------------------------- GERGEL CHRERM -----------------------------*/
input.progress[type='range']::-webkit-slider-thumb, input.sprogress[type='range']::-webkit-slider-thumb {-webkit-appearance: none;width:10px;height: 20px;border-radius: 0;border:none;background: #ffffff;}
input.progress[type='range'],input.sprogress[type='range']{-webkit-appearance: none;background-color: #727272;border:0;padding:0;width: 25%;display: inline-block;}
/*-------------------------- MICROFAIL -----------------------------*/
input.progress[type='range']::-ms-thumb, input.sprogress[type='range']::-ms-thumb {-webkit-appearance: none;width:10px;height: 20px;border-radius: 0;border:none;background: #ffffff;}
input.progress[type='range']::-ms-track, input.sprogress[type='range']::-ms-track {position: relative;top: -1px;background-color: #727272;padding:0;border:0;height:20px;}
@media only screen and (min-width : 320px) and (max-width : 480px){
    .mp-close-audio{display:none;}
    .sprogress{display:none;}
    .sprogress_timer{margin-left: 0px;position: absolute;top: -2px;right:5px;}
    .sprogress_duration{position: absolute;top: 20px;right:5px}
    .sprogress_duration::before{content: "____";padding-left: 5px;padding-right: 5px;position:absolute;top: -18.5px;}
    .mp-audio-container{z-index: 20;}
    .audiotitle{margin-left:-20px;}
    .mp-audio-container > .audiotitle > h1{left: 11px;max-width: 35%;}
}