@charset "utf-8";


/*----------Cajas Home---------*/


@media  (max-width: 359px) {
.noMobile {display: none;}
.col3-3 { width:99%; margin:.5%; float:left; position:relative }
.col3-3 img {width: 100%;}
.col4-3 { width:99%; position:relative }
.col1-3 { width:49%; padding-bottom: 44%; margin:.5%; background:#333; float:left; position:relative }
.colTexto { width:99%; padding-bottom: 44%; margin:.5%; background:#333; float:left; position:relative }
.col2-3 { width:99%; margin:.5%; padding-bottom: 93%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.col2-3.half {padding-bottom: 44%; }
.col1-26 { width:49%; margin:.5%; float:left; position:relative }
.fotoNosotros {position: relative;width: 100%; height: 70%;}
.textoNosotros{position: relative;width: 100%; min-height: 10em;}
.colFila {width:99%; margin:.5%; padding-bottom: 13.4%; background:#333; float:right; position:relative }
.double {padding-bottom: 45%;}
.colContacto {width:90%; padding-bottom: 85%; margin:auto; position:relative}
.colForm {width:90%; padding-bottom: 150%; margin:auto; position:relative; border: 1px solid black;}
.colImgContacto { width:99%; margin:.5%; padding-bottom: 74%; background:#333; float:right; position:relative }
/*.colTextoNosotros { width:99%; margin:.5%; padding-bottom: 45%; float:right; position:relative; overflow-y: auto !important;}*/
.colTextoNosotros {display: none}
.colVideo {width:99%; margin:.5%; padding-bottom: 65.5%; background:#333; float:left; position:relative }
}

@media (max-width: 767px) {


.noMobile {display: none;}
.col3-3 { width:99%; margin:.5%; float:left; position:relative }
.col3-3 img {width: 100%;}
.col4-3 { width:99%; position:relative }
.col1-3 { width:49%; padding-bottom: 44%; margin:.5%; background:#333; float:left; position:relative }
.colTexto { width:99%; padding-bottom: 44%; margin:.5%; background:#333; float:left; position:relative }
.col2-3 { width:99%; margin:.5%; padding-bottom: 93%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.col2-3.half {padding-bottom: 44%; }
.col1-26 { width:49%; margin:.5%; float:left; position:relative }
.fotoNosotros {position: relative;width: 100%; height: 70%;}
.textoNosotros{position: relative;width: 100%; min-height: 10em;}
.colFila {width:99%; margin:.5%; padding-bottom: 13.4%; background:#333; float:right; position:relative }
.double {padding-bottom: 45%;}
.colContacto {width:90%; padding-bottom: 85%; margin:auto; position:relative}
.colForm {width:90%; padding-bottom: 140%; margin:auto; position:relative; border: 1px solid black;}
.colImgContacto { width:99%; margin:.5%; padding-bottom: 74%; background:#333; float:right; position:relative }
.colTextoNosotros { display: none;}
.colVideo {width:99%; margin:.5%; padding-bottom: 65.5%; background:#333; float:left; position:relative }
}

@media (min-width: 768px) {

.noDesktop {display: none;}
.col3-3 { width:74%; margin:.5%; float:left; position:relative }
.col3-3 img {width: 100%;}
.col4-3 { width:100%; position:relative }
.col1-3, .colTexto { width:24%; padding-bottom: 22%; margin:.5%; background:#333; float:left; position:relative }
.col2-3 { width:49%; margin:.5%; padding-bottom: 45%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.col2-3.half {padding-bottom: 22%; }
.col1-26 { width:24%; margin:.5%; float:left; position:relative }
.fotoNosotros {position: relative;width: 100%; height: 70%;}
.textoNosotros{position: relative;width: 100%; height: 30%;}
.colFila {width:49%; margin:.5%; padding-bottom: 6.63%; background:#333; float:right; position:relative }
.double {padding-bottom: 45%;}
.colContacto {width:21%; padding-bottom: 36%; margin:.5%;float:left; position:relative}
.colForm {width:25%; padding-bottom: 36%; margin:.5%; float:left; position:relative; border: 1px solid black;}
.colImgContacto { width:49%; margin:.5%; padding-bottom: 36%; background:#333; float:right; position:relative }
.colTextoNosotrosMobile {display: none}
.colTextoNosotros { width:49%; margin:.5%; padding-bottom: 32.5%; background:#333; float:right; position:relative }
.colVideo {width:49%; margin:.5%; padding-bottom: 32.5%; background:#333; float:left; position:relative }

}



/*----------Cajas Casos ---------*/

@media  (max-width: 359px) {
.noMobile {display: none;}
.caso3-3 { width:99%; margin:.5%; float:left; position:relative }
.caso3-3 img {width: 100%;}
.caso4-3 { width:99%; position:relative }
.caso1x1 { width:99%; padding-bottom: 91%; margin:1%; background:#333; float:left; position:relative }
.caso2x2 { width:99%; margin:1%; padding-bottom: 92%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.caso22x2.half {padding-bottom: 44%; }
.caso2x3 { width:99%; margin:1%; padding-bottom: 60.4%; background:#333; float:right; position:relative }
.caso2x3.half {padding-bottom: 29.7%; }

}

@media (max-width: 767px) {


.noMobile {display: none;}
.caso3-3 { width:99%; margin:.5%; float:left; position:relative }
.caso3-3 img {width: 100%;}
.caso4-3 { width:99%; position:relative }
.caso1x1 { width:99%; padding-bottom: 91%; margin:1%; background:#333; float:left; position:relative }
.caso2x2 { width:99%; margin:1%; padding-bottom: 92%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.caso2x2.half {padding-bottom: 44%; }
.caso2x3 { width:99%; margin:1%; padding-bottom: 60.4%; background:#333; float:right; position:relative }
.caso2x3.half {padding-bottom: 29.7%; }
}

@media (min-width: 768px) {

.noDesktop {display: none;}
.caso3-3 { width:74%; margin:.5%; float:left; position:relative }
.caso3-3 img {width: 100%;}
.caso4-3 { width:100%; position:relative }
.caso1x1, .casoTexto { width:32.3%; padding-bottom: 29.7%; margin:.5%; background:#333; float:left; position:relative }
.caso2x2 { width:65.7%; margin:.5%; padding-bottom: 60.4%; background:#333; float:right; position:relative }
.caja {position: absolute; height: 100%; left: 0; top:0;}
.caja2-3 {position: absolute; height: 100%; left: 0; top: 0;}
.caso2x2.half {padding-bottom: 29.7%; }
.caso1-26 { width:24%; margin:.5%; float:left; position:relative }
.caso2x3 { width:99%; margin:.5%; padding-bottom: 60.4%; background:#333; float:right; position:relative }
.caso2x3.half {padding-bottom: 29.7%; }
}




/*-------------Header-----------*/



@media (max-width: 767px) {

body {margin: 0;
padding: 0;}

header { 
	position: fixed; 
	left: 0; 
	top: 0; 
	width:100%; 
	z-index:104; 
	height:6em; 
	background-color: #fff;
	padding:1em;
	z-index: 202;
}

#content { 
	width:100%; 
	position:relative; 
	padding:0px; 
	margin-top:4em; 
	z-index:103; 
	display:block; 
	background:#fff	; 
}

#contentCasos { 
	width:100%; 
	position:relative; 
	padding:0px; 
	margin-top:4em; 
	z-index:103; 
	display:block; 
	background:#fff	; 
}

.thin-post-format #content { 
	max-width:1000px; 
}

#background-color { 
	background:#242423; 
	position:absolute; 
	width:100%; 
	height:100%; 
	z-index:102; 
}

.logo-wrapper {
	position:fixed; 
	left:0; 
	z-index:101; 
	padding-left:30px; 
	padding-top: 10px; 
}
.header-bottom { 
	margin:5px 0 0 35px; 
	}




#nav-button { display:inline-block; width:50px; height:50px; border:solid 1px rgba(255, 255, 255, 0.25); margin:0; margin-left:10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding:18px 0 0 0px; border-radius:51%; cursor:pointer }
.nav-bar { background-color:#fff; border-radius:1px; display:block; width:19px; height:2px; margin:0px auto 3px; font-family: 'PT Sans', sans-serif;}

#main-nav { display: none;}

#mobile-nav  {
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: center;
	padding-left: 1.2em;
	z-index: 201;
}

#mobile-nav a {
	color: #000;
}

#mobile-nav a.logo img {
	height: 4em;
}

#burgerMobile {
	position: fixed;
    left: 2em;
    top: 2em;
}

#menuMobile {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 200;
	background-color: #fff;
    color: #000;
    left: -768px;    
    transition: left 1s;

}

#menuMobile.abierto {
	left: 0;
	transition: left .51s;
}


#linksMobile a {
	color: #000;
	width: 100%;
	text-transform: uppercase;
	font-size: 1.2em;

}

ul#linksMobile{
	padding-top:3em;
}

#linksMobile li{
	position: relative;
	padding-bottom: 1em;
	padding-top: 1em;
	padding-left: 1.6em;
}

#linksMobile li:before{
	background-image: url(../images/iconos/triangulonegro.png);
	background-size: 14px 14px;
	display: inline-block;
	width: 14px;
	height: 14px;
	content: ""; 
	margin-right: 12px;
}

ul#socialMobile {
	display: flex;
	width: 98%;
	justify-content: space-around;
	position: relative;
	top: 4em;
	margin:auto;

}

#socialMobile li:before{
	display: none;
}


ul#socialMobile li > a > img {
	height: 3em;
}

ul#social {
	display: none;
}

footer {display: none; }
#footerMobile {
	text-align: center;
	padding-top: 2em;
	padding-bottom: 1em;
}

#footerMobile > img {
	height: 6em;
}

.arrow-wrapper { display: none; }
a:hover .arrow-wrapper { display: none; }

}






@media (min-width: 768px) {

header { position: fixed; left: 0; top: 0; width:100%; z-index:104; height:110px; background-color: #fff;}
#content { width:100%; position:relative; padding:0px; margin-top:7em; z-index:103; display:block; background:#fff	; }
#contentCasos { width:75%; position:relative; padding:0px; margin-top:7em; z-index:103; display:block; background:#fff	; margin-left: auto; margin-right: auto;}
.thin-post-format #content { max-width:1000px; }

#background-color { background:#242423; position:absolute; width:100%; height:100%; z-index:102; }

.logo-wrapper {position:fixed; left:0; z-index:101; padding-left:30px; padding-top: 10px; }
.header-bottom { margin:5px 0 0 35px; }


#mobile-nav, #menuMobile {
	display: none;
}

#nav-button { display:inline-block; width:50px; height:50px; border:solid 1px rgba(255, 255, 255, 0.25); margin:0; margin-left:10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding:18px 0 0 0px; border-radius:51%; cursor:pointer }
.nav-bar { background-color:#fff; border-radius:1px; display:block; width:19px; height:2px; margin:0px auto 3px; font-family: 'PT Sans', sans-serif;}

#main-nav { position: relative; width: 100%; padding-left: 12%; padding-right: 12%; margin-top: 10px;}
#main-nav a { text-decoration: none; color: #000; opacity:0.7; font-size: 14px; letter-spacing:1px; font-family: 'PT Sans', sans-serif; display:block; padding:4px 0px; }
#main-nav a.logo {opacity: 1 ;}
#main-nav a.logo img {height: 4em;}
#main-nav a.indus {opacity: 1;color: #302e80;font-weight: bold;}
#main-nav a.indus:hover {color: #302e80; text-decoration: underline;
}
#main-nav ul {display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
#main-nav > ul a { text-transform: uppercase; }
#main-nav > ul .active > a, #main-nav > ul a.active, #main-nav li a:hover, #main-nav li a.selected { color: #000;  opacity:1; -webkit-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; }
#main-nav > ul > li > .sub-nav { padding:3px 15px; }
#main-nav > ul > li > .sub-nav > li > a { font-size: 12px; }
#main-nav li a.selected:after {background-image: url(../images/iconos/triangulonegro.png);background-size: 12px 12px;display: inline-block;width: 12px;height: 12px;content: ""; margin-left:6px;}
#main-nav li a.selected:before {background-image: url(../images/iconos/triangulonegro.png);background-size: 12px 12px;display: inline-block;width: 12px;height: 12px;content: ""; margin-right: 6px;}

.socialMobile {display: none;}

footer {margin:0px 50px; width: 93%; padding-top: 1.9em; padding-bottom: 1.5em; text-align: center; }
#footerMobile {display: none;}
ul#social a > li > img {
	height: 3em;
}

.pieDePagina { font-size:0; display:inline-block; margin: 0px; padding: 0px; position: relative; right: 10px; display: flex; justify-content: space-between; align-content: center;align-items: center;}
.logoFooter{font-size: 1.2em;}
.logoFooter img {padding-right: 3em;}

ul.logoFooter > li > img {
	padding-bottom: 2em;
}

.arrow-wrapper { opacity:0; position:absolute; right:45px; bottom:30px; }
a:hover .arrow-wrapper { opacity:1; right:35px; -webkit-transition: all 0.2s ease-in-out 0.1s; transition: all 0.2s ease-in-out 0.1s; }

}



/*-------------------------Estilos etiquetas y cosas varias-----------------------*/


@media (max-width: 767px) {

.textoCasos {
    opacity: 1;
    position: absolute;
    left: 0;
    bottom: 0em;
    width: 100%;
    text-align: left;
    background-color: rgba(0,0,0,0);
    min-height: 2.3em;
    vertical-align: middle;
    display: block;
    justify-content: center
}
.textoCasos h4 {font-family: 'PT Serif'; font-size: 1em; margin: auto; background-color: rgba(50,50,50,.4); padding:10px;}
.textoCasos h2 {display: none;}
.etiquetasCasos { display: none;}

.textoHome {    
	background: white;
    color: black;
    font-size: .9em;
    padding: 2em;
    text-align: justify;
}

.colTextoNosotrosMobile {
	padding: 2em;
	text-align: justify;		
	position: relative;
	top: 1em;
}

}

@media (min-width: 768px){

.textoHome {
	background: white;
    color: black;
    font-size: .8em;
    padding: 2em 1.8em 0em 2em;

}

}

@media (min-width: 1000px){

.textoHome {
	background: white;
    color: black;
    font-size: 1em;
    padding: 2em 2.8em 0em 2em;

}

}


@media (min-width: 1240px){

.textoHome {
	background: white;
    color: black;
    font-size: 1.2em;
    padding: 2em 3.8em 0em 2em;

}

}



@media (min-width: 768px) {

.textoCasos { opacity:1; position:absolute; left:0; bottom:0; width:240px; padding:15px 25px 20px;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.textoCasos h4 {font-family: 'PT Serif'; font-size: 28px; margin: auto; line-height: 28px;text-shadow: 2px 2px 3px rgba(0,0,0,.1);}
.textoCasos h2 {font-family: 'PT Sans'; font-size: 12px; letter-spacing: 1px; margin-top: 8px;}

}

@media (min-width: 768px) {

.etiquetasCasos { color:#fff;opacity:1; position:absolute; left:0; bottom:0; width:170px; padding:3em 2em 6.5em;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.etiquetasCasos p {border: 1px solid white; display: block; font-family: 'PT Sans'; font-size: .9em; padding: .1px 3px; text-transform: uppercase;}

}

@media (min-width: 1145px) {

.etiquetasCasos { color:#fff;opacity:1; position:absolute; left:0; bottom:0; width:170px; padding:3em 2em 11em;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.etiquetasCasos p {border: 1px solid white; display: block; font-family: 'PT Sans'; font-size: .9em; padding: .1px 3px; text-transform: uppercase;}

}

@media (min-width: 1300px) {

.etiquetasCasos { color:#fff;opacity:1; position:absolute; left:0; bottom:0; width:170px; padding:3em 2em 13em;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.etiquetasCasos p {border: 1px solid white; display: block; font-family: 'PT Sans'; font-size: .9em; padding: .1px 3px; text-transform: uppercase;}

}

@media (min-width: 1500px) {

.etiquetasCasos { color:#fff;opacity:1; position:absolute; left:0; bottom:0; width:170px; padding:3em 2em 17em;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.etiquetasCasos p {border: 1px solid white; display: block; font-family: 'PT Sans'; font-size: .9em; padding: .1px 3px; text-transform: uppercase;}
}

@media (min-width: 1700px) {

.etiquetasCasos { color:#fff;opacity:1; position:absolute; left:0; bottom:0; width:170px; padding:3em 2em 20em;  -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s;  }
.etiquetasCasos p {border: 1px solid white; display: block; font-family: 'PT Sans'; font-size: .9em; padding: .1px 3px; text-transform: uppercase;}

}