body {

    margin: 0;

    padding: 0;

    background-position: left top;

  /* background-image: url(../img/fondojetix.jpg);*/

/*background-image: url(../img/backhalljt.jpg);*/

background-image: url(../img/navidad.jpg);

   /* background-color: #1e4370;*/

    background-repeat: no-repeat;

    background-size: 100% 100%;

    color: #c0c6f8;

    font-size: 14px;

    min-width: 360px;

    height: 100%;

    box-sizing: border-box;

    /*display: flex;*/

    flex-direction: column;

    font-family: 'Luggage';

}

#adspub{
height:10vw;
width:100%;

}




.bmc-btn {
 font-size: 14px !important;
}


@font-face {

    font-family: 'Luggage';

    src: url(../fonts/luggage.ttf);

    font-style: normal;

}



.facecomentarios {

    height: 200px;

    overflow-y: auto;

    width: 100%;

    background: red;

}



.poll {

    background: #1e4370;

}



.contenido {

    width: 100%;

    height: auto;

    background-color: #1e4370;

	display:flex;

}







.posterprincipal {

    width: 40%;

}





.submedia {

    width: 20%;

    height: auto;

    float: left;

    background-color: #2c5492;

}



    .submedia img {

        width: 100%;

        height: 90px;

        margin-top: 20px;

    }



    .submedia h1 {

        text-align: center;

        font-size:12px;

        color: white;

    }







.media {

    width: 80%;

    height: 100%;

    float: left;

    background: #1e4370;

}



.subcontenido {

    height: auto;

    width: 100%;

    background-color: #1e4370;

    overflow-y: auto;

    max-height: 1000px;

}





    .subcontenido::-webkit-scrollbar {

        width: 10px; /* Tama�o del scroll en vertical */

        height: 10px; /* Tama�o del scroll en horizontal */

    }



    .subcontenido::-webkit-scrollbar-thumb {

        background: #1e4370;

        border-radius: 4px;

    }



.contenidomodal::-webkit-scrollbar-thumb:hover {

    background: crimson;

    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);

}



.subcontenido::-webkit-scrollbar-track {

    background: #1e4370;

    border-radius: 4px;

}



select {

    overflow: auto;

    text-decoration: none;

    padding: 1.5%;

   

    font-size: 12px;

    color: #445599;

    background-color: #97a3d3;

    border-radius: 3px;

    border: 2px solid #7888b9;

    font-family: 'Luggage';

}



    select:hover {

        cursor: pointer;

    }







.ghost {

    position: absolute;

    width: 150px;

    height: 145px;

    z-index: 10001;

    display: block;

    opacity: 0.8;

    background: transparent url('../img/fantasma.png') no-repeat;

}



    .ghost.moving-left {

        -moz-transform: scaleX(-1);

        -webkit-transform: scaleX(-1);

        -o-transform: scaleX(-1);

        transform: scaleX(-1);

        filter: fliph; /*IE*/

    }



.marquesina {

    float: left;

    position: relative;

    background: #97a3d3;

    width: 100%;

    height: 50px;

}



    .marquesina h1 {

        background: #97a3d3;

        color: #354381;

        font-size: 18px;

    }



p {

    font-family: 'Luggage';

    font-size: 14px;

  

}





.posterprinc {

    width: 90%;

}



.listadesplegable {

    text-decoration: none;

    padding: 1%;

    font-weight: 600;

    font-size: 12px;

    color: white;

    background-color: #193075;

    border-radius: 6px;

    border: 2px solid #818ddf;

    font-family: 'Luggage';

}





select:focus > option:checked {

    background: black !important;

}



.modal {

    width: 100%;

    position: fixed;

    top: 0;

    right: 0;

    bottom: 0;

    left: 0;

    z-index: 40;

    display: flex;

    overflow: hidden;

    -webkit-overflow-scrolling: touch;

    outline: 0;

    background: rgba(0,0,0,0.8);

}



.velocidad {

    width: 100%;

    font-family: 'Roboto', sans-serif;

    color: white;

}



.vel01 {

    width: 40%;

    margin-left: 10%;

    float: left;

    background-color: purple;

}



.contenidomodal {

    margin: auto;

    width: 40%;

    height: 30%;

    background-color: whitesmoke;

    color: black;

    border-radius: 10px;

    padding: 2%;

    overflow-y: scroll;

}



    .contenidomodal::-webkit-scrollbar {

        width: 10px; /* Tama�o del scroll en vertical */

        height: 10px; /* Tama�o del scroll en horizontal */

    }



    .contenidomodal::-webkit-scrollbar-thumb {

        background: #193075;

        border-radius: 4px;

    }



     

    .contenidomodal::-webkit-scrollbar-track {

        background: #686868;

        border-radius: 4px;

    }







    .contenidomodal h2 {

        float: left;

    }



    .contenidomodal p {

        float: left;

        text-align: justify;

    }



    .contenidomodal .boton_personalizado3 {

        color: white;

        padding: 5px;

        background-color: #193075;

        border-radius: 6px;

        border: 2px solid #818ddf;

        cursor: pointer;

    }



