/*---------------------------------------------------------------- 
NORMALIZE ////////////////////////////////////////////////////////
----------------------------------------------------------------*/
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px
solid #c0c0c0;margin:0
2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,
html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0;}

/*---------------------------------------------------------------- 
GENERAL /////////////////////////////////////////////////////////
----------------------------------------------------------------*/
html, body {
	display:flex;
	flex-direction:row; 
	flex-wrap: wrap;
	justify-content:center;
	align-items:flex-start;
	height: auto;
	min-height:100vh;
	line-height:1.3em;
	overflow-x:hidden;
	position: relative;
	width:100%;
	}



html, body  {
	font-family: 'Lato', sans-serif;
	font-weight:400;
	font-size:18px;
	}
	@media only screen and (max-width:1500px) {
	html, body {
	font-size:16px;
	}}


/* Fuente secundaria  ----------------------------*/
nav ul li *,
h1{
	font-family: 'Oswald', sans-serif;
	}


div.contenedor {
	padding:40px 0px;
	}


section {
	height: auto;
	}
	

article {
	height: auto;
	width:100%;
	}
	
aside{
	height: auto;
	}
	

img{
	display:block;
	height:auto;
	padding:0px;
	margin: 0px;
	max-width:100%;
	padding: 0px;
	}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Cairo', sans-serif;
	font-weight: 800;
	height:auto;
	margin:0px;
	padding:5px 0px;
	line-height:1.2em;
	text-transform: uppercase;
	width:100%;
	}


h1 {font-size:2em;}
h2 {font-size:1.8em;}
h3 {font-size:1.6em;}
h4 {font-size:1.4em;}
h5 {font-size:1.2em;}
h6 {font-size:1em;}


a, a:visited{
	margin:0px;
	padding: 0px;
	text-decoration:underline;
	}

a:hover {	
	text-decoration:underline;
	}

p {
	color: inherit;
	height:auto;
	line-height:1.2em;
	margin: 0px;
	padding:20px 0px;
	text-align:left;
	width:100%;
	}

p strong,
p b{
	font-weight:bold;
	}


ul, ol {
	float: none;
	height: auto;
	margin:15px 0px;
	padding-left:18px;
	width:100%;
	}

ul li, 
ol li{
	float: none;
	height: auto;
	line-height:1.4em;
	margin: 0px;
	padding: 0px;
	width:100%;
	}

ul li {
	list-style:disc;
	}

ol li {
	list-style:decimal;
	}

hr {
	border:0px;
	padding:0px;
	margin:20px 0px;
	height:1px;
	width: 100%;
	}


* {
	box-sizing:border-box!important;
	float: none;
	}


body#index h1,
body#index section.nuestros-servicios h2{
	/*overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: break-all;
	word-break: break-word;
	hyphens:auto!important;*/
	}


nav ul li a,
nav ul li span,
input.movil-button[type=checkbox] + label .svg-icon{
 	transition:all 0.12s;
 	}


/*---------------------------------------------------------------- 
ESTRUCTURA ///////////////////////////////////////////////////////
----------------------------------------------------------------*/
div.contenedor,
div.container,
header,
section,
footer{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:center;
	align-items:flex-start;
	height:auto;
	max-width:100%;
	overflow-x:hidden;
	width:100%;
	}



div.in{
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:flex-start;
	height:auto;
	min-height:auto;
	max-height:auto;
	max-width:1800px;
	min-width:55%;
	position:relative;
	}

div.in{
	width:75%;
	}
	@media only screen and (max-width:1500px) {
	div.in{
	max-width:94%;
	width:1000px;
	}}
	@media only screen and (max-width:1020px) {
	div.in{
	width:800px;
	}}
	@media only screen and (max-width:820px) {
	div.in{
	width:700px;
	}}
	@media only screen and (max-width:720px) {
	div.in{
	width:600px;
	}}
	@media only screen and (max-width:620px) {
	div.in{
	width:92%;
	}}



div.in.thin{
	width:60%;
	}
	@media only screen and (max-width:1500px) {
	div.in.thin{
	width:800px;
	}}
	@media only screen and (max-width:820px) {
	div.in.thin{
	width:700px;
	}}
	@media only screen and (max-width:720px) {
	div.in.thin{
	width:600px;
	}}
	@media only screen and (max-width:620px) {
	div.in.thin{
	width:92%;
	}}

