.file-input:lang(en)~.custom-file-label::after,
.custom-file-label::after{
    content:"Adjuntar"
}
#div_id_constancia_participacion_docente > label{
    width: 48%;
}



:root {
    /* general variables */
    --bodyColor: #353535;
    --titleColor: #222f5b;
    --brandColor: #9e9e9e;
    --lightColor: #6c757d;
    --lineColor: #c2cbd3;
    --complementaryColor: #2e3677;
    --bgColor:#ffffff;
    --mainTitleSize:3rem;
    --bodySize:16px;
    /* macro lobby door variables */
    --mld-width: 100px;
    --mld-left: 420px;
    --mld-spacing: 13px;

    /* course door variables */
    --cd-width: 149px;
    --cd-left: 50px;
    --cd-spacing: 56px;

   /* stand item variables */
    --si-width: 60px;
    --si-left: 621px;
    --si-spacing: 14px;
  }
  .btn-primary{
    background-color: #222f5b;
    border-color:#222f5b;
  }
  body{

      font-family: 'Helvetica', sans-serif;
      color: var(--bodyColor);
      background-color: var(--bgColor);
      font-size: var(--bodySize);
      ;
      /* padding-top: 88px; */
  }
  
  h1,h2,h3,h4,.title{
     color: var(--titleColor);
     font-weight:bold;
  }
  
  li{
    color: var(--bodyColor);
  }
  
  /*#intro{
      background-image: url('https://via.placeholder.com/1280x706');
  }*/
  
  a{
      color: var(--brandColor);
  
  }
  
  a:hover{
    color: var(--titleColor);
    text-decoration: none;
  }
  a.plane-link{
    color: var(--bodyColor);
  }
  a.plane-link:hover{
    color: var(--brandColor);
  }
  a.white:hover{
    color: var(--brandColor)!important;
  }
  a.white.over2:hover{
    color: var(--titleColor)!important;
  }
  h1, .title{
      color: var(--titleColor);
      font-size: var(--mainTitleSize);
  }
  /* .broken-screen{
    background-color:#ff00ff;
    width: 1px;
    height: 100vh;
    position: fixed;
    top:0;
    left:15%;
    z-index: 9999;
  } */
  
  .primary-color{
    color: var(--titleColor);
  }
  .brand-color{
      color: var(--brandColor);
  }
  .light-color{
    color: var(--lightColor);
  }
  .complementary-color{
    color: var(--complementaryColor);
  }
  .link-color{
    color: #007bff;
  }
  .custom-title .title{
      line-height: 0.8em;
  }
  .custom-title .brand-color{
      font-size: 1.5rem;
  }
  .color-red{
    color:red;
  }
  .hr-blue{
    border-color: var(--titleColor);
    border-width: 2px;
  }
  
 
  .nav-link{
      font-weight: 500;
      text-decoration: none;
      font-weight: medium;
      font-size: 18px;
      color: var(--titleColor);
      border-bottom: 2px solid transparent;
      line-height: 1.4rem;
      padding-bottom: 0.2rem;
      /* margin-bottom: 0.5rem; */
      text-align: center;

  }
  .nav-link:hover,.nav-link.active{
      text-decoration: none; 
      border-bottom: 0;
      border-bottom: 2px solid var(--brandColor);
      
  }
  .navbar-expand-md .navbar-nav.navbar-out .nav-link{
    padding-right: 1rem;
    padding-left: 1rem;
  }
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: .7rem;
    padding-left: .7rem;
}