.barrarepro {

    margin: 0;

    width: 100%;

    height: auto;
    float: left;
    display: flex;
    background-color: #b5c9ee;

}



.suscripcion {

    padding: 5%;

}



    .suscripcion table {

        width: 100%;

        font-family: 'Roboto', sans-serif;

    }



        .suscripcion table tr td {

            width: 30%;

            padding: 3%;

        }



            .suscripcion table tr td a {

                color: white;

                font-size: 20px;

                text-align: center;

                border: solid;

                border-color: white;

                background-color: crimson;

                padding: 4px;

                margin: 20%;

                width: auto;

                border-radius: 15px;

                text-decoration: none;

            }



            .suscripcion table tr td ul li {

                color: white;

                font-size: 14px;

                margin-left: 7%;

            }





    .suscripcion h3 {

        color: yellow;

        font-size: 18px;

        text-align: center;

    }



    .suscripcion p {

        color: white;

        font-size: 16px;

        text-align: justify;

    }



    .suscripcion h4 {

        color: #FF6187;

        font-size: 16px;

        text-align: center;

    }



    .suscripcion p {

        font-size: 20px;

    }



    .suscripcion img {

        width: 100%;

        height: 200px;

    }



.tabla_comentario {

    width: 100%;

    background-color: #8233c5;

}





.series {

    padding: 3%;

    overflow-y: scroll;

    height: 1100px;

}



    .series::-webkit-scrollbar {

        width: 10px; /* Tama�o del scroll en vertical */

        height: 10px; /* Tama�o del scroll en horizontal */

    }



    .series::-webkit-scrollbar-thumb {

        background: #193075;

        border-radius: 4px;

    }



      



    .series::-webkit-scrollbar-track {

        background: #686868;

        border-radius: 4px;

    }



    .series table {

        width: 100%;

    }



        .series table tr td {

            width: 30%;

            text-align: center;

            vertical-align: central;

        }



.serieimagen {

    width: 70%;

    padding: 5%;

    -webkit-transition: all 0.6s ease;

    -moz-transition: all 0.6s ease;

    -o-transition: all 0.6s ease;

}



    .serieimagen p {

        font-family: 'Luggage';

    }



    .serieimagen:hover {

        transform: scale(1.1);

        -moz-transform: scale(1.1); /* Firefox */

        -webkit-transform: scale(1.1);

        cursor: pointer;

    }



.titulo {

    background: #193075;

    color: white;

    height: 100px;

    padding: 10px;

}

    .titulo h1 {

        padding-left :5%;

        padding-top:2%;

        font-size:20px;

        font-family: 'Luggage';

        word-spacing: 1em;

        letter-spacing: 0.2em;

    }





.logoPrincipal {

    width: 100%;

    height:13vw;
   

}



.logoHalloween {

   width: 100%;

  height:250px;

}



ul, ol, dl { /* Debido a las diferencias existentes entre los navegadores, es recomendable no a�adir relleno ni m�rgenes en las listas. Para lograr coherencia, puede especificar las cantidades deseadas aqu� o en los elementos de lista (LI, DT, DD) que contienen. Recuerde que lo que haga aqu� se aplicar� en cascada en la lista .nav, a no ser que escriba un selector m�s espec�fico. */

    padding: 0;

    margin: 0;

}



f2 {

    text-align: right;

    padding: 0;

    font-family: 'Roboto', sans-serif;

    right: 0px;

}



h1 {

    font-family: 'Roboto', sans-serif;

    font-size: 24px;

}



h2 {

    float: right;

    font-family: 'Roboto', sans-serif;

}



header {

    background-position: left top;

    width: 100%;

    height: fit-content;

    background-size: 100% 100%;

    background-image: url(../img/bannerjetix.jpg);

    background-color: brown;

}



.barra {

    background-color: #193075;

    background-position: left top;

    width: auto;

    height: 100%;

text-align: center;

}



#sliderabajo {

    background-color: rgb(44, 52, 105);

}



.slider {

    display: flex;

    width: 656px;

}



