@font-face {
    font-family: 'NHaasGroteskDSStd56It';
    src: url('../fonts/NHaasGroteskDSStd56It.eot');
    src: url('../fonts/NHaasGroteskDSStd56It.eot') format('embedded-opentype'),
         url('../fonts/NHaasGroteskDSStd56It.woff2') format('woff2'),
         url('../fonts/NHaasGroteskDSStd56It.woff') format('woff'),
         url('../fonts/NHaasGroteskDSStd56It.ttf') format('truetype'),
         url('../fonts/NHaasGroteskDSStd56It.svg#NHaasGroteskDSStd56It') format('svg');
}

@font-face {
    font-family: 'NHaasGroteskDSStd55Rg';
    src: url('../fonts/NHaasGroteskDSStd55Rg.eot');
    src: url('../fonts/NHaasGroteskDSStd55Rg.eot') format('embedded-opentype'),
         url('../fonts/NHaasGroteskDSStd55Rg.woff2') format('woff2'),
         url('../fonts/NHaasGroteskDSStd55Rg.woff') format('woff'),
         url('../fonts/NHaasGroteskDSStd55Rg.ttf') format('truetype'),
         url('../fonts/NHaasGroteskDSStd55Rg.svg#NHaasGroteskDSStd55Rg') format('svg');
}



body{
    font-family: 'NHaasGroteskDSStd55Rg', 'Helvetica', 'Arial' !important;
    font-size: 16px !important;
    
    color: #000;
    overflow-x: hidden;
    background-color: none !important;
    background-image: url('../imgblanc/fdo_blanc.gif')!important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: top center;
    background-attachment: fixed;
}

.rotate-handle{
    display: none;
    background: url('../images/rotate_handle.png') top left no-repeat;
    background-size: contain;
    border: none !important;
    background-color: transparent !important;
}

.footer{
    max-width: 1770px;
    margin: 40px auto 0 auto;
    border-top: 1px solid #000;
    padding: 40px 15px 40px 15px;
    
}

.logos_footer{
    text-decoration: none !important;
}

.logos_footer img{
    max-width: 300px !important;
    height: auto;
}

h1, h2, h3, h4, h5, h6{
    font-family: 'NHaasGroteskDSStd55Rg', 'Helvetica', 'Arial' !important;
}

h2{
    margin-top: 20px;
}

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 100% !important;
    min-width: 100% !important;
    width: 100% !important;
  }

.div_entradas{
    max-width: 250px;
    float: right;
}

.inner_entraditas{
    float: right;
    cursor: pointer;
    background: url('../images/gifs/entraditas.jpg') top;
    height: 44px;
    width: 243px;
}
.inner_entraditas:hover{
    background-position: bottom;
}

.entraditas small{
    font-size: 0.8em;
}

.timer img{
    width: 100%; height: auto;
}
.timer{
    width: 243px;
    height: 100;
    float: right;
}

header {
    min-height: 80px;
    padding: 20px 0;
}

header.nav-down.header-sm {
  box-shadow: none !important;
  background-color: transparent; !important;
}

.logo a{
    text-decoration: none;
}

