:root{
	--blanco: #fff;
	--negro: #000;
	--amarillo: #F2C531;
	--verde: #47AD4D;
	--gris: #706f6f;
	--manropeBold: 'Manrope-Bold';
	--manropeExtraBold: 'Manrope-ExtraBold';
	--manropeRegular: 'Manrope-Regular';
	--manropeMedium: 'Manrope-Medium';
	--manropeLight: 'Manrope-Light';
}
@font-face {
	font-family: 'Manrope-SemiBold';
	src: url(../fonts/Manrope-SemiBold.ttf);
}
@font-face {
	font-family: 'Manrope-Regular';
	src: url(../fonts/Manrope-Regular.ttf);
}
@font-face {
	font-family: 'Manrope-Medium';
	src: url(../fonts/Manrope-Medium.ttf);
}
@font-face {
	font-family: 'Manrope-Light';
	src: url(../fonts/Manrope-Light.ttf);
}
@font-face {
	font-family: 'Manrope-ExtraLight';
	src: url(../fonts/Manrope-ExtraLight.ttf);
}
@font-face {
	font-family: 'Manrope-ExtraBold';
	src: url(../fonts/Manrope-ExtraBold.ttf);
}
@font-face {
	font-family: 'Manrope-Bold';
	src: url(../fonts/Manrope-Bold.ttf);
}
body{
	font-family: var(--manropeRegular);
}
.menu-list li a{
	color: var(--gris);
	transition: .2s ease-in-out;
}
.menu-list .active > a, .menu-list li a:hover{
	color: var(--verde);
	font-family: var(--manropeBold);
}
.m-b0{
	margin-bottom: 0;
}
.navbar{
	padding-bottom: 2.7rem;
}
.navbar .brand{
	margin-top: -1.8rem;
}
.navbar-address{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	margin-bottom: 0;
	font-family: var(--manropeBold);
	color: var(--gris);
}
.navbar-spacer{
	background-color: #dadada;
}
.brand img{
	width: 200px;
	height: auto;
}
.menu-list{
	height: 100%;
}
.titleSlide{
	font-size: 45px!important;
	color: var(--blanco);
	font-weight: 500!important;
	white-space: pre-line!important;
	line-height: normal!important;
	letter-spacing: 0px!important;
	margin-top: 0!important;
	font-family: var(--manropeRegular);
}
.titleSlide span{
	font-weight: 600!important;
	font-size: 45px!important;
	font-family: var(--manropeExtraBold);
}
section.relative{
	/*position: relative;
	display: block;*/
}
.contentCallToAction1{
	margin-top: 40px;
}
#call-to-action1{
	background: url('../archivos/home/EcoDesignProject-Pleca01.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding: 70px 0;
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#call-to-action1 .contentBx{
	text-align: center;
}
#call-to-action1 .contentBx .title{
	font-size: 45px;
	white-space: pre-line;
	color: var(--blanco);
	font-weight: 500;
	margin: 0;
	font-family: var(--Manrope-Regular);
}
#call-to-action1 .contentBx .title span{
	font-weight: 600;
	font-family: var(--Manrope-Bold);
}
/*#eco-wood-floor .dots-image .dots{
	background: url(../archivos/home/dot1.png) 0 0 repeat;
}*/
#eco-wood-terrazas .dots-image .dots,
#eco-wood-siding .dots-image .dots,
#eco-glass .dots-image .dots{
	background: url(../archivos/home/dot1.png) 0 0 repeat;
}
#call-to-action2{
	background: url('../archivos/home/EcoDesignProject-Pleca02.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding: 70px 0;
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#call-to-action2 .contentBx{
	text-align: center;
}
#call-to-action2 .contentBx .title{
	font-size: 50px;
	white-space: pre-line;
	color: var(--blanco);
	font-weight: 500;
	margin: 0;
	font-family: var(--manropeRegular);
}
#call-to-action2 .contentBx .title span{
	font-weight: 600;
	font-family: var(--manropeBold);
}
#call-to-action2 .btn-transparent{
	display: table;
	margin: 20px auto 0;
	border-radius: 75px;
	background: transparent;
	border: 2px solid var(--amarillo);
	color: var(--blanco);
	padding: 15px 25px;
	font-size: 20px;
	line-height: normal;
	transition: .5s ease-in-out;
	font-family: var(--manropeBold);
}
#call-to-action2 .btn-transparent:hover{
	background: var(--amarillo);
	text-decoration: none;
}
#eco-wood-siding{
	padding: 50px 0 100px;
	background: var(--amarillo);
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#eco-wood-siding .flex-col{
	display: flex;
	align-items: center;
}
#eco-wood-siding .dots-image .dots{
	height: 95.2%;
	left: 15%;
}
#eco-wood-siding .section-subtitle{
	color: var(--blanco);
	font-family: var(--manropeBold);
}
#eco-wood-siding .section-title{
	font-size: 40px;
    font-weight: 600;
    line-height: normal;
    text-align: left;
	color: #FAE8AD;
	font-family: var(--manropeBold);
	white-space: pre-line;
}
#eco-wood-siding .content p{
	text-align: justify;
	color: var(--blanco);
	font-family: var(--manropeRegular);
}