.contenedor-slider {



    max-width: 100%;

    max-height: 53px;

    padding-bottom :10px;

    overflow: hidden;

    overflow-x:auto;

}



    .contenedor-slider::-webkit-scrollbar {

        width: 10px; /* Tama�o del scroll en vertical */

        height: 10px; /* Tama�o del scroll en horizontal */

    }



    .contenedor-slider::-webkit-scrollbar-thumb {

        background: #193075;

        border-radius: 4px;

    }



      



    .contenedor-slider::-webkit-scrollbar-track {

        background: rgb(60, 62, 62);

        border-radius: 4px;

    }



.btn-next {

    background-image: url(https://4.bp.blogspot.com/-8ExDVmfCgiI/WanNKVubw7I/AAAAAAAACiQ/lSZZnrWq7i4i9KhJ3Egxz_jv0QQm74NpQCLcBGAs/s1600/next.png);

}



.btn-next {

    width: 50px;

    height: 53px;

    float:left;

   

    font-family: monospace;

    cursor: pointer;

}



#imghorario {

    display: block;

    margin: auto;

    width: 100%;

}



.horario {

    color: #fff;

    position: absolute;

    top: 10%;

    left: 0;

    margin-left: 20%;

    margin-right: 20%;

    width: 60%;

    height: 600px;

    overflow-y: scroll;

    display: none;

    transition: all .5s;

    transition-duration: 0.4s;
    
    box-shadow: 0px 0px 30px black;

}



    .horario::-webkit-scrollbar {

        width: 10px; /* Tama�o del scroll en vertical */

        height: 10px; /* Tama�o del scroll en horizontal */

    }



    .horario::-webkit-scrollbar-thumb {

        background: #193075;

        border-radius: 4px;

    }



        



    .horario::-webkit-scrollbar-track {

        background: #686868;

        border-radius: 4px;

    }







.horario1 {

    top: 30%;

    width: 80%;

    left: 10%;

    right: 10%;

    position: fixed;

    background-color: black;

    display: none;

    transition: all .5s;

}



a.class_a_href {

    pointer-events: none;

    cursor: default;

}



#botoncerrar {

    width: 4%;

    border-radius: 5px;

    height: 4%;

    margin-right: 0;

    font-size: 12px;

}



.botoncerrar {

    top: 1%;

    right: 0%;

    position: absolute;

    text-decoration: none;

    color: white;

    background-color: #193075;

    border-radius: 2%;

    border: 2px solid #c0c6f8;

}



    .botoncerrar:hover {

        background-color: #304db1;

        color: white;

    }







@-webkit-keyframes opaco {

    from {

        opacity: 0;

    }



    to {

        opacity: 1;

    }

}





f1 {

    font-size: 20px;

    color: white;

    font-family: 'Roboto', sans-serif;

}



content {

    background-position: left top;

    width: 50%;

    background-color: black;

    position: relative;

}



.centrarimagen {

    display: block;

    margin-left: auto;

    margin-right: auto;

    width: 60%;

}



.derechaimagen {

    display: block;

    margin-left: 20%;

    width:60%;

}



.flotante {

    width: 20%;

    position: fixed;

    bottom: 10%;

    right: 20%;

}



.facebook {

    width: 20%;

    position: fixed;

    bottom: 4%;

    right: 1%;

}



    .facebook img {

        width: 100%;

    }



.flotante2 {

    width: 17%;

    position: fixed;

    bottom: 0%;

    right: 2px;

}



.botonform {

    background-color: black;

    border: double;

    color: white;

    width: 150px;

    height: 30px;

    font-size: 18px;

}



.reloj {

    font-family: 'Luggage';

    text-align: right;

    background-color: #1e4370;

    color: white;

    height: 2%;

    font-weight: bold;

}



.relojdis {

    color: white;

    background-color: #1e4370;

    text-align: center;

}



footer {

    background: #193075;

    color: white;

    padding-left: 3%;

    width: 97%;

    height: 100%;

    font-family: 'Luggage';

    font-size: 14px;

    bottom: 0;

    float: left;

    word-spacing: 0.2em;

    letter-spacing: 0.2em;

}



.video-container {

    position: relative;

    padding: 0;

    margin: 0;

    width: 100%;

    height: 28vw;

    text-align: center;

    background-color: black;

    background-size: cover;

    overflow: hidden;

}



#container {

    width: 60%;

    height: auto;

    background-color: #1e4370;

    bottom: 0;

    margin: 0 auto; /* el valor autom�tico de los lados, unido a la anchura, centra el dise�o */

}



.userVideo {

    position: relative;

    width: 100%;

    height: 100%;

    object-fit:fill;

}



.medio {

    margin-left: 12.5%;

    margin-right: 12.5%;

    width: 75%;

    height: auto;

    background-color: rebeccapurple;

}