div.in.full{
	width:94%;
	}
	@media only screen and (max-width:620px) {
	div.in.full{
	width:92%;
	}}


div.in.plus{
	max-width:100%;
	width:calc(100% - 1px)!important;
	}
/*---------------------------------------------------------------- 
GENERAL  /////////////////////////////////////////////////////////
----------------------------------------------------------------*/

.title{
	font-family: 'Cairo', sans-serif;
	font-size:1.6em;
	font-weight: 800;
	margin:20px 0px 40px 0px;
	text-align:center;
	text-transform: uppercase;
	width:100%;
	}



/*---------------------------------------------------------------- 
INDEX  ///////////////////////////////////////////////////////////
----------------------------------------------------------------*/
/* --------------------------------------------- BANNER SIMPLE SWIPER */
body#index .swiper-container.simple{
	min-height:200px;
	padding:0px 0px;
	}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple{
	padding:0px 0px;
	width: 100%;
	}}


body#index .swiper-container.simple div.in{
	align-items:center;
	flex-direction:row;
	justify-content:flex-start;
	padding:0px 0px;
	}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple div.in{
	align-items:flex-end;
	padding-bottom:45px;
	}}


body#index .swiper-container.simple div.in div.welcome{
	display: flex;
	flex-direction:column;
	justify-content:flex-start;
	width:320px;
	}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple div.in div.welcome{
	align-items:center;
	justify-content: center;
	width: 100%;
	}}

body#index .swiper-container.simple div.welcome h1{
	display:block;
	color:#fff;
	font-weight:800;
	font-size:1.8em;
	line-height:1.2em;
	text-align:left;
	text-transform:uppercase;
	width:320px;
	}
	@media only screen and (max-width:1020px) {
	body#index .swiper-container.simple div.welcome h1{
	margin-top: -20px;
	font-size:1.6em;
	width:290px;
	}}
	@media only screen and (max-width:920px) {
	body#index .swiper-container.simple div.welcome h1{
	font-size:1.5em;
	width:260px;
	}}
	@media only screen and (max-width:720px) {
	body#index .swiper-container.simple div.welcome h1{
	font-size:1.2em;
	width:220px;
	}}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple div.welcome h1{
	margin-top: 0px;
	font-size:1.6em;
	margin-bottom:20px;
	width:320px;
	}}
	@media only screen and (max-width:520px) {
	body#index .swiper-container.simple div.welcome h1{
	margin-bottom:20px;
	}}
	@media only screen and (max-width:420px) {
	body#index .swiper-container.simple div.welcome h1{
	font-size:1.4em;
	}}


body#index .swiper-container.simple div.welcome h1 b{
	height:1px;
	display:block;
	margin:10px 0px;
	width:100%;
	}
	@media only screen and (max-width:920px) {
	body#index .swiper-container.simple div.welcome h1 b{
	margin:5px 0px;
	}}


body#index .swiper-container.simple div.welcome a{
	background-color:#55b88b;
	color:#ffffff;
	border-radius:5px;
	align-items:center;
	border:0px;
	cursor: pointer;
	display:inline-flex;
	flex-direction:row;
	font-size:1.1em;
	font-family: 'Oswald', sans-serif;
	height:42px;
	line-height:1.2em;
	letter-spacing:1px;
	gap:4px;
	justify-content:center;
	margin-top:40px;
	width:180px;
	outline:0;
	padding:0px 16px;
	position:relative;
	text-decoration:none;
	text-transform:uppercase;
	transition:all 0.12s;
	}
	@media only screen and (max-width:1020px) {
	body#index .swiper-container.simple div.welcome a{
	height:36px;
	margin-top:20px;
	line-height: 1.1em;
	font-size: 1em;
	width:150px;
	}}
	@media only screen and (max-width:720px) {
	body#index .swiper-container.simple div.welcome a{
	height:30px;
	margin-top:15px;
	line-height: 1em;
	font-size: 0.9em;
	width:130px;
	}}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple div.welcome a{
	height:42px;
	margin-top:5px;
	line-height: 1.2em;
	font-size: 1.1em;
	width:180px;
	}}

body#index .swiper-container.simple div.welcome a .svg-icon{
	fill:#ffffff;
	height:38px;
	width:38px;
	margin-left:-8px;
	}
	@media only screen and (max-width:1020px) {
	body#index .swiper-container.simple div.welcome a .svg-icon{
	height:32px;
	width:32px;
	}}
	@media only screen and (max-width:620px) {
	body#index .swiper-container.simple div.welcome a .svg-icon{
	height:38px;
	width:38px;
	}}