#eco-wood-floor{
	padding: 50px 0 100px;
}
#eco-wood-floor .flex-col{
	display: flex;
	align-items: center;
}
#eco-wood-floor .dots-image .dots{
	height: 95.2%;
	left: -15%;
}
#eco-wood-floor .section-subtitle{
	color: var(--amarillo);
	font-family: var(--manropeBold);
}
#eco-wood-floor .section-title{
	font-size: 40px;
    font-weight: 600;
    line-height: normal;
    text-align: left;
    color: var(--verde);
    font-family: var(--manropeBold);
    white-space: pre-line;
}
#eco-wood-floor p{
	text-align: justify;
	color: var(--gris);
	font-family: var(--manropeRegular);
}


#eco-wood-terrazas{
	padding: 50px 0 100px;
	background: var(--amarillo);
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#eco-wood-terrazas .flex-col{
	display: flex;
	align-items: center;
}
#eco-wood-terrazas .dots-image .dots{
	height: 95.2%;
	left: 15%;
}
#eco-wood-terrazas .section-subtitle{
	color: var(--blanco);
	font-family: var(--manropeBold);
}
#eco-wood-terrazas .section-title{
	font-size: 40px;
    font-weight: 600;
    line-height: normal;
    text-align: left;
	color: #FAE8AD;
	font-family: var(--manropeBold);
}
#eco-wood-terrazas .content p{
	text-align: justify;
	color: var(--blanco);
	font-family: var(--manropeRegular);
}

#nosotros{
	margin: 50px 0;
}
#nosotros .project-detail-control{
	font-size: 18px;
	margin: 0;
	color: var(--amarillo);
	font-weight: 600;
	cursor: default;
	font-family: var(--manropeBold);
}
#nosotros .project-detail-title{
	font-size: 25px;
	color: var(--verde);
	font-weight: 600;
	font-family: var(--manropeBold);
	margin-bottom: 30px;
	margin-top: 30px;
}
#nosotros .project-detail-text{
	text-align: justify;
	font-size: 16px;
	font-family: var(--manropeRegular);
	color: var(--gris);
}

