/*
Theme Name: ARMEX CONSTRUCCION
Theme URI: https://armexconstruccion.com
Author: Carlos Sanchez by interweb gdl
Author URI: https://interwbgdl.com.mx/
Description: ARMEX CONSTRUCCION
Version: 1.0
Text Domain: iw
*/

* {
	border:0;
    margin:0;
	padding:0;

	}

	/* Pasar los elementos a block*/

header, nav, section, aside, article, figure, figcaption, hgroup, footer, { display:block}

/************************************************************** M E N U ******************************/


/*BOTON DE WHATSAPP*/
.boton-whatsapp {
    position: fixed;
    left: 25px;
    bottom: 25px;
    background-color: #2ecc71;
    color: #FFFFFF;
    padding: 17px 17px;
    border-radius: 100px;
    z-index: 9999999;
    text-decoration: none;
    vertical-align:  middle;
   
}
.boton-whatsapp:hover{
  position: fixed;
    left: 25px;
    bottom: 25px;
    background-color: #313140;
    color: #FFFFFF;
    padding: 17px 17px;
    border-radius: 100px;
    z-index: 9999999;
    text-decoration: none;
    vertical-align:  middle;
    
}

.boton-whatsapp i{
	font-size: 2em;
}

.tell p{
	font-family: 'muli', sans-serif;
	font-weight: normal;
    font-style: normal;
    font-size: 0.9em;
}

.tx-tell p{
	font-family: 'muli', sans-serif;
	font-weight: normal;
    font-style: normal;
}

/*####################################
## GLOBALES  ##
#####################################*/

h1,h2,h3,h4,h5{
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}
b{
	color: #FFC527;
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}
a{
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}
p{
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}
span{
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}	

/*####################################
## HEADER  ##
#####################################*/
header{

}
.logo{
	text-align: center;
	padding-top: 0.5em;
}
.logo img{
	max-width: 100%;
}
.contacto-header{	
	border-top: 3px solid#FFC527;
}
.tel-contacto{
	padding: 1.5em 0;
}
.tel-contacto span{
	color: #777777;
}



.tel-contacto p{
	color: #333333;
	font-weight: bold;
	font-size: 1em;
	margin-bottom: 0;
	padding-bottom: 0;
}
.tel-contacto a{
	color: #444;
	font-size: 1em;
	font-weight: normal;
}
.tel-contacto span{
	font-size: 0.9em;
}

.tel-contacto .ic, .tel-contacto .tx{
	display: inline-block;
}

.tel-contacto i{
	padding: 0.8em 0.9em;
	background: #FFC527;
	text-align: center;
	font-size: 1em;
	color: #fff;
}

.tarjetas{
	padding-top: 0.3em;
	text-align: center;
}
.tarjetas img{
	max-width: 100%;
	width: 90%;
}


.menu{
	background: #222222;
	padding: 0;
	margin: 0;
}
.navbar-static-top{
	padding-bottom: 0;
	margin-bottom: 0;
	text-align: center;
}
.navbar-nav{
	text-align: center;
	width: 100%;
	
}

.nav li{
	margin-left: 2em;
	text-align: center;
}
.navbar a:hover{
	#FFC527;
}
/*####################################
## SLIDER  ##
#####################################*/
.slider{

}

/*####################################
## SERVICIOS INICIO  ##
#####################################*/

.servicios-inicio{
	padding: 2.5em 0;
	padding-bottom: 2.5em;
}

.servicios-inicio span{
	display: block;
	text-align: center;
	font-size: 1.3em;
	color: #FFC527;
	font-weight: normal;
}
.servicios-inicio h2{
	color: #333333;
	text-align: center;
	font-weight: bold;
	padding-top: 0;
	margin-top: 0;
}
.servicios-inicio h2::after {
    content: " ";
    display: block;
    width: 20%;
    height: 1px;
    border-bottom: 5px solid#FFC527;
    margin: 0.5em auto;
}
.servicios-inicio p{
	text-align: center;
}

.item-servicios{
	padding: 2em;
}
.item-servicios img{
	text-align: center;
}
.img-item{
	text-align: center;
}
.item-servicios h3{
	padding-left: 1em;
	padding-right: 1em;
	padding-top: 0.5em;
	color: #333;
	font-weight: bold;
	text-align: center;
}
.item-servicios p{
	color: #777777;
	font-weight: normal;
}
.item-servicios a{
	color: #FFC526;
}


/*####################################
## PROMOCION Y CONTACTO INICIO  ##
#####################################*/

