@charset "utf-8";
/* CSS Document */
*{margin:0; padding:0; border:none; outline:none; text-decoration:none}
body{color:#363636}

h1{font:500 36px/47px 'Exo', sans-serif;}
.pagina h1 {font-weight:300}
h2{text-transform:uppercase; font:300 20px/21px 'Exo', sans-serif; margin-bottom:10px;}
	h2 span, .pagina h1 span{font-weight:700}
h3{text-transform:uppercase; font:300 18px/18px 'Exo', sans-serif; margin-bottom:10px;}
h4{}
h5{}
p, ul, table{font:400 14px/19px Calibri, Arial, sans-serif;}
ul{margin-left:22px; margin-bottom:0; list-style:url(img/bullet.png)}
li{margin-bottom:7px}
img{}

a{color:#fdbe27; }
p a{}
a.vermas{}

.wrapper{width:970px; padding:0 20px; margin:0 auto}
.izq{width:680px; float:left}
.der{width:240px; float:right}
.last{margin-right:0 !important}

.header{border-top:4px solid #363636; background:#f1f1f1; padding-bottom:12px }
	.header .wrapper{}
		a.logo{display:block; float:left; width:303px; margin-top:10px}
		.menu{width:440px; float:right}
			.menu a{color:#363636; display:block; float:left; font:400 11px/14px 'Exo', sans-serif; text-transform:uppercase; padding:8px 4px 2px; border-top:28px solid #f1f1f1 }
			.menu a.contacto{border-top:none; margin-top: 27px; padding: 8px 10px 6px; border: 1px solid #acacac; font-weight:600; border-radius: 3px; margin-left: 4px;}
			.menu a:hover, .menu a.activo{border-top:28px solid #fdb815}
			.menu a.contacto:hover, .menu a.contacto-activo{background:#fdb815; border: 1px solid #acacac; }
			.menu span{display:block; float:left; background:url(img/separador-menu.gif) no-repeat; width:2px; height:16px; margin:35px 10px 0}
			
.franja-header{background:url(img/bg-subheader.gif); margin-bottom:3px}
	.franja-header .wrapper{background:url(img/sombra.png) top center no-repeat; padding:12px 20px}
		.franja-header p{font:500 12px/14px 'Exo', sans-serif; text-align:right; padding-right:10px}
			.franja-header p a{font-weight:700; color:#363636}
			
.banner{width:100%; position:relative; padding-bottom:4px; background:url(img/bg-subheader.gif) repeat-x bottom; }
	.caption{position:absolute; z-index:5; top:135px; width:100%; background:url(img/bg-caption-banner.png) repeat-x; padding-top:25px}
		.caption .wrapper{ }
			.caption h1{font:500 32px/35px 'Exo', sans-serif; text-transform:uppercase; color:#fff; text-align:center; text-shadow: 0px 2px 3px rgba(0,0,0,0.8)}
				.caption h1 span{font-weight:800}
			.caption a.conocemas{display:block; width:125px; text-align:center; margin:10px auto 0; border:4px solid #fdb815; border-radius:3px; padding:10px; color:#fff; font:700 16px/16px 'Exo', sans-serif;}
			.caption a.conocemas:hover{background:#fdb815}
			.servicios-banner{margin:108px auto; width:860px}
				.servicios-banner div{margin:0 auto 12px}
					.servicios-banner a{display:block; float:left; padding:15px 20px 14px; background:url(img/bg-amarrillo-80.png); color:#363636; font:700 14px/14px 'Exo', sans-serif; margin:0 10px 0}
					.servicios-banner a:hover{background:#fdbe27}
				.servicios-banner .fila1{width:754px}
				.servicios-banner .fila2{width:871px}
				.servicios-banner .fila3{width:330px}
		
#wrapper {width: 100%; min-width: 970px; height: 618px; margin: 0;}
		#carousel div {height: 618px; float: left;}
			#carousel img {min-width: 100%; min-height: 100%;}
			#title {width: 100%;}

.empresa-index{padding:33px 0 130px; background:url(img/secuencia-tronadura.jpg) repeat-x left bottom}
	a.logo-gris{display:block; float:left; width:166px; height:165px; background:url(img/logo-trogen-gris.jpg)}
	.empresa-index .wrapper div{width:780px; float:right}
		.empresa-index h2{padding-top:10px}
		.empresa-index p{font:400 15px/24px 'Exo', sans-serif;}
		.empresa-index p a{font-weight:700}
		
.contacto-index{background:#fdb815;}
	.contacto-index .wrapper{background:url(img/sombra.png) top center no-repeat; padding:40px 92px 35px; width:786px }
		.contacto-index h2{color:#fff; text-align:center; margin-bottom:16px}
		.contacto-index .wrapper div{}
		.contacto-index input, .contacto-index textarea{display:block; width:226px; height:15px; padding:12px 10px 10px; background:#fff; border:2px solid #e8af26; border-radius:2px; font:italic 500 14px/16px 'Exo', sans-serif; margin-right:18px; float:left}
		.contacto-index input[type=email]{margin-right:0}
		.contacto-index textarea{width:762px; height:90px; margin:15px 0; float:none }
		.contacto-index input[type=submit]{width:215px; height:16px; padding:15px; border-color:#fff; background:#edb42a; font:700 18px/18px 'Exo', sans-serif; color:#fff; text-transform:uppercase; float:right; text-align:center; margin:0; cursor:pointer; height:auto;}
		.contacto-index div.wpcf7-response-output{margin: 0;  padding: 9px 8px 7px; width: 400px; color: #fff; font: italic 500 14px/16px 'Exo', sans-serif;}
		.contacto-index div.wpcf7-mail-sent-ok{background:#398f14; }
		.contacto-index span.wpcf7-not-valid-tip{display:none; }
		.contacto-index div.wpcf7-validation-errors {background:#cd1313; border:2px solid #cd1313}

.proyectos-index{background:#f1f1f1; padding:33px 0 50px}
	.proyectos-index h2{background:url(img/bg-subheader.gif) repeat-x left center; text-align:center; margin-bottom:25px}
		.proyectos-index h2 span{background:#f1f1f1; display:inline-block; padding:0 15px;}
	.proyectos-index .wrapper div{width:164px; float:left; margin-right:30px }
	.proyectos-index .wrapper div:last-child{margin-right:0}
		.proyectos-index .wrapper div h3{font: 500 13px/17px 'Exo', sans-serif; margin:4px 0 8px; text-transform:none }
			.proyectos-index .wrapper div h3 a{color:#363636;}
		.proyectos-index .wrapper div a.img-post-index{display:block; border:2px solid #fff}
		a.ver-mas{display:block; float:left; color:#363636; background:#fdb815; padding:5px 8px; border-radius:3px; font:700 12px/14px 'Exo', sans-serif;}

.footer{background:#363636; }
	.footer .inner{background:url(img/sombra.png) top center no-repeat; padding:23px 0 25px; }
		.menu-footer{background:url(img/bg-menu-footer.png); height:37px;}
			.menu-footer .wrapper{padding:11px 0 10px; width:404px}
			.menu-footer a{color:#fff; display:block; float:left; text-transform:uppercase; font:300 10px/12px 'Exo', sans-serif; padding:2px 4px}
			.menu-footer a:hover{}
			.menu-footer span{display:block; float:left; background:url(img/separador-menu.gif) no-repeat; width:2px; height:16px; margin:0 10px}
	.footer .wrapper{}
		
		.datos-footer{width:530px; margin:0 auto; padding-top:16px}
			a.logo-footer{display:block; width:273px; height:71px; background:url(img/logo-trogen-footer.png) no-repeat; float:left}
			.datos-footer p{color:#f1f1f1; font:500 12px/18px 'Exo', sans-serif; float:right; width:250px; padding-top:9px}
				.datos-footer p a{color:#f1f1f1; font-weight:700}
	
/*paginas*/
.pagina{}
		.pagina .info .titulo-pagina, .proyectos .titulo-pagina{background:#fdb815;  padding:24px 0 15px; margin-bottom:5px }
			.pagina .info .titulo-pagina h1, .proyectos .titulo-pagina h1{font-size:25px; line-height:28px; width:970px; margin:0 auto; display:block  }	
	.pagina .info{padding-bottom: 50px; }
		.pagina .info .wrapper, .proyectos .info .wrapper{padding-top:33px}

/*empresa*/	
	.pagina .izq{width:605px}
		.pagina .izq p{text-align:justify;}
		.datos-metros{background:#f1f1f1; padding:22px 15px; width:290px; border-top:3px solid #fdb815; }
	
	.pagina .banner{width:100%; position:relative; padding-bottom:4px; background:url(img/bg-subheader.gif) repeat-x bottom; }
				table{font-size:13px; line-height:23px}
					table tr td{border-bottom:1px solid #ddd; padding:1px}

.pagina #wrapper {width: 100%; min-width: 970px; height: 220px; margin: 0;}
		.pagina #carousel div {height: 220px; float: left;}
	
/*contacto*/
.pagina .info .contacto-form .wrapper{background:none; padding-top:0; padding-bottom:45px  }
.pagina .info .contacto-form .titulo-pagina{background:none;  }
	.pagina .info .contacto-form .titulo-pagina h1{text-align:center; margin-bottom:16px; width:auto; margin:0}
	.contacto-form textarea{height:180px;}
	
/*servicios*/	
.servicios .izq{width:270px; background:#f1f1f1; border-top:3px solid #fdb815; padding-top:1px  }
	.servicios .izq a{border-bottom: 2px solid #fff; padding: 11px 14px; font: 600 13px/15px 'Exo', sans-serif; display: block; color: #363636; }
	.servicios .izq	a.activo{background:#fdb815;}
.servicios .der{width:650px}
		.servicios .der p{text-align:left; padding-left:2px}
			.servicios .der p span{font:700 15px/18px 'Exo', sans-serif; display:inline-block; padding:15px 0 0px }
		.servicios ul{margin-top:6px; line-height:20px}
		.servicios h2, .proyectos h2{font-weight:700; border-bottom:1px solid #fdb815; padding:0 2px 10px; margin-bottom:12px}
			.servicios h2 span{font-weight:700;}
		.servicios .der img, .servicios .der iframe, .img-post, .post-blog .video{display:block; margin-top:16px; padding:8px; border:1px solid #eee}

/*proyectos*/
.proyectos{}
	.proyectos .izq{width:650px}
		.proyectos h2{margin-bottom:8px; line-height:23px; padding-bottom:8px}
			.proyectos h2 a{color:#363636}
		.post-blog{margin-bottom:55px;}
			.post-blog p{padding-left:2px}
			.post-blog p.meta{font-size:13px; line-height:14px}
			.post-single p{margin-top:16px}
			.post-single p.meta{margin:0}
			.img-post{margin:8px 0 12px}
			.galeria-imagenes{margin:0 0 18px;}
				.galeria-imagenes a{display:block; float:left; padding:3px; border:1px solid #eee; margin:0 6px 0 7px;}
			.post-blog .video{margin:0}
			.post-blog ul{margin-top:12px}
			.compartir {background:#f1f1f1; padding:10px; margin-top:16px}
			.post-single .compartir{margin-top:22px}
				.compartir div{float:left; margin-right:13px; padding-top:2px}
				.compartir a.ver-mas{float:right;}
	.proyectos .der{width:260px; margin-bottom:50px}
		.proyectos .der ul{list-style:none; margin:0; background:#f1f1f1; border-top:3px solid #fdb815; padding-top:1px }
			.proyectos .der li{margin:0}
			.proyectos .der li a{border-bottom: 2px solid #fff; padding: 11px 14px; font: 600 13px/15px 'Exo', sans-serif; display: block; color: #363636;}
			.proyectos .der li.current-cat a, .proyectos .der li a:hover{background:#fdb815;}
	
		

	
			
				
/* clearfix */ 
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }


@media only screen and (max-width: 480px) {
h2{font-size:18px}	
.wrapper{width:100%; margin:0; padding:0}
.izq, .der, .menu, .empresa-index .wrapper div{width:100%; float:none}
a.logo{float:none; margin:10px auto; background:center}
.menu{margin:10px 0 0; width:94%; padding:0 3%}
			.menu a{border-top:none; font-size:8px; width:12%;  text-align:center }
			.menu a.contacto{border-top:none; margin-top:0; width:12%; text-align:center }
			.menu a:hover, .menu a.activo{border-bottom:3px solid #fdb815; border-top:none}
			.menu span{ width:1%; margin:8px 2%}
.franja-header .wrapper{padding:12px 0}
.franja-header p{text-align:center}	
.banner{background:url(img/banner1.jpg) center}	
#carousel, .caroufredsel_wrapper{display:none;}

.caption{ top:35px; padding-top:20px}
		.caption .wrapper{ }
			.caption h1{font:500 26px/33px 'Exo', sans-serif;}
			
.servicios-banner{margin:45px auto 0; width:100%}
				.servicios-banner div{padding:0 10px; margin:0}
					.servicios-banner a{float:none; width:100%; padding:12px 0; text-align:center; margin:0 0 5px; font-size:12px}
					.servicios-banner a:hover{background:#fdbe27}
				.servicios-banner .fila1, .servicios-banner .fila2, .servicios-banner .fila3{width:auto}
#wrapper {width: 100%; min-width: 0; }
		
						
a.logo-gris{display:block; float:none; margin:0 auto 10px; width:166px; height:165px; background:url(img/logo-trogen-gris.jpg)}
.empresa-index .wrapper div{}
	.empresa-index h2{padding:10px 10px 0; font-size:18px; text-align:center;}
		.empresa-index p{padding:0 10px; text-align:center; font-size:14px; line-height:21px}
			.empresa-index p a{display:block}
	

.contacto-index .wrapper{background:url(img/sombra.png) top center no-repeat; padding:40px 0 35px; width:100%; }
		.contacto-index .wrapper div{padding:0 10px}
			.contacto-index .wrapper div.fila-campos{padding:0; margin:0}
		.contacto-index input, .contacto-index textarea{width:92%; margin-right:0; margin-bottom:8px; float:none;}
		.contacto-index textarea{width:92%; margin:0 0 8px; }
		.contacto-index input[type=submit]{width:100%; float:none;}
		.contacto-index div.wpcf7-response-output{margin:0; width: 92%;}

.proyectos-index .wrapper div{width:46%; float:left; margin:0 2%; }
	.proyectos-index .wrapper div img{width:100%; height:auto}

.footer .inner{padding-top:5px}
	.menu-footer{display:none} 
	.footer .wrapper{}
		
		.datos-footer{width:100%; margin:0 auto; padding-top:16px}
			a.logo-footer{margin:0 auto; float:none}
		.datos-footer p{float:none; width:auto; padding:9px 10px; text-align:center}	

		.pagina .info .titulo-pagina, .proyectos .titulo-pagina{padding:15px 0; }
			.pagina .info .titulo-pagina h1, .proyectos .titulo-pagina h1{font-size:18px; line-height:22px; width:90%; margin:0 auto;   }
		.pagina .info .wrapper, .proyectos .info .wrapper{padding-top:22px}	
	
	.pagina .izq{width:100%; margin-bottom:25px}
		.pagina .izq p{padding:0 12px}
		.datos-metros{padding:22px 5%; width:84%; margin:0 auto }
	
	.pagina .banner{display:none }
				table{font-size:13px; line-height:23px}
					table tr td{border-bottom:1px solid #ddd; padding:1px}

.pagina #wrapper {width: 100%; min-width: 0; height: 220px; margin: 0;}
		.pagina #carousel div {height: 220px; float: none;}		
		

 .coda-slider-wrapper .coda-slider {width: 310px !important; }
 	.coda-slider-wrapper .coda-slider img, .coda-slider-wrapper .coda-slider iframe{width:95% !important; height:auto !important}
    
    .coda-slider-wrapper .coda-slider .panel { width: 310px !important;  }		
					

/*contacto*/
.pagina .info .contacto-form .wrapper{background:none; padding-top:0; padding-bottom:45px  }
.pagina .info .contacto-form .titulo-pagina{background:none;  }
	.pagina .info .contacto-form .titulo-pagina h1{text-align:center; margin-bottom:16px; width:auto; margin:0}
	.contacto-form textarea{height:180px;}


.proyectos{}
	.proyectos .izq{width:100%}
		.proyectos h2{margin-bottom:8px; line-height:21px; padding-bottom:8px}
		.post-blog{ width:92%; margin:0 auto 55px}
			.img-post img{width:100%; height:auto}
			.galeria-imagenes{margin:0 0 18px;}
				.galeria-imagenes a{display:block; float:left; padding:3px; border:1px solid #eee; margin:0 1px 3px;}
			.post-single iframe{width:100% !important; height:auto !important}
			.compartir { background:none; padding:0; margin-top:16px}
				.compartir div{display:none;}
			.post-single .compartir{margin-top:22px}
				.compartir div{float:left; margin-right:13px; padding-top:2px}
				.compartir a.ver-mas{float:none;}
	.proyectos .der{width:92%; margin:0 auto 50px}
		
}

@media only screen and (min-width: 500px) and (max-width: 969px) {
h2{font-size:18px}	
.wrapper{width:100%; margin:0; padding:0}
.izq, .der, .menu, .empresa-index .wrapper div{width:100%; float:none}
a.logo{float:none; margin:10px auto; background:center}
.menu{margin:10px 0 0; width:94%; padding:0 3%}
			.menu a{border-top:none; font-size:10px; width:12%;  text-align:center }
			.menu a.contacto{border-top:none; margin-top:0; width:12%; text-align:center }
			.menu a:hover, .menu a.activo{border-bottom:3px solid #fdb815; border-top:none}
			.menu span{ width:1%; margin:8px 2%}
.franja-header .wrapper{padding:12px 0}
.franja-header p{text-align:center}	
.banner{background:url(img/banner1.jpg) center}	
#carousel, .caroufredsel_wrapper{display:none;}

.caption{ top:35px; padding-top:20px}
		.caption .wrapper{ }
			.caption h1{font:500 26px/33px 'Exo', sans-serif;}
			
.servicios-banner{margin:45px auto 0; width:100%}
				.servicios-banner div{padding:0 10px; margin:0}
					.servicios-banner a{float:none; width:100%; padding:12px 0; text-align:center; margin:0 0 5px; font-size:12px}
					.servicios-banner a:hover{background:#fdbe27}
				.servicios-banner .fila1, .servicios-banner .fila2, .servicios-banner .fila3{width:auto}
#wrapper {width: 100%; min-width: 0; }
		
						
a.logo-gris{display:block; float:none; margin:0 auto 10px; width:166px; height:165px; background:url(img/logo-trogen-gris.jpg)}
.empresa-index .wrapper div{}
	.empresa-index h2{padding:10px 10px 0; font-size:18px; text-align:center;}
		.empresa-index p{padding:0 10px; text-align:center; font-size:14px; line-height:21px}
			.empresa-index p a{display:block}
	

.contacto-index .wrapper{background:url(img/sombra.png) top center no-repeat; padding:40px 0 35px; width:100%; }
		.contacto-index .wrapper div{padding:0 10px}
			.contacto-index .wrapper div.fila-campos{padding:0; margin:0}
		.contacto-index input, .contacto-index textarea{width:92%; margin-right:0; margin-bottom:8px; float:none;}
		.contacto-index textarea{width:92%; margin:0 0 8px; }
		.contacto-index input[type=submit]{width:100%; float:none;}
		.contacto-index div.wpcf7-response-output{margin:0; width: 92%;}

.proyectos-index .wrapper div{width:46%; float:left; margin:0 2%; }
	.proyectos-index .wrapper div img{width:100%; height:auto}

.footer .inner{padding-top:5px}
	.menu-footer{display:none} 
	.footer .wrapper{}
		
		.datos-footer{width:100%; margin:0 auto; padding-top:16px}
			a.logo-footer{margin:0 auto; float:none}
		.datos-footer p{float:none; width:auto; padding:9px 10px; text-align:center}	

		.pagina .info .titulo-pagina, .proyectos .titulo-pagina{padding:15px 0; }
			.pagina .info .titulo-pagina h1, .proyectos .titulo-pagina h1{font-size:18px; line-height:22px; width:90%; margin:0 auto;   }
		.pagina .info .wrapper, .proyectos .info .wrapper{padding-top:22px}	
	
	.pagina .izq{width:100%; margin-bottom:25px}
		.pagina .izq p{padding:0 12px}
		.datos-metros{padding:22px 5%; width:84%; margin:0 auto }
	
	.pagina .banner{display:none }
				table{font-size:13px; line-height:23px}
					table tr td{border-bottom:1px solid #ddd; padding:1px}

.pagina #wrapper {width: 100%; min-width: 0; height: 220px; margin: 0;}
		.pagina #carousel div {height: 220px; float: none;}		
		

 .coda-slider-wrapper .coda-slider {width: 490px !important; }
 	.coda-slider-wrapper .coda-slider img, .coda-slider-wrapper .coda-slider iframe{width:95% !important; height:auto !important}
    
    .coda-slider-wrapper .coda-slider .panel { width: 490px !important;  }		
					

/*contacto*/
.pagina .info .contacto-form .wrapper{background:none; padding-top:0; padding-bottom:45px  }
.pagina .info .contacto-form .titulo-pagina{background:none;  }
	.pagina .info .contacto-form .titulo-pagina h1{text-align:center; margin-bottom:16px; width:auto; margin:0}
	.contacto-form textarea{height:180px;}


.proyectos{}
	.proyectos .izq{width:100%}
		.proyectos h2{margin-bottom:8px; line-height:21px; padding-bottom:8px}
		.post-blog{ width:92%; margin:0 auto 55px}
			.img-post img{width:100%; height:auto}
			.galeria-imagenes{margin:0 0 18px;}
				.galeria-imagenes a{display:block; float:left; padding:3px; border:1px solid #eee; margin:0 1px 3px;}
			.post-single iframe{width:100% !important; height:auto !important}
			.compartir { background:none; padding:0; margin-top:16px}
				.compartir div{display:none;}
			.post-single .compartir{margin-top:22px}
				.compartir div{float:left; margin-right:13px; padding-top:2px}
				.compartir a.ver-mas{float:none;}
	.proyectos .der{width:92%; margin:0 auto 50px}
	
	}