#projects{
	position: absolute;
	left: 0;
	background: var(--verde);
	height: auto;
	width: 100%;
	padding: 60px 0;
}
#projects .project-carousel{
	margin-top: 0;
}
#projects .owl-nav{
	width: 100%;
}
#projects .owl-nav .owl-prev{
	position: absolute;
	transform: translateY(-50%);
	left: 0;
	font-size: 70px;
	color: var(--blanco);
	transition: .5s ease-in-out;
}
#projects .owl-nav .owl-next{
	position: absolute;
	right: 0;
	transform: translateY(-50%);
	font-size: 70px;
	color: var(--blanco);
	transition: .5s ease-in-out;
}
#projects .owl-nav .owl-prev:hover, 
#projects .owl-nav .owl-next:hover{
	color: var(--amarillo);
}
#contact{
	padding: 50px 0;
}
#contact .btn-form{
	background: var(--amarillo);
	padding: 10px 35px;
	border: 1px solid var(--amarillo);
	display: table;
	transition: .5s ease-in-out;
	font-weight: 600;
	font-size: 18px;
	cursor: pointer;
	line-height: normal;
	letter-spacing: 1px;
	font-family: var(--manropeBold);
	color: var(--gris);
}
#contact .btn-form:hover{
	background: transparent;
}
#contact .title-hr{
	background: var(--verde);
}
#contact .info-title{
	width: 100%;
	white-space: pre-line;
	font-size: 15px;
	color: #9D9D9C;
	font-family: var(--manropeBold); 
}
#keep-in-touch{
	position: absolute;
	left: 0;
	background: var(--amarillo);
	height: auto;
	width: 100%;
	padding: 60px 0;
}
#keep-in-touch .title-hr{
	background: var(--blanco);
}
#keep-in-touch .info-title{
	width: 100%;
	white-space: pre-line;
	font-size: 15px;
	color: #FAE8AD;
	font-family: var(--manropeBold);
}
#keep-in-touch .contact-top,
#keep-in-touch .contact-top span,
#keep-in-touch .contact-address a,
#keep-in-touch .contact-row,
#keep-in-touch .phone-lg a,
#keep-in-touch .contact-social a,
#keep-in-touch .text-muted{
	color: var(--blanco);
}
#keep-in-touch .contact-top{
	font-family: var(--manropeBold);
}
#keep-in-touch .contact-top span{
	color: #FAE8AD;
	font-family: var(--manropeRegular);
}
#keep-in-touch .contact-address a{
	font-family: var(--manropeBold);
	color: #FAE8AD;
	white-space: pre-line;
}
.mailInfo strong{
	font-family: var(--manropeExtraBold);
}
.mailInfo{
	font-family: var(--manropeMedium);
	color: #FAE8AD;
}
.contact-phone{
	font-family: var(--manropeExtraBold);
}
#keep-in-touch .phone-lg a{
	color: #FAE8AD;
	font-family: var(--manropeMedium);
}
.flexSocialFooter{
	font-family: var(--manropeBold);
}
#keep-in-touch .flexSocialFooter{
	display: flex;
	align-items: center;
}
#keep-in-touch .flexSocialFooter strong{
	margin-right: 10px;
}
#keep-in-touch .flexSocialFooter .contact-social{
	margin-top: 0;
}
#keep-in-touch .contact-social a{
	color: #FAE8AD;
}
.map{
	margin-top: 40px;
}

#footer{
	position: absolute;
	left: 0;
	background: var(--verde);
	height: auto;
	width: 100%;
	padding: 15px 0;
}
#footer .flexFooter{
	display: flex;
	align-items: center;
}
#footer .footer-left img{
	width: 230px;
	height: auto;
}
#footer .footer-center{
	text-align: center;
}
#footer .footer-center p{
	margin-bottom: 0;
	color: #B5DEB8;
}
#footer .footer-center p span{
	margin: 0 10px;
}
#footer .footer-center a{
	color: #B5DEB8;
}
#footer .footer-center a:hover{
	text-decoration: none;
}
#footer .footer-right{
	text-align: right;
}
#footer .footer-right img{
	width: 150px;
	height: auto;
}
input[type='text'], input[type='address'], input[type='url'], input[type='password'], input[type='email'], input[type="search"], input[type="tel"], textarea{
	font-family: var(--manropeRegular);
	color: #9D9D9C;
}
/*.owl-carousel .owl-item{
	height: 270px;
	overflow: hidden;
}*/
.owl-carousel .owl-item img{
	width: 100%;
	min-height: 100%;
	position: relative;
}
#beneficios{
	padding: 70px 0;
}

#beneficios .info-title{
	width: 100%;
    white-space: pre-line;
    font-size: 15px;
    color: #9D9D9C;
    font-family: var(--manropeBold);
}
#beneficios .contentBxBeneficios h4{
    font-family: var(--manropeBold);
    color: var(--verde);
    margin-top: 0;
}
#beneficios .contentBxBeneficios p{
	text-align: justify;
    color: var(--gris);
    font-family: var(--manropeRegular);
}

#eco-glass{
	padding: 50px 0 100px;
	background: var(--amarillo);
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#eco-glass .flex-col{
	display: flex;
	align-items: center;
}
#eco-glass .dots-image .dots{
	height: 95.2%;
	left: 15%;
}
#eco-glass .section-subtitle{
	color: var(--blanco);
	font-family: var(--manropeBold);
}
#eco-glass .section-title{
	font-size: 40px;
    font-weight: 600;
    line-height: normal;
    text-align: left;
	color: #FAE8AD;
	font-family: var(--manropeBold);
	white-space: pre-line;
}
#eco-glass .content p{
	text-align: justify;
	color: var(--blanco);
	font-family: var(--manropeRegular);
}

