@media screen and (min-width:1024px) {
	*{
		margin: 0;
		padding: 0;
	}
	a{
		color: #444;
		text-decoration: none;
	}
	footer a{
		color: #000;
	}
	body{
		background: #fff;
	} 
	footer{ 
		background-color: #fff;
		bottom: 0;
		color: #000;
		font-family: 'Raleway', sans-serif;
		left: 0;
		position: fixed;
		padding-bottom: 10px;
		text-align: center;
		width: 100%;
	}
	h2{
		color: #aaf;
		font-size: 25px;
		margin-top: 30px; 
		text-align: center;
	}
	html {
	    overflow-y: hidden;
	}
	img{
		margin-top: 30px;
		width: 100%;
	}
	section{
		height: 200px;
		margin: 0 auto;
		width: 250px;
	}
	span{
		margin:0 5% 5px 5%;
		text-align: center;	
		width: 40px;
	}
	.input_log{
		background: #fff;
		border: 0px;
		border-bottom: 1px solid #888;
		color: #000;
		font-family: 'Raleway', sans-serif;
		font-size: 14px;
		margin:5px 5% 5px -5%;
		outline:0px;
		padding: 5px 0;
		width: 80%;
	}
	.loginExpire{
		background: #ffafaf;
		border: 1px solid #b4585e;
		font-size: 13px;
		
		margin: 5px 5% 0 5%;
		padding: 3px 0;
		text-align: center;
		width: 90%;
	}
	.loginError{
		background: #6a4a57;
		border: 1px solid #b4585e;
		display: none;
		font-size: 14px;
		margin: 5px 5% 0 5%;
		padding: 3px 0;
		text-align: center;
		width: 90%;
	}
	#button{
		//background: #18BB9B;
		background: #aaf;
		border:0;
		box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
		color:#fff;
		cursor: pointer;
		margin:5px 5% 5px 5%;
		outline:0px;
		padding: 5px 0;
		width: 90%;
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	}
	#button:hover{
		 box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
	}
	#p_create{
		cursor: pointer;
		background: #b4585e;
		border-radius: 0 5px 5px 5px;
		font-family: 'Raleway', sans-serif;
		font-size: 14px;
		margin-top: -10px;
		padding: 20px 0px;
		text-align: center;
		width: 100%;
	}
	#p_forgot{
		color:#ccc;
		cursor: pointer;
		font-family: 'Raleway', sans-serif;
		font-size: 12px;
		margin: 5px 0;
		text-align: center;
		text-decoration: none;
		width: 100%;

	}
	#session{
		background: #fff;
		border: 1px solid #aaf;
		border-radius: 5px;
		color: #444;
		display: inline-block;
		font-family: 'Raleway', sans-serif;
		height: 100%;
		margin-top: 10%;
		width: 100%;
	}

	/*
	*
	*	ESTILOS PARA ICONOS
	*
	*/
	@font-face {
		font-family: 'icomoon';
		font-style: normal;
		font-weight: normal;
		src:  url('../fonts/icomoon.eot?bzr9vg');
		src:  url('../fonts/icomoon.eot?bzr9vg#iefix') format('embedded-opentype'),
			url('../fonts/icomoon.ttf?bzr9vg') format('truetype'),
			url('../fonts/icomoon.woff?bzr9vg') format('woff'),
			url('../fonts/icomoon.svg?bzr9vg#icomoon') format('svg');
	}
	[class^="icon-"], [class*=" icon-"] {
		font-family: 'icomoon' !important;
		font-style: normal;
		font-variant: normal;
		font-weight: normal;
		line-height: 1;
		speak: none;
		text-transform: none;
		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	.icon-key:before {
		content: "\e98d";
	}
	.icon-user:before {
		content: "\e971";
	}
	.icon-user1:before {
		content: "\e903";
	}
}














@media screen and (max-width:1024px) {
	*{
		margin: 0;
		padding: 0;
	}
	a{
		color: #444;
		text-decoration: none;
	}
	footer a{
		color: #000;
	}
	body{
		background: #fff;
	} 
	footer{ 
		background-color: #fff;
		bottom: 0;
		color: #000;
		font-family: 'Raleway', sans-serif;
		left: 0;
		position: fixed;
		padding-bottom: 10px;
		text-align: center;
		width: 100%;
	}
	h2{
		color: #aaf;
		font-size: 40px;
		margin-top: 30px; 
		text-align: center;
	}
	html {
	    overflow-y: hidden;
	}
	img{
		margin-top: 30px;
		width: 100%;
	}
	section{
		height: 200px;
		margin: 0 auto;
		width: 90%;
	}
	span{
		margin:0 5% 5px 5%;
		text-align: center;	
		font-size: 25px;
		width: 40px;
	}
	.input_log{
		background: #fff;
		border: 0px;
		border-bottom: 1px solid #888;
		color: #000;
		font-family: 'Raleway', sans-serif;
		font-size: 25px;
		margin:5px 5% 5px -5%;
		outline:0px;
		padding: 5px 0;
		width: 80%;
	}
	.loginExpire{
		background: #ffafaf;
		border: 1px solid #b4585e;
		display: none;
		font-size: 13px;

		margin: 5px 5% 0 5%;
		padding: 3px 0;
		text-align: center;
		width: 90%;
	}
	.loginError{
		background: #6a4a57;
		border: 1px solid #b4585e;
		display: none;
		font-size: 14px;
		margin: 5px 5% 0 5%;
		padding: 3px 0;
		text-align: center;
		width: 90%;
	}
	#button{
		//background: #18BB9B;
		background: #aaf;
		border:0;
		box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
		color:#fff;
		font-size: 25px;
		height: 60px;
		cursor: pointer;
		margin:5px 5% 5px 5%;
		outline:0px;
		padding: 5px 0;
		width: 90%;
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	}
	#button:hover{
		 box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
	}
	::placeholder {
		color: #dddddd;
	}
	#p_create{
		cursor: pointer;
		background: #b4585e;
		border-radius: 0 5px 5px 5px;
		font-family: 'Raleway', sans-serif;
		font-size: 14px;
		margin-top: -10px;
		padding: 20px 0px;
		text-align: center;
		width: 100%;
	}
	#p_forgot{
		color:#ccc;
		cursor: pointer;
		font-family: 'Raleway', sans-serif;
		font-size: 12px;
		margin: 5px 0;
		text-align: center;
		text-decoration: none;
		width: 100%;

	}
	#session{
		background: #fff;
		border-radius: 5px;
		color: #444;
		display: inline-block;
		font-family: 'Raleway', sans-serif;
		height: 100%;
		margin-top: 10%;
		width: 100%;
	}

	/*
	*
	*	ESTILOS PARA ICONOS
	*
	*/
	@font-face {
		font-family: 'icomoon';
		font-style: normal;
		font-weight: normal;
		src:  url('../fonts/icomoon.eot?bzr9vg');
		src:  url('../fonts/icomoon.eot?bzr9vg#iefix') format('embedded-opentype'),
			url('../fonts/icomoon.ttf?bzr9vg') format('truetype'),
			url('../fonts/icomoon.woff?bzr9vg') format('woff'),
			url('../fonts/icomoon.svg?bzr9vg#icomoon') format('svg');
	}
	[class^="icon-"], [class*=" icon-"] {
		font-family: 'icomoon' !important;
		font-style: normal;
		font-variant: normal;
		font-weight: normal;
		line-height: 1;
		speak: none;
		text-transform: none;
		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	.icon-key:before {
		content: "\e98d";
	}
	.icon-user:before {
		content: "\e971";
	}
	.icon-user1:before {
		content: "\e903";
	}
}