@charset "UTF-8";

@media (min-width: 700px) {
	body {
		background-color:#2B2A2A !important;
		background-image: url("../../images/login/fondoResponsive.jpg") ;
		background-position: top left;
	    	background-repeat: no-repeat;
		-webkit-background-size: 100% auto;
		-moz-background-size: 100% auto;
		-o-background-size:100% auto; 
		background-size: 100% auto;
		font-family: sans-serif, Futura, 'Trebuchet MS', Arial;
	}
	
	.divTitulo {
		width: 70% !important;
		background-image: url("../../images/login/RecuadroSAGA.png") !important;
		background-position: top left !important;
	    	background-repeat: no-repeat !important;
		-webkit-background-size: 100% auto !important;
		-moz-background-size: 100% auto !important;
		-o-background-size:100% auto !important;
		background-size: 100% auto !important;
		padding: 1.4vw 4vw  !important;
		text-align: center   !important;
		color: #5C4738;
		font-size: 2vw !important;
		font-weight: bold;
	}
	
	.footerBottom {
		width: 100%;
	    position: absolute;
	    bottom: 0;
	    padding-bottom: 0.5vw;
	    text-align: center; 
	    font-weight: bold;
	    font-size: 0.8vw;
	    color: #000;
	}
	.footerBottom a {
	    text-decoration: none;
	    color: #000;
	}
	.footerBottom a:visited {
	    text-decoration: none;
	    color: #000;
	}			
	
	.cajaDos {
		float: right;
		width: 36% !important;
		margin: 0 0;
	}	
	
	.imagenIcono {
		width: 2vw;
	}
	
	.panelIconos {
		width: 5vw; 
		display:inline-block;
	}
	
	.iniciarSesion {
		font-size: 2.5vw !important;
		font-weight: bold;
		color: #418FDE  !important;
	}
	
	.plataformaGestion {
		font-size: 1.5vw !important;
		font-weight: bold;
		color: #5C4738 !important;
	}
	
	.panelOjo {
		cursor:pointer; 
		width: 1.5vw;	
	}

	.inputText {
		font-size: 1vw !important;
		width: 98%  !important;
		margin-top: 0 !important;
		border: 3px solid transparent;
	    border-radius: 1vw !important;
	}

	.botonSubmit {
		font-size: 1.5vw;
		padding: 0.1vw 2.5vw;
		background-color: #5C4738 !important;
		color: #fff;	
		font-weight: bold;
		border: 3px solid transparent;
	    border-radius: 1vw;	
	}
	
	.caja100 {
		width: 100% !important;
		margin: 0 0;
	}

	.marginTopLogin {
		margin-top: 1vw !important;
	}
}

@media (max-width: 699px) {
	body {
		background-color:#2B2A2A !important;
		background-image: url("../../images/login/fondoMobil.jpg") ;
		background-position: top left;
	    	background-repeat: no-repeat;
		-webkit-background-size: 100% auto;
		-moz-background-size: 100% auto;
		-o-background-size:100% auto;
		background-size: 100% auto;
		font-family: sans-serif, Futura, 'Trebuchet MS', Arial;
	}
	
	.divTitulo {
		display: none;
	}
	
	.footerBottom {
		width: 100%;
	    position: absolute;
	    bottom: 0;
	    padding-bottom: 0.5vw;
	    text-align: center; 
	    font-weight: bold;
	    font-size: 1.3vw;
	    color: #000;
	}
	.footerBottom a {
	    text-decoration: none;
	    color: #000;
	}
	.footerBottom a:visited {
	    text-decoration: none;
	    color: #000;
	}			
	
	.cajaDos {
		float: left;
		width: 90% !important;
		margin: 40vw 0 0 10vw;
	}	
	
	.imagenIcono {
		width: 6vw;
	}
	
	.panelIconos {
		width: 20vw; 
		display:inline-block;
	}
	
	.iniciarSesion {
		font-size: 6vw !important;
		font-weight: bold;
		color: #418FDE  !important;
	}
	
	.panelOjo {
		cursor:pointer; 
		width: 6vw;	
	}
	
	.plataformaGestion {
		font-size: 3.5vw !important;
		font-weight: bold;
		color: #5C4738 !important;
	}
	
	.inputText {
		font-size: 3vw !important;
		margin-top: 0 !important;
		border: 3px solid transparent;
	    border-radius: 10vw !important;
	    width: 98% !important;
	}
	
	.botonSubmit {
		font-size: 3vw;
		padding: 0.1vw 2.5vw;
		background-color: #5C4738 !important;
		color: #fff;	
		font-weight: bold;
		border: 3px solid transparent;
	    border-radius: 1vw;	
	    width: 60% !important;
	}
	
	.caja100 {
		width: 100% !important;
	}
	
	.marginTopLogin {
		margin-top: 5vw !important;
	}
}

.mainLogin {
	width: 90% !important;
	margin: 4vw auto !important; 
}