.nav-tabs .nav-link{
  padding: 15px;
  border-color: var(--brandColor);
}
.nav-tabs .nav-link.active{
  background-color: var(--titleColor) ;
  border-color: var(--brandColor);
  color:white;
}
.sesiones-nav.nav-tabs .nav-link.active{
  background-color: var(--complementaryColor) ;
  border-color: var(--complementaryColor);
  color:white;
}
.username{
    max-width: 110px;
}
  .px100{
    font-size: 100px;
  }
  .px23{
      font-size: 23px;
  }
  .px25{
      font-size: 25px;
  }
  .px50{
      font-size: 50px;
  }
  .px40{
      font-size: 40px;
  }
  .px35{
    font-size: 35px;
  }
  .px30{
      font-size: 30px;
  }
  .px20{
      font-size: 20px;
  }
  .px18{
      font-size: 18px;
  }
  
  .px16{
      font-size: 16px;
  }
  .px14{
      font-size: 14px;
  }
  .px12{
      font-size: 12px;
  }
  .px10{
    font-size: 10px;
  }
  .bold{
      font-weight: bold;
  }
  .boldi{
      font-weight: bold;
      font-style: italic;
  }
  .medium{
      font-weight: 500;
  }
  .white{
    color: white!important;
  }
  
  .lh-2{
      line-height: 0.5em
  }
  .tx-wine{
      color: var(--wine-color);
  }
  .plane-link{
      color: inherit;
      text-decoration: none;
  }
  .plane-link:hover{
      color: inherit;
      text-decoration: none;
  }
  .form-inline .form-control{
      width: 215px;
  }
  .form-control{
      border: 1px solid var(--titleColor);
  }
  .cuota-field{
      width:100%
  }
  
  .btn-outline-brand{
    color: var(--brandColor);
    border-color:var(--brandColor);
  }
  .bg-complementary{
    background-color: var(--complementaryColor);
  }
  .bg-buildings{
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    padding-bottom:350px;
    position: relative;
  }

  .coutas-table tbody tr{
      cursor: pointer;
      
  }

  .coutas-table tbody tr:hover, .coutas-table tr.selected{
      background-color: var(--brandColor);
  }
  .coutas-table thead{
    background-color: var(--titleColor);
    color: white;
  }

  .ui-widget.ui-widget-content{
      z-index: 1100;
      max-height: 500px;
      overflow: scroll;
  }
  .category-item{
    transform: skew(-20deg);
    box-shadow: -1px 4px 14px -4px rgba(0,0,0,0.75);
  }
  .category-item .category-number{
    background-color: white;
    font-size: 35px;
    font-weight: bold;
    text-align: center;
  }
  .category-item p{
    margin:1rem 0;
    transform: skew(20deg);
  }
  .category-item .category-title{
    border-left: 10px solid black;
  }
  .category-item h2{
    color: white;
    font-size:18px;
    transform: skew(20deg);
  }

  .category-indicators li{
    display: inline-block;
  }
  .category-indicators .color-indicator{
    display: inline-block;
    width: 15px;
    height: 15px;
    

  }

  .profesor-list{
    list-style: none;
    padding-left: 0;
  }
  
  .bg-buildings .footer{
    width: 100%;
    position: absolute;
    bottom: 0px;
    color:#353535;
    font-size: 12px;
    font-weight: bold;
    display: block
  }
  .footer{
    /* display: none; */
  }
  .abs a.flag-btn{
    display: inline-block;
    width: auto;
    height: auto;
  }
  .abs .flag-btn >img{
    padding: 1px;
    width: 40px;
    height: auto;
    display: inline-block;
  }
  .flag-btn.selected >img, .flag-btn:hover >img{
    border: 3px solid var(--brandColor);
  }

  .gafete{
    width: 507px;
    height: 658px;
    background-size: contain;
    margin: 0 auto;
    display: inline-block;
    position: relative;
  }

  .gafete-content{
    width: 100%;
    padding: 20px;
    margin-top: 325px;
    color: white;
  }

  .gafete-title{
    position: absolute;
    width: 100%;
    padding: 20px;
    top: 135px;
    color: #000;
    text-transform: uppercase; 
  }
  .gafete-footer{
    position: absolute;
    padding: 20px;
    bottom: 10px;
    right: 0px;
    font-size: 14px;
    color:white;
  }
  .gafete img{
    top:0;left:0;
  }

  .add-to-agenda,.remove-from-agenda{
    border: none;
    background-color: transparent;
  }
  #asistenteForm .modal-footer{
    border-top: 0;
  }
  .rate {
    float: left;
    padding: 0 10px;
  }
  .rate > label{
    margin-bottom: 0;
  }
  .rate:not(:checked) > input {
      position:absolute;
      left:-9999px;
  }
  .rate:not(:checked) > label {
      float:right;
      width:1.1em;
      overflow:hidden;
      white-space:nowrap;
      cursor:pointer;
      font-size:20px;
      color:#ccc;
  }
  .rate:not(:checked) > label:before {
      content: '★ ';
  }
  .rate > input:checked ~ label {
      color: #ffc700;    
  }
  .rate:not(:checked) > label:hover,
  .rate:not(:checked) > label:hover ~ label {
      color: #deb217;  
  }
  .rate > input:checked + label:hover,
  .rate > input:checked + label:hover ~ label,
  .rate > input:checked ~ label:hover,
  .rate > input:checked ~ label:hover ~ label,
  .rate > label:hover ~ input:checked ~ label {
      color: #c59b08;
  }
  #disqus_thread_container{
    display: none;
    background-color: #f3f3f3;
  }
  #disqus_thread{
    background-color: #f3f3f3;
    padding: 20px;
  }
  .commento-root{
    padding: 12px 40px!important;
  }
  .commento-name{
    max-width: 350px!important;
  }
  
  