.promo-txt h2{
	color: #f5f5f5;
	font-family: 'raleway', sans-serif;
	font-weight: 600;
    font-style: normal;
    font-size: 3.5em;
    text-align: center;
}
.promo-txt span{
	color: #f5f5f5;
	font-size: 2.2em;
	font-family: 'raleway', sans-serif;
	font-weight: 800;
    font-style: normal;
    display: block;
    text-align: center;
}
.promo-txt img{
	max-width: 100%;
}
.promo-txt h4{
	text-align: center;
}

.meses{
	margin-top: 3em;
	padding-top: 2em;
}
.meses img{
	max-width: 100%;
	width: 100%;
}

/*####################################
## EMPRESA INICIO  ##
#####################################*/

.empresa-inicio{
	padding: 3em;
	background: #F5F5F5;
	margin: 1em auto;
}

.empresa-inicio h2{
	margin-top: 0;
	padding-top: 0;
	margin-bottom: 1em;
}
.empresa-inicio h2::after {
    content: " ";
    display: block;
    width: 25%;
    height: 1px;
    border-bottom: 5px solid#FFC527;
    margin-top: 0.5em;
}
.empresa-inicio p{
	font-size: 1.2em;
	color: #777777;
	line-height: 25px;
	text-align: justify;
	margin-top: 1em;
}
.link{
	margin-top: 2em;
}
.empresa-inicio a{
	color: #FFC526;
	font-size: 1.3em;
	margin-top: 2em;
}

.empresa-inicio img{
	max-width: 100%;
}


/*####################################
## PROYECTOS INICIO  ##
#####################################*/

.proyectos-inicio{
	padding: 2em 0;
	background: #0F0F1E;
}
.proyectos-inicio h2{
	text-align: center;
	color: #fff;
}
.proyectos-inicio h2::after {
    content: " ";
    display: block;
    width: 25%;
    height: 1px;
    border-bottom: 5px solid#FFC527;
    margin: 0.5em auto;
}

/*####################################
## CAROUSELL ##
#####################################*/
.carousell{
	margin-bottom: 2em;
}

.ver-proyectos{
	padding-top: 2em;
	text-align: center;
}
.ver-proyectos a{
	padding: 0.7em;
	border: 1px solid#FFC527;
	color: #FFC527;
	text-decoration: none;
}
.ver-proyectos a:hover{
	background: #FFC527;
	color: #fff;
}

/*####################################
## FOOTER  ##
#####################################*/

footer{
	background-color: rgba(15,15,30,0.9);
	background: url(images/img-footer1.jpg) repeat;
}
.footer{
	padding: 2em 0;
}
.footer h4{
	color: #fff;
	font-weight: bold;
}
.footer p{
	margin-top: 1em;
	color: #fff;
}

.footer ul{
	margin-top: 2em;
	outline: none;
	list-style: none;
}
.empresa-footer img{
	max-width: 100%;
}
.empresa-footer span{
	color: #fff;
	font-weight: lighter;
	font-size: 1.6em;
}
.empresa-footer a{
	color: #FFC527;
}
.empresa-footer p{
	text-align: justify;
}
.empresa-footer li{
	display: inline-block;
}
.empresa-footer i{
	font-size: 2em;
	margin-left: 1em;
}
.empresa-footer i:hover{
	color: #fff;
}

.footer .sitemap-footer ul li{
	margin-bottom: 1em;
}
.footer .sitemap-footer ul li a{
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
    color: #fff;
    font-size: 0.9em;
}

/*DIRECCION FOOTER*/
.direccion-footer h4{
	text-align: center;
}
.direccion-footer p{
	text-align: center;
	color: #fff;
}
.direccion-footer sub{
	padding-top: -15px;
}
.direccion-footer li{
	margin-bottom: 2em;
}
.direccion-footer a{
	color: #fff;
}
.ic, .tx, .txm{
	display: inline-block;
	vertical-align: top;
	width: 15%;
}
.tx{
	width: 80%;
}
.tx p{
	padding: 0;
	margin: 0;
	padding-left: 0.5em;
}
.txm{
	padding-top: 0.5em;
	
	padding-left: 0.5em;	
}
.direccion-footer i{
	padding: 0.8em 0.9em;
	background: #FFC527;
	text-align: center;
	font-size: 1em;
	color: #fff;
}
.direccion-footer i:hover{
	background: #fff;
	color: #FFC527;
}

.derechos p{
	color: #fff;
}
.derechos a{
	color: #FFC527;
}

/*####################################
## BANNERS PAGES  ##
#####################################*/

.migas{
	background: none;
}

.banner-pages h1{
	color: #fff;
}

