:root {
    --bodyColor: #525252;
    --titleColor: #000;
    --brandColor: #006aa8;
    /* --brandColor: #157f9d; */
    /* --brandColor: #9e9e9e; */
    --lightColor: #84a8cc;
    --lineColor: #c2cbd3;
    --bgColor:#ffffff;
    --redColor:#a90000;
    --mainTitleSize:3rem;
    --bodySize:16px;
  }
  
  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.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);
  }
  .course-color{
    color: var(--courseColor)
  }
  .light-color{
    color: var(--lightColor);
  }
  .custom-title .title{
      line-height: 0.8em;
  }
  .custom-title .brand-color{
      font-size: 1.5rem;
  }
  .color-red{
    color:var(--redColor);
  }
  .hr-blue{
    border-color: var(--titleColor);
    border-width: 2px;
  }
  .hr-brand{
    border-color: var(--brandColor);
    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 .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;
}
.username{
    max-width: 110px;
}
  .px100{
    font-size: 100px;
  }
  .px80{
    font-size: 80px;
  }
  .px60{
    font-size: 60px;
  }
  .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-control{
      
  }
  .cuota-field{
      width:100%
  }
  .btn-primary{
    background-color: var(--brandColor);
    border-color:var(--brandColor);
    color: white;
  }
  .btn-curso{
    background-color:var(--courseColor);
    color: white;
  }
  .btn-outline-curso{
    background-color: transparent;
    border-color:var(--courseColor);
    color: var(--courseColor);;
  }
  .btn-outline-curso:hover{
    background-color: var(--courseColor);
    border-color:var(--courseColor);
    color: white;
  }
  .btn-outline-brand{
    color: var(--brandColor);
    border-color:var(--brandColor);
  }
  .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;
  }
  
 
 
  .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);
  }
  .marco-foto{
    background-color: white;
    padding: 10px;
  }
  .gafete{
    width: 500px;
    height: 281px;
    background-size: contain;
    margin: 0 auto;
    display: inline-block;
    position: relative;
    background-image: url('https://www.gastroacademy.mx/static/website/img/gafete.png');
    background-repeat: no-repeat;
    float: right;
    padding: 20px;
  }

  .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 {
    display: inline-block;
  }
  .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{
    
    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}
.profesor-list table{
  border-color: transparent!important;
}
/* -------LOBBY -------- */
.lobby-logocomego{width: 258px;height: 80px;top: 66px;left: 519px; cursor: default}
.lobby-register{width: 262px;height: 164px;top: 328px;left: 26px;}
.lobby-salones{width: 109px;height: 87px;top: 220px;left: 596px;}
.lobby-expo-comercial{width: 116px;height: 81px;top: 365px;left: 592px;}


.lobby-izq1{width: 75px;height: 20px;top: 222px;left: 519px;}
.lobby-izq2{width: 75px;height: 20px;top: 262px;left: 519px;}
.lobby-izq3{width: 95px;height: 25px;top: 385px;left: 485px;}
.lobby-der1{width: 75px;height: 20px;top: 225px;left: 708px;}
.lobby-der2{width: 75px;height: 20px;top: 258px;left: 708px;}
.lobby-der3{width: 75px;height: 20px;top: 391px;left: 728px;}

/* -------REGISTRO -------- */
.registro-test{width: 96px;height: 175px;top: 440px;left: 101px;}
.registro-inscripcion{width: 70px;height: 70px;top: 345px;left: 401px;}
.registro-programa{width: 70px;height: 70px;top: 346px;left: 496px;}
.registro-chat{width: 70px;height: 70px;top: 347px;left: 694px;}
.registro-llamanos{width: 70px;height: 70px;top: 346px;left: 788px;}
.registro-izq{width: 73px;height: 193px;top: 333px;left: 297px;}
.registro-supr{width: 495px;height: 76px;top: 217px;left: 384px;}
.registro-der{width: 72px;height: 193px;top: 333px;left: 892px;}