body#index .swiper-container.simple div.in a:hover{
	background-color:#58cd98;
	}



/* --------------------------------------------- NUESTROS SERVICIOS */
body#index section.nuestros-servicios{
	padding:80px 0px 120px 0px;
	}

section.nuestros-servicios .item{
	align-items:flex-end;
	height:420px;
	overflow:hidden;
	position:relative;
	margin:8px;
	width:320px;
	}


section.nuestros-servicios .item:nth-child(2),
section.nuestros-servicios .item:nth-child(4),
section.nuestros-servicios .item:nth-child(6),
section.nuestros-servicios .item:nth-child(8){
	margin-top:40px;
	}


section.nuestros-servicios .item img{
	height:100%;
	transition:all 0.2s;
	transform: scale(1);
	width:100%;
	object-fit:cover!important;
	opacity:0.7;
	position:absolute;
	}


section.nuestros-servicios .item:hover img{
	transform: scale(1.06);
	opacity:1.0;
	}

section.nuestros-servicios .item h2{
	display:block;
	height:80px;
	font-size:1em;
	line-height:1.4em;
	font-family: 'Cairo', sans-serif;
	font-weight:400px!important;
	padding:20px;
	position:relative;
	text-align:right;
	text-transform:uppercase;
	transition:all 0.12s;
	width:100%;
	}


section.nuestros-servicios .item h2:after{
	position:absolute;
	left:0px;
	right:0px;
	top:-18px;
	bottom:auto;
	content:"";

	width: 0;
	height: 0;
	border-bottom: 20px solid #fff;
	border-left: 360px solid transparent;
	transition:all 0.12s;
    }
  

section.nuestros-servicios .item:hover h2:after{
	border-bottom: 20px solid #0085ca;
    }
  

@media only screen and (max-width:1500px) {
	section.nuestros-servicios .item{
	height:360px;
	width:260px;
	}
	section.nuestros-servicios .item h2:after{
	border-left: 260px solid transparent;
	}}

@media only screen and (max-width:1200px) {
	section.nuestros-servicios .item{
	width:220px;
	}
	section.nuestros-servicios .item h2:after{
	border-left: 220px solid transparent;
	}}
@media only screen and (max-width:1020px) {
	section.nuestros-servicios .item{
	width:190px;
	}
	section.nuestros-servicios .item h2:after{
	border-left: 190px solid transparent;
	}}
@media only screen and (max-width:920px) {
	section.nuestros-servicios .item{
	width:240px;
	}
	section.nuestros-servicios .item h2:after{
	border-left: 240px solid transparent;
	}
	section.nuestros-servicios .item:nth-child(2),
	section.nuestros-servicios .item:nth-child(4){
	margin-top:10px;
	}}
@media only screen and (max-width:820px) {
	section.nuestros-servicios .item{
	width:260px;
	}
	section.nuestros-servicios .item h2:after{
	border-left: 260px solid transparent;
	}}

@media only screen and (max-width:620px) {
	section.nuestros-servicios div.in{
	justify-content:space-between!important;
	}
	section.nuestros-servicios .item{
	margin:4px 8px!important;
	width:48%;
	}
	section.nuestros-servicios .item h2:after{
	border-left:320px solid transparent;
	}
	section.nuestros-servicios .item {
	margin:4px 4px 4px 4px!important;
	}}


@media only screen and (max-width:520px) {
	section.nuestros-servicios .item h2:after{
	border-left:280px solid transparent;
	}
	section.nuestros-servicios .item{
	height:260px;
	margin:4px 2px!important;
	}}

@media only screen and (max-width:420px) {
	section.nuestros-servicios .item{
	width:100%;
	}
	section.nuestros-servicios .item h2:after{
	border-left:380px solid transparent;
	}
	section.nuestros-servicios .item{
	height:280px;
	}}

/* --------------------------------------------- SOMOS */

body#index section.banner-fusionado.somos,
body#clients section.banner-fusionado.clientes {
	height:280px;
	}

body#index section.banner-fusionado.somos p,
body#clients section.banner-fusionado.clientes p{
	font-size:1.8em;
	padding:0px;
	width:60%;
	}
	@media only screen and (max-width:1500px) {
	body#index section.banner-fusionado.somos p,
	body#clients section.banner-fusionado.clientes p{
	font-size:1.6em;
	}}
	@media only screen and (max-width:620px) {
	body#index section.banner-fusionado.somos p,
	body#clients section.banner-fusionado.clientes p{
	font-size:1.4em;
	text-align:center;
	width:100%;
	}}

