/* 
Theme Name: FOMAX2021
Template Theme URI: https://www.fomax.com,mx/
Author: Salomón Echavarría - QuintoPi5o
Author URI: http://www.quintopisoweb.com/
Description: Plantilla creada para el sitio web Fomax.com.mx
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: Brochure
Text Domain: fomax

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

*/

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

body{
	text-align:center;
	font-family:'Roboto', sans-serif;
	font-size:1em;
	color:#333;
	background-color:#cfcdcf;
	--color-1:#ee0000;
	--color-2:#ffaa01;
	--color-3:#cfcdcf;
	--color-4:#f4f4f4;
	--positivo:#fff;
	--negativo:#333;
	--fuente-huge:4.5vw;
	--fuente-xl:3vw;
	--fuente-large:2.2vw;
	--fuente-medium:1.7vw;
	--fuente-normal:1.2vw;
	--fuente-small:1vw;/*Tamaño de fuente pequeña*/
	--fuente-extra-small:0.7vw;
	--fuente-t-1:2vw;
	--fuente-t-2:1.8vw;
	--fuente-t-3:1.6vw;
	--fuente-t-4:1.4vw;
	--fuente-w-1:300; /*Ancho de fuente 1*/
	--fuente-w-2:700; /*Ancho de fuente 2*/
	--alto-1:20vh;
	--alto-2:55vh;
	--padding-0:0.5vw;
	--padding-1:1vw;
	--padding-2:2vw;
	--padding-3:3vw;
	--padding-4:4vw;
	font-weight: var(--fuente-w-1);
	--ancho-1:15%; /*Ancho logo*/
	--ancho-2:85%; /*Ancho logo*/
	--ancho-3:20%; /*Ancho barra lateral*/
}

h1, h2, h3, h4 ,h5{
	text-transform:uppercase;
	font-weight:var(--fuente-w-2);
}

h1{
	font-size:var(--fuente-xl);
}

h2{
	font-size:var(--fuente-xl);
	margin-bottom:var(--padding-2);
}

h3{
	font-size:var(--fuente-large);
	margin-bottom:var(--padding-2);	
}

h4{
	font-size:var(--fuente-medium);
	margin-bottom:var(--padding-2);
}

h5{
	font-size:var(--fuente-normal);
	margin-bottom:var(--padding-2);
}

p{
	font-size:var(--fuente-normal);
	margin-bottom:var(--padding-2);
	font-weight:var(--fuente-w-1);
	line-height:1.5em;
}

a, a strong{
	color:var(--color-2);
	font-weight:var(--fuente-w-2);
	text-decoration:none;
}

a:hover, a strong:hover{
	text-decoration:underline;
}

ul, ol{
	padding-left:var(--padding-2);
	margin-bottom:var(--padding-2);
}

ul li, ol li{
	font-size:var(--fuente-normal);
	list-style-position:outside;
	margin-bottom:var(--padding-1);
}

strong{
	font-weight:var(--fuente-w-2);
}

small{
	font-size:var(--fuente-small);
}

img{
	max-width:100%;
	height:auto;
}

.no-mobil{
	display:none;
}

/*Estilos Wordpress*/

.entry-content{
	text-align:left;
}

.entry-content > div{
	max-width:55%;
	margin:0 auto;
}

