@import url(normalize.css);

body { background: white;font-family: 'Raleway', sans-serif;}
a { text-decoration: none; }
.clear{clear: both;}
.dn{display: none;}
.tac{text-align: center !important;}
.pr{position: relative;}

.activo{background: rgba(203,204,204,0.8);margin-top: 20px;}
nav{position: fixed;    width: 100%;top: 0;z-index: 99;left: 0;}
.menu {height: 70px;width: 70px;right: 70px;top: 20px;text-align: center;position: absolute;background: rgba(203,204,204,0.8);overflow: hidden;-webkit-transition: all .2s ease;transition: all .2s ease;z-index: 999;}
.menu.active {width: calc(100% - 140px);}
.menu.active .menuContent * {opacity: 1;}
.menu.active span i:nth-child(1) {
  -webkit-transform: rotate(-45deg) translate(-50%, -50%);
          transform: rotate(-45deg) translate(-50%, -50%);
  top: 34%;width: 48%;left: 22px;
}
.menu.active span i:nth-child(2) {
  -webkit-transform: translateX(-100px);
          transform: translateX(-100px);
  opacity: 0;
}
.menu.active span i:nth-child(3) {
  -webkit-transform: rotate(45deg) translate(-50%, -50%);
          transform: rotate(45deg) translate(-50%, -50%);
  top: 65%;
  width: 45%;left: 20px;
}
.menu span {width: 70px;height: 70px;position: absolute;right: 0;cursor: pointer;background: #ff0000;z-index: 1;}
.menu span i {
  position: absolute;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  width: 45%;
  height: 2px;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #FFFFFF;
  -webkit-transition: opacity .1s ease .1s, -webkit-transform .3s ease;
  transition: opacity .1s ease .1s, -webkit-transform .3s ease;
  transition: transform .3s ease, opacity .1s ease .1s;
  transition: transform .3s ease, opacity .1s ease .1s, -webkit-transform .3s ease;
}
.menu.active span{background: transparent;}
.menu span i:nth-child(1) {top: 40%;}
.menu span i:nth-child(2) {top: 50%;}
.menu span i:nth-child(3) {top: 60%;}
.menu .menuContent {position: absolute;width: 100%;height: 100%;line-height: 70px;right: 0px;text-align: center;}
.menu .menuContent * {opacity: 0;}
.menu .menuContent ul{padding: 0;margin:0;}
.menu .menuContent ul li {display: inline-block;margin:0 20px;-webkit-transition: opacity .3s ease .3s;transition: opacity .3s ease .3s;cursor: pointer;position: relative;}
.menu .menuContent ul li a{color: #FFFFFF;}
.menu .menuContent ul li a:hover{color: #ff0000;text-decoration: none;}
.logo{float: left;width: 150px;padding: 10px;}
.logotipo{padding:10px;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.logotipo.peque{width: 150px;padding: 25px 10px;}
.f_eng{position: absolute;right: 150px;top: 40px;font-size: 20px;color: #FFFFFF;}
.f_eng span{margin: 0 10px;}
.f_eng span a{color: #FFFFFF;}
.f_eng span i{width: 40px;height: 40px;border-radius: 20px;background-color: #FFFFFF;color: #ff0000;padding-top: 10px;padding-left: 14px;}


#slider .item img{width: 100%;}

.proyectos{background-color: #FFFFFF;}
.proyectos h1{text-align: center;color: #aaaaaa;}
.proyecto1{background: url(../img/d4_proyecto1.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyecto2{background: url(../img/d4_proyecto2.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyecto3{background: url(../img/d4_proyecto3.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyecto4{background: url(../img/d4_proyecto4.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyecto5{background: url(../img/d4_proyecto5.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyecto6{background: url(../img/d4_proyecto6.jpg) no-repeat;background-size: 100%;height: 100%;}
.proyectos .listado .item{padding: 10px;text-align:center;height: 380px;color: #FFFFFF;}
.proyectos .listado .item img{padding-top: calc(50% - 50px);}
.proyectos .listado .item h3{font-weight: 100;font-style: normal;font-size: 22px;}
.proyectos .listado .item p{font-size: 12px;opacity: 0; -webkit-transition: all 0.5s,;transition: all 0.5s;}
.proyectos .listado .item:hover p{opacity: 1;}
.proyectos .listado .item p a{color: #FFFFFF;}

.sobre_nosotros{position:relative;width: 100%;
  background: url(../img/d4_sn_bg.jpg) no-repeat fixed;
  background-position: center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}
.sobre_nosotros h1{text-align: center;color: #dedede;}
.sobre_nosotros .listado .item{color: #dedede;padding: 30px 0;overflow: hidden;}
.sobre_nosotros .listado .item p{font-size: 14px;}
.sobre_nosotros .listado .item .icono{text-align: center;padding-top: 10px;}

.publicaciones{background: url(../img/d4_publicacion_bg.jpg) no-repeat fixed;
 background-position: center top;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}
.publicaciones .rec_pub{text-align: center;margin-bottom: 30px;overflow: auto;border-bottom: 2px solid #FFFFFF;padding-bottom: 30px;}
.publicaciones .rec_pub img{margin-bottom: 10px;}
.publicaciones .rec_pub .item:first-child{color:#ff0000;}
.publicaciones .rec_pub .item:last-child{color:#aaaaaa;}

.publicaciones h1{text-align: center;color: #000000;}
.publicaciones .listado .item{padding: 10px;}
.publicaciones .listado .item img{width: 100%;}
.publicaciones .listado .item .imagen{position: relative;}
.rojo{background-color: rgba(255,0,0,0.5);position: absolute;top:0;left:0;width: 100%;height: 100%;}
.publicaciones .listado .item:hover .rojo{background-color: rgba(255,0,0,0); -webkit-transition: all 0.5s,;transition: all 0.5s;}
.publicaciones .listado .item:hover .bottom{opacity: 1;}
.bottom{background-color: rgba(189,157,134,0.5);position: absolute;bottom:10px;left:0;width: 100%;height: 80px;padding:10px;color: #FFFFFF;opacity: 0; -webkit-transition: all 0.5s,;transition: all 0.5s;}

.reconocimientos{width: 300px;height: 300px;background: url(../img/d4_reconocimientos.png) center no-repeat;margin: 0 auto;cursor: pointer;}
.reconocimientos.capa.activo{background: url(../img/d4_reconocimientos_h.png) center no-repeat;}
.reconocimientos:hover{width: 300px;height: 300px;background: url(../img/d4_reconocimientos_h.png) center no-repeat;}

.publicacioness{width: 300px;height: 300px;background: url(../img/d4_publicaciones.png) center no-repeat;margin: 0 auto;cursor: pointer;}
.publicacioness.capa.activo{background: url(../img/d4_publicaciones_h.png) center no-repeat;}
.publicacioness:hover{width: 300px;height: 300px;background: url(../img/d4_publicaciones_h.png) center no-repeat;}


.reconocimientos_eng{width: 300px;height: 300px;background: url(../img/d4_reconocimientos_eng.png) center no-repeat;margin: 0 auto;cursor: pointer;}
.reconocimientos_eng.capa.activo{background: url(../img/d4_reconocimientos_h_eng.png) center no-repeat;}
.reconocimientos_eng:hover{width: 300px;height: 300px;background: url(../img/d4_reconocimientos_h_eng.png) center no-repeat;}

.publicacioness_eng{width: 300px;height: 300px;background: url(../img/d4_publicaciones_eng.png) center no-repeat;margin: 0 auto;cursor: pointer;}
.publicacioness_eng.capa.activo{background: url(../img/d4_publicaciones_h_eng.png) center no-repeat;}
.publicacioness_eng:hover{width: 300px;height: 300px;background: url(../img/d4_publicaciones_h_eng.png) center no-repeat;}

.capa2{display: none;}


/*.contacto{background: url(../img/d4_contacto1.jpg) no-repeat;background-size: 45% 100%;}*/
.contacto{position:relative;width: 100%;
  background: url(../img/d4_contacto4.jpg) no-repeat fixed;
  background-position: left top;
  -webkit-background-size: 45% 100%;;
  -moz-background-size: 45% 100%;;
  -o-background-size: 45% 100%;;
  background-size: 45% 100%;;}
.contacto p{text-align: center;color: #aaaaaa;}
.contacto p strong{font-weight: 900;color: #000000;font-size: 18px;}
.contacto .texto{text-align: center;padding:30px;}
.contacto .texto img{padding: 30px 0;}
.contacto .texto .linea{width: 100%;height: 3px;background-color: #a3a3a3;margin-top: 30px;}

.img_mapa{margin:30px auto;width: 55px;height: 50px;}
.img_mapa label{background: url(../img/d4_contacto2.png) 0px 0px no-repeat;width: 55px;height: 50px;margin-bottom: 0;}
.img_mapa label:hover{background-position: -55px 0px;width: 55px;height: 50px;}

#frm-contacto{margin-top: 60px;padding:30px;}
#frm-contacto input{border-top: 0;border-left: 0;border-right:0;border-bottom:2px solid #a3a3a3;box-shadow: inset 0 0px 0px rgba(0,0,0,.075);border-radius: 0;}
#frm-contacto textarea{border-top: 0;border-left: 0;border-right:0;border-bottom:2px solid #a3a3a3;box-shadow: inset 0 0px 0px rgba(0,0,0,.075);border-radius: 0;}
#frm-contacto button{border: 2px solid #ff0000;background-color: #FFFFFF;color: #ff0000;padding: 10px 15px;}
.redes{text-align: center;margin-top: 30px;}
.redes i{width: 40px;height: 40px;border-radius: 20px;background-color: #ff0000;color: #FFFFFF;font-size: 20px;padding-top: 10px;}
.help-block{color: #ff0000 !important;}

footer{background-color: #ff0000;color: #FFFFFF;text-align: center;padding: 5px 0;}

@media only screen and (max-height: 1024px){
	.proyectos {padding:80px 0;overflow: hidden;}
	.sobre_nosotros {padding:120px 0;overflow: hidden;}
	.contacto{padding:120px 0;overflow: hidden;}
	.publicaciones {padding:120px 0;overflow: hidden;}
}

@media only screen and (max-height: 768px){
	.logotipo {width: 150px;padding-top: 30px;}
	.proyectos {padding:40px 0;overflow: hidden;}
	.sobre_nosotros {padding:40px 0;overflow: hidden;}
	.contacto{padding:120px 0;overflow: hidden;}
}

@media only screen and (min-width: 2560px){

}

@media only screen and (max-width: 1440px){
	/*.proyectos {padding:0;overflow: hidden;}*/

}

@media only screen and (max-width: 1366px){

}

@media only screen and (max-width: 1024px){
	.proyectos .listado .item{height: 293px;}
	.proyectos .listado .item img {padding-top: calc(50% - 100px);}
	.contacto .imagen img{width: 100%;}
}
@media only screen and (max-width: 768px){
	.menu{right: 20px;}
	.menu.active{width: 95%;}
	.f_eng{right: 100px;}
	.menu .menuContent ul li{margin: 0 10px;}
  .proyectos .listado .item img {padding-top: calc(50% - 95px);}
	.proyectos .listado .item {height: 340px;}
}

@media only screen and (max-width: 479px){
	.contacto .texto{padding:10px;}
	#frm-contacto{margin-top: 30px;padding:10px;}
  .contacto{background: none;}

  .reconocimientos{width: 100%;height:200px;background-size: 150%;}
  .reconocimientos:hover{width: 100%;height:200px;}
  .reconocimientos.capa.activo {background-size: 150%;}

  .publicacioness{width: 100%;height:200px;background-size: 150%;}
  .publicacioness:hover{width: 100%;height:200px;}
  .publicacioness.capa.activo {background-size: 150%;}

  .logo {float: none;}
  .menu.active{height: 220px;}
  .menu .menuContent ul li{display: block;}
  .menu .menuContent{line-height: 25px;}
  .f_eng{font-size: 14px;}
  .f_eng span i {width: 30px;height: 30px;padding-left: 10px;}
  .logotipo {width: 100px;padding-top: 40px;}

  .sobre_nosotros .listado .item .icono {padding-bottom: 10px;}

  .publicaciones .listado .item .rojo{background-color: rgba(255,0,0,0); -webkit-transition: all 0.5s,;transition: all 0.5s;}
  .publicaciones .listado .item .bottom{opacity: 1;}
}