body#index section.banner-fusionado.somos p b{
	font-family: 'Cairo', sans-serif;
	font-size:1.3em;
	}


body#index section.banner-fusionado.somos hr,
body#clients section.banner-fusionado.clientes hr{
	height:5px;
	width:40%;
	}
	@media only screen and (max-width:620px) {
	body#index section.banner-fusionado.somos hr,
	body#clients section.banner-fusionado.clientes hr{
	margin-left:20%;
	width:60%;
	}}

/* --------------------------------------------- PROYECTOS  */
body#index section.panel-proyectos{
	padding:80px 0px;
	}


body#index ul.panel-wall li a img{
	opacity:0.7;
	transition:all 0.2s;
	transform: scale(1);
	}

body#index ul.panel-wall li a:hover img{
	transform: scale(1.06);
	opacity:1.0;
	}


body#index ul.panel-wall li:nth-child(5) a{
	align-items:center;
	display:flex;
	flex-wrap:wrap;
	flex-direction:column;
	justify-content:center;
	padding:40px;
	text-align:center;
	}


body#index ul.panel-wall li:nth-child(5) a p{
	font-size:1.2em;
	padding:0px;
	text-align:center;
	}

body#index ul.panel-wall li:nth-child(5) a span{
	display:block;
	border:1px solid #fff;
	color:#fff;
	height:32px;
	font-size:0.8em;
	line-height:32px;
	padding:0px 10px;
	text-transform:uppercase;
	margin-top:20px;
	}

body#index ul.panel-wall li:nth-child(5) a:hover span{
	color:#0085ca;
	width:auto;
	}


@media only screen and (max-width:920px) {
	ul.panel-wall li{
	height:180px!important;
	}}

@media only screen and (max-width:820px) {
	body#index ul.panel-wall li:nth-child(5) a p{
	font-size:1em;
	}}

@media only screen and (max-width:620px) {
	ul.panel-wall li:nth-child(1){
	order:1;
	width:50%!important;
	}
	ul.panel-wall li:nth-child(2){
	order:2;
	width:50%!important;
	}
	ul.panel-wall li:nth-child(3){
	order:4!important;
	width:50%!important;
	}
	ul.panel-wall li:nth-child(4){
	order:5!important;
	width:50%!important;
	}
	ul.panel-wall li:nth-child(5){
	order:3!important;
	width:100%!important;
	}}
/* --------------------------------------------- FRASE  */
body#index section.frase {
	padding:0px 0px 40px 0px;
	}

body#index section.frase p{
	font-size:1.4em;
	text-align:center;
	}



/* --------------------------------------------- CONTACTO */
section.panel-contactoleft{
	background-color:#3e3e3e;
	height:auto;
	position:relative;
	}

section.panel-contactoleft div.in {
	height:100%;
	justify-content: space-between;
	z-index:10;
	}

section.panel-contactoleft picture{
	align-items:center;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:flex-start; /*alineamos imagen a la derecha*/
	height:auto;
	overflow:hidden;
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
	top:0px;
	width:auto;
	}

section.panel-contactoleft picture img{
	position:relative;
	display:block;
	height:100%;
	max-width:1000%;
	width:auto;
	}
	/* Posiblente en algun punto debemos cambiar a propiedad cover */
	@media only screen and (max-width:720px) {
	section.panel-contactoleft picture img{
	height:100%;
	width:100%;
	object-fit:cover;
	}}


section.panel-contactoleft div.datos {
	width:40%;
	}
	@media only screen and (max-width:720px) {
	section.panel-contactoleft div.datos {
	margin-bottom:20px;
	width:100%;
	}}


section.panel-contactoleft div.datos h4 {
	font-size:1.6em;
	padding:0px 0px;
	width:40%;
	}

section.panel-contactoleft div.datos hr {
	height:5px;
	width:30%;
	}

section.panel-contactoleft div.datos p {
	padding:0px;
	}

section.panel-contactoleft ul.bar-social-vertical{
	margin:4px 0px 6px 0px;
	}

section.panel-contactoleft ul.bar-social-vertical span {
	padding-left: 10px;
	}