.draggable {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

 /* (Optional) Apply a "closed-hand" cursor during drag operation. */
.draggable:active {
    cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing;
}

/* **************************** OBJETOS ********************************* */

.img_ponente{
    width: 100%;
    max-width: 400px;
    height: auto;
    /*position: fixed;
    z-index: 1;*/
}



.name_ponente_img{
    text-align: center;
    margin: 0 auto;
    display: block;
}

.container_video {
    display: flex;
    justify-content: center;
    width: 800px;
}
    
.container_video iframe {
    aspect-ratio: 16 / 9;
    width: 100% !important;
}



.window{
    width: fit-content;
    position: fixed;
    z-index: 500000;
    /* border-radius */
     -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
     border-radius: 15px;
    /* box-shadow */
     -webkit-box-shadow: rgba(0,0,0,0.8) 0px 0 10px;
     -moz-box-shadow: rgba(0,0,0,0.8) 0 0 10px;
     box-shadow: rgba(0,0,0,0.8) 0 0 10px;
     display: none;
}

.window.test{
    display: block;
}

.window .window_barra{
    height: 62px;
}

.window .window_barra .ui_barra_left{
    background: url("../images/icons/ui_barra/ui-barra.png") no-repeat left top;
    height: 62px;
    width: 2%;
    float: left;
}

.window .window_barra .ui_barra_center{
    background: url("../images/icons/ui_barra/ui-barra_02.png") repeat-x center top;
    height: 62px;
    width: 96%;
    float: left;
}

.window .window_barra .ui_barra_right{
    background: url("../images/icons/ui_barra/ui-barra.png") no-repeat right top;
    height: 62px;
    width: 2%;
    float: left;
}



.btns_barra{
    float: left;
    margin:20px 0;
    width: 30%;
}

.titulo_ventana{
    width: 70%;
    float: right;
    font-weight: bold;
    padding: 15px 0;
    text-align: right;
    color: #222222;
}

.btns_barra .btn_barra{
    height: 18px;
    width: 18px;
    margin-right: 3px;
    display: inline-block;
    background-size: 100% !important;
}

.btns_barra .btn_barra:hover{
    background-position: top;
    cursor: pointer;

}

.btns_barra .btn_barra_close{
    background:url('../images/icons/ui-btn-red2.png') bottom no-repeat;
}
.btns_barra .btn_barra_min{
    background:url('../images/icons/ui-btn-yellow3.png') bottom no-repeat;
}
.btns_barra .btn_barra_size{
    background:url('../images/icons/ui-btn-green2.png') bottom no-repeat;
}

.btns_barra .btn_barra_move{
    background:url('../images/icons/btn_barra_move.png?v=1') bottom no-repeat;
}

.window .window_content{
    /*min-height: 400px;*/
    background: white;
    border:1px solid #DCDCDC;
    border-radius: 0px 0px 15px 15px;
    padding: 15px 15px 15px 15px;
    height: 50vh;
    overflow: hidden;
    position: relative;
}

.window_content .contenidos{
    overflow: auto;
    max-height: 100%;
    overflow-x: hidden;
}



.window_centered{
    top: 5vh;
    left: 33vw; 
    right: 33vw; 
    width: 33vw;
}



.objeto{
    padding: 5px;
}

.nodos{
    display: none;
}

.material{
    position: relative;
    min-height: 200px;
    overflow: hidden !important;
}

.material_images{
    text-align: center;
    width: 200px; height: auto;
    overflow: hidden !important;
    padding: 15px;
}

.material_images img{
    width: 100%;
    height: auto;
    box-shadow: 0 5px 5px 0 rgba(0,0,0,0.2),0 5px 5px 0 rgba(0,0,0,0.19) !important;
}

.material_video{
    width: 150px; height: auto;
}

.material_video video{
    width: 100%; height: auto;
}


.material_video{
 
}

.nombre_archivo{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; 
    max-width: 100%; 
    display: block;
}

.folder_home .folder_txt{
    width: 75px !important;
}

#box{
    animation-delay: 2s;
}
.box > div{height:10px;width:10px;background-color:white;position:absolute;border: 1px solid cyan}
#nw{top:-5px;left:-5px; cursor:nw-resize}
#n{top:-5px;left:50%;margin-left: -5px; cursor:n-resize}
#ne{top:-5px;right:-5px;cursor:ne-resize}
#w{top:50%;left:-5px;cursor:w-resize}
#e{top:50%;right:-5px;cursor:e-resize}
#sw{bottom:-5px;left:-5px;cursor:sw-resize}
#s{bottom:-5px;left:50%;cursor:s-resize}
#se{bottom:-5px;right:-5px;cursor:se-resize}



#box{
  position: absolute;
  /*width: auto;*/
  /*transition: all .5s ease;*/
}

#box img{ 
    width: 100%; height: 100%;
}

.folder{
    position: absolute;
    z-index: 10;
    animation-delay: 2s;
    overflow: hidden !important;
    overflow-x: hidden !important;
    width: 100px;
    text-align: center;
}