.peerVideo {

    position: relative;

    width: 100%;

    height: 100%;

    display: none;

    object-fit: fill;

}







.logo {

    position: absolute;

    bottom: 12%;

    right: 19%;

    width: 12%;

    opacity:0.9;

}



.logomov {

    position: absolute;

    bottom: 6%;

    right: 5%;

    width: 22%;

    opacity: 0.9;

}



label {

    display: inline-block;

    width: auto;

    padding: 2%;

    text-align: left;

    font-family: 'Luggage';

}







.button {

    margin: 20px;

    font-size: 14px;

    float: right;

}



.boton_personalizado {

    text-decoration: none;

    padding: 1%;

    font-family: 'Luggage';

    font-size: 16px;

    color: white;

    background-color: #193075;

    border-radius: 6px;

    border: 2px solid #818ddf;

}



    .boton_personalizado:hover {

        color: white;

        background-color: #a3a2a4;

        cursor: pointer;

    }





.boton_personalizado2 {
    float: left;
    text-decoration: none;
    padding: 1.5%;
    padding-left: 5%;
    padding-right: 5%;
    font-family: 'Luggage';
    font-size: 15px;
    font-weight: 400;
     color: #445599;
    background-color: #97a3d3;
    border-radius: 3px;
    border: 2px solid #7888b9;
}



    .boton_personalizado2:hover {

        color: white;

        background-color: #a3a2a4;

        cursor: pointer;

    }



.power_ranger {

    margin-left: 10px;

    width: 10%;

}



.histats {

    width: 40vw;

}



.anuncio {

    width: 80%;

}











.spider {

    display: block;

    height: 145px;

    left: 40px;

    margin-left: 100px;

    position: absolute;

    top: 0;

    width: 45px;

    z-index: 100;

}



@keyframes spider-move {

    0% {

        height: 50px;

    }



    100% {

        height: 200px;

    }

}



.spider::before {

    display: block;

    content: "";

    width: 1px;

    height: 500px;

    background: #efebe4;

    margin-left: 50px;

    margin-bottom: -3px;

    z-index: 100;

    animation: spider-move 4s ease-in-out infinite alternate;

}





/*//////////////////estilo dispositivos moviles////////////*/







@media (max-width:900px) and (min-width:401px) {

    #body {

        width: 100vw;

        height: 100vh;

        background-color: aquamarine;

        /* ampliamos los textos si mide m�s de 800px */

    }

#adspub{
height:53%;
width:100%;

}


    .reloj {

        height: 20px;

    }



    .poll {

        height: auto;

    }



    .barrarepro {

        height: auto;

    }



    .subcontenido {

        height: 900px;

    }



    .submedia {

        height: 1300px;

    }



        .submedia h1 {

            font-size: 10px;

        }



    .media {

        height: 400px;

    }



    .contenido {

        height: 1300px;

    }



    header {

        height: 140px;

    }



    .logoPrincipal {

        width: 100%;
    height: -webkit-fill-available;

       

    }



    .logoHalloween {

        width: 100%;
        
        height: 165px;

        margin-left: 0%;

        margin-right: 0%;

    }

.logomov {

   

    right: 5%;

   

}




    #container {

        width: 100vw;

        height: 100%;

    }



    #botoncerrar {

        float: right;

        margin: 0;

        width: 10%;

        height: 7%;

        padding: 0;

        font-size: 11px;

        position: fixed;

        border-radius: 5px;

    }



    .modal {

        width: 100vw;

    }



    .contenidomodal {

        width: 90%;

        margin-right: 5%;

        margin-left: 5%;

        height: 45%;

        padding: 40px;

    }



        .contenidomodal p {

            float: left;

            text-align: justify;

            font-family: 'Luggage';

        }



    .horario {

        width: 80%;

        margin-left: 10%;

        margin-right: 10%;

        height: 200px;

        margin-top: 3%;

        padding: 0;

        position: fixed;

        overflow-y: scroll;

        overflow-x: scroll;

    }



    #imghorario {

        width: 718px;

        height: auto;

    }







    footer {

        width: 98vw;

        height: 100%;

        padding-left: 2vw;

    }



    .flotante {

        width: 30%;

        position: fixed;

        bottom: 10%;

        right: 1%;

    }



    .logo {

        position: absolute;

        bottom: 10%;

        right: 20%;

        width: 10%;

    }



    .facebook {

        width: 20%;

        position: fixed;

        bottom: 10%;

        right: 0;

    }



    .video-container {

        width: 100%;

        height: 45vw;

        margin: 0;

    }



    .userVideo {

        position: relative;

    

        width:100%;

       

        height: 100%;

    }



    .peerVideo {

        position: relative;

        width: 100%;

      

        height: 100%;

        display: none;

    }



    .suscripcion {

        padding: 1%;

    }



        .suscripcion table {

            width: 100%;

            font-family: 'Roboto', sans-serif;

        }



            .suscripcion table tr td {

                width: 30%;

                padding: 1%;

            }



                .suscripcion table tr td ul li {

                    color: white;

                    font-size: 14px;

                    margin-left: 3%;

                }



        .suscripcion p {

            color: white;

            font-size: 16px;

            text-align: left;

        }



    .serieimagen {

        border: 2px solid black;

        width: 90%;

        padding: 5%;

    }



    .ghost {

        position: absolute;

        width: 50px;

        height: 48px;

        z-index: 10001;

        display: block;

        opacity: 0.8;

        background: transparent url('../img/fantasma2.png') no-repeat;

    }



        .ghost.moving-left {

            -moz-transform: scaleX(-1);

            -webkit-transform: scaleX(-1);

            -o-transform: scaleX(-1);

            transform: scaleX(-1);

            filter: fliph; /*IE*/

        }

}





