/*--------------------------------------------------------------------------------------------------*/
/*##################################### ESTILOS ETIQUETAS HTML #####################################*/
/*--------------------------------------------------------------------------------------------------*/
:root { --ancho: 18px; }
html, body { 0overflow-y: auto; font-family: 'Comfortaa'; margin: 0; padding: 0; }
h1, h2, h3, h4, h5 { font-family: 'Comfortaa'; }
label { color: white; text-shadow: 0 0 2px black; }
.login-page, .register-page { background: transparent; }
.form-group { text-align: left; margin-bottom: 0 !important; }
.form-group label { margin-top: 0; margin-bottom: 0; }
.contdata { margin-top: 6px !important; }
/*--------------------------------------------------------------------------------------------------*/
/*######################################## BACKGROUND LOGIN ########################################*/
/*--------------------------------------------------------------------------------------------------*/
.login-page { 
  background: url('../../images/login/Login.jpg') !important;
  background-size: cover !important;
  background-position: 0 -150px !important; }
/*--------------------------------------------------------------------------------------------------*/
/*###################################### BACKGROUND REGISTER #######################################*/
/*--------------------------------------------------------------------------------------------------*/
.register-page { 
  background: url('../../images/login/Register.jpg') !important;
  background-position: -100px -270px !important; }
/*--------------------------------------------------------------------------------------------------*/
/*##################################### BACKGROUND RESET PAGE ######################################*/
/*--------------------------------------------------------------------------------------------------*/
.reset-page { 
  background: url('../../images/login/ResetPassword.jpg') !important;
  background-size: cover !important;
  background-position: 0 -50px !important; }
/*--------------------------------------------------------------------------------------------------*/
/*################################ CONTENEDORES PRINCIPALES VISTA ##################################*/
/*--------------------------------------------------------------------------------------------------*/
.login-box, .register-box { float: left; }
.login-box { margin: 2% 4%; }
.register-box { margin: 2% 16%; }
/*--------------------------------------------------------------------------------------------------*/
/*####################################### CUERPO CONTENEDOR ########################################*/
/*--------------------------------------------------------------------------------------------------*/
.login-box-body, .register-box-body {
  background-color: rgba(0,0,0,.4);
  padding-top: 60px;
  padding-bottom: 60px;
  border-radius: 10px;
  box-shadow: -3px 0 4px -3px black, 3px 0 4px -3px black; }
.register-box-body { padding-right: 0; }
/*--------------------------------------------------------------------------------------------------*/
/*######################################## LOGO EVALUEMOS ##########################################*/
/*--------------------------------------------------------------------------------------------------*/
.login-logo { display: inline-block; }
.login-logo:hover { animation-name: rubberBand; }
/*--------------------------------------------------------------------------------------------------*/
/*############################## CONTENEDOR LOGIN - REGISTER - RESET ###############################*/
/*--------------------------------------------------------------------------------------------------*/
.rotulologin {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: -5%; 
  width: 110%;
  height: 40px;
  font-size: 16px;
  background: #00B58A;
  background-image: repeating-linear-gradient(45deg, rgba(0,0,0, 0.05), rgba(0,0,0, 0.05) 1px, transparent 1px, transparent 7px);
  background-size: 10px 10px; }
/*####################################### HEADER CONTENEDOR ########################################*/
.rot1 {
  top: 0;
  color: white;
  text-shadow: 0px 0px 3px black;
  box-shadow: 0 2px 4px rgba(0,0,0,.7);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px; }
/*####################################### FOOTER CONTENEDOR ########################################*/
.rot2 {
  bottom: 0;
  letter-spacing: 1px;
  color: #2A2A2A;
  box-shadow: 0 -2px 4px rgba(0,0,0,.7);
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px; }
/*###################################### TRIÁNGULOS RÓTULOS ########################################*/
.rotulologin:before, .rotulologin:after { content: ""; position: absolute; width: 0; height: 0; }
.rotulologin:before { left: 0; }
.rotulologin:after { right: 0; }
.rot1:before, .rot1:after { top: 100%; border-top: 12px solid #007F61; border-bottom: 12px solid transparent; }
.rot2:before, .rot2:after { top: -24px; border-top: 12px solid transparent; border-bottom: 12px solid #007F61; }
.rot1:before, .rot2:before { border-left: var(--ancho) solid transparent; }
.rot1:after, .rot2:after { border-right: var(--ancho) solid transparent; }
/*--------------------------------------------------------------------------------------------------*/
/*########################################## TEXTO ERROR ###########################################*/
/*--------------------------------------------------------------------------------------------------*/
.form-group.has-error .help-block { color: #BF0000; }
/*--------------------------------------------------------------------------------------------------*/
/*######################################### BOTÓN ENLACE ###########################################*/
/*--------------------------------------------------------------------------------------------------*/
.btntypea { color: #88FFE1; text-shadow: 0 0 2px black; }
.btntypea:hover, .btntypea:focus { color: #88FFE1; text-decoration: underline; }
.btntypea i { font-size: 16px; }
/*--------------------------------------------------------------------------------------------------*/
/*########################################### CHECKBOX #############################################*/
/*--------------------------------------------------------------------------------------------------*/
.icheckbox_square-green { outline: 1px solid gray; }
.checked, .icheckbox_square-green:hover { outline: none; }
/*--------------------------------------------------------------------------------------------------*/
/*#################################### CONTENEDOR FORMULARIOS ######################################*/
/*--------------------------------------------------------------------------------------------------*/
#formreg, #formrest { margin-bottom: 15px; }
/*--------------------------------------------------------------------------------------------------*/
/*############################### COLUMNAS EMPRESA - ADMINISTRADOR #################################*/
/*--------------------------------------------------------------------------------------------------*/
.ColInfo { padding-right: 20px; }
.ColInfo h4 { margin-bottom: 0; color: #88FFE1; font-size: 15px; text-shadow: 0 0 2px black; }