#ocupamosDe{
	padding: 70px 0;
}
#ocupamosDe .info-title{
	width: 100%;
    white-space: pre-line;
    font-size: 15px;
    color: #9D9D9C;
    font-family: var(--manropeBold);
}
#ocupamosDe .contentBxBeneficios h4{
    font-family: var(--manropeBold);
    color: var(--verde);
    margin-top: 0;
    white-space: pre-line;
    margin-bottom: 0;
}
#ocupamosDe .contentBxBeneficios p{
	text-align: justify;
    color: var(--gris);
    font-family: var(--manropeRegular);
}

#call-to-action3{
	background: url('../archivos/home/EcoDesignProject-Pleca02.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding: 70px 0;
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
}
#call-to-action3 .contentBx{
	text-align: center;
}
#call-to-action3 .contentBx .title{
	font-size: 50px;
	white-space: pre-line;
	color: var(--blanco);
	font-weight: 500;
	margin: 0;
	font-family: var(--manropeRegular);
}
#call-to-action3 .contentBx .title span{
	font-weight: 600;
	font-family: var(--manropeBold);
}
#call-to-action3 .btn-transparent{
	display: table;
	margin: 20px auto 0;
	border-radius: 75px;
	background: transparent;
	border: 2px solid var(--amarillo);
	color: var(--blanco);
	padding: 15px 25px;
	font-size: 20px;
	line-height: normal;
	transition: .5s ease-in-out;
	font-family: var(--manropeBold);
}
#call-to-action3 .btn-transparent:hover{
	background: var(--amarillo);
	text-decoration: none;
}

#projects2{
	position: absolute;
	left: 0;
	background: var(--verde);
	height: auto;
	width: 100%;
	padding: 60px 0;
}
#projects2 .project-carousel{
	margin-top: 0;
}
#projects2 .owl-nav{
	width: 100%;
}
#projects2 .owl-nav .owl-prev{
	position: absolute;
	transform: translateY(-50%);
	left: 0;
	font-size: 70px;
	color: var(--blanco);
	transition: .5s ease-in-out;
}
#projects2 .owl-nav .owl-next{
	position: absolute;
	right: 0;
	transform: translateY(-50%);
	font-size: 70px;
	color: var(--blanco);
	transition: .5s ease-in-out;
}
#projects2 .owl-nav .owl-prev:hover, 
#projects2 .owl-nav .owl-next:hover{
	color: var(--amarillo);
}

#clientes{
	padding: 70px 0;
}
#clientes .info-title{
	width: 100%;
    white-space: pre-line;
    font-size: 15px;
    color: #9D9D9C;
    font-family: var(--manropeBold);
}
#clientes .contentBxBeneficios h4{
    font-family: var(--manropeBold);
    color: var(--verde);
    margin-top: 0;
    white-space: pre-line;
    margin-bottom: 0;
}
#clientes .contentBxBeneficios p{
	text-align: justify;
    color: var(--gris);
    font-family: var(--manropeRegular);
}
#clientes .project-carousel{
	margin-top: 0;
}
#clientes .owl-nav{
	width: 100%;
}
#clientes .owl-item img{
	max-height: 200px;
}
#clientes .owl-item{
	display: flex;
	align-items: center;
}
#clientes .owl-nav .owl-prev{
	position: absolute;
	transform: translateY(-50%);
	left: 0;
	font-size: 70px;
	color: var(--verde);
	transition: .5s ease-in-out;
}
#clientes .owl-nav .owl-next{
	position: absolute;
	right: 0;
	transform: translateY(-50%);
	font-size: 70px;
	color: var(--verde);
	transition: .5s ease-in-out;
}
#clientes .owl-nav .owl-prev:hover, 
#clientes .owl-nav .owl-next:hover{
	color: var(--amarillo);
}
/*Redes Desktop*/
.cont-info-float{position: fixed; top: 40%; right: 5px; z-index: 99999; width: 100%; }
.info-float{position: absolute; right: 0;}
.info-float img{width: 50px; display: block; margin: 10px 0; filter: drop-shadow(1px 3px 2px black); }
.cont-redes-phone{display: none;}
/*.info-float img.face-float{width: 44px; padding: 1px; filter: drop-shadow(2px 4px 2px black); margin-left: 1px;}*/