.ugb-highlight{
	background:linear-gradient(to bottom, transparent 90%, #ee0000 10%) !important;
}

.wp-block-cover, .wp-block-cover-image{
	padding:var(--padding-4);
}

.wp-block-button__link{
	text-transform:uppercase;
	padding:var(--padding-1) var(--padding-2);
	border-radius:0;
	font-size:var(--fuente-normal);
}

.wp-block-coblocks-service__figure img{
	max-width:100%;
	object-fit: inherit;
}

.wp-block-group{
	padding:var(--padding-4) !important;
	margin:var(--padding-1) 0 0 !important;
}

.wp-block-separator.has-background:not(.is-style-dots){
	margin:0 0 var(--padding-2);
}

.wp-block-gallery .blocks-gallery-item figure{
	align-items: center;
}

.alignfull{
	max-width:100% !important;
}

.alignwide{
	max-width:80% !important;
	margin:0 auto;
}

.wp-block-column:not(:first-child){
	
}

.coblocks-form .coblocks-field, .coblocks-form select{
	padding: var(--padding-1);
	margin: 0 0 var(--padding-1);
}

.coblocks-form label{
	font-size:var(--fuente-normal);
	margin: 0 0 var(--padding-1);
}


p.has-background{
	margin:0;
	padding: var(--padding-2) var(--padding-3);
}

/*Estilos Editor*/

/*Tamaños de fuente editor*/

.has-extra-small-font-size{
	font-size:var(--fuente-extra-small) !important;
	line-height:1.2em;
}

.has-small-font-size{
	font-size:var(--fuente-small) !important;
	line-height:1.2em;
}

.has-normal-font-size, .has-regular-font-size{
	font-size:var(--fuente-normal) !important;
	line-height:1.2em;
}

.has-medium-font-size{
	font-size:var(--fuente-medium) !important;
	line-height:1.2em;
}

.has-large-font-size{
	font-size:var(--fuente-large) !important;
	line-height:1.2em;
	
}

.has-extra-large-font-size{
	font-size:var(--fuente-xl) !important;
	line-height:1.2em;
}

.has-huge-font-size, .has-larger-font-size{
	font-size:var(--fuente-huge) !important;
	line-height:1em;
	font-weight:var(--fuente-w-2);
}

/*Colore editor*/

.has-rojo-fomax-background-color{
	background-color:var(--color-1);
}

.has-amarillo-fomax-background-color{
	background-color:var(--color-2);
}

.has-gris-fomax-background-color{
	background-color:var(--color-3);
}

.has-gris-claro-background-color{
	background-color:var(--color-4);
}

.has-blanco-background-color{
	background-color:var(--positivo);
}

.has-negativo-background-color{
	background-color:var(--negativo);
}

.has-rojo-fomax-color{
	color:var(--color-1);
}

.has-amarillo-fomax-color{
	color:var(--color-2);
}

.has-gris-fomax-color{
	color:var(--color-3);
}

.has-gris-claro-color{
	color:var(--color-4);
}

.has-blanco-color{
	color:var(--positivo);
}

.has-negativo-color{
	color:var(--negativo);
}

/*Paddings Coblocks*/

/*Personalizados*/

.mayusculas{
	text-transform:uppercase;
}

.centrar{
	text-align:center;
}

/*Header Fomax*/

header{
	position: fixed;
	top: 0;
	left: 0;
	width:100%;
	background: #f4f4f4;
	z-index: 100;
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
	height:var(--alto-1);
}

		#id{
			float:left;
			width:var(--ancho-1);
			background-color:var(--color-1);
			padding:var(--padding-1) var(--padding-2);
			display:flex;
			align-items: center;
			justify-content: center;
			height:100%;
		}
		
				.custom-logo-link{
					height:80%;
				}
		
				#id h1{
					text-indent:-2000px;
					font-size:0.1em;
				}
		
				#id img{
					width:auto;
					height:100%;
					line-height:18vh;
				}
				
		#header-derecha{
			float:left;
			width:var(--ancho-2);
			height:100%;
		}
		
				#herramientas-contacto{
					float:left;
					width:100%;
					background-color:var(--color-2);
					height:30%;
					display:flex;
				}
				
						#ubicacion{
							flex-grow:1;
							justify-content:right;
							align-items: center;
							display:flex;
							padding:var(--padding-0) var(--padding-2);
						}
								
								#ubicacion-h{
									float:right;
								}
						
								#ubicacion a.tel{
									line-height:1.8em;
									font-size:var(--fuente-small);
									color:#fff;
									font-weight:var(--fuente-w-2);
								}
								
								#ubicacion-h img{
									float:left;
									max-height:1.5em;
									width:auto;
									margin:0.2em var(--padding-0) 0 0;
								}
						
						#contacto{
							flex-shrink:0;
							min-width:var(--ancho-3);
							justify-content: center;
							align-items: center;
							display:flex;
							padding:var(--padding-0) var(--padding-2);
							background-color:var(--color-1);
						}
						
								#contacto > div:first-child{
									margin-right:var(--padding-2);
								}
								
								#contacto-tel{
									float:left;
								}
						
								#contacto a.tel{
									line-height:1.5em;
									font-size:var(--fuente-small);
									color:#fff;
									font-weight:var(--fuente-w-2);
								}
								
								#contacto-tel img{
									float:left;
									max-height:1.2em;
									width:auto;
									margin:0.2em var(--padding-0) 0 0;
								}
				
				#menu-ppl-redes{
					float:left;
					width:100%;
					background-color:#f4f4f4;
					height:70%;
					display:flex;
				}
				
						nav.menu-principal{
							flex-grow:1;
							justify-content: center;
							align-items: center;
							display:flex;
							background-color:rgba(255,255,255,0.3);
						}
						
						#redes-seguir{
							flex-shrink:0;
							min-width:var(--ancho-1);
							justify-content: center;
							align-items: center;
							display:flex;
						}
								
								#buscador{
									float:right;
									width:100%;
									padding:var(--padding-1) var(--padding-2);
								}
								
											.screen-reader-text{
												clip: rect(1px, 1px, 1px, 1px);
												height: 1px;
												overflow: hidden;
												position: absolute !important;
												width: 1px;
												word-wrap: normal !important;
											}
											
											.searchform #s{
												background:var(--positivo);
												border: 1px solid #CCC;
												border-radius: 2px;
												color:var(--negativo);
												padding:var(--padding-0) var(--padding-0);
												margin:0;
											}
											
											.searchform #searchsubmit{
												width:2vw;
												cursor:pointer;
												background:var(--color-1);
												border: 0;
												border-radius: 2px;
												color:var(--positivo);
												font-weight:var(--fuente-w-2);
												letter-spacing: 0.046875em;
												line-height: 1;
												padding: 0.84375em 0.875em 0.78125em;
												text-transform: uppercase;
												text-indent:-2000px;
												background-image:url("img/lupa.svg");
												background-repeat:no-repeat;
												background-size:70% auto;
												background-position:center center;
											}

		#whatsapp{
			position:fixed;
			bottom:5vh;
			right:0;
			width:8%;
			/*background-color:#1ebea5;*/
		}
		
				#whatsapp img{
					width:100%;
					max-width:100%;
					height:auto;
					padding:var(--padding-0);
				}

