* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
	font-size:62.5%;
	font-family: helvetica, arial, serif;
	width: 100%;
    height: 100%;
}

body{ 
  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  background: #fff;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 12px;
  /*text-transform: uppercase; */
  text-align: center;
}


a {
  text-decoration: none !important;
  display: block;
}



#separadorvert {
		   border-right: 6px dotted #666; 
}



.franja {
	float:left;
	height:380px;
	width:100%;
	font-family: helvetica, arial, serif;
    font-size: 1.3rem;
	text-align:center;
	background-image: url('../imagenes/fondo.jpg');
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	vertical-align:middle;
	color:#fff;
 }


.franja_oscura {
	width:100%;
    text-align:left;
	background: #3a3a3a;
	color: #fff;
}

.cuadromsg{
	color:#3399FF;
	font-size:15px;
	border: 0px solid #000;
	margin:3px;
}

.logo_empresa {
	left:12%;  
	transform: translate(-50%, -50%); 
	position:relative;  
	top: 40%; 
	width:20%;
    height:auto;
    max-width:300px;
    min-width:160px;
}

#logo_candado {
	padding:8px;
	vertical-align:middle; 
	width:100px;
	height:auto;
}




.datoslogin {
	width:100%; text-align:left;
}




hr.style1 { border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
hr.style2 { border: 0; height: 1px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); }
hr.style3 { border: 0; border-bottom: 1px dashed #ccc; background: #999; }




/***************************************************************/

@media screen and (max-width:640px) {  /* menores a 640*/
		
		.en-small {
			display:block;
		}
		
		.en-pc {
			display:none;
		}
		
		.input-userypass {
			 padding-bottom:8px;
		}
		
		 .franja {
			 height:150px;
        }
		
		
		.logo_empresa {
	      left:50%;  
	      transform: translate(-50%, -50%); 
	      position:relative;  
	      top: 30%; 
          max-width:170px;
          min-width:150px;
        }
		
		#logo_candado {
	      width:80px;  
        }

		
		.datos_login {
	      text-align:center;
        }
		
		#separadorvert {
		   border-right: 6px dotted #fff; 
	   }
	   
	   

}


@media screen and (max-width:996px) and (min-width:640px) { /* entre 640 y  996 */

		#separadorvert {
		   border-right: 6px dotted #fff; 
		}
		
		.input-userypass {
			 padding-bottom:8px;
		}
		
		.en-small {
			display:block;
		}
		
		.en-pc {
			display:none;
		}
}

@media screen and (min-width:996px) { /*  mayores a 996 1024px */


		#separadorvert {
		   border-right: 6px dotted #00729D; 
		}
		
		.input-userypass {
			 padding-bottom:0px;
		}
		
		.en-small {
			display:none;
		}
		
		.en-pc {
			display:block;
		}
}