.salon-titulo{
  background-color: rgba(255,255,255,0.90);
  border-radius: 10px;
  margin-top: 10px;
}
body.b-render{
    background-color: black;
}
.background-container{
    /* width:100%;
    height:100vh; */
    position: relative;
    margin: 0 auto;
    width:1280px;
    height: 615px;
    background-repeat: no-repeat;
    background-color: black;
    background-size: contain;
}
.abs{
    cursor: pointer;
    position: absolute;
    transition: all .2s ease-in-out;
    /* background-color:  rgba(233, 226, 0, 0.5); */
}
.abs.no-pointer, .no-pointer{
  cursor:default
}

.zoom:hover{
    /* background-color:  rgba(255,0,0,0.5); */
    transform: scale(1.1);
}

.abs img,.abs a{
    width: 100%;
    height: 100%;
    display: block;
}
.faqs{width: 40px; height:40px; top: 26px; right:58px}

/* -------MACRO LOBBY -------- */
.macrolobby-comegotv{width: 250px;height: 165px;top: 358px;left: 10px;}
.macrolobby-publicaciones{width: 250px;height: 165px;top: 358px;left: 1019px;}
.macrolobby-macroexpo{width: 244px;height: 103px;top: 351px;left: 519px;}
.macrolobby-banner-top{width: 244px;height: 42px;top: 308px;left: 518px;}
.macrolobby-banner-left{width: 51px;height: 144px;top: 310px;left: 466px;}
.macrolobby-banner-right{width: 51px;height: 144px;top: 310px;left: 763px;}
.macrolobby-puerta{width: var(--mld-width);height: 100px;top: 184px;}



.courses-title{width: 100%;height: 27px;top: 5px;left: 0;color: white;text-align: center;cursor: text;font-size: 23px;}
.curso-select{width: var(--cd-width);height: 200px;top: 95px; }

/* -------Salon Investigacion -------- */
.contenidos-investigacion{
  width: 300px;height: 370px;left: 851px;top: 10px;
  background-color: rgba(255,255,255,0.90);
  border-radius: 10px;
  overflow-y: scroll;
}
.investigacion-videoplayer{width: 583px;height: 290px;top: 8px;left: 231px;}
.item-investigacion .fa-arrow-circle-right{ display: none;}
.item-investigacion.selected .fa-arrow-circle-right{ display: inline;}
/* -------LOBBY -------- */
.lobby-logocomego{width: 258px;height: 80px;top: 66px;left: 490px;cursor: default;}
.lobby-register{width: 300px;height: 164px;top: 306px;left: 103px;}
.lobby-salones{width: 109px;height: 87px;top: 220px;left: 570px;}
.lobby-expo-comercial{width: 116px;height: 81px;top: 345px;left: 566px;}


