@font-face {
    font-family: MyriadPro;
    src: url("../fonts/MyriadPro/MyriadPro-Regular.otf"), 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;  
}

/*nuevos stilos*/
.css-footer{
  z-index: 100;
  position: fixed;
  width: 100%;
  bottom: 1em;
  bottom: 2.7em;
  color: white;
}
/*fin estilos*/
a#recuperar_password, a#recuperar_password:hover, a#recuperar_password:link{color: #FFF; font-size: 0.875rem;}
.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: #2470A0;
      }

.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: fixed;
    z-index: -1;
    width: 100%;
    height: 100%;
    /*-webkit-filter: brightness(40%);*/
}

.imagenLogo{
    position: absolute;    
    top: 30px;
    left: 30px;
}

.barraLogos{
    margin-top: 10%;
}

.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: #2470A0;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.class_titulo_feria{
    background-color: #5d6672; 
    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: #ff9800;
    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;
  
}

.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: #ff9800;
    font-size: 1rem;
}

.input-group {
  flex-wrap: nowrap;
}

  #formulario_login {
    background-color: #8a8a8a66;
  }

/*// Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 

  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; }
  form#login button, form#login button:link, form#login button:hover { font-size: 12px; }
  .span-bold { font-size: 0.7rem; }
  .imagenLogos{
      width: 80%;
      height: 80%;
   }
   nav { padding-top: 35%;}
   #formulario_login {
    padding: 2rem !important;
    margin: 4.5rem 2rem;
    position: relative;
  }
  #btn_ingresar {
    min-width: 150px;
    height: 32px;
  }
  #login-Otro { padding: 0 !important; }
  #login-Otro > .col-md-6, .col-sm-12 { width: 100% !important; }

  .div-btn-login button {
    -ms-flex: 0 0 60% !important;
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }
  .mb-2 { margin-bottom: .5rem !important; }
  .imagenLogin { width: 250% !important; }
  .class_titulo_feria { font-size: 0.8rem; }
}

/*// Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767.98px) { 
   
  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 button{
    margin-top: 0 !important;
  }

  #formulario_login {
    margin: 0;
    position: absolute;
    right: 0;
    padding: 0 !important;
  }
  .imagenLogin { width: 200% !important; }
  #login-Otro {
    padding: .4rem 1rem !important;
    display: flex;
  }
  #login-Otro > .col-md-6 {
    width: 40%;
    padding-left: 2rem !important;
    /*padding-right: 3rem !important;*/
  }
  .div-btn-login {
    width: 20% !important;
  }
  .mb-2 { margin-bottom: 0 !important; }
  .input-group > .custom-file, .input-group > .custom-select, .input-group > .form-control { width: 75%; }
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 30%;
    max-width: 30%;
  }
  .imagenLogin { width: 150% !important; }
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) { 
  #formulario_login {
    margin: 0;
    position: absolute;
    right: 0;
    padding-left: 50% !important;
  }
  .imagenLogin { width: 100% !important; }
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

  #formulario_login {
    padding-left: 40%;
  }
  .col-md-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
  }
}