/*---------------------------------------------------------------- 
ANIMACIONES //////////////////////////////////////////////////////
----------------------------------------------------------------*/
body#index ul.panel-wall li {
	transition:all 0.7s;
	opacity:0.0;
	}

body#index ul.panel-wall li:nth-child(2) {
	transition-delay:0.1s;
	}
body#index ul.panel-wall li:nth-child(3) {
	transition-delay:0.4s;
	}
body#index ul.panel-wall li:nth-child(4) {
	transition-delay:0.3s;
	}
body#index ul.panel-wall li:nth-child(5) {
	transition-delay:0.2s;
	}

body#index ul.panel-wall li.animate {
	opacity:1.0;
	}



body#index section.panels .item{
	transition:all 0.6s;
	transform: translateY(100px);
	opacity:0.0;
	}

body#index section.panels .item:nth-child(2),
body#index section.panels .item:nth-child(4){
	transition-delay:0.1s;
	}


body#index section.panels .item.animate{
	transform: translateY(0px);
	opacity:1.0;
	}

/*---------------------------------------------------------------- 
SERVICIOS  //////////////////////////////////////////////////////
----------------------------------------------------------------*/
body#servicios section.nuestros-servicios{
	padding:40px 0px 40px 0px;
	}

/* --------------------------------------------- BANNER */
body.servicios section.banner-simple div.in{
	align-items: center;
	justify-content: flex-start;
	}
	@media only screen and (max-width:620px) {
	body.servicios section.banner-simple div.in{
	align-items:flex-end;
	justify-content:center;
	}}


body.servicios section.nuestros-servicios img{
	margin-bottom:0px;
	}
	@media only screen and (max-width:620px) {
	body.servicios section.banner-simple img{
	margin-bottom:80px;
	}}


body.servicios section.banner-simple h1{
	border-bottom:3px solid #ffce00;
	font-size:2.2em;
	text-align:left;
	width:auto;
	}
	@media only screen and (max-width:1500px) {
	body.servicios section.banner-simple h1{
	font-size:2.2em;
	}}
	@media only screen and (max-width:1020px) {
	body.servicios section.banner-simple h1{
	font-size:1.8em;
	}}
	@media only screen and (max-width:820px) {
	body.servicios section.banner-simple h1{
	font-size:1.4em;
	}}
	@media only screen and (max-width:620px) {
	body.servicios section.banner-simple h1{
	color:#000!important;
	font-size:1.6em;
	text-align:center;
	}}

/* --------------------------------------------- CONTAINER */
body.servicios .container{
	padding:40px 0px;
	}

body.servicios .container div.in{
	justify-content:space-between;
	}
/* --------------------------------------------- ARTICLE */
body.servicios article{
	font-size:1.4em;
	width:50%;
	}
	@media only screen and (max-width:620px) {
	body.servicios article{
	font-size:1.2em;
	width:100%;
	}}


/* --------------------------------------------- ASIDE */
body.servicios aside{
	font-size:1.2em;
	padding:20px 40px;
	width:48%;
	}
	@media only screen and (max-width:620px) {
	body.servicios aside{
	font-size:1em;	
	margin-top:20px;
	padding:20px 20px;
	width:100%;
	}}

body#capacitaciones aside{
	display: flex;
 	align-items: center;
  	justify-content: center;
	}

body#capacitaciones aside img{
	height: auto;
	width: 280px;
	}
	@media only screen and (max-width:620px) {
	body#capacitaciones aside img{
		}}

body#capacitaciones section{
	margin-top: 30px;
	}

body#capacitaciones section h4{
	border-left:3px solid #5baad3;
	font-size:1.2em;
	font-family: 'Lato', sans-serif;
	text-align: left;
	padding:2px 0px 2px 6px;
	margin-bottom: 10px;
	}	

body#capacitaciones section ul{
	margin-top: 0px;
	margin-bottom: 40px;
	}	



/* --------------------------------------------- UL TAG */
body.servicios ul.list.tag li{
	font-size:0.7em;
	height:18px;
	line-height:22px;
	font-weight:bold;
	}


/* --------------------------------------------- A COTIZA */
body.servicios a.cotiza{
	background-color:#55b88b;
	color:#ffffff;
	border-radius:5px;
	align-items:center;
	border:0px;
	cursor: pointer;
	display:inline-flex;
	flex-direction:row;
	font-size:1.1em;
	font-family: 'Oswald', sans-serif;
	height:42px;
	line-height:1.2em;
	letter-spacing:1px;
	gap:4px;
	justify-content:center;
	margin:40px 0px 80px 0px;
	width:220px;
	outline:0;
	padding:0px 16px;
	position:relative;
	text-decoration:none;
	text-transform:uppercase;
	transition:all 0.12s;
	}