/* Transitions and class for reduced height */
header{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

header.header-shrink {
	height:12vh;
}

#espacio-header{
	float:left;
	width:100%;
	height:var(--alto-1);
}

/*Termina el header*/

/*Página de inicio*/

.servicio-home{
	grid-template-columns:10% 30% 20% 20% 20%;
	padding:var(--padding-4) 0 0 0;
}

		.servicio-home .wp-block-media-text__media{
			grid-column: 1 / 5 !important;
			height:70vh !important;
		}
		
		.servicio-home .wp-block-media-text.is-image-fill .wp-block-media-text__media{
			height:120%;
		}
		
		.servicio-home .wp-block-media-text__content{
			grid-column: 4 / 6 !important;
			background-color:var(--color-3) !important;
			min-height:35vh !important;
			padding:var(--padding-4) !important;
		}
		
		.wp-block-media-text.is-style-card .wp-block-media-text__content{
		}

/*Interna*/

.internas-cont{
	float:left;
	width:100%;
	text-align:left;
}

		#imagen-apertura-post-titulo{
			float:left;
			width:100%;
			position:relative;
			min-height:var(--alto-2);
		}
		
				#imagen-apertura-cont{
					position:absolute;
					width:100%;
					top:0;
					left:0;
				}
				
						#img-single{
							float:left;
							width:100%;
							min-height:var(--alto-2);
							background-size:cover;
							background-position:center center;
						}
				
				#titulo-side{
					position:absolute;
					width:50%;
					bottom:0;
					left:0;
					padding:var(--padding-4) var(--padding-3) var(--padding-4) var(--padding-4);
					background-color:rgba(255,255,255,0.5);
					text-align:right;
				}
				
						#categoria {
							float:right;
						}
				
								#categoria ul{
									padding:0 !important;
									margin:0 ;
								}
						
								#categoria ul li{
									list-style-type:none;
									margin:0;
								}
								
								#categoria ul li a{
									font-weight:var(--fuente-w-2);
								}
								
								ul.post-categories{
									color:var(--positivo);
									float:left;
									margin:0;
								}
								
										ul.post-categories li{
											background-color:var(--color-2);
											padding:var(--padding-0) var(--padding-1);
											list-style-type:none;
											margin:0 var(--padding-1);
											display:inline-block;
											font-size:var(--fuente-small);
										}
								
										ul.post-categories a{
											color:var(--positivo);
										}
		.titulo-single{
			float:left;
			width:100%;
			padding:var(--padding-4) var(--padding-4) var(--padding-2);
			background-color:var(--positivo);
		}
		
				.titulo-single #categoria {
					max-width:40%;
				}
		
				.titulo-single h2{
					display:flex;
					margin:0 auto;
					max-width:80%;
				}

				.titulo-single h2 span{
					flex-shrink:0;
					width:auto;
					max-width:60%;
				}
		
				.titulo-single h2:after{
					content:"";
					border-bottom:2px solid var(--color-2);
					flex-grow:1;
					height:2px;
					margin:var(--padding-2) 0 0 var(--padding-2);
				}

				
		.wrapper-single{
			float:left;
			width:100%;
		}
		
				.main-single{
					float:left;
					width:100%;				
					background-color:var(--positivo);
				}
				
						#wrapper-cont-single{
							width:100%;
							margin:0 auto;
						}
						
								#contenido-single{
									float:left;
									width:100%;
									padding:var(--padding-3);
								}
						
										#contenido-single section > p, #contenido-single section > div, #contenido-single section > h1, #contenido-single section > h2, #contenido-single section > h3, #contenido-single section > h4, #contenido-single section > h5, #contenido-single section > ul li{
											max-width:50%;
											margin:0 auto var(--padding-2);
										}
										
										#contenido-single section > div{
											margin-bottom:var(--padding-4);
										}
								
				.side-single{
					float:left;
					width:100%;
				}
				
						.pos-1 h2{
							margin:var(--padding-2) 0;
							font-size: var(--fuente-large);
							font-weight:var(--fuente-w-1);
							display:flex;
							width:100%;
						}
						
								.side-single h2 span{
									flex-shrink:0;
									width:auto;
								}
						
								.side-single h2:after{
									content:"";
									border-bottom:2px solid var(--color-2);
									flex-grow:1;
									height:2px;
									margin:var(--padding-2) 0 0 var(--padding-2);
								}