.lobby-izq1{width: 75px;height: 20px;top: 242px;left: 489px;}
.lobby-izq2{width: 75px;height: 20px;top: 336px;left: 489px;}
.lobby-izq3{width: 75px;height: 20px;top: 381px;left: 491px;}
.lobby-der1{width: 75px;height: 20px;top: 242px;left: 687px;}
.lobby-der2{width: 75px;height: 20px;top: 336px;left: 681px;}
.lobby-der3{width: 75px;height: 20px;top: 381px;left: 683px;}

/* -------REGISTRO -------- */
.registro-test{width: 265px;height: 143px;top: 302px;left: 0px;}
.registro-inscripcion{width: 70px;height: 70px;top: 345px;left: 401px;}
.registro-programa{width: 70px;height: 70px;top: 302px;left: 434px;}
.registro-chat{width: 70px;height: 70px;top: 302px;left: 527px;}
.registro-llamanos{width: 70px;height: 70px;top: 302px;left: 616px;}
.registro-izq{width: 55px;height: 138px;top: 312px;left: 323px;}
.registro-supr{width: 317px;height: 76px;top: 204px;left: 401px;}
.registro-der{width: 54px;height: 138px;top: 312px;left: 739px;}

/* -------SALONES -------- */
.itemsalon-1{width: 134px;height: 309px;top: 33px;left: 36px;transform: rotate(0deg) skew(4deg, 4deg)}
.itemsalon-2{ width: 116px; height: 321px; top: 29px; left: 170px; transform: rotateY(15deg) rotateX(-33deg) skew(12deg, 5deg);}
.itemsalon-3{ width: 93px; height: 327px; top: 27px; left: 281px; transform: rotateY(17deg) rotateX(-42deg) skew(14deg, 6deg);}
.itemsalon-4{ width: 76px; height: 218px; top: 84px; left: 371px; transform: rotateY(21deg) rotateX(-1deg) skew(3deg, 4deg);}
.itemsalon-4{ width: 76px; height: 218px; top: 84px; left: 371px; transform: rotateY(21deg) rotateX(-1deg) skew(3deg, 4deg);}
.itemsalon-5{ width: 74px; height: 223px; top: 83px; left: 818px; transform: rotateY(-14deg) rotateX(-10deg) skew(-5deg, -6deg);}
.itemsalon-6{ width: 88px; height: 238px; top: 72px; left: 891px; transform: rotateY(2deg) rotateX(-1deg) skew(-3deg, -1deg);}
/* .itemsalon-comego{width: 134px;height: 309px;top: 33px;left: 36px;transform: rotate(0deg) skew(4deg, 4deg)}
.itemsalon-diana{ width: 116px; height: 321px; top: 29px; left: 170px; transform: rotateY(15deg) rotateX(-33deg) skew(12deg, 5deg);}
.itemsalon-bellasartes{ width: 93px; height: 327px; top: 27px; left: 281px; transform: rotateY(17deg) rotateX(-42deg) skew(14deg, 6deg);}
.itemsalon-angel{ width: 76px; height: 218px; top: 84px; left: 371px; transform: rotateY(21deg) rotateX(-1deg) skew(3deg, 4deg);}

.itemsalon-trabajos{ width: 74px; height: 223px; top: 83px; left: 818px; transform: rotateY(-14deg) rotateX(-10deg) skew(-5deg, -6deg);}
.itemsalon-residentes{ width: 88px; height: 238px; top: 72px; left: 891px; transform: rotateY(2deg) rotateX(-1deg) skew(-3deg, -1deg);}
.itemsalon-expresidentes{ width: 130px; height: 271px; top: 58px; left: 968px; transform: rotateY(-34deg) rotateX(2deg) skew(-3deg, 0deg);}
.itemsalon-profesores{ width: 181px; height: 322px; top: 28px; left: 1067px; transform: rotateY(41deg) rotateX(17deg) skew(-19deg, -3deg);} */
.itemsalon-profesores{ width: 181px; height: 322px; top: 28px; left: 1067px; transform: rotateY(41deg) rotateX(17deg) skew(-19deg, -3deg);}