/*vista vertical*/



@media (max-width:400px) and (min-width:1px) {

    #body {

        width: 100%;

        height: 100vh;

        background-color: aquamarine;

        /* ampliamos los textos si mide m�s de 800px */

    }

#adspub{
height:53%;
width:100%;

}


    .reloj {

        height: 20px;

    }







    .barrarepro {

        height: auto;

    }



    .subcontenido {

        height: auto;

    }



    .submedia {

        height: 1300px;

        width: 30%;

    }



        .submedia h1 {

            font-size: 13px;

        }



    .media {

        height: 400px;

        width: 70%;

    }



    .contenido {

        height: 1300px;

    }



    header {

        height: 100px;

    }



    .logoHalloween {

        width: 100px;
        
        height: 119px;

        margin-left: 0%;

        margin-right: 0%;

    }



    .logoPrincipal {

        width: 100%;
    height: -webkit-fill-available;
       

    }

.logomov {

   

    right: 5%;

   

}




    #container {

        width: 100vw;

        height: 100%;

    }



    #botoncerrar {

        float: right;

        margin: 0;

        width: 10%;

        height: 7%;

        padding: 0;

        font-size: 11px;

        position: fixed;

        border-radius: 5px;

    }



    .modal {

        width: 100vw;

    }



    .contenidomodal {

        width: 90%;

        margin-right: 5%;

        margin-left: 5%;

        height: 45%;

        padding: 40px;

    }



    .horario {

        width: 80%;

        margin-left: 10%;

        margin-right: 10%;

        height: 200px;

        margin-top: 3%;

        padding: 0;

        position: fixed;

        overflow-y: scroll;

        overflow-x: scroll;

    }



    #imghorario {

        width: 718px;

        height: auto;

    }







    footer {

        width: 98vw;

        height: 100%;

        padding-left: 2vw;

    }



    .flotante {

        width: 30%;

        position: fixed;

        bottom: 10%;

        right: 1%;

    }



    .logo {

        position: absolute;

        bottom: 10%;

        right: 20%;

        width: 10%;

    }



    .facebook {

        width: 20%;

        position: fixed;

        bottom: 10%;

        right: 0;

    }



    .video-container {

        width: 100%;

        height: 40vw;

        margin: 0;

    }



    .userVideo {

        position: relative;



        width: 100%;

       

        height: 100%;

    }



    .peerVideo {

        position: relative;

        width: 100%;

     

        height: 100%;

        display: none;

    }



    .suscripcion {

        padding: 1%;

    }



        .suscripcion table {

            width: 100%;

            font-family: 'Roboto', sans-serif;

        }



            .suscripcion table tr td {

                width: 30%;

                padding: 1%;

            }



                .suscripcion table tr td ul li {

                    color: white;

                    font-size: 14px;

                    margin-left: 3%;

                }



        .suscripcion p {

            color: white;

            font-size: 16px;

            text-align: left;

        }



    .serieimagen {

        border: 2px solid black;

        width: 90%;

        padding: 5%;

    }



    .ghost {

        position: absolute;

        width: 50px;

        height: 48px;

        z-index: 10001;

        display: block;

        opacity: 0.8;

        background: transparent url('../img/fantasma2.png') no-repeat;

    }



        .ghost.moving-left {

            -moz-transform: scaleX(-1);

            -webkit-transform: scaleX(-1);

            -o-transform: scaleX(-1);

            transform: scaleX(-1);

            filter: fliph; /*IE*/

        }

}