.navbar-brand{
display: none !important;
}
#fh5co-header.navbar-fixed-top .navbar-brand{
display: block !important;
}




#fh5co-header.navbar-fixed-top .nav{
  margin-top: 23px;
}
#inicio{
    height: 600px;
  

}

#edificio{
  position: absolute;
  right: 12%;
  bottom:-120px;
  z-index: 2;
}

#marco{
  background-image: url(../images/marco.png);
  width: 100%;
  height: 600px;
  position: absolute;
  z-index: 3;
  top: 0;
  left:0;
  background-size: 100% 100%;
}

#contacto{
  padding-top: 5em;
    background-repeat: no-repeat;
    background-position: left 20% bottom -30px; 
    padding-bottom: 7em;
  position: relative;
  overflow: hidden;
  z-index: 30;
}
#edificio-gris{
  position: absolute;
  bottom:-300px;
  left:20px;
  z-index: -2;
}
#forms{
  position: relative
}
#linea-roja{
  background: red;
  width:1px;
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
}

#backto{
  width: 100px;
  height: 70px;
  position: fixed;
  bottom: 40px;
  right: -200px;
  transition: all ease 500ms;
  cursor: pointer;
}

#backto p{
  display: block;
  text-align: center;
  line-height: 11px;
  color:#444;
  font-size:12px;
}
#backto p .glyphicon{
  font-size: 12px;
  color:#999;
}

.toTop{
  right: 0px !important;

}

.rojo{
  color:red;
}

.texto-intro{
  color:white;
  margin-top: 30vh;
  border-top: 2px solid white;
  font-size: 19px;
  line-height: 20px;
  padding-top: 10px;
}

.verProyecto {
  font-size: 16px;
  top: 60%;
  position: absolute;
  margin: auto;
  width: 30%;
  text-align: center;
  left: 35%;
  color: #fff;
  font-weight: bold;
}

#servicios{
  // padding-top: 5em;
  overflow: hidden;
}
#barra{
  background: #aaced9;
  position: relative;
  height: auto;

}
#blank{
  height: 60px;
}
#barra h2{
  color:white;
  text-align: center;
      margin-bottom: 40px;
}
#barra p{
  color:#52565b;
  line-height: 24px;
}
#barra-left{
    background: #aaced9;
    position: absolute;
    left: -600px;
    width: 600px;
    height: 100%;
    z-index: -1;
}
#barra-right{
  background: #aaced9;
  position: absolute;
  right: -600px;
  width: 600px;
  height: 100%;
  z-index: -1;

}
#somos{
  padding-top:30px;
  padding-bottom: 30px; 
  }
#mision{
  padding-top: 100px;
}

#mision p{
color: #5eb7d2;
}



h3{
  text-align: center;
  border-bottom:1px solid #aaa;
  margin-bottom: 30px;
      padding: 30px;
}


h3:after, .servicio-text:after {
  content: " //";
  color: #ee1e38;
}
#img1{
      position: absolute;
    right: 0;
    top: -30px;
}
#m{position: relative;}
.red-left{ border-left:1px solid #ee1e38;}
.red-right{ border-right:1px solid #ee1e38;}
#red-right{
  width: 1px;
  position: absolute;
  right: -90px;
  height: 100%;
  background: #ee1e38;
}

.servicios-holders{
    width: 100%;
    height: 320px;
    margin: 20px 0;
    background-position: center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.servicios-holders a {
  text-decoration: none; 
}



.servicio-text{
    position: absolute;
    z-index: 5;
    color: #fff;
    font-weight: bold;
    font-size: 25px;
    line-height: 25px;
    width: 225px;
    display: block;
    margin: 0;
    top: 190px;
    opacity: 0;
    left: 70px;
    transition:all ease 400ms;
    -webkit-transition-delay: 100ms; 
    transition-delay: 100ms;    
}

.servicios-holders:hover .marco1{
  height: 90%;
  width: 90%;
}
.servicios-holders:hover .marco2{
  width: 90%;
  height: 90%;
}
.servicios-holders:hover .over{
 opacity: 0.9;
}
.servicios-holders:hover .servicio-text{
  top: 130px;
  opacity: 1;

}
.over{
    background: #aaced9;
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    transition: all ease 900ms;
}
.servicio-text{
  position: relative;
  z-index: 5;
  color:#fff
}

.marcos{
top: 5%;
left: 5%;
z-index:3;
position: absolute;
 transition: all ease 600ms;
}

#serv1{ background-image: url(../images/proyectos/1_Adolfo_Lopez/fondo.jpg)}
#serv2{ background-image: url(../images/proyectos/2_Alta_Especialidad_Zumpango/imagen2.jpg)}
#serv3{ background-image: url(../images/proyectos/1_Adolfo_Lopez/fondo.jpg)}
#serv4{ background-image: url(../images/proyectos/4_Unitec_Leon/galeria2.jpg)}
#serv5{ background-image: url(../images/proyectos/5_Unitec_Toluca/galeria6.jpg)}



#servicios{
  padding-top: 5em;
  padding-bottom: 5em;
  background: #fafafa;
}

#joydivision{
    background-image: url(../images/edificio.jpg);
    height: 110px;
    background-position: center bottom;
    background-repeat: no-repeat;
    position: relative;
        margin-top: -130px;
}
#joydivision .redrum{
    background: #ee1e38;
    width: 20px;
    height: 50px;
    position: absolute;
  bottom: 0;
  left:0;
}