/*Animation*/
/*.info-float:hover img{animation: move linear 2s infinite;}

@keyframes move{
  0%{transform: translateX(-10px);}
  50%{transform: translateX(10px);}
  100%{transform: translateX(-10px);}
}*/
/**//**//**//**//**//**//**//**//**//**//**//**/
/*Responsive*/
/*Ipad Pro Vertical*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: portrait){
  	
}

/*Ipad Pro Horizontal*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px) 
  and (-webkit-min-device-pixel-ratio: 2) 
  and (orientation: landscape){
  	
}

/*Ipad Horizontal*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 
	
}

/*Ipad Vertical*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 
}

/*Phone Vertical*/
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 736px) 
  and (orientation: portrait){ 
  	.navbar .brand{margin-top: -2.2rem;}
  	.titleSlide{font-size: 28px!important;}
  	.titleSlide span{font-size: 28px!important;}
  	#call-to-action1 .contentBx .title, #call-to-action2 .contentBx .title, #call-to-action3 .contentBx .title{font-size: 28px; white-space: normal;}
  	#eco-wood-floor .flex-col{display: block;}
  	#eco-wood-floor .description{font-size: 17px;}
  	#eco-wood-floor .section-title{margin-bottom: 30px;}
  	#eco-wood-terrazas .content p{font-size: 17px;}
  	#eco-wood-terrazas .section-title{margin-bottom: 30px;}
  	#eco-wood-terrazas .flex-col{flex-direction: column-reverse;}
  	#eco-wood-terrazas .dots-image .dots{width: 92%; left: 0;}
  	#eco-wood-siding .content p{font-size: 17px;}
  	#eco-wood-siding .section-title{margin-bottom: 30px;}
  	#eco-wood-siding .flex-col{flex-direction: column-reverse;}
  	#eco-wood-siding .dots-image .dots{width: 92%; left: 0;}
  	.boxed .container, .boxed .container-fluid{padding-right: 15px; padding-left: 15px;}
  	#nosotros .project-detail-title{font-size: 20px;}
  	#nosotros .project-detail-text{line-height: 20px; margin-bottom: 10px;}
  	#contact .section-info, #keep-in-touch .section-info{margin-bottom: 30px;}
  	#contact .info-title, #keep-in-touch .info-title{font-size: 20px; line-height: 24px;}
  	#footer{padding: 15px 0 70px;}
  	#footer .flexFooter{display: block;}
  	#footer .flexFooter .footer-left{text-align: center; }
  	#footer .flexFooter .footer-center{text-align: center; margin: 25px 0;}
  	#footer .flexFooter .footer-right{text-align: center; }
  	#footer .footer-center p{font-size: 16px;}
  	#beneficios .contentBxBeneficios h4{margin-bottom: 15px; font-size: 22px;}
  	#beneficios .contentBxBeneficios p{font-size: 17px;}
  	#keep-in-touch .mailInfo{margin-bottom: 40px;}
  	.mailInfo, .phoneInfo, .titleSocials{font-size: 18px;}
  	#eco-glass .content p{font-size: 17px;}
  	#eco-glass .section-title{margin-bottom: 30px;}
  	#eco-glass .flex-col{flex-direction: column-reverse;}
  	#eco-glass .dots-image .dots{width: 92%; left: 0;}
  	#ocupamosDe .contentBxBeneficios h4{margin-bottom: 15px; font-size: 22px;}
  	#ocupamosDe .contentBxBeneficios p{font-size: 17px;}
  	#clientes .owl-item{display: flex; align-items: center; justify-content: center;}
  	#clientes .owl-item img {max-height: 90px; height: 100%; object-fit: contain;}


  	/*Redes Phone*/
    .cont-info-float{display: none;}
    .cont-redes-phone{display: block; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9999;}
    .cont-redes-phone .cont-style{border-top: 1px solid var(--negro); display: flex; align-items: center;}
    .whats-phone{font-size: 25px; background: var(--blanco); width: 100%; padding: 0px 0; border-right: 1px solid var(--negro);}
    .whats-phone i{color: var(--negro)!important;}
}