/* ===================================================================

Theme Name: Pupilo Theme Main Stylesheet
Author: pupilo
Author URI: http://pupilo.com.mx
Description: Wordpress Theme
Version: 1.0 / 04-12-2023

=================================================================== */


/* EXTRAS
=================================================================== */
html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

.columna{display: grid; grid-template-columns: 1fr;}
.fila{display: grid; grid-template-columns: 1fr 1fr 1fr;}
.galeria{padding:0px 15px 15px;}
.galeria .pieza{width:100%; height:230px; overflow:hidden;}
.galeria .pieza img {width:100%; min-height:230px; height:100%;}
.galeria h3 {font-size: 12px; text-transform: uppercase; margin-top: 30px; font-family: 'Inter'; font-weight: 500; color: #8a817c;}
.galeria h3 a {color: #000;}
.galeria p {font-size:12px; font-family:'Inter'; margin:20px 0;}
.galeria h4{font-size:14px; font-weight:400;}
.expo{display: grid; grid-template-columns: 1fr 6fr;}
.expo_fecha p {font-size: 12px; text-transform: uppercase; font-family: 'Inter'; color: #8a817c;}
.expo_titulo p {font-size: 12px; text-transform: uppercase; font-family: 'Inter';}
.expo_titulo p a {color: #000;}
.publicaciones {display: grid; grid-template-columns: 1fr 6fr;}
.publicaciones_fecha p {font-size: 12px; text-transform: uppercase; font-family: 'Inter'; color: #8a817c;}
.publicaciones_titulo p {font-size: 12px; text-transform: uppercase; font-family: 'Inter'; margin:10px 0;}
.publicaciones_titulo p.desc {font-size: 12px; font-family: 'Inter'; margin:10px 0; text-transform:unset;}
.colecciones {display: grid; grid-template-columns: 1fr;}
.colecciones p {font-size: 12px; font-family: 'Inter';}
.semblanza {font-size: 14px; font-family:'Inter'; color: #333a3d; line-height:1.9;}



/* RESPONSIVE
=================================================================== */

@media only screen and ( max-width: 1280px ){

}

@media only screen and ( max-width: 960px ){
	.fila{display: grid; grid-template-columns: 1fr 1fr;}
	.expo{display: grid;grid-template-columns: 1fr 2fr;}
}

@media only screen and ( max-width: 767px ){

}

@media only screen and (max-width: 576px) {
	.fila{display: grid; grid-template-columns: 1fr;}
	.expo{display: grid;grid-template-columns: 1fr 2fr;}
}