@font-face {
    font-family: MyriadPro;
    src: url("../fonts/MyriadPro/MyriadPro-Regular.otf"), url("../fonts/MyriadPro/MyriadPro-Regular.ttf"), url("../fonts/MyriadPro/MyriadPro-Regular.eot");
}
@font-face {
    font-family: MyriadPro;
    src: url("../fonts/MyriadPro/MyriadPro-Bold.otf"), url("../fonts/MyriadPro/MyriadPro-Bold.eot");
    font-weight: bold;
}
body{
	font-family: MyriadPro;  
  overflow-y: hidden;
  height: 100%;
  width: 100%;
}

.carousel{
  height: 632px;
}

.input-radio-login {
    display: block;
    position: relative;
  
}
 
.input-radio-login label {

      padding: 1px 1px;
      width: 100%;
      display: block;
      text-align: left;
      color: #A3A3A3;
      cursor: pointer;
      position: relative;
      z-index: 2;
      overflow: hidden;

}

.input-radio-login label:before {
        content: '';
        position: absolute;
        left: 50%;
        top: 50%;
        opacity: 0;
        z-index: -1;
      }

.input-radio-login label:after {
        content: '';
        z-index: 2;
        position: absolute;
        top: 50%;
        cursor: pointer;
      }

.input-radio-login input:checked ~ label {
        color: #00c2c7;
      }

.input-radio-login input:checked ~ label:before {
        transform: translate(-50%, -50%) scale3d(56, 56, 1);
        opacity: 1;
      }

.input-radio-login input:checked ~ label:after {
        
      }

.input-radio-login input {
      order: 1;
      z-index: 2;
      position: absolute;
      right: 30px;
      top: 50%;
      cursor: pointer;
      visibility: hidden;
    }

.form-control{
    border-left: 0;
    border-right: 0;
    border-top: 0;
    color: #9E9E9E;
    border:1.5;
    border-color: #C0C0C0;
}

.div-login{top:150px;}

.imagenLogin{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-filter: brightness(40%);
}

.imagenLogo{
    position: absolute;
    height: 5%;
    top: 30px;
    left: 30px;
}

.span-bold{
    font-size: 0.875rem;
    font-weight: bold;
    color: #666666;
}

.span-regular{
    font-size: 0.875rem;
    color: #A3A3A3;
}

.span-asesor{
    font-size: 0.875rem;
    color: #00c2c7;
}

a#recuperar_password, a#recuperar_password:hover, a#recuperar_password:link{color: #00c2c7; font-size: 0.875rem;}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.class_titulo_feria{
    background-color: #595959; 
    color: white;
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: -22px;
    -webkit-box-shadow: 0px 8px 0px -2px rgba(87,86,87,0.14);
    -moz-box-shadow: 0px 8px 0px -2px rgba(87,86,87,0.14);
    box-shadow: 0px 8px 0px -2px rgba(87,86,87,0.14);
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    padding: 15px 10px 15px 25px;
    
}

form#login{

    color: #9B9B9B;
    /*background-color: white;*/

    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 0px solid #000000;
}

form#login button, form#login button:link{
    color: #FFFFFF;
    background-color: #00c2c7;
    font-size: 12px;
    border-color: #E3303D;
    font-size: 16px;
    
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 0px solid #000000;
  
}

#login-Otro .row, #login-Comercial .row{    
    padding-top: 5px;
    padding-bottom: 5px;
}

.select2-container--default .select2-selection--single{
    height: 35px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 35px;
    width: 25px;    
}

.select2-container--default .select2-selection--single{
    border: 1px solid #C0C0C0;
    border-left: 0px;
    border-right: 0px;
    border-top: 0px;
}

.form-control, .select2-container--default .select2-selection--single{
    border-radius: 0rem;
}

form#login button:hover{
    background-color: #00c2c7;
    font-size: 1rem;
}

@media only screen and (max-width: 768px) {
   
  body{
    font-size: 0.7rem;
  }
  .row {
    margin: 0;
  } 
  .col-4.div-login {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%;
  }
  .class_titulo_feria {
    font-size: 1rem;
  }
  .div-btn-login{
    -ms-flex: 0 0 60% !important;
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }

}

@media only screen and (max-width: 1124px) {
    
  .col-4.div-login {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
  }

}

@media only screen and (max-width: 320px) {

  body{
    font-size: 0.7rem;
  }
  .col-4.div-login {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row {
    margin: 0;
  }
  .class_titulo_feria {
    font-size: 0.8rem;
  }
  form#login button, form#login button:link, form#login button:hover {
    font-size: 12px;
  }
  .div-btn-login{
    -ms-flex: 0 0 70% !important;
    flex: 0 0 70% !important;
    max-width: 70% !important;
  }
  .span-bold {
    font-size: 0.7rem;
  }


}


@media only screen and (max-width: 480px) {
  body{
    font-size: 0.7rem;
  }
  .col-4.div-login {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row {
    margin: 0;
  }
  .class_titulo_feria {
    font-size: 0.8rem;
  }
  form#login button, form#login button:link, form#login button:hover {
    font-size: 12px;
  }
  .div-btn-login{
    -ms-flex: 0 0 70% !important;
    flex: 0 0 70% !important;
    max-width: 70% !important;
  }
  .span-bold {
    font-size: 0.7rem;
  }

}