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
   ========================================================================== */

#inicio{background: #f7b731; color: #202020; font-family: 'dm_sansbold'}
div.cont{widows: 90%; margin: 0 auto}
.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} 

.swiper-container{width: 100vw;height: 550px; margin: 100px 0 0; padding: 0; }
.swiper-wrapper{}
.swiper-slide {text-align: center;font-size: 18px;background: #fff; width: 100vw;  position: relative;
  /* Center slide text vertically */background-position: center center}
.swiper-slide h3{margin: 200px auto 0; width: 90% ;text-align: center; font-size: 30px; line-height: 1em}
.swiper-slide p{margin: 20px auto; width: 90% ;text-align: center; font-size: 18px}
.swiper-slide a{margin: 0 auto; width: 200px ;text-align: center; display: block; font-size: 14px}

.uno{background: url(../img/banners/1.jpg); background-size: cover; ; position: relative;}
.uno a{background: #202020; padding: 10px 0; border-radius: 50px; color: #fff;font-family: 'dm_sansbold'}

.dos{background: url(../img/banners/2.jpg); background-size: cover; position: relative;}
.dos h3{color: #fff; }
.dos p{color: #fff; width: 80% }
.dos a{background: #f7b731; padding: 10px 0; border-radius: 50px; color: #fff;font-family: 'dm_sansbold'}


.swiper-button-next{display: none}
.swiper-button-prev{display: none}
/* == AMCO EMPRESA MEXICANA == */

section.amco-mex{widows: 100%; display: block; margin-bottom: 50px}
section.amco-mex div.cont{width: 90%; margin: 0 auto}
section.amco-mex div.cont div.img{width: 100%; height: 300px; display: block;; background: url(../img/amco-mex.png); background-size: 300px; background-position: center center; background-repeat: no-repeat;}
section.amco-mex div.cont div.texto{width: 90%; margin: 0 auto}
section.amco-mex div.cont div.texto h1{text-align: center;; font-size: 28px; color: #202020; font-weight: normal; line-height: 1.2em; margin: 20px auto}
section.amco-mex div.cont div.texto h1 span{color: #f7b731; }
section.amco-mex div.cont div.texto p{font-size: 14px; text-align: justify; line-height: 1.2em; margin-bottom: 30px}
section.amco-mex div.cont div.texto a{}


/* == CALIDAD CONFIANZA == */
section.calidad{width: 100%; margin: 0 auto; background: #000; border-bottom: 8px solid #fed330; padding-top: 50px}
section.calidad::after{content: ''; width: 100%; height: 300px; background: url("../img/calidad-confianza-mobile.jpg"); background-size: cover; background-position: center center; display: block}
section.calidad div.cont{width: 90%; margin: 0 auto}

section.calidad h3{font-size: 28px; color: #fff; text-align: center; line-height: 1em; margin: 0}
section.calidad h3 span{color: #f7b731}
section.calidad p{color: #fff; font-size: 14px; margin: 15px auto 50px; text-align: center;}

/* == SERVICIOS == */
section.servicios{padding: 30px 0; }
section.servicios div.cont{width: 90%; margin: 0 auto}
section.servicios h4{font-size: 28px; margin: 0; text-align: center; font-family:  'dm_sansbold'; font-weight: normal;color: #202020}
section.servicios p{font-size: 14px; text-align: center; margin: 0px auto 0;color: #202020}
section.servicios .cajas{padding: 30px 0 0}

.caja-s{width: 100%; height: auto; padding: 20px; text-align: center; border: 1px solid rgba(0,0,0,0.1); box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); margin-bottom: 30px; border-radius: 10px;  -webkit-transition: ease-in-out .4s;-moz-transition: ease-in-out .4s;-o-transition: ease-in-out .4s;transition: ease-in-out .4s;}
.caja-s:hover{transform: scale(1.05)}
.caja-s h2{color: #202020; margin: 0; font-size: 20px;font-family:  'dm_sansbold'; font-weight: normal; margin-bottom: 15px}
.caja-s p{color: #202020; font-size: 14px; line-height: 1em;margin: 15px auto 20px!important;}

.terra h2::before, .demo h2::before, .exca h2::before, .leva h2::before, .pavi h2::before, .renta h2::before{content: ''; width: 100%; display: block; height: 100px;}
.terra h2::before{background: url("../img/servicios/terracerias.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }
.demo h2::before{background: url("../img/servicios/demolicion.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }
.exca h2::before{background: url("../img/servicios/excavaciones.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }
.leva h2::before{background: url("../img/servicios/levantamientos.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }
.pavi h2::before{background: url("../img/servicios/pavimentacion.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }
.renta h2::before{background: url("../img/servicios/renta-de-equipo.jpg"); background-size: 150px;  background-position: center center; background-repeat: no-repeat }

.btn-serv{background: #f7b731!important; color: #fff}
.btn-serv:hover{background: #fff!important; color: #000;}


/* == SERVICIOS == */
#proyectos{padding: 30px 0 0}
#proyectos div.cont{margin: 0 auto; width: 90%; }

#proyectos h4{font-size: 28px; margin: 0; text-align: center; font-family:  'dm_sansbold'; font-weight: normal;color: #202020}
#proyectos p{font-size: 14px; text-align: center; margin: 0px auto 0;color: #202020}
#proyectos .cajas{padding: 30px 0 0}


#gal-fotos{margin: 0; padding: 20px 0; border-bottom: 2px solid #202020; width: 100%;cursor: pointer}
#gal-fotos span.gal{text-align: left;width: 80%; display: inline-block; padding-left: 5%; color: rgba(0,0,0,0.4)}
#plus{text-align: right;width: 10%; display: inline-block; color: rgba(0,0,0,0.4)}


.filter-button-group{height: 0; overflow: hidden; -webkit-transition: ease-in-out .3s;-moz-transition: ease-in-out .3s;-o-transition: ease-in-out .3s;transition: ease-in-out .3s;}
.group{height: 260px; overflow: hidden; -webkit-transition: ease-in-out .3s;-moz-transition: ease-in-out .3s;-o-transition: ease-in-out .3s;transition: ease-in-out .3s;}
.filter-button-group a{background: #202020; color: #fff; padding: 15px 40px; display: block; text-align: center}
.filter-button-group a:hover{background: #000}
.filter-button-group .active{background: #f7b731}


/* == PROYECTOS == */
div.grid{width: 100%; height: 120vw!important; overflow: hidden}
div.grid div a{overflow: hidden!important}
div.grid img{width: 100%; float: left; opacity: 1}
div.grid img:hover{; opacity: .1}
div.grid .terracerias, div.grid .demolicion, div.grid .excavacion, div.grid .pavimentos, div.grid .levantamientos{;background: url("../img/proyecto/ver-mas.png"); background-size: cover; background-position: center center; background-repeat: no-repeat; width: 50%; float: left}




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

.swiper-container {width: 100vw;height: 60vh; margin: 100px 0 0; padding: 0; }
.swiper-slide div.cont{width: 90%; margin: 0 auto}
.swiper-slide h3{font-size: 38px; width: 70%; margin-left: 0; margin-top: 20vh}
.swiper-slide p{font-size: 20px; width: 65%; margin-left: 0}
.swiper-slide a{font-size: 14px}

.uno{}
.uno h3{ text-align: left;}
.uno p{ text-align: left;}
.uno a{margin-left: 0; border: 2px solid #202020; }
.uno a:hover{border: 2px solid #202020; background: none; color: #202020; transform: scale(1.05);}

.dos{background: url(../img/banners/2.jpg); background-size: cover; position: relative;}
.dos h3{text-align: left;}
.dos p{text-align: left;}
.dos a{margin-left: 0; border: 2px solid #f7b731; }
.dos a:hover{border: 2px solid #f7b731; background: none; color: #f7b731; transform: scale(1.05);}

	
.swiper-button-next{display: block; position: absolute; margin-top: 23vh; width: 35px; height: 35px}
.swiper-button-prev{display: block; position: absolute;  margin-top: 23vh; width: 35px; height: 35px}
/* == AMCO EMPRESA MEXICANA == */
section.amco-mex{ margin-bottom: 0px}
section.amco-mex div.cont{width: 90%; margin: 0 auto; }
section.amco-mex div.cont div.img{width: 50%; height: 350px; background-size: 350px; float: left}
section.amco-mex div.cont div.texto{width: 50%; float: right; padding-right: 10%}
section.amco-mex div.cont div.texto h1{text-align: left; margin-top: 40px}
section.amco-mex div.cont div.texto p{text-align: justify;}
section.amco-mex div.cont div.texto a{margin-left: 0}

/* == CALIDAD CONFIANZA == */
section.calidad{width: 100%; margin: 0 auto; background: url("../img/calidad-confianza.jpg"); background-size: cover; padding: 80px 0; background-position: center center}
section.calidad::after{display: none}
section.calidad div.cont{width: 90%; margin: 0 auto}

section.calidad h3{font-size: 30px;text-align: left; width: 50%}
section.calidad h3 span{color: #f7b731;}
section.calidad p{font-size: 16px; margin: 15px 0 0; text-align: left; width: 40%}

	
/* == SERVICIOS == */
section.servicios{padding: 50px 0 30px; }
section.servicios div.cont{width: 90%;}
section.servicios h4{font-size: 30px;}
section.servicios p{font-size: 14px; }
section.servicios .cajas{padding: 30px 0 0}

	.caja-s{ width: 48%;}
	.clear-l{ float: left}
	.clear-r{ float: right}
	
/* == SERVICIOS == */
#proyectos{padding: 30px 0}
#proyectos div.cont{width: 90%; }
#proyectos h4{font-size: 30px; }
#proyectos p{font-size: 14px; }
#proyectos .cajas{padding: 30px 0 0}
#gal-fotos{display: none}

.filter-button-group{height: auto; text-align: center; margin: 20px auto}
.filter-button-group a{padding: 10px 20px; display: inline-block; border-radius: 50px;  margin: auto 0px }
.filter-button-group a:hover{background: #f7b731}
	
/* == PROYECTOS == */
div.grid{width: 100%;height: 55vw!important; }
div.grid img{width: 100%; float: left; opacity: 1}
div.grid .terracerias, div.grid .demolicion, div.grid .excavacion, div.grid .pavimentos, div.grid .levantamientos{ width: 33.3%; float: left; }
	
}

/* == 1024px MEDIA QUERY ========================================================================== */
@media only screen and (min-width:1024px){

.swiper-container {width: 100vw;height: 60vh; margin: 100px 0 0; padding: 0; }
.swiper-slide div.cont{width: 80%; margin: 0 auto}
.swiper-slide h3{font-size: 45px; width: 70%; margin-left: 0; }
.swiper-slide p{font-size: 24px; width: 65%; margin-left: 0}
.swiper-slide a{font-size: 14px}

.uno{}
.uno h3{ text-align: left;}
.uno p{ text-align: left;}
.uno a{margin-left: 0; border: 2px solid #202020; }
.uno a:hover{border: 2px solid #202020; background: none; color: #202020}

.dos{background: url(../img/banners/2.jpg); background-size: cover; position: relative;}
.dos h3{text-align: left;}
.dos p{text-align: left;}
.dos a{margin-left: 0}

/* == AMCO EMPRESA MEXICANA == */
section.amco-mex{ margin-bottom: 0px}
section.amco-mex div.cont{width: 80%; margin: 0 auto; }
section.amco-mex div.cont div.img{width: 40%; height: 350px; background-size: 350px; float: left}
section.amco-mex div.cont div.texto{width: 50%; float: right; padding-right: 0}
section.amco-mex div.cont div.texto h1{text-align: left; margin-top: 60px}
section.amco-mex div.cont div.texto p{text-align: justify;}
section.amco-mex div.cont div.texto a{margin-left: 0}

	
/* == CALIDAD CONFIANZA == */
section.calidad{padding: 90px 0}
section.calidad::after{display: none}
section.calidad div.cont{width: 80%; margin: 0 auto}

section.calidad h3{text-align: left; width: 50%}
section.calidad h3 span{color: #f7b731;}
section.calidad p{font-size: 16px; margin: 15px 0 0; }

	
/* == SERVICIOS == */
section.servicios{padding: 50px 0; }
section.servicios div.cont{width: 80%;}
section.servicios h4{font-size: 30px;}
section.servicios p{font-size: 14px; }
section.servicios .cajas{padding: 30px 0}

	.caja-s{ width: 30%; float: left; margin: 20px 1.65% }
	.clear-l{ float: left}
	.clear-r{ float: left}
	
/* == SERVICIOS == */
#proyectos{padding: 30px 0}
#proyectos div.cont{width: 90%; }
#proyectos h4{font-size: 30px; }
#proyectos p{font-size: 14px; }
#proyectos .cajas{padding: 30px 0 0}
#gal-fotos{display: none}

.filter-button-group{height: auto; text-align: center; margin: 20px auto}
.filter-button-group a{padding: 15px 20px; display: inline-block; border-radius: 50px;  margin: auto 10px }
.filter-button-group a:hover{background: #f7b731}

	
/* == PROYECTOS == */
div.grid{width: 100%;height: 400px!important; }
div.grid img{width: 100%; float: left; opacity: 1}
div.grid .terracerias, div.grid .demolicion, div.grid .excavacion, div.grid .pavimentos, div.grid .levantamientos{ width: 33.3%; float: left; height: 200px}
	
	
}

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

.swiper-container {width: 100vw;height: 70vh; margin: 100px 0 0; padding: 0; }
.swiper-slide div.cont{width: 80%; margin: 0 auto}
.swiper-slide h3{font-size: 55px; width: 70%; margin-left: 0; margin-top: 20vh}
.swiper-slide p{font-size: 28px; width: 65%; margin-left: 0}
.swiper-slide a{font-size: 16px}

.uno{}
.uno h3{ text-align: left;}
.uno p{ text-align: left;}
.uno a{margin-left: 0; border: 2px solid #202020; }
.uno a:hover{border: 2px solid #202020; background: none; color: #202020}

.dos{background: url(../img/banners/2.jpg); background-size: cover; position: relative;}
.dos h3{text-align: left;}
.dos p{text-align: left;}
.dos a{margin-left: 0}

	
	
.swiper-button-next{display: block; position: absolute; margin-top: 27vh; width: 35px; height: 35px;right: 100px}
.swiper-button-prev{display: block; position: absolute;  margin-top: 27vh; width: 35px; height: 35px;right: 140px}

	
/* == AMCO EMPRESA MEXICANA == */

section.amco-mex{ margin-bottom: 0px}
section.amco-mex div.cont{width: 76%; margin: 0 auto; }
section.amco-mex div.cont div.img{width: 40%; height: 400px; background-size: 400px; float: left}
section.amco-mex div.cont div.texto{width: 50%; float: right; padding-right: 0}
section.amco-mex div.cont div.texto h1{text-align: left; margin-top: 50px; font-size: 50px; line-height: 1em}
section.amco-mex div.cont div.texto p{text-align: justify;font-size: 16px; margin: 20px auto 30px}
section.amco-mex div.cont div.texto a{margin-left: 0; }
	
/* == CALIDAD CONFIANZA == */
section.calidad{padding: 120px}
section.calidad::after{display: none}
section.calidad div.cont{width: 80%; margin: 0 auto}

section.calidad h3{font-size: 46px}
section.calidad p{font-size: 20px; margin: 15px 0 0; }

/* == SERVICIOS == */
section.servicios{padding: 50px 0; }
section.servicios div.cont{width: 80%;}
section.servicios h4{font-size: 30px;}
section.servicios p{font-size: 16px; width: 80%; margin: 0 auto}
section.servicios .cajas{padding: 30px 0}

	.caja-s{ width: 30%; float: left; margin: 20px 1.65% }
	.clear-l{ float: left}
	.clear-r{ float: left}	
	
	
.terra h2::before, .demo h2::before, .exca h2::before, .leva h2::before, .pavi h2::before, .renta h2::before{height: 150px;}
.terra h2::before{background-size: 180px; }
.demo h2::before{background-size: 180px; }
.exca h2::before{background-size: 180px; }
.leva h2::before{background-size: 180px;  }
.pavi h2::before{background-size: 180px; }
.renta h2::before{background-size: 180px; }
	
/* == SERVICIOS == */
#proyectos{padding: 30px 0}
#proyectos div.cont{width: 90%; }
#proyectos h4{font-size: 30px; }
#proyectos p{font-size: 16px; }
#proyectos .cajas{padding: 30px 0 0}
#gal-fotos{display: none}

.filter-button-group a{margin: auto 15px; font-size: 16px}

	
/* == PROYECTOS == */
div.grid{width: 100%;height: 600px!important; }
div.grid img{width: 100%; float: left; opacity: 1}
div.grid .terracerias, div.grid .demolicion, div.grid .excavacion, div.grid .pavimentos, div.grid .levantamientos{ width: 33.3%; float: left; height: 300px}
}

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

.swiper-slide h3{font-size: 60px; width: 70%; margin-left: 0;}
.swiper-slide p{font-size: 30px; width: 65%; margin-left: 0}
.swiper-slide a{font-size: 18px}

	
section.amco-mex div.cont div.texto p{text-align: justify;font-size: 18px; margin: 20px auto 30px}
	
/* == CALIDAD CONFIANZA == */
section.calidad h3{font-size: 50px}
	
	
	
	
/* == SERVICIOS == */
section.servicios{padding: 50px 0 30px; }
section.servicios div.cont{width: 90%;}
section.servicios h4{font-size: 30px;}
section.servicios p{font-size: 18px; }
section.servicios .cajas{padding: 30px 0 50px}

	
/* == SERVICIOS == */
#proyectos{padding: 30px 0}
#proyectos div.cont{width: 90%; }
#proyectos h4{font-size: 30px; }
#proyectos p{font-size: 18px; }
#proyectos .cajas{padding: 30px 0 0}
#gal-fotos{display: none}

.filter-button-group a{margin: auto 15px; font-size: 18px}

	
	
/* == PROYECTOS == */
div.grid{width: 100%;height: 700px!important; }
div.grid img{width: 100%; float: left; opacity: 1}
div.grid img:hover{; opacity: .3}
div.grid .terracerias, div.grid .demolicion, div.grid .excavacion, div.grid .pavimentos, div.grid .levantamientos{ width: 33.3%; float: left; height: 350px}
}



/* ==========================================================================
   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}}