.breadcrumb{
	background: none;
}
.breadcrumb a{
	color: #f9f9f9;
}
.breadcrumb li.active{
	color: #FFBB02;
} 


/*####################################
##  EMPRESA  ##
#####################################*/

.title-empresa{
	padding-top: 2em;
	padding-bottom: 2em;
	text-align: center;
}

.title-empresa span::after {
    content: " ";
    display: block;
    width: 25%;
    height: 1px;
    border-bottom: 3px solid#FFC527;
    margin: 1em auto;
}


.empresa-contenido{
	background: #f5f5f5;
	padding-top: 3em;
	padding-bottom: 3em;
	
}

.img-empresa img{
	max-width: 100%;
}
.txt-empresa{
	line-height: 25px;
}



/*####################################
##  SERVICIOS  ##
#####################################*/


.servicios{
	padding-top: 3em;
	padding-bottom: 3em;
}

.menu-servicios{
	border: 1px solid#eeeeee;
}
.menu-servicios h3{
	color: #444;

}
.menu-servicios h3::after {
    content: " ";
    display: block;
    width: 25%;
    height: 1px;
    border-bottom: 5px solid#FFC527;
    margin-top: 0.5em;
}

.menu-servicios li{
	 display: block;
    padding: 15px 15px !important;
    margin: 0;
    cursor: pointer;
    float: none;
    font-size: 1.1em;
    font-family: 'raleway', sans-serif;
    font-weight: normal;
    font-style: bold;

    padding-left: 0;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.menu-servicios li:hover{
	background: #fff;/*color de tabs activada*/
    color: #efbb20;
    border-top:1px solid#eeeeee; 
    border-bottom:1px solid#eeeeee; 
    margin-left: 1em;
}

.menu-servicios  ul.active > li {
	background: #fff;/*color de tabs activada*/
    color: #efbb20;
    border-top:1px solid#eeeeee; 
    border-bottom:1px solid#eeeeee; 
    margin-left: 1em;
}

/*CONTACTO LATERAL*/

.contacto-lateral {
   border: 1px solid#eeeeee;
   margin-top: 2em;
}
.contacto-lateral h3{
	color: #444;
}
.contacto-lateral h3::after {
    content: " ";
    display: block;
    width: 25%;
    height: 1px;
    border-bottom: 5px solid#FFC527;
    margin-top: 0.5em;
}
.contacto-lateral ul{
	outline: none;
	list-style: none;
}
.contacto-lateral li{
	margin-bottom: 1em;
	color: #555;
}
.contacto-lateral i{
	color: #FFC527;
	margin-right: 0.5em;
	font-size: 1.2em;
}

.contacto-lateral ul{
    border-bottom: 1px solid#eeeeee;
}

.contacto-lateral p{
	color: #333;
	font-family: 'raleway', sans-serif;
	font-weight: bold;
    
}

/*FACEBOOK*/

.face{
	margin-top: 2em;
}



.contenido-servicios{
	padding-top: 0;
	border: 1px solid#eeeeee;
}
.contenido-servicios ul{
	outline: none;
	list-style: none;
}
.contenido-servicios li{
	margin-bottom: 1em;
}
.contenido-servicios h2{
	padding-left: 1em;
	color: #FFC527;
}

.txt{
	padding-top: 2em;
	padding-bottom: 2em;
}
.txt span{
	color: #666;
	font-size: 1.4em;
	display: block;
	margin-bottom: 1em;
}
.txt i{
	margin-right: 0.5em;
	color: #FFC527;
}


/*LEER POSTS*/

.ir-contacto{
	font-family: 'raleway', sans-serif;
    font-weight: normal;
    font-style: normal;
	padding: 10px;
	text-align: center;
	font-weight: bolder;
	width: auto;
	display: inline-block;
	vertical-align: middle; 
	color: #FFC527;
	text-decoration: none;
	
}
.ir-contacto a{
	color: #FFC527;
	text-decoration: none;
	font-size: 1em;
	font-family: 'raleway', sans-serif;
    font-weight: normal;
    font-style: normal;
}

.ir-contacto{
	position: relative;
}

.ir-contacto:before{
	content: '';
	position: absolute;
	border: 1px solid#FFC527;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	-webkit-transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
}

.ir-contacto:hover:before{
	top: -5px;
	bottom: -5px;
	left: -5px;
	right: -5px;
	text-decoration: none;
	border: 1px solid#FFC527;
	color: #FFC527;
}
.ir-contacto:hover{
	text-decoration: none;
	color: #fff;
	background: #FFC527;
}


/*####################################
##  PROYECTOS RECIENTES  ##
#####################################*/


.proyectos{
	background: #f5f5f5;
	padding-top: 3em;
	padding-bottom: 3em;
}
.proyectos ul{
	outline: none;
	list-style: none;
	text-align: center;
}
.proyectos li{
	display: inline-block;
	margin: 1em;
}


/*carousel clientes*/

.clientes{
	padding-bottom: 3em;
}

/*####################################
##  CONTACTO  ##
#####################################*/

.contacto{
	padding-top: 2em;
	padding-bottom: 2em;
}


.separador{
	border-bottom: 1px solid#eeeeee;
	padding-bottom: 2em;
}
.icons-contacto{
	text-align: center;
}

.icons-contacto i{
	font-size: 2.7em;
	color: #FFC527;
	margin-bottom: 1em;
}
.icons-contacto p, a{
	color: #777;
	margin: 0;
	padding: 0;
}
.icons-contacto span{
	color: #333;
	font-family: 'raleway', sans-serif;
	font-weight: bold;
}


.formacontacto ul{
	outline: none;
	list-style: none;
}
.formacontacto li{
	outline: none;
	list-style: none;
}
.txt-contacto{
	max-width: 100%;
	width: 100%;
	border: 1px solid#eeeeee;
	padding: 0.6em;
	border-radius: 3px;
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
    margin-bottom: 1em;
}




.text-area{
	max-width: 100%;
	width: 100%;
	border: 1px solid#eeeeee;
	padding: 0.5em;
	border-radius: 3px;
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
}

.boton{
	padding-top: 1em;
	padding-bottom: 1em;
	text-align: center;
}
.contacto-enviar{
	
	max-width: 100%;
	width: auto;
	border:1px solid#337ab7;
	padding: 0.7em;
	background: #fff;
	border-radius: 3px;
	font-family: 'raleway', sans-serif;
	font-weight: normal;
    font-style: normal;
    font-size: 1.2em;
    border: 1px solid#FFBB02; 
    color: #FFBB02;

}
.contacto-enviar:hover{
	background: #FFBB02;
	color: #fff;
}

/*#####################################
###  RESPONSIVE 
#####################################*/
/*360*/

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

.logo{
	margin-top: 5em;
}
.logo img{
	max-width: 100%;
	width: 55%;
}
.tarjetas {
	display: none;
}
.menu{
	position: fixed;
    top: 0;
    width: 100%;
}


.promo-txt{
	padding-bottom: 0; margin-bottom: 0;
}
.promo-txt h2{font-size: 2em;}
.promo-txt span{ font-size: 1.5em;}

.meses{text-align: center; padding-bottom: 2em; padding-top: 0;margin-top: 0;}
.meses img{max-width: 100%;width: 50%;}

.full_width_carousel_caption h1 { font-size: 1.8em;}

.tarjetas img{width: 70%;}

.empresa-inicio h2{text-align: center;}
.empresa-inicio h2::after {
    margin: 0.5em auto;
}

}