.folder_1{
    top: 20%;
    left: calc(((100vw + 1200px) / 2));
}

.folder_2{
    top: 30%;
    left: calc(((100vw + 1400px) / 2));
}

.folder_3{
    top: 40%;
    left: calc(((100vw + 1500px) / 2));
}

.folder_5{
    top: 30%;
    left: calc(((100vw + 800px) / 2));
}

.folder .folder_img{
    width: 75px !important;
    height: 75px !important;
    background: url('../imgblanc/folder.png') no-repeat top;
    margin: 0 auto;
}

.folder.folder_1 .folder_img{
    /*background: url('../imgblanc/folder_email.png') no-repeat top;*/
}

.folder .folder_txt{
    text-align: center;
    width: auto;
    background-color: transparent;
    border: none !important;
    white-space: initial;
    word-break:break-all;
    line-height: 1em;
}

.folder_ponente .folder_txt{
    word-break: normal;
}

/*.folder_ponente{
    width: 250px !important;
    height: 270px !important;
}

.folder_ponente .folder_img:hover{
    cursor: pointer;
    background-position: center bottom;
}

.folder_ponente .folder_img{
    width: 250px !important;
    height: 250px !important;  
    background-position: center top;
    background-size: 100%;
}*/

.folder_home .folder_txt:focus {
  background: #2f7aff;
  color: #fff;
  border: none !important;
}

.frase_matadora{
    bottom: 1%;
    left: calc(((100vw - 1800px) / 2));
    max-width: 600px;
    font-size: 2em;
    line-height: 1em;
    height: fit-content;
}

.textos_evento{
    bottom: 1%;
    right: 5%;
    max-width: 600px;
    font-size: 2em;
    line-height: 1em;
    height: fit-content;

}

.dog{
    bottom: 0;
    
    animation-delay: 2s;
    z-index: 0;
    position: fixed !important;
    right: 10%;

}

.programa{
    top: 30%;
    left: calc(((170vw - 500px) / 2));
    
    width: 20%; height: auto;
    rotate: 5deg;
    z-index: 1000;
}

.programa img{
   
}



.zodiaco{
    bottom: 15%;
    left: calc(((100vw - 1000px) / 2));
    animation-delay: 2s;
    z-index: 0;

}

.boca{
    bottom: 20%;
    left: calc(((100vw + 200px) / 2));
    animation-delay: 2s;
    z-index: 0;
    width: 450px; height: auto;
    padding: 0 !important;
}


.rayon{
    top: 13%;
    left: calc(((100vw + 300px) / 2));
    animation-delay: 1s;
    z-index: 0;
    animation-duration: 15s;
}

.star_blue_exlamacion{
    top: 20%;
    left: calc(((100vw + 900px) / 2));
    animation-delay: 0.5s;
    animation-duration: 8s;
}

.star_blue{
    top: 15%;
    left: calc(((100vw + 450px) / 2));
    animation-delay: 1.5s;
    z-index: 1;
    animation-duration: 10s;
}

.diablo{
    top: 21%;
    left: calc(((100vw - 400px) / 2));
    animation-delay: 2s;
}

.star_red{
    top: 17%;
    left: calc(((100vw + 200px) / 2));
    animation-delay: 2s;
}

.star_green{
    top: 35%;
    left: calc(((100vw - 500px) / 2));
    animation-delay: 2s;
    z-index: 2;
}

.star_green_face{
    top: 50%;
    left: calc(((100vw - 850px) / 2));
    animation-delay: 2s;
    z-index: 2;
}

.star_orange{
    top: 20%;
    left: calc(((100vw - 1900px) / 2));
    animation-delay: 2s;
}

.exclamacion{
    top: 10%;
    left: calc(((100vw - 1770px) / 2));
    animation-delay: 2s;
}

.mayofechas{
    top: 20%;
    left: calc(((100vw - 1170px) / 2));
    animation-delay: 2s;
    
}

.logo_central {
  top: 30%;
  left: calc(((100vw - 1170px) / 2));
  animation-delay: 2s;
  z-index: 1;
}