/*Page*/

.page-general{
	background-color:var(--positivo);
	text-align:left;
}

		.page-general h2{
			font-size:var(--fuente-xl);
			font-weight:var(--fuente-w-2);
		}


		.contenido-page{
			float:left;
			width:100%;
			margin:var(--padding-4) 0;
		}
		
				.contenido-page > div, .contenido-page > p, .contenido-page > h1, .contenido-page > h2, .contenido-page > h3, .contenido-page > h4, .contenido-page > h5, .contenido-page > ul li{
					max-width:50%;
					margin:0 auto var(--padding-2);
				}
				
				.contenido-page > {
					margin:0 auto var(--padding-2);
					width:100%;
					max-width:65%;
				}
				
				.bloque-contacto{
					min-height:15vh;
					display:flex;
					align-items: center;
  					justify-content: center;
				}
				
				.bloque-contacto < wp-block-column < wp-block-columns{
					margin-top:-5em;
				}
/*Categoría*/

.cat-list{
	float:left;
	width:100%;
	margin:0 0 var(--padding-1);
}

		.cat-list:after{
			content:"";
			float:left;
			border-bottom:1px solid var(--color-1);
			width:70%;
			margin:var(--padding-3) 0 var(--padding-3) 15%;
		}

		a.img-cat{
			float:left;
			width:60%;
			height:40vh;
			background-size:100% auto;
			background-position:center center;
			transition: 0.3s;
		}
		
				a.img-cat:hover{
					background-size:110% auto;
				}
		
		.text-cat{
			float:right;
			width:50%;
			margin:10vh 0 0 -10%;
			
		}
						
				.tag-cat{
					color:var(--positivo);
					float:left;
				}
				
						.tag-cat ul{
							margin:0;
							padding:0;
						}
						
						.tag-cat ul li{
							display:inline-block;
							list-style-type:none;
							margin:0;
							padding:0;
							font-size:var(--fuente-small);
							background-color:var(--color-2);
							padding:var(--padding-1) var(--padding-3);
						}
						
						.tag-cat a{
							color:var(--positivo);
						}
						
				
		
				.text-cat > a{
					float:left;
					width:100%;
					padding:var(--padding-3);
					background-color:var(--color-4);
					transition: 0.3s;
					opacity:0.9;
				}
				
				.text-cat > a:hover{
					opacity:1;
				}
		
				.text-cat .tit-cat{
					color:var(--negativo);
				}
				
						.text-cat a{
							text-decoration:none;
						}
				
				.text-cat p{
					float:left;
					width:100%;
					color:var(--negativo);
					margin:var(--padding-2) 0 !important;
				}
				


/*Búsqueda*/

.texto-busqueda{
	float:left;
	width:100%;
	padding:var(--padding-4) var(--padding-4) 0;
}

.titulo-busqueda{
	float:left;
	width:100%;
	padding:0 var(--padding-4) 0;
}

/*Footer*/

#footer{
	float:left;
	width:100%;
	background-color:#f4f4f4;
	display:flex;
	text-align:left;
}

		#content-footer{
			flex-grow:1;
			padding:2em 4em;
		}
		
				#content-footer h3{
					font-weight:300;
					font-style:italic;
					border-bottom:3px solid var(--color-1);
					width:min-content;
					padding-right:1em;
					margin:0 0 1em 0;
					font-size:1.3em;
					text-transform:uppercase;
					font-family:var(--font-1);
				}
		
				#footer-1{
					float:left;
					width:33.33%;
					padding:1em 2em;
				}
				
				#footer-2{
					float:left;
					width:33.33%;
					padding:1em 2em;
				}
				
				#footer-3{
					float:left;
					width:33.33%;
					padding:1em 2em;
				}
				
				#legal{
					float:left;
					width:100%;
					padding:1em 2em;
					text-align:center;
				}
				
				#footer .sharethis-inline-follow-buttons{
					text-align:left !important;
					padding:1em 0;
				}
				
		#side-footer{
			flex-shrink:0;
    		width:var(--ancho-side);
			background-color:#fff;
			padding:2em;
		}
		
		#side-footer img{
			max-width:46%;
			float:left;
		}
		
		#side-footer img:first-child{
			margin-left:4%;
		}