@charset "UTF-8";

/* PLAYER JANUS */
#player-janus-mobile .box-player {width: 100%; padding-bottom: 56.25%; /* 16:9 */ position: relative; background-size: cover;}
/* controles */
#player-janus-mobile .box-controles {width:100%; height: 100%; position: absolute;
/* degrade */
background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 20%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0) 70%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 20%,rgba(0,0,0,0) 70%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#8c000000',GradientType=0 ); /* IE6-9 */
}
#player-janus-mobile .controles-left {width:100%; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);}
#player-janus-mobile .controles-right {position: absolute; bottom: 3%; right:3%;}
#player-janus-mobile .controles-top-right {position: absolute; top: 5%; right: 5%;}
/* botones */
#player-janus-mobile .btn-player {display: inline-block; border:none; height: auto; padding: 0; background: transparent; cursor: pointer;}
#player-janus-mobile .btn-player svg {fill: #ffffff; transition: all .2s ease;}
#player-janus-mobile .controles-left .btn-player svg {width:60px; height:60px;}
#player-janus-mobile .controles-right .btn-player svg {width:30px; height: 30px;}
#player-janus-mobile .controles-top-right .btn-player svg {width:30px; height: 30px;}
/* linea tiempo */
#player-janus-mobile .box-linea-tiempo {width:100%; height:5px; position: absolute; bottom: 0;}
#player-janus-mobile .box-linea-tiempo .box-progreso {width:100%; height:5px; position: absolute; background-color: #cccccc; opacity: .4; z-index: 10;}
#player-janus-mobile .box-linea-tiempo .barra-progreso {width:30%; height:5px; position: absolute; background-color: #cd3933; z-index: 20;}
/* popups modales */
#player-janus-mobile .modal1 {width:auto; display: none; position: absolute; background: rgba(255, 255, 255, 0.8); top: 5%; left: 5%; right: 5%; transition: opacity 500ms; z-index: 100;}
#player-janus-mobile .modal1 .auxi {padding: 1rem; position: relative; overflow: hidden;}
#player-janus-mobile .modal1 .auxi .cerrar {position: absolute; right:0.8rem; top:0.5rem; font-size: 21px; color: #000; opacity: 0.2; font-weight:bold; line-height:1; float: right; }
#player-janus-mobile .modal1 .auxi .titulo {font-size: 1rem;}
#player-janus-mobile .modal1 .auxi p {margin-bottom: 3px;}
#player-janus-mobile .modal1 .auxi .btn-social {display: inline-block; width:40px; border: none; height: auto; padding: 0; background: transparent; cursor: pointer;}
/*botones*/
#player-janus-mobile .btn-popup {width:100%; display: inline-block; font-weight: normal; text-align: center; color: #fff; background-color: #cd3933; border-color: #cd3933; white-space: nowrap; vertical-align: middle; border: 1px solid transparent; padding: 0.5rem 0.75rem; font-size: 1rem; line-height: 1.25; border-radius: 0.25rem; transition: all 0.15s ease-in-out; cursor: pointer;}
#player-janus-mobile .btn-popup.btn-popup-lg { padding: 0.5rem 1rem; font-size: 1.25rem; line-height: 1.5; border-radius: 0.3rem;}
#player-janus-mobile .btn-popup.btn-popup-sm {padding: 0.25rem 0.5rem; font-size: 0.875rem; line-height: 1.5; border-radius: 0.2rem;}
#player-janus-mobile .btn-popup:hover {color: #fff; background-color: #000; border-color: #000; text-decoration: none;}
/*campos*/
#player-janus-mobile .form-control-j {display:block; width:100%; padding:.5rem .75rem; font-size:1rem; line-height:1.25; color:#495057; background-color:#fff; background-image:none; background-clip:padding-box; border:1px solid rgba(0,0,0,.15); border-radius:.25rem; transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; }
#player-janus-mobile .campos-group {display: flex;}
/*extras*/
#player-janus-mobile .text-center {text-align:center;}
#player-janus-mobile ul {list-style: none; padding-left: 0;}
#player-janus-mobile a {text-decoration:none; color:#cd3933;}

/*--------------- Font face ---------------*/
@font-face {
    font-family: 'montserratbold';
    src: url('fonts/montserrat-bold-webfont.eot');
    src: url('fonts/montserrat-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-bold-webfont.woff') format('woff'),
         url('fonts/montserrat-bold-webfont.ttf') format('truetype'),
         url('fonts/montserrat-bold-webfont.svg#montserratbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratlight';
    src: url('fonts/montserrat-light-webfont.eot');
    src: url('fonts/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-light-webfont.woff') format('woff'),
         url('fonts/montserrat-light-webfont.ttf') format('truetype'),
         url('fonts/montserrat-light-webfont.svg#montserratlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratregular';
    src: url('fonts/montserrat-regular-webfont.eot');
    src: url('fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-regular-webfont.woff') format('woff'),
         url('fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratsemibold';
    src: url('fonts/montserrat-semibold-webfont.eot');
    src: url('fonts/montserrat-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-semibold-webfont.woff') format('woff'),
         url('fonts/montserrat-semibold-webfont.ttf') format('truetype'),
         url('fonts/montserrat-semibold-webfont.svg#montserratsemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}
/* FIN Font face */

/*--------------- Sistema de 12 Columnas  ---------------*/
#player-janus-mobile .colp {display: block; float:left; margin: 1% 0 1% 1.6%;}
#player-janus-mobile .colp:first-child { margin-left: 0; }
#player-janus-mobile .grid-12 {width:100%;}
#player-janus-mobile .grid-11 {width:91.53%;}
#player-janus-mobile .grid-10 {width:83.06%;}
#player-janus-mobile .grid-9 {width:74.6%;}
#player-janus-mobile .grid-8 {width:66.13%;}
#player-janus-mobile .grid-7 {width:57.66%;}
#player-janus-mobile .grid-6 {width:49.2%;}
#player-janus-mobile .grid-5 {width:40.73%;}
#player-janus-mobile .grid-4 {width:32.26%;}
#player-janus-mobile .grid-3 {width:23.8%;}
#player-janus-mobile .grid-2 {width:15.33%;}
#player-janus-mobile .grid-1 {width:6.86%;}

/*--------------- col responsive  ---------------*/
@media only screen and (max-width: 760px) {
    #player-janus-mobile .colp {margin: 1% 0 1% 0%;}
    #player-janus-mobile .grid-1, #player-janus-mobile .grid-2, #player-janus-mobile .grid-3, #player-janus-mobile .grid-4, #player-janus-mobile .grid-5, #player-janus-mobile .grid-6,
    #player-janus-mobile .grid-7, #player-janus-mobile .grid-8, #player-janus-mobile .grid-9, #player-janus-mobile .grid-10, #player-janus-mobile .grid-11, #player-janus-mobile .grid-12 {width: 100% !important;}
}

/* FIN */