/*Medida para tablets horizontal*/
@media screen and (max-width:1024px) {

}

/*Medida para tablets en vertical*/
@media screen and (max-width:920px) {
	#wrap {
		width: 100%;
	}
	#cabeza {
		background: rgba(12, 11, 9, 1);
	}
	.topnav a {
		line-height: 20px;
	}
	.topnav a:not(:first-child) { display: none; }
	.topnav a.icon {
		float: right;
		display: block;
	}

	.topnav.responsive { position: relative; }
	.topnav.responsive .icon {
		position: absolute;
		right: 0;
		top: 0;
	}
	.topnav.responsive a {
		float: none;
		display: block;
		text-align: left;
	}
	.topnav.responsive a.minimo { 
		margin:0px;
	}
	.topnav.responsive a.oculto {
		display: none;
	}

	.tres { grid-template-columns: repeat(2, 1fr); }
}


/*Medida para tablets en vertical*/
@media screen and (max-width:760px) {
	.dos { grid-template-columns: repeat(1, 1fr); }
	
	.galeria { grid-template-columns: repeat(5, 1fr); grid-auto-rows: 100px; }
	.principal { grid-column: span 5; grid-row: span 4; }
	.vertical { grid-column: span 2; grid-row: span 3; }
	.horizontal { grid-column: span 3; grid-row: span 2;}
	.cuadro { grid-column: span 2; grid-row: span 2; } 

	#footer {
		padding: 15px 10px;
	}

	#login {
		padding: 20px 10%;
	}
}

@media screen and (max-width:600px) {
	.tres { grid-template-columns: repeat(1, 1fr); }

	.galeria { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 100px; }
	.principal { grid-column: span 4; grid-row: span 4; }
	.vertical { grid-column: span 2; grid-row: span 3; }
	.horizontal { grid-column: span 3; grid-row: span 2;}
	.cuadro { grid-column: span 2; grid-row: span 2; }

	.nover { display: none; }
}

/*Medida smartphones*/
@media screen and (max-width:500px) {
	.derecha { float: left; }
}

/*Medida smartphones*/
@media screen and (max-width:400px) {
	.galeria { display: block; }
	.alignnone { margin-bottom: 30px; }
}

/*Medida smartphones*/
@media screen and (max-width:300px) {
	header {
		height: 70px;
		}
	.banner {
		height: calc(100vh - 70px);
	}
	a.logo {
		background-size: 100%;
		width:81px;
		height:56px;
		margin-top: 10px;
	}
}

/*Medida smartphones*/
@media screen and (max-width:250px) {

	.topnav.responsive a.oculto {
		display: block;
	}
}