.itemsalontrabajos-cartelespresentacion{ width: 118px; height: 374px; top: 55px; left: 474px;}
.itemsalontrabajos-cartelesconcurso{ width: 118px; height: 374px; top: 55px; left: 592px;}
.itemsalontrabajos-audiovisuales{ width: 112px; height: 373px; top: 55px; left: 710px;}

/* -------SALON DETALLE -------- */
/* .salon-titulo{width: 100%; text-align: center; top:20px; left:0;} */
#mainvideo{max-height: 100%;}
.salon-videoplayer{width: 398px;height: 255px;top: 121px;left: 448px;}
.salon-next{width: 54px;height: 54px;top: 178px;left: 846px;}
.salon-back{width: 54px;height: 54px;top: 240px;left: 846px;}
.salon-programa{width: 127px;height: 212px;top: 403px;left: 1068px;}
.salon-comentarios{width: 190px;height: 45px;top: 558px;left: 545px;}
.salon-notas{width: 80px;height: 36px;top: 361px;left: 599px;}
.salon-constancia{width: 220px;height: 36px;top: 500px;left: 539px;}
.salon-flags{width: 90px;height: 30px;top: 342px;left: 699px;}
.salon-programa div{
  position: absolute!important;
  top:6px!important;
  left:3px!important;
}
.salon-rate{
  background-color:var(--titleColor);
  color: white;
  padding: 0.5em;
  border-radius: 20px;
  bottom: 10px;
  left: 75px;
  width: 146px;
  overflow: hidden;
  z-index: 9999;
}
.salon-rate .rates{
  display:none;
}
.salon-brand1{width: 141px;height: 443px;top: 72px;left: 1px;transform: skew(0deg, -23deg);}
.salon-brand2 {width: 104px;height: 395px;top: 72px;left: 133px;transform: skew(0deg, -23deg);}
.salon-brand3 {
  width: 113px;
  height: 271px;
  top: 119px;
  right: 6px;
  transform: skew(0deg, 23deg);
}
.salon-brand4 {
  width: 107px;
  height: 241px;
  top: 114px;
  right: 130px;
  transform: skew(0deg, 23deg);

}

.programa .salon-programa{
  top:auto;
  bottom:50px;
}
.program-button{
  border: 2px solid var(--brandColor);
  border-radius: 10%;
  width: 300px;
  height: 300px;
  font-size: 26px;
  color: var(--titleColor);
}
.program-button:hover{
  background-color: var(--titleColor);
  color: white;
}
.flaticon-calendar:before,.flaticon-webinar:before,.flaticon-play-button:before{
  margin-left: 0;
  font-size: 60px;
}


/* -------EXPO COMERCIAL -------- */
.expostand-1{width: 121px;height: 76px;top: 109px;left: 261px;}
.expostand-2{width: 119px;height: 63px;top: 121px;left: 437px;}
.expostand-3{width: 126px;height: 64px;top: 119px;left: 725px;}
.expostand-4{width: 123px;height: 76px;top: 109px;left: 900px;}
.expostand-5{width: 172px;height: 130px;top: 281px;left: 81px;}
.expostand-6{width: 159px;height: 112px;top: 264px;left: 319px;}
.expostand-7{width: 144px;height: 82px;top: 250px;left: 493px;}
.expostand-8{width: 140px;height: 84px;top: 250px;left: 672px;}
.expostand-9{width: 158px;height: 110px;top: 265px;left: 835px;}
.expostand-10{width: 180px;height: 132px;top: 280px;left: 1062px;}
.expostand-11{width: 400px;height: 224px;top: 377px;left: 521px;}
/* .expostand-12{width: 205px;height: 148px;top: 377px;left: 1025px;}
.expostand-13{width: 227px;height: 163px;top: 348px;left: 518px;}

.expostand-14{width: 244px;height: 135px;top: 302px;left: 16px;}
.expostand-15{width: 176px;height: 135px;top: 302px;left: 291px;}
.expostand-16{width: 262px;height: 162px;top: 274px;left: 508px;}
.expostand-17{width: 180px;height: 135px;top: 302px;left: 826px;}
.expostand-18{width: 239px;height: 135px;top: 302px;left: 1022px;} */