body.servicios a.cotiza .svg-icon{
	fill:#ffffff;
	height:38px;
	width:38px;
	margin-left:-8px;
	}


body.servicios a.cotiza:hover{
	background-color:#58cd98;
	}


/*---------------------------------------------------------------- 
PROYECTOS  //////////////////////////////////////////////////////
----------------------------------------------------------------*/
body#proyectos section.mas-de {
	padding:18px 0px 12px 0px;
	}
body#proyectos section.mas-de h1{
	font-weight:400;
	font-size:1.6em;
	line-height: 1.8em;
	text-align:center;
	}
body#proyectos section.mas-de h1 b{
	padding:2px 10px;
	}

/* --------------------------------------------- ZIGZAG */
body#proyectos div.container{
	padding:40px 0px;
	}

body#proyectos div.container h3{
	font-family: 'Lato', sans-serif;
	text-align: center;
	text-transform: none;
	padding-bottom: 20px;
	}


body#proyectos ul.zigzag div.info{
	padding:0px 0px;
	}

body#proyectos ul.zigzag div.info h2{
	margin-bottom: 30px;
	}	

body#proyectos ul.zigzag div.info h4{
	border-left:3px solid #5baad3;
	font-size:1.2em;
	font-family: 'Lato', sans-serif;
	text-align: left;
	padding:2px 0px 2px 6px;
	margin-bottom: 10px;

	}	

body#proyectos ul.zigzag div.info p{
	padding:2px 0px 2px 10px;
	margin:0px;
	}

body#proyectos ul.zigzag div.info hr{
	margin:20px 0px;
	}


/*--------------------------------------------
CLIENTES /////////////////////////////////
-------------------------------------------*/
body#clients .testimoniales{
	align-items:stretch;
	background-color:#ffff;/*set*/
	display:grid;
	width:100%;
	grid-gap:1.6vmax;/*set*/
	grid-template-columns:repeat(auto-fill, minmax(100%, 1fr)); /*set*/
	margin-bottom:10px;/*delete*/
	padding:1.6vmax;/*set*/
	}


/* Design card
------------------------------------------*/
.cards-dos .item{
	align-items:flex-start;
	background-color:#ecf0f5;/*set*/
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	gap:30px;
	justify-content:space-between;
	height:auto;
	padding:30px;
	width:100%; /* depende del contenedor */
	}



/* If card is anchor */
.cards-dos a.item{
	text-decoration:none;
	}
.cards-dos a.item:hover{
	box-shadow:0px 0px 2px rgba(0, 0, 0, 0.2);
	text-decoration:none;
	}

/* Anchos */
.cards-dos .cover{
	background-color: #fff;
	border-radius:50%;
	overflow:hidden;
	height:150px;
	width:150px;
	}

.cards-dos .info{
	flex-grow:999;
	width:50%;
	}



/* Orden */
.cards-dos .cover{
	order:1;
	}

.cards-dos .info{
	order:2;
	}


/* img o icon */
.cards-dos .cover img,
.cards-dos .cover svg{
	height:100%;
	object-fit:contain;
	width:100%;
	}

.cards-dos .cover svg{
	padding:2px;
	}


/* info */
.cards-dos .info{

	} 

.cards-dos .info .title{ 
	color:var(--color-main);/*set*/
	font-size:0.8em;
	font-weight:var(--fw-normal);
	height:auto;
	margin:0px;
	padding:0px;
	text-transform:uppercase;
	width:100%;
	}

.cards-dos .info p{ 
	text-align: justify;
	color:initial;
	font-size:1em;
	font-weight:normal;
	height:auto;
	margin:0px;
	padding:0px;
	width:100%;
	}


.cards-dos .info p.derecha{ 
	text-align: right;
	margin-top: 15px;
	}


/* Link */
.cards-dos .info .link,
.cards-dos .info a{ 
	color:var(--color-neutro-soft);/*set*/
	font-size:0.7em;
	text-transform:uppercase;
	text-decoration:none;
	}



/* Hover
------------------------------------------*/
.cards-dos a.item:hover .link,
.cards-dos .item a:hover { 
	text-decoration:underline;
	}