/* -------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-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-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: 36px;transform: skew(0deg, -23deg);}
.salon-brand2 {width: 104px;height: 395px;top: 72px;left: 193px;transform: skew(0deg, -23deg);}
.salon-brand3 {width: 75px;height: 342px;top: 95px;left: 309px;transform: skew(0deg, -23deg);}
.salon-brand4 {width: 57px;height: 297px;top: 114px;left: 393px;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-class:before,.flaticon-video:before{
  margin-left: 0;
  font-size: 60px;
}
.profile-picture-container .lds-ring{
  position: absolute;
  top: 115px;
  left: 120px;
}
.profile-pic{
  width: 300px;
  height: 300px;
  object-fit: cover;
}
.edit-img{
  position: absolute;
    bottom: 0;
    left: 230px;
}

/* -------EXPO COMERCIAL -------- */
.expostand-1{width: 211px;height: 110px;top: 212px;left: 23px;}
.expostand-2{width: 211px;height: 148px;top: 377px;left: 27px;}
.expostand-3{width: 126px;height: 88px;top: 224px;left: 281px;}
.expostand-4{width: 129px;height: 110px;top: 355px;left: 279px;}
.expostand-5{width: 86px;height: 70px;top: 235px;left: 433px;}
.expostand-6{width: 85px;height: 87px;top: 341px;left: 433px;}
.expostand-7{width: 83px;height: 68px;top: 237px;left: 750px;}
.expostand-8{width: 83px;height: 84px;top: 343px;left: 750px;}
.expostand-9{width: 125px;height: 82px;top: 228px;left: 858px;}
.expostand-10{width: 123px;height: 106px;top: 358px;left: 858px;}
.expostand-11{width: 205px;height: 110px;top: 212px;left: 1027px;}
.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: 577px;left: 357px;}

.itemexpo-title{ width: 190px; height: 100px; top: 500px; left: 20px;}
.itemexpo-back{top: 50px; left: 70px;}
.itemexpo-promo1{width: 123px;height: 169px;top: 116px;left: 385px;}
.itemexpo-promo2{width: 64px;height: 88px;top: 177px;left: 589px;}
.itemexpo-promo3{width: 64px;height: 88px;top: 177px;left: 774px;}
.itemexpo-video1{width: 104px;height: 45px;top: 516px;left: 357px;}
.itemexpo-video2{width: 140px;height: 80px;top: 354px;left: 370px;}
.itemexpo-video3{width: 151px;height: 86px;top: 332px;left: 634px;}
.itemexpo-registro{width: 60px;height: 60px;top: 465px;left: 561px;}
.itemexpo-directorio{width: 60px;height: 60px;top: 484px;left: 633px;}
.itemexpo-whatsapp{width: 60px;height: 60px;top: 484px;left: 778px;}
.itemexpo-videocall{width: 60px;height: 60px;top: 465px;left: 866px;}
/* .itemexpo-actividad{ width: 60px; height: 60px; top: 488px; left: 1092px;} */