.silvertape{
    top: 40%;
    left: calc(((100vw - 1370px) / 2));
    animation-delay: 2s;
    z-index: 5;
}

.mad{
    top: 50%;
    left: calc(((100vw - 330px) / 2));
    animation-delay: 2s;
}

.active{
    border:1px solid cyan;
}

.frase_matadora_active{
    background: #fff;
}

/* **************************** MODAL ********************************* */

.modal-header .modal-title {
  line-height: 1em;
}
#apologia .form-container{
    text-align: left !important;
    letter-spacing: 0.05em;
    line-height: 1.3em;
}

#apologia .form-container strong{
    text-decoration: underline;
}

.modal-body {
  padding: 0 !important;
}

.modal-content {
  border-radius: 0;
  border: 0;
}

.modal-header .btn-close{
    z-index: 10 !important;
    background: url(../images/close-icon.png) no-repeat center;
    
}

.modal-header{
    padding: 25px;
    border-bottom: 1px solid #000;
}

.form-container{
    text-align: left;
    padding: 25px;
}

.tachado{
    text-decoration: line-through;
}

.frase_matadora{
    padding: 10px;
}


/* **************************** MOBILE ********************************* */



@media (max-width: 1800px) {
   


    .exclamacion{
        left:1%;
        width: 15% !important;
    }
    .star_orange{
        left:5px;
        width: 5% !important; 
    }
    .mayofechas{
        left:17%;
    }
    .logo_central{
        left: 17%;
        width: 60% !important;
        top: 34% ;
    }
    .frase_matadora{
        left: 20px;
        width: 50% !important; 
    }
    .silvertape{
        left: 15%;
        top: 50%;
        width: 12% !important;
    }
    .folder_1{
        left:auto; right: 10%;
    }
    .folder_2{
        left:auto; right: 5%;
    }
    .folder_3{
        left:auto; right: 1%;
    }
    .folder_5{
        left:auto; right: 25%;
    }
    .frase_matadora{
        font-size: 1.5em;
        width: 40% !important;
    }
    .mad{
        top: 60%;
    }
    .boca {
      width: 20% !important;
      top: 75%;
    }
    .dog{
        left:auto; right: 0 !important;
        width: 12% !important;
    }
    .diablo {
      top: 15%;
      left: 550px;
    }
    .star_green_face {
        left: 50%;
        top:80%;
      }
}

@media (max-width: 1650px) {
    .diablo{
        left: 600px;
    }
    .star_red{
        left: 60%;
        top: 27%;
    }
}


@media (max-width: 1550px) {

    .window_centered{
        
        left: 20vw; 
        right: 20vw; 
        width: 60vw;
    }

    .star_green{
        left: 40%
    }
    .star_green_face{
        left: 40%
    }
    .rayon{
        width: 17% !important;
    }
    .star_blue_exlamacion{
        left:auto; right: 15%;
    }
    
}

@media (max-width: 1450px) {

    
    .folder_1{ top:10%; right:20%; }
    .folder_2{ top:15%; right:10%; }
    .folder_3{ top:20%; right:1%; }
    .folder_5{ top:20%; right:25%; }

    .star_green_face{
       top: 75%; 
    }

    .star_blue_exlamacion{
        top:20%;
    }

    .mad {
      top: 60%;
      
    }
    .dog{
        right: 0;
        width: 15% !important;
    }

    .frase_matadora{
        bottom: 5% !important;
    }
    .boca {
      bottom: 0;
    }
}




@media (max-width: 1300px) {
    .exclamacion{
        width: 23% !important; 
    }
    .silvertape{
        width: 18% !important; 
    }
    .star_red{
        display: none;
    }

    
    
}