.expo-next{top: 39px;left: 1112px;}
.expo-website{top: 491px;left: 357px;}

.itemexpo-title{width: 600px;height: 32px;top: 559px;left: 20px;}
.itemexpo-back{top: 50px; left: 20px;}
.itemexpo-logo{width: 367px;height: 161px;top: 45px;left: 210px;}
.itemexpo-totem{width: 184px;height: 505px;top: 40px;left: 1043px;}
.itemexpo-promo1{width: 77px;height: 107px;top: 316px;left: 591px;}
.itemexpo-promo2{width: 77px;height: 107px;top: 316px;left: 701px;}
.itemexpo-promo3{width: 77px;height: 107px;top: 316px;left: 798px;}
.itemexpo-video1{width: 118px;height: 85px;top: 315px;left: 406px;}
.itemexpo-video2{width: 117px;height: 82px;top: 253px;left: 210px;}
.itemexpo-video3{width: 116px;height: 82px;top: 350px;left: 211px;}
.itemexpo-registro{width: var(--si-width);height: 60px;top: 65px;left: calc(var(--si-left) + var(--si-spacing) * 0)}
.itemexpo-directorio{width: var(--si-width);height: 60px;top: 65px;left: calc(var(--si-left) + (var(--si-width) + var(--si-spacing)) * 1)}
.itemexpo-whatsapp{width: var(--si-width);height: 60px;top: 65px;left: calc(var(--si-left) + (var(--si-width) + var(--si-spacing)) * 2)}
.itemexpo-videocall{width: var(--si-width);height: 60px;top: 65px;left: calc(var(--si-left) + (var(--si-width) + var(--si-spacing)) * 3)}
.itemexpo-actividad{width: var(--si-width);height: 60px;top: 65px;left: calc(var(--si-left) + (var(--si-width) + var(--si-spacing)) * 4)}

/* -------EXPO COMERCIAL -------- */
#pdf-iframe{
    width: 100%;
    min-height: 550px;
}
.video-modal-lg .close {
    position:absolute;
    right:-30px;
    top:0;
    z-index:999;
    font-size:2rem;
    font-weight: normal;
    color:#fff;
    opacity:1;
  }
#video-iframe{
    
}
.pdf-modal-lg{
    
}
.expo-comentarios{width: 171px;height: 40px;top: 556px;left: 703px;}

/* -------PROFESORES -------- */
.popup-profesores{ width: 442px; height: 186px; top: 154px; left: 393px;}
.popup-pdf-profesores{ width: 135px;height: 156px;top: 168px;left: 174px;}

/* -------Trabajos / CARTELES -------- */
.trabajos-1{ width: 56px; height: 87px; top: 337px; left: 30px; transform: rotate(-3deg) skew(-1deg,-7deg)}
.trabajos-2{ width: 45px; height: 81px; top: 328px; left: 115px; transform: rotate(0deg) skew(2deg,-7deg);}
.trabajos-3{ width: 36px; height: 71px; top: 326px; left: 184px; transform: rotate(-3deg) skew(-1deg,-7deg);}
.trabajos-4{ width: 29px; height: 64px; top: 322px; left: 240px; transform: rotate(1deg) skew(3deg,-11deg);}
.trabajos-5{ width: 22px; height: 60px; top: 317px; left: 288px; transform: rotate(1deg) skew(3deg,-11deg);}
.trabajos-6{ width: 42px; height: 54px; top: 314px; left: 346px; }
.trabajos-7{ width: 42px; height: 54px; top: 314px; left: 406px; }
.trabajos-8{ width: 42px; height: 54px; top: 314px; left: 467px; }
.trabajos-9{ width: 42px; height: 54px; top: 314px; left: 528px; }
.trabajos-10{ width: 42px; height: 54px; top: 314px; left: 589px; }
.trabajos-11{ width: 42px; height: 54px; top: 314px; left: 649px; }
.trabajos-12{ width: 42px; height: 54px; top: 314px; left: 711px; }
.trabajos-13{ width: 42px; height: 54px; top: 314px; left: 773px; }
.trabajos-14{ width: 42px; height: 54px; top: 314px; left: 835px; }
.trabajos-15{ width: 42px; height: 54px; top: 314px; left: 896px; }
.trabajos-16{ width: 23px; height: 60px; top: 319px; left: 974px; transform: rotate(1deg) skew(-2deg,10deg);}
.trabajos-17{ width: 29px; height: 64px; top: 323px; left: 1014px; transform: rotate(-1deg) skew(-3deg,11deg);}
.trabajos-18{ width: 36px; height: 71px; top: 327px; left: 1064px; transform: rotate(3deg) skew(1deg,7deg);}
.trabajos-19{ width: 44px; height: 81px; top: 332px; left: 1123px; transform: rotate(-1deg) skew(-3deg,7deg);}
.trabajos-20{ width: 56px; height: 91px; top: 339px; left: 1195px; transform: rotate(3deg) skew(2deg,7deg);}
.sala-next{width: 54px;height: 54px;top: 210px;left: 890px;}
.sala-back{width: 54px;height: 54px;top: 210px;left: 345px;}
.sala-title{ padding-top: 230px; width: 200px; text-align: center; margin:0 auto}
.stand-title{ padding-top: 36px; width: 200px; text-align: center; margin:0 auto}