#formulario input , #formulario textarea{
  width: 100%;
  border:1px solid rgb(94, 183, 210);
  padding: 17px 20px;
  margin-bottom: 20px;
}

#forms{
  margin-bottom: 40px;
  padding-bottom: 50px;
}
.boton{
  background: #5eb7d2;
  border:none;
  color:white;
  padding: 10px; 40px;
  width: 200px;
  display: block;
  margin: 0 auto;
  cursor:pointer;
  letter-spacing: 1px;
}
.boton:hover{
  color:#fff;
  text-decoration: none;
}

#footer-image{
 float: right;
 margin: 0px 10px;
}

#bloque-derecho{
  background: #ee1e38;
  width: 25px;
  height: 60px;
  position: absolute;
  top: 0;
  right: 0;
  display: block;
}

footer{
  background: #5eb7d2;
}
#footer p{
  color:white;
  font-size: 14px;
  /*margin: 40px !important;*/
  text-align: center !important;
}

.powered a{
  font-weight: bold;
  color:white
}

.powered{
  text-align: right;
}

#puente{
  position: absolute;
  right:-230px;
  top: 0px;
  width: 800px;
  transition:all ease 2000ms;
}
#grua{
    position: absolute;
  left:0;
  bottom: 0px;
  width: 800px;
  transition:all ease 2000ms;
}  
.muevete{
  margin-left:-300px;
}
.muevete2{
  margin-right:-300px;
}

.nav li a{
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    cursor: pointer;
    background: #fff;
    color:#333 !important;
}

.nav li.current a{
    background: #67bed2 !important;
    color: white !important;
    z-index: 2;
}

.nav li.current a:hover{
   background: #67bed2 !important;
}

.nav li.current a:before{
    content:"\A";
    border-style: solid;
    border-width: 0px 25px 52px 0px;
    border-color: transparent #67bed2 transparent transparent;
    position: absolute;
    left: -24px;
    top: 0px;
}

.nav li:last-child a:after{
    content:"\A";
    border-style: solid;
    border-width: 0px 25px 52px 0px;
    border-color: transparent transparent #fff transparent;
    position: absolute;
    right: -24px;
    top: 0px;
}

.nav.not-index li:first-child a:after{
    content:"\A";
    border-style: solid;
    border-width: 0px 25px 52px 0px;
    border-color: transparent #fff transparent transparent;
    position: absolute;
    left: -24px;
    top: 0px;
    text-align: left;
}




.nav li.current a:after{
    content:"\A";
    border-style: solid;
    border-width: 0px 24px 52px 0px;
    border-color: transparent transparent #67bed2 transparent;
    position: absolute;
    right: -24px;
    top: 0px;
}

.navbar-fixed-top .teya-white{
  display: none !important;
}


#demo{
  background: #e6f7fc;
  overflow: hidden;
  min-height: 600px ;
   width: 100%;
   padding-top: 40px;
}

html, body{
  height: 100%;
}
#nosotros-card{
background: #52565b;
color:#fff;
    margin-top: -130px;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.17);
}

#nosotros-card h2{
  color:#fff;
}

#mision1{
  margin-top: 300px;
   transition:all ease 2000ms;
   opacity: 0;
}
#vision1{
  opacity: 0;
   transition:all ease 2000ms;
}

#mision1 h3, #vision1 h3{
  padding: 10px;
}


.aparece{
  margin-top:40px !important;
  opacity: 1 !important;
}

#servicio-titulo{
  background: #ddd url(../images/proyectos-fondo.jpg);
  background-size:cover;
}

#proyecto-titulo{
  background: #ddd url(../images/fondo3.jpg);
  background-size:cover;
}

.iconos-servicios{
  display: block;
  position: relative;
  margin-top: 50px;
  padding: 0px 35px;
}

.iconos-servicios a {
  color: grey;
} 
.iconos-servicios a:hover,
.iconos-servicios a:focus {
  color: #6daae4;
}

.iconos-servicios p {
text-align: center;
margin-top: 20px;
font-weight: bold;
}

.icono-categoria{
  display: block;
  margin: 0 auto;
  
}