@media (max-width: 1300px) {

    header {
        padding: 40px 0 !important;
      }
    
    .entraditas{
        text-align: center;
        margin-top: 20px;
        color: #000;
        padding-top: 5px;
        background-image:none;
    }

    .inner_entraditas{
        float: none;
    }
    .silvertape {
        top: 47% !important;
    }

    .exclamacion{
        top:20% !important;
        left: 0;
    }
    .star_orange{
        top:10%;
        left: 0;
        width: 10% !important;
    }

    .star_green_face{
        top:60%;
        left:29%;
    }
    .frase_matadora{
        bottom: 1% !important;
    }
    .mayofechas{
        top: 25%;
        left: 25%;
    }
    .logo_central{
        top: 37%;
        left: 23%;
    }
    .rayon{
        display: none;
    }
    .diablo{
        left: 500px !important;
        width: 25% !important;
    }
    .star_blue_exlamacion{
        right: 30%;
        top: 30%;
    }
    .star_blue{
        left: auto;
        right: 14%;
    }
    .dog{
        width: 20% !important;
    }
    .mad{
        top:68%;
        z-index: 1;
    }
    .boca {
        z-index: 1;
        width: 20% !important;
        top: auto;
        left: auto;
        right: 15%;
        bottom: 0;
      }
    .folder{
        
    }
    .folder{
        z-index: 5 !important;
    }
    .folder_1 { right: 35%; bottom: 8%; }
    .folder_2 { right: 25%; bottom: 5%; }
    .folder_3 { right: 5%; bottom: 10%; }
    .folder_5 { right: 40%; bottom: 30%; }


}

@media (max-width: 992px) {

    .programa{
        width: 40%; height: auto;
    }
    .entraditas{
        text-align: center;
        margin-top: 20px;
        color: #000;
        padding-top: 5px;
        background-image:none;
    }

    .inner_entraditas{
        float: none;
    }
    .silvertape {
        top: 47% ;
    }

    .exclamacion{
        top:20% ;
        left: 0;
    }
    .star_orange{
        top:10% ;
        left: 0;
        width: 10% !important;
    }

    .star_green_face{
        top:60%;
        left:29%;
    }
    .frase_matadora{
        bottom: 1% !important;
    }
    .mayofechas{
        top: 25%;
        left: 25%;
    }
    .logo_central{
        top: 37%;
        left: 23%;
    }
    .rayon{
        display: none;
    }
    .diablo{
        left: 500px;
        width: 25% !important;
    }
    .star_blue_exlamacion{
        right: 0;
    }
    .dog{
        width: 20% !important;
    }
    .mad{
        top:60%;
        z-index: 1;
        right: 5%;
    }
    .boca{
        z-index: 1;
        width: 30% !important;
        top:72%;
        left: auto;
        right: 20%;
    }
    .folder{
        
    }
    .folder{
        z-index: 5 !important;
    }
    .folder_1 { right: 35%; bottom: 8%; height:100px; }
    .folder_2 { right: 25%; bottom: 5%; height:100px; }
    .folder_3 { right: 5%; bottom: 10%; height:100px; }
    .folder_5 { right: 40%; bottom: 30%;height:100px; }
}

@media (max-width: 768px) {

    .img_ponente{
        position: static;
        
    }

    .lightbox-prev, .lightbox-next{
        display: none;
    }
    .entraditas{
        text-align: center;
        margin-top: 20px;
        color: #000;
        padding-top: 5px;
        background: url('../imgblanc/fdo_tickets.png') no-repeat center center;
        background-size: contain;
    }
    .container_video {
        width: 500px;
    }



    .inner_entraditas{
        float: none;
    }

    .div_entradas{
        float: none;
        margin: 0 auto;
    }
    .silvertape {
        top: 45% !important;
    }

    .exclamacion{
        top:20% ;
        left: 0;
    }
    .star_orange{
        top:10% ;
        left: 0;
        width: 10% !important;
    }

    .star_green_face{
        top:60%;
        left:29%;
    }
    .frase_matadora{
        bottom: 10% !important;
    }
    .mayofechas{
        top: 25%;
        left: 25%;
    }
    .logo_central{
        top: 37%;
        left: 23%;
    }
    
    .rayon{
        display: none;
    }
    .diablo{
        left: 500px;
        width: 25% !important;
    }
    .star_blue_exlamacion{
        right: 0;
    }
    .dog{
        width: 20% !important;
    }
    .mad{
        top:52%;
    }
    .boca{
        z-index: 1;
        width: 30% !important;
        top:65%;
        left: auto;
        right: 32%;
    }
    .folder{
        
    }
    .folder{
        z-index: 5 !important;
    }
    .folder_1 { right: 35%; bottom: 8% !important; top: auto !important; }
    .folder_2 { right: 25%; bottom: 5% !important; top: auto !important; }
    .folder_3 { right: 5%; bottom: 10% !important; top: auto !important; }
    .folder_5 { right: 40%; bottom: 30% !important; top: auto !important; }

    .material_images{
         width: 100px;
    }
}