/*---------------------------------
/// BRANDS  ///
----------------------------------*/
.panel-brands {
	background-color:#ecf0f5;
	padding-bottom: 30px;
	height:auto;
	}

.panel-brands div.in{
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	}
	@media only screen and (max-width:1500px) {
	.panel-brands div.in{
	justify-content:center;
	}}




.panel-brands .item {
	background-color:#fff; /*set or delete*/
	height:120px;
	padding:10px 20px;
	margin:12px; /*set*/
	width:200px;
	}
	@media only screen and (max-width:1500px) {
	.panel-brands .item{
	height:100px;
	margin:10px 16px;
	width:180px;
	}}
	@media only screen and (max-width:1020px) {
	.panel-brands .item{
	height:80px;
	margin:5px 10px;
	padding:8px 16px;
	width:120px;
	}}
	@media only screen and (max-width:920px) {
	.panel-brands .item{
	height:70px;
	margin:5px 10px;
	padding:6px 12px;
	width:100px;
	}}



.panel-brands img{
	height:100%;
	object-fit:contain;
	width:100%;
	}



/*---------------------------------------------------------------- 
EMPRESA  //////////////////////////////////////////////////////
----------------------------------------------------------------*/
body#empresa section.somos{
	padding:30px 0px;
	}

body#clients section.clientes{
	padding:46px 0px;
	}

body#empresa section.somos h1,
body#clients section.clientes h1 {
	font-weight:400;
	font-size:1.6em;
	text-align:center;
	}

body#empresa div.container{
	padding:40px 0px;
	}


/* --------------------------------------------- ARTICLE */
body#empresa article{
	width:50%;
	}
	@media only screen and (max-width:620px) {
	body#empresa article{
	width:100%;
	}}


/* --------------------------------------------- ASIDE */
body#empresa aside{
	padding:20px 40px;
	width:48%;
	}
	@media only screen and (max-width:620px) {
	body#empresa aside{
	margin-top:20px;
	padding:20px 20px;
	width:100%;
	}}
	@media only screen and (max-width:520px) {
	body#empresa aside img{
	height: auto;
	width:100%;
	}}




/* --------------------------------------------------------------- < HEADER > */


/* --------------------------------------------------------------- < NAV > */


/* --------------------------------------------------------------- < FOOTER > */


/* --------------------------------------------- AREA  > SECCION > ELEMENTO */

/* --------------------------------------------- SECCION  > ELEMENTO */

/* --------------------------------------------- SECCION  > ELEMENTO */

/* --------------------------------------------- SECCION  > ELEMENTO */

/*----------*/



/*---------------------------------------------------------------- 
VARIOS ///////////////////////////////////////////////////////////
----------------------------------------------------------------*/
.first {
	}
	@media only screen and (max-width:620px) {
	.first{
	margin-top:62px;
	}}


.txt-small{
	font-size:0.8em;
	}


/*--------------------------------------------------------------------------- GUIA (delete) */

.flex-container {
	display: flex;

	/* Dirección de items */
	flex-direction: row; /* → */
	flex-direction: row-reverse; /* ← */
	flex-direction: column; /* ↓ */
	flex-direction: column-reverse; /* ↑ */

	/* Envolvente */
	flex-wrap: wrap; /* Respeta tamaño de flex-items al llegar a limite de espacio*/
	flex-wrap: nowrap; /* Reduce flex-items conforme se reduce wrap al llegar a limite de espacio*/
	flex-wrap: wrap-reverse; /* Reduce flex-items conforme se reduce wrap y los invierte en orden  al llegar a limite de espacio*/

	/* Justificación */
	justify-content:flex-start; /* 1 2 3 4 - - - - - - - */
	justify-content:flex-end; /* - - - - - - -  1 2 3 4 */
	justify-content:center; /* - - - 1 2 3 4 - - - */
	justify-content:space-between; /* 1 - - - 2 - - - 3 - - - 4 */
	justify-content:space-around; /* - 1 - - 2 - - 3 - - 4 - */
	justify-content:space-evenly; /* - 1 - 2 - 3 - 4 - */


	/* Alineación (vertical )*/
	align-items:flex-start; /* top */
	align-items:flex-end; /* bottom */
	align-items:center; /* middle */
	align-items:stretch; /* Modifica altura de .flex-items para adaptarlos a todo lo alto */
	align-items:baseline; /* ???  */
	}	



.flex-items{
	order:1; /* default 0, orden de items  */
	}