/*Loading*/
.lds-ring {
    display: none;
    position: relative;
    width: 80px;
    height: 80px;
    margin: 0 auto;
}
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #bbb;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #bbb transparent transparent transparent;
  }

  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

  .lds-ring.small {
    width: 50px;
    height: 50px;
    margin:0;
}
.lds-ring.small div{
    width: 34px;
    height: 34px;
}







/* Modal Bottom */

.modal.fade .modal-bottom {
  -webkit-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}
.modal .modal-bottom .modal-header .close{
  margin-left: 0;
}


.modal .modal-bottom {
    margin:0;
	margin-top:auto;
	padding: 0;
	position:absolute;
	bottom:0;
	top:auto;
	left:auto;
	right:0;
	height:243px; /* default height:45% its just for demo*/
}

.modal .modal-bottom>.modal-content{
    
    height:100%;
    border-color: #fff;
    border-radius:0;
    margin:0;

}
.modal-bottom .modal-body{height: 175px;overflow-y:auto;padding-top: 0;}

@media (min-width: 1px){
	.modal-bottom {max-width: 100%;width:100%;}
}
/*Custume scroll bar*/
.modal-bottom ::-webkit-scrollbar {width:8px}
.modal-bottom ::-webkit-scrollbar-button {width:8px;height:5px}
.modal-bottom ::-webkit-scrollbar-thumb:hover {background: #ccc}
.modal-bottom ::-webkit-scrollbar-thumb {	background:#f1f1f1;border: thin solid white;border-radius: 10px}
.modal-bottom ::-webkit-scrollbar-track {background: #fff;border:thin solid white}   

#standQuiz ul{
  list-style: none;
  padding-left: 10px;
}
.quiz-result{
  position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.9);
    display: none;
}
.result-content{
  position: fixed;
  width: 400px;
  margin-left: 200px;
  text-align: center;
}
.result-content-success,.result-content-failure{
  display: none;
}

#standQuiz [type="radio"]:checked,
#standQuiz [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
#standQuiz [type="radio"]:checked + label,
#standQuiz [type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}
#standQuiz [type="radio"]:checked + label:before,
#standQuiz [type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
#standQuiz [type="radio"]:checked + label:after,
#standQuiz [type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: var(--complementaryColor);
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
#standQuiz [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
#standQuiz [type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#covermobile{

  background-color: rgba(0,0,0,0.90);
  color: white;
  z-index: 99999999;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
}

@media (max-width: 767px) {
  #covermobile{
    display: block;
  }
}

.intro-cover{
  background-color: var(--complementaryColor);
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  bottom:0;
  right:0;
  display:flex;
}

#video-intro{
  z-index: 1000;
  display:none;
  position: fixed; right: 0; bottom: 0;
  min-width: 100%; min-height: 100%;
  width: auto; height: auto; z-index: 100;
  background-size: cover;
}