/* *************. moviles. ****************** */
@media (min-width: 501px){
    .programa .mov{
        display: none;
    }
    .programa .screen{
        display: block;
    }
}

@media (max-width: 500px) {

    /*.main-content{
        border: 1px solid red;
        width: 100vw !important;
    }
    #home{
        border: 1px solid green;
        width: 100vw !important;
    }
    .banner-wrapper{
        border: 1px solid yellow;
        width: 100vw !important;
    }*/

    .window_centered{
        
        left: 5vw !important; 
        right: 5vw !important; 
        width: 90vw;
    }
    .programa .screen{
        display: none;
    }
    .programa .mov{
        display: block;
        
    }
    .programa{
        width: 90%; height: auto;
        top:80%;
        rotate: 0deg;
        left: calc(((170vw - 800px) / 2));
    }

    header {
        padding: 15px 0 !important;
      }

    .banner .banner-wrapper{
        max-width: 100vw !important;
    }

    .entraditas{
        margin-top: 0;
    }


    .logo{ padding: 0 !important}

    .frase_matadora{
        bottom: 5px;
        font-size: 1em;
    }
    .folder{
        right: 1%;
    }
    .folder_1{ top:auto ; left: auto; right: 5%;  bottom: 23% !important;  }
    .folder_2{ top:auto ; left: auto; right: 5%; bottom: 13% !important;  }
    .folder_3{ top:auto ; left: auto; right: 5%; bottom: 15px !important;  }
    .folder_5{ top:20% ; left: auto; right: 5%; bottom: 70% !important;  }

    .exclamacion{
        width: 30% !important; 
        left: 15px;
        top:150px;
    }

    .mayofechas{
        left:5%;
        width: 50% !important;
        top:20%;
    }
    .logo_central{
        left: 1%;
        top: 30%;
        width: 100% !important;
    }
    .dog{
        width: 30% !important;
    }

    .star_green{
        width: 20% !important;
        left: auto !important;
        right: 0;
        top: 20%;
    }

    .star_green_face{
        width: 20% !important;
        left: auto;
        right: 15%;
        top: 55%;
    }

    .star_orange {
        width: 15% !important;
        top: 15%;
    }

    .star_blue_exlamacion, .exclamacion{
        display: none;
    }

    .silvertape {
        width: 25% !important;
        left: -10px;
        top: 40% !important;
      }

    .mad {
        top: 45%;
        width: 70% !important;
        left: auto;
        right: 0;
        z-index: 10;
    }

    .boca {
      bottom: auto !important;
      left: auto;
      width: 45% !important;
      height: auto !important;
      padding: 0 !important;
      top: 50%;
      right: 40%;
    }

    .rayon{
        width: 30% !important;
        top:20%;
        left:auto;
        right: 15%;
    }
    .star_blue{
        top: 23%;
        left: auto;
        right: 20%;
        z-index: 1;
    }

    .diablo {
      top: 15%;
      left: auto !important;
      right: 1%;
    }

    .main-content{
        margin-top: 100px;
    }

    .div_entradas{
        margin:0 auto;
    }
    .container_video {
        width: 400px;
    }
    .material_images{
         width: 100px;
    }
}

@media (max-width: 380px) {

    .boca{
        display: none;
    }

    .main-content{
        margin-top: 100px;
    }
    .container_video {
        width: 3500px;
    }
    .material_images{
         width: 100px;
    }
}

.banner-wrapper {
        height: auto;
        min-height: 100vh !important;
        overflow: auto;
        position: relative !important;
    }