/*300px*/

@media only screen and (min-width: 300px) and (max-width: 359px){

	.logo{
		margin-top: 5em;
	}
	.logo img{
		max-width: 100%;
		width: 55%;
	}
	.tarjetas {
		display: none;
	}
	.menu{
		position: fixed;
		top: 0;
		width: 100%;
	}
.promo-txt{
	padding-bottom: 0; margin-bottom: 0;
}
.promo-txt h2{font-size: 2em;}
.promo-txt span{ font-size: 1.5em;}

.meses{text-align: center; padding-bottom: 2em; padding-top: 0;margin-top: 0;}
.meses img{max-width: 100%;width: 50%;}

.full_width_carousel_caption h1 { font-size: 1.8em;}

.tarjetas img{width: 70%;}

.empresa-inicio h2{text-align: center;}


}

/*200px*/

@media only screen and (min-width: 200px) and (max-width: 299px){

	.logo{
		margin-top: 5em;
	}
	.logo img{
		max-width: 100%;
		width: 55%;
	}
	.tarjetas {
		display: none;
	}
	.menu{
		position: fixed;
		top: 0;
		width: 100%;
	}
.promo-txt{
	padding-bottom: 0; margin-bottom: 0;
}
.promo-txt h2{font-size: 2em;}
.promo-txt span{ font-size: 1.5em;}

.meses{text-align: center; padding-bottom: 2em; padding-top: 0;margin-top: 0;}
.meses img{max-width: 100%;width: 50%;}

.full_width_carousel_caption h1 { font-size: 1.8em;}

.tarjetas img{width: 70%;}

.empresa-inicio h2{text-align: center;}


}