/* -------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: 885px;}

/* -------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: 45px;
    height: 45px;
    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{
  width: 300px;
  margin: auto;
  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(--brandColor);
    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);
}

@media (max-width: 767px) {
  .h2, h2{
    font-size: 1.5em;
  }
}


.btn{
  border-radius: 2em;
}
.btn-activity{
  font-size: 1.2em;
  border: 0;
  border-radius: 2em;
}
.btn-primary{
  font-size: 1.2em;
  border: 0;
  border-radius: 2em;
  background-color: var(--brandColor);
  border-color:var(--brandColor);
  color:white!important;
}
.btn-gray{
  font-size: 1.2em;
  border: 0;
  border-radius: 2em;
  background-color: gray; 
}
.btn-light-gray{
  background-color: #eee;
  color: gray;
}

.radius-gradiant{
  color:white;
  border-radius: 2em;
  background: rgb(36, 67, 147);
  background: linear-gradient(254deg,rgb(36, 67, 147) 0%, rgb(75, 200, 228) 100%);
}
.bg-curso{
  background-color: var(--courseColor);
  color:white;
}
.bg-blue{
  background-color: rgb(11, 11, 53);
  color:white;
}
.bg-gradiant{
  background: rgb(36, 67, 147);
  background: linear-gradient(254deg,rgb(36, 67, 147) 0%, rgb(75, 200, 228) 100%);
}
.bg-brand{
  background-color: var(--brandColor);
  color:white;
}
.bg-brand  a{
  color: white;
}

.bg-brand .nav-link:hover,.bg-brand .nav-link.active{
  text-decoration: none; 
  border-bottom: 0;
  color: white!important;
  border-bottom: 2px solid white;
  
}
.bg-gray{
  background-color: rgb(242,242,242);
}
.bg-light2{
  background-color:var(--lightColor)
}

.main-menu-container{
  border-bottom: 8px solid var(--lightColor);
}
.footer{
  border-top: 8px solid #222f5b;
}
.main-menu-container .nav a.active{
  background-color:var(--lightColor);
  border-radius: 5px 5px 0 0 ;
}
.blue{
  color:rgb(36, 67, 147);
}
.black{
  color:black;
}
.light-blue{
  color:rgb(75, 174, 228);
}
.color-light{
  color: var(--lightColor);
}
.light-gray{
  color: var(--lineColor);
}
.color-brand{
  color: var(--brandColor);
}
.gray{
  color:gray;
}
.color-curso{
  color: var(--courseColor);
}
.programa-list li{
  margin-bottom: 10px;
  
}
.arrow-div{
  width: 54px;
  height: 54px;
  text-align: center;
  display: inline-block;
}
.arrow-div i{
  font-size: 40px;
  padding: 6px;
}
#id_comment{

}
#newsletterBtn{
  margin-top: -8px;
}
a.white:hover{
  text-decoration: underline;
}
.btn-white{
  background-color: white;
  color: var(--brandColor)!important;
}

.carousel-caption{
  bottom:35%;
  width:50%;
  left: 2%;
}
.carousel-caption h5,
.carousel-caption p{
  color: black;
}

.carousel-indicators li {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}
.controls-bottom{
  margin-top: -20%;
  width: 100%;
  position: absolute;
}
.controls-bottom .float-left{
  margin-left: -30px;
}
.controls-bottom .float-right{
  margin-right: -30px;
}
#carouselOpinions .carousel-indicators li,
.carouselVideoteca .carousel-indicators li{
  background-color: var(--lightColor);
}
#carouselOpinions .carousel-control-prev,
.carouselVideoteca .carousel-control-prev{
  width: auto;
  left: -20px;
}
#carouselOpinions .carousel-control-prev:hover,
#carouselOpinions .carousel-control-next:hover,
.carouselVideoteca .carousel-control-prev:hover,
.carouselVideoteca .carousel-control-next:hover{
  color:var(--bodyColor)
}

#carouselOpinions .carousel-control-next,
.carouselVideoteca .carousel-control-next{
  width: auto;
  right: -20px;
}

#carouselOpinions .carousel-indicators,
.carouselVideoteca .carousel-indicators{
  bottom:-40px;
}

.carouselVideoteca .carousel-control-prev,
.carouselVideoteca .carousel-control-next{
  color:var(--brandColor)
}

@media (max-width: 767px) {
  .carousel-control-next{
    right: 0!important;
  }
  .carousel-control-prev{
    left: 0!important;
  }
  #stream-iframe{
    height: 300px;
  }
  .main-menu-container .nav a.active{
    border-radius: 5px;
  }
  .gafete{
    width: 320px;
    height: 200px;
    float: none;
    display: block;

  }
  .gafete h4{
    font-size: 20px;
  }

  .nav-link{
    padding-bottom:0.8em ;
  }
  #carouselOpinions .carousel-control-prev,
  #carouselOpinions .carousel-control-next,
  .controls-bottom{
    display: none;
  }
}




#myCarousel .carousel-item {
  margin-right: auto;
}
#myCarousel .carousel-control-next,
#myCarousel .carousel-control-next:hover,
#myCarousel .carousel-control-prev,
#myCarousel .carousel-control-prev:hover{
  opacity: 1;
  color: var(--brandColor);
}

#myCarousel .carousel-control-next, #myCarousel .carousel-control-next:hover{
  right: -80px;
}
#myCarousel .carousel-control-prev, #myCarousel .carousel-control-prev:hover{
  left: -80px;
}

[class^="bg-pattern"]{
  color:white;
  background-size: cover;
  background-repeat: no-repeat;
}
.home-banner{
  background-position: 0 0;
  background-size: 100%;
  background-repeat: no-repeat;
}
.bg-pattern-1{
  background-image: url('https://www.gastroacademy.mx/static/website/img/bg_pattern1.png');
}
.bg-pattern-2{
  background-image: url('https://www.gastroacademy.mx/static/website/img/bg_pattern1.png');
}
.bg-pattern-3{
  background-image: url('https://www.gastroacademy.mx/static/website/img/bg_pattern1.png');
}
@media (min-width: 768px) {
  /* show 3 items */
  #myCarousel .carousel-inner .active,
  #myCarousel .carousel-inner .active + .carousel-item,
  #myCarousel .carousel-inner .active + .carousel-item + .carousel-item {
    display: block;
  }

  #myCarousel .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
  #myCarousel .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
  #myCarousel .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
    transition: none;
  }

  #myCarousel .carousel-inner .carousel-item-next,
  #myCarousel .carousel-inner .carousel-item-prev {
    position: relative;
    transform: translate3d(0, 0, 0);
  }

  #myCarousel .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item {
    position: absolute;
    top: 0;
    right: -33.3333%;
    z-index: -1;
    display: block;
    visibility: visible;
  }

  /* left or forward direction */
  #myCarousel .active.carousel-item-left + .carousel-item-next.carousel-item-left,
  #myCarousel .carousel-item-next.carousel-item-left + .carousel-item,
  #myCarousel .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
  #myCarousel .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  /* farthest right hidden item must be abso position for animations */
  #myCarousel .carousel-inner .carousel-item-prev.carousel-item-right {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    visibility: visible;
  }

  /* right or prev direction */
  .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
  .carousel-item-prev.carousel-item-right + .carousel-item,
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
  .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
    position: relative;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
    display: block;
    visibility: visible;
  }
}