#contacto-titulo{
  background: #ddd url(../images/fondo-contacto.jpg);
  background-size:cover;
  background-position: center top;
}
#eco-titulo{
  background: #ddd url(../images/fondo-eco.jpg);
  background-size:cover;
  background-position: center top;
}
#error-titulo{
  background: #ddd url(../images/404-bg.jpg);
  background-size:cover;
  background-position: center top;
}

#proyecto1-titulo {
  background: #ddd url(../images/proyectos/1_Adolfo_Lopez/fondo-proyecto1.jpg);
  background-size:cover;
  background-position: center;
}
#proyecto-toluca {
  background: #ddd url(../images/proyectos/5_Unitec_Toluca/portada4.jpg);
  background-size:cover;
  background-position: center;
}

#proyecto-leon {
  background: #ddd url(../images/proyectos/4_Unitec_Leon/portada1.jpg);
  background-size:cover;
  background-position: center;
}

#proyecto-ISEMYM {
  background: #ddd url(../images/proyectos/3_ISEMYM/portada.jpg);
  background-size:cover;
  background-position: center;
}

#proyecto2-titulo {
  background: #ddd url(../images/proyectos/2_Alta_Especialidad_Zumpango/fondo.jpg);
  background-size:cover;
  background-position: bottom;
}

.titulo-parallax{
  margin-top: 355px !important;
}
.parallaxParent {
		height: 450px;
		overflow: hidden;
}
.parallaxParent > * {
  height: 160%;
  position: relative;
  top: -100%;
}

#video-bicentenario{
  width: 100%;
}

.error404{
 padding-bottom: 180px !important;
}

#error-card{
background: #52565b;
    color: #fff;
    margin-top: -170px;
    padding-bottom: 70px;
    padding-top: 70px;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.17);
}

.not-found{
  font-size: 30px;
  letter-spacing: 2px;
}
.card{
      background: #f1f1f1;
    padding: 40px !important;
    box-shadow: 1px 6px 11px rgba(0, 0, 0, 0.1);
}

footer{
  background:#52565b;
  padding: 15px 15px;

}

footer a, footer p{
        color: #fff;
        font-size: 12px;
    }

footer a:hover{
  color: #f1f1f1;
}

.avisoProvacidad, .poweredBy{
  margin-top: 3%;
}

.chlogo{
    width: 120px;
}

#grupo{
  width: 50px;
display: block;
margin: 0 auto;
}

.go-right{
  float:right;
}

.boton-negro, .boton-negro:focus{
    /*border:2px solid white;*/
    border-radius:5px;
    color: white;
    padding:5px 10px;
    text-align: center;
    transition:all ease 600ms;
    width: 124px;
    display: block;
    margin-bottom: 20px;
}
/*.boton-negro:hover{
    background: #fff;
    color: #000
}*/


@media(max-width:1390px){
  #grua{
    width: 700px;
  }
  .muevete{
    margin-left: -230px;
  }
  #puente{
    width:700px;
  }

  .muevete2{
    margin-right: -300px;
  }
}
@media(max-width:1245px){
  .under-break {
    display: none;
  }
}
@media(max-width:1140px){
  #grua{
    width: 600px;
  }
  .muevete{
    margin-left: -230px;
  }
  #puente{
    width:800px;
  }

  .muevete2{
        margin-right: -470px;
  }
}

@media(max-width:991px){
  #backto, #grua, #puente{
    display: none;
  }
 #img1{
       width: 350px;
    top: 80px;
    right: 20px;
 }
 #img1 img{width: 100%;}
}
@media(max-width:767px){
  #footer-image{
    display: block;
    float: initial !important;
    margin: 0px;
  }
    #img1{
      position: initial;
      top:0;
      left:0;
      margin: 0 auto 60px;
      width: 90%;
    }
    .texto-intro{
          color: white;
    margin-top: 180px;
    border-top: 2px solid white;
    font-size: 19px;
    line-height: 20px;
    padding-top: 10px;
    width: 220px;
    margin-left: 70px;
    }
    #edificio{
      right: -100px;
    }
    .go-right{
          float: inherit;
    display: block;
    margin: 20px auto;
    width: 180px;
    text-align: center;
    }
    .underline-red:after {
      margin-left: -30px;
    }
    footer p{
        text-align: center!important;
      }
}
@media(max-width:600px){
  .texto-intro{
        margin-left: 30px;
  }
  #edificio-gris{
    display: none;
  }
  #nosotros-card{
        margin-top: -50px !important;
  }
  .parallaxParent {
    height: 290px;
    }
    .titulo-parallax {
    margin-top: 205px !important;
  }
}
#img-resp{
  display: none;
}
@media(max-width:550px){
  #inicio{
    display: none;
  }
  #img-resp{
    display: block;
        padding-top: 90px;
  }
  .overlay{
    opacity:1;
  }

}