html { color: #222; font-size: 1em; line-height: 1.4; } ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; } fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; } .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }

/* ==========================================================================
   Author's custom styles #f3523c  #b33c2d
   ========================================================================== */

#nosotros{background: #f7b731; color: #202020; font-family: 'dm_sansbold'}

.boton{display: block; width: 150px; border-radius: 50px; border: 2px solid #f7b731; color: #202020; text-align: center; padding: 8px 0; font-family: 'dm_sansbold'; margin: 0 auto; font-size: 14px}
.boton:hover{background: #f7b731; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7b831', endColorstr='#fed130', GradientType=0 );
 color: #fff} 

section.hero{margin: 180px auto 0!important; display: block; height: 200px; width: 100%; background: url("../img/bann-nosotros.jpg"); background-size: cover; background-position: center center; display: flex; justify-content: center; align-items: center; }
section.hero div.cont{width: 80%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 30px; color: #f7b731; text-align: center; font-family: 'dm_sansbold'}
section.hero div.cont p{font-size: 16px; color: #fff;  text-align: center; margin: 0 auto}


/* == CALIDAD CONFIANZA == */
.amcoMX div.cont div{width: 90%; margin: 0 auto; padding: 30px 0 0}
.amcoMX div.cont div h2{text-align: center;; font-size: 28px; color: #202020; font-weight: normal; line-height: 1.2em; margin: 20px auto}
.amcoMX div.cont div h2 span{color: #f7b731; }
.amcoMX div.cont div p{font-size: 14px; text-align: justify; line-height: 1.2em; margin-bottom: 30px}
.amcoMX div.cont div.cajaVideo{width: 100%; height: 80vw; display: flex; justify-content: center; align-items: center; background: url("../img/Rectángulo-14.png"); background-size:  70% 100%; background-position: center center; background-repeat: no-repeat}
#vimeo{width: 90vw; height: 52vw}


/* == NUMEROS == */
section.numeros{width: 100%; background: #202020; padding: 30px 0}
section.numeros p{color: #f7b731; text-align: center; font-size: 40px!important;}
section.numeros p .ama{color: #f7b731;}
.textoN{color: #fff; display: block;font-size: 16px!important;}


/* == CALIDAD Y CONFIANZA == */
section.calidad{width: 100%; padding: 50px 0;}
section.calidad div.cont{width: 90%; margin: 0 auto}
section.calidad div.cont h4{font-size: 28px; margin: 0 0 20px 0; text-align: center; font-family:  'dm_sansbold'; font-weight: normal;color: #f7b731; line-height: 1.2em;}
section.calidad div.cont h4 span{color: #202020}

section.calidad div.cont .mision{width: 100%; background: #202020; padding: 15px; border-radius: 10px;}
section.calidad div.cont .mision p.tittle{color: #f7b731; text-align: center; font-size: 28px; margin: 0}
section.calidad div.cont .mision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background: url("../img/icono-mision.png"); background-size: 50px; background-position: center center; background-repeat: no-repeat; transform: translateY(13px); margin-right: 15px}
section.calidad div.cont .mision p{font-size: 14px; color: #fff; text-align:center}

section.calidad div.cont .vision{width: 100%; background: #fed330; padding: 15px; border-radius: 10px; float: right; margin-top: 30px; }
section.calidad div.cont .vision p.tittle{color: #202020; text-align: center; font-size: 28px; margin: 0}
section.calidad div.cont .vision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background: url("../img/icono-vision.png"); background-size: 50px; background-position: center center; background-repeat: no-repeat; transform: translateY(13px); margin-right: 15px}
section.calidad div.cont .vision p{font-size: 14px; color: #202020; text-align:center}


/* == LEALTAD == */
section.lealtad{width: 100%; padding: 50px 0; background: #202020}
section.lealtad div.cont{text-align: center; font-size: 28px;}
section.lealtad div.cont p{color: #fff; font-family:  'dm_sansbold'; margin: 30px auto }
section.lealtad div.cont .amarillo{color: #f7b731}




/* == 768px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:768px){
#nosotros{background: none; color: #f7b731; font-family: 'dm_sansbold'}

section.hero{margin: 120px auto 0!important; height: 180px; width: 100%; }
section.hero div.cont{width: 90%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 30px; text-align: left}
section.hero div.cont p{font-size: 16px; ; text-align: left}
	
	
/* == CALIDAD CONFIANZA == */
	.amcoMX div.cont{width: 90%; margin: 0 auto}
.amcoMX div.cont div{width: 50%; margin: 0 auto; padding: 80px 0 0; float: left}
.amcoMX div.cont div h2{text-align: left; font-size: 30px; }
.amcoMX div.cont div p{font-size: 14px; margin-bottom: 30px}
.amcoMX div.cont div.cajaVideo{width: 45%; height: 450px; background-size: 200px 450px; float: right; padding: 0}
#vimeo{width: 90vw; height: 23vw}

/* == NUMEROS == */
section.numeros{padding: 30px 0}
	section.numeros div.cont{width: 90%; margin: 0 auto}	
section.numeros p{font-size: 40px!important; width: 25%; float: left;  text-align: left; }
section.numeros p .ama{color: #f7b731;}
.textoN{font-size: 20px!important; }


/* == CALIDAD Y CONFIANZA == */
section.calidad{width: 100%; padding: 70px 0;}
section.calidad div.cont{width: 90%; margin: 0 auto}
section.calidad div.cont h4{font-size: 30px; margin: 0 0 50px 0; }
section.calidad div.cont .mision{width: 51%;float: left; padding: 35px; box-shadow: 5px 0 15px 0px rgba(0,0,0,0.2)}
section.calidad div.cont .mision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .mision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 5vw}
section.calidad div.cont .mision p{font-size: 14px; text-align:center}

section.calidad div.cont .vision{width: 51%;float: right; padding: 35px; margin-top: -150px; box-shadow: 5px 0 15px 0px rgba(0,0,0,0.2)}
section.calidad div.cont .vision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .vision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 5vw}
section.calidad div.cont .vision p{font-size: 14px; text-align:center}


/* == LEALTAD == */
section.lealtad{width: 100%; padding: 50px 0; background: #202020}
section.lealtad div.cont{text-align: center; font-size: 30px;}
section.lealtad div.cont p{width: 25%; float: left}


}

/* == 1024px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1024px){
section.hero div.cont{width: 80%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 35px;}
section.hero div.cont p{font-size: 24px;}
	
/* == CALIDAD CONFIANZA == */
.amcoMX div.cont{width: 80%;}
.amcoMX div.cont div{width: 45%; padding: 80px 0 0;}
.amcoMX div.cont div h2{text-align: left; }
.amcoMX div.cont div p{font-size: 16px; margin-bottom: 30px}
.amcoMX div.cont div.cajaVideo{height: 450px; background-size: 300px 450px; float: right; padding: 0}
#vimeo{width: 90vw; height: 20vw}


/* == NUMEROS == */
section.numeros{padding: 30px 0}
	section.numeros div.cont{width: 80%; margin: 0 auto}	
section.numeros p{font-size: 45px!important; width: 25%; float: left;  text-align: center; }
.textoN{font-size: 28px!important; line-height: 1.2em; }

/* == CALIDAD Y CONFIANZA == */
section.calidad{width: 100%; padding: 70px 0;}
section.calidad div.cont{width: 80%; margin: 0 auto}
section.calidad div.cont h4{font-size: 30px; margin: 0 0 50px 0; }
section.calidad div.cont .mision{width: 51%;float: left; padding: 35px 50px; height: 280px}
section.calidad div.cont .mision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .mision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 2vw}
section.calidad div.cont .mision p{font-size: 16px; text-align: justify}

section.calidad div.cont .vision{width: 51%;float: right; padding: 35px 50px; margin-top: -150px; height: 280px}
section.calidad div.cont .vision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .vision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 2vw}
section.calidad div.cont .vision p{font-size: 16px; text-align: justify}
	
	
	
/* == LEALTAD == */
section.lealtad{padding: 50px 0;}
section.lealtad div.cont{font-size: 30px; width: 80%; margin: 0 auto}

}

/* == 1280px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1280px){
.boton{font-size: 16px}

section.hero div.cont{width: 75%; margin: 0 auto}
section.hero div.cont p.tittle{font-size: 45px;}
section.hero div.cont p{font-size: 24px;}
	
	
/* == CALIDAD CONFIANZA == */
.amcoMX div.cont{width: 76%;}
.amcoMX div.cont div{width: 45%; padding: 120px 0 0;}
.amcoMX div.cont div h2{text-align: left; font-size: 50px}
.amcoMX div.cont div p{font-size: 18px; margin-bottom: 30px}
.amcoMX div.cont div.cajaVideo{height: 550px; background-size: 300px 550px; float: right; padding: 0}
#vimeo{width: 90vw; height: 19vw}
	
	
/* == NUMEROS == */
section.numeros{padding: 30px 0}
	section.numeros div.cont{width: 76%; margin: 0 auto}	
section.numeros p{font-size: 45px!important; width: 25%; float: left;  text-align: center; }
	section.numeros p .ama{ font-family: 'dm_sansbold'; font-weight: normal}
.textoN{font-size: 28px!important; line-height: 1.2em; }

/* == CALIDAD Y CONFIANZA == */
section.calidad{width: 100%; padding: 100px 0;}
section.calidad div.cont{width: 76%; margin: 0 auto}
section.calidad div.cont h4{font-size: 30px; margin: 0 0 50px 0; }
section.calidad div.cont .mision{width: 51%;float: left; padding: 35px 50px; height: 280px}
section.calidad div.cont .mision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .mision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 2vw}
section.calidad div.cont .mision p{font-size: 18px; text-align: justify}

section.calidad div.cont .vision{width: 51%;float: right; padding: 35px 50px; margin-top: -150px; height: 280px}
section.calidad div.cont .vision p.tittle{text-align: left; font-size: 30px; margin: 0 auto; width: auto}
section.calidad div.cont .vision p.tittle::before{content: ''; width: 50px; height: 50px; display: inline-block; background-size: 50px; background-position: center center; margin-right: 2vw}
section.calidad div.cont .vision p{font-size: 18px; text-align: justify}

	
	/* == LEALTAD == */
section.lealtad{padding: 70px 0;}

}

/* == 1600px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1600px){
/* == LEALTAD == */
section.lealtad{width: 100%; padding: 50px 0; background: #202020}
section.lealtad div.cont{text-align: center; font-size: 40px;}
section.lealtad div.cont p{width: 25%; float: left}

}



/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden{display:none!important}.visuallyhidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;-webkit-clip-path:none;clip-path:none;height:auto;margin:0;overflow:visible;position:static;width:auto;white-space:inherit}.invisible{visibility:hidden}
.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,:before,:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}
a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}
pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}