.round-number{
  text-align: center;
  background-color: var(--brandColor);
  color: white;
  border-radius: 20px;
  font-weight: bold;
  width: 30px;
  height: 30px;
  display: inline-block;
}

@media (max-width: 768px) {
  #recipeCarousel .carousel-inner .carousel-item > div {
      display: none;
  }
  #recipeCarousel .carousel-inner .carousel-item > div:first-child {
      display: block;
  }
}

#recipeCarousel .carousel-inner .carousel-item.active,
#recipeCarousel .carousel-inner .carousel-item-next,
#recipeCarousel .carousel-inner .carousel-item-prev {
  display: flex;
}

/* display 3 */
@media (min-width: 768px) {
  
  #recipeCarousel .carousel-inner .carousel-item-right.active,
  #recipeCarousel .carousel-inner .carousel-item-next {
    transform: translateX(16.66666%);
  }
  
  #recipeCarousel .carousel-inner .carousel-item-left.active, 
  #recipeCarousel .carousel-inner .carousel-item-prev {
    transform: translateX(-16.66666%);
  }
}

#recipeCarousel .carousel-inner .carousel-item-right,
#recipeCarousel .carousel-inner .carousel-item-left{ 
transform: translateX(0);
}
#recipeCarousel .carousel-control-prev-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='80' height='80' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");

}
#recipeCarousel .carousel-control-next-icon{
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}