:root{
 /*Cambia el color de fondo de la página*/
 --color-de-fondo: #f5f5f5;
/*----------------------------------------------------------*/

/*Cambia el color de fondo del encabezado del formulario*/
--color-de-fondo-encabezado: #54DAD9;
/*----------------------------------------------------------*/

/*Cambia el color del texto en el encabezado del formulario*/
--color-de-texto: #ffffff;
/*----------------------------------------------------------*/

/*Cambia el color de los iconos de los campos*/
--color-iconos: #ffffff;
/*----------------------------------------------------------*/

/*Cambia el color de fondo de los iconos*/
--color-de-fondo-iconos: #959595;
/*----------------------------------------------------------*/

/*Cambia el color del boton enviar*/
--color-del-boton-enviar: #959595;
/*----------------------------------------------------------*/

/*Cambia el color del boton enviar en el efecto hover*/
--color-del-boton-enviar-hover: #838282;
/*----------------------------------------------------------*/

}

body{
 font-family: 'Raleway', sans-serif;
 font-weight: 400;
 background-color: var(--color-de-fondo);
}

.separador{
 height: 15px;
}
.form-control{
 height: 45px;
 font-size: 15px;
 border-radius: 0px;
}
.input-group-addon{
 font-size: 16px;
 border-radius: 0px;
 color: var(--color-iconos) !important;
 background-color:  var(--color-de-fondo-iconos) !important;
}
.panel{
 border-radius: 0px;
 -webkit-box-shadow: 0px 0px 15px 1px rgba(161,161,161,0.39);
 -moz-box-shadow: 0px 0px 15px 1px rgba(161,161,161,0.39);
 box-shadow: 0px 0px 15px 1px rgba(161,161,161,0.39);
}
.panel-heading{
 padding: 3px 5px !important;
 background-color: var(--color-de-fondo-encabezado) !important;
}
.panel-heading h2{
 text-align: center;
 font-weight: 300;
 color: var(--color-de-texto) !important;
}
.panel-heading h2 span{
 font-weight: 600;
 color: var(--color-de-texto) !important;
}
.panel-footer p{
 text-align: center;
}
.panel-footer a{
 font-weight: 600;
}
.fondo-publicidad{
 margin-top: 25px;
 width: 100%;
 height: 200px;
 background-image: url('../img/publicidad-biofile.png');
 background-size: cover;
}
.fondo-publicidad h2{
 text-align: center;
 padding-top: 30px;
 margin-top: 0px;
 font-weight: bold;
 font-size: 24px;
 color: #fff;
}
.fondo-publicidad p{
 color: #fff;
 font-size: 18px;
 font-style: italic;
 text-align: center;
}
.overlay {
 width: 100%;
 height: 200px;
 background: rgba(0, 0, 0, .75);
 padding-bottom: 25px !important;
}
@media (max-width: 767px) {
 .overlay {
  height: auto !important;
 }
}
.btn{
 border-radius: 0px;
}
.btn-default{
 background-color: var(--color-del-boton-enviar) !important;
 border-color: #fff !important;
 color:#fff;
}
.btn-default:hover{
 background-color: var(--color-del-boton-enviar-hover) !important;
 border-color: #fff!important;
 color:#fff !important;
}
.btn-success {
 font-size: 18px;
 font-weight: 400;
 color: #fff;
 background-color: #22A007;
 border-color: #fff;
}
.btn-success:hover{
 background-color: #1f8a08;
 border-color: #fff;
}
.logo-cliente{
 margin-bottom:15px;
 margin-top:10px;
}
.logo-cliente img{
margin: auto;
max-width: 300px;
max-height: 200px;
}
.clear:hover{
 background-color: rgb(194, 12, 12) !important;
}

.FondoProgress{
 background-color: black;
 /* IE8 */
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
 /* IE8 */
 background-color: rgba(0, 0, 0, 0.4);
 position: fixed;
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 display: none;
 z-index: 10000;
}
.CuerpoProgress {
 background-color: white;
font-family: 'Raleway', sans-serif !important;
width: 478px;
padding: 17px;
border-radius: 5px;
text-align: center;
position: fixed;
left: 50%;
top: 50%;
margin-left: -256px;
margin-top: -200px;
overflow: hidden;
display: block;
z-index: 99999;
color: #575757;
    text-align: center;

}
.CuerpoProgress h2{
 font-size: 26px !important;
 font-weight: 300;
}
.CuerpoProgress h2 span{
 font-size: 26px !important;
 font-weight: 600;
}

@media (max-width: 540px) {
.CuerpoProgress {
    width: auto;
    margin-left: 0;
    margin-right: 0;
    left: 15px;
    right: 15px;
}
}

.Error{
 border: 1px solid red;
 box-shadow: inset 0 1px 1px rgba(255,0,0,.075), 0 0 8px rgba(255, 0, 0, .6);
}
