
@font-face {
  font-family: Spinnaker;
  src: url(/font/Spinnaker-Regular.ttf);
}
.spinnaker{
  font-family: Spinnaker, sans-serif;
}
.color-q2{
  color: rgba(26,43,109);
 }
.bg-q2{
  background-color: rgba(26,43,109);
}
.bg-q2-g{
  background-color: rgb(242, 242, 242);
}

#main-info .main-banner{
  height: 534px; background-image: url(/images/aadc90_19126529fcaf469ea31d9d08c45680de_mv2.jpg); background-repeat: no-repeat; background-position: center;
}
.line-section{
  display: inline-block; 
  padding: 0;
  margin: 25px 0 10px 0;
  width: 100%;
}
.line-section div{
  float:left;
  height: 15px;
}
.customer{
  position: static;
  display: grid;
  height: auto;
  width: 100%;
  min-height: 396px;
  margin-top: -175px;
  grid-template-rows: 1fr;
  grid-template-columns: 100%;
}
.clase-form{
  color: white;
  outline: none;
  border-top: rgba(26,43,109) 2px solid;
  border-left: rgba(26,43,109) 2px solid;
  border-right: rgba(26,43,109) 2px solid;
  border-bottom: white 2px solid;
  background-color: transparent;
  width: 100%;
  padding: 7px;
}
.clase-form:hover{
  border: rgba(227,227,227) 2px solid;
}
.box-contact{
  width: 60%; 
  margin: 0 auto; 
  padding: 50px 60px 60px 60px;
}
.b-box-ourservice{
  border: #F2F2F2 solid 3px;
}

.b-box-services{
  text-align: center;
  border: #FFFFFF solid 3px;
}
.line-contact{
  width: 20%; border-bottom: rgba(26,43,109) solid 3px; float: left; margin-top: 50px;
}
.button-find{
  height: 50px;
  width: 180px;
  float: right;
  padding: 12px;
  text-align: center;
  color: white;
  text-decoration: none;
  transition: 0.3s;
}
.button-find:hover{
  background-color: red;
  color: white;
}
#find-us{
  margin-top: 70px;
}
#map {
  height: 370px;
}
#boxes-services{
  display: flex; height: auto; width: 100%;
}
#boxes-services .boxes{
  position: static;
  display: grid;
  height: auto;
  width: 100%;
  min-height: 396px;
  margin-top: -132px;
  grid-template-rows: 1fr;
  grid-template-columns: 100%;
}
.basic-info-contact{
  width: 90%; margin: 0 auto;margin-top: 100px;
}
.parallax {
  /* The image used */
  background-image: url("/images/aadc90_78e33ebfabf14797b181bffac4b30341_mv2.jpg");

  /* Set a specific height */
  min-height: 700px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
/*--------------
---About us-
--------------*/
.text-about{
  text-align: justify; 
}
.container-aboutus{
  position: static;
  display: grid;
  height: auto;
  width: 100%;
  min-height: 396px;
  margin-top: -175px;
  grid-template-rows: 1fr;
  grid-template-columns: 100%;
}
.text-permission{
  text-align: center; padding: 20px 50px; border: 6px rgba(26,43,109) solid;
}
.text-permission .code{
  font-weight: bold; font-size: 30px; padding: 20px; letter-spacing: 5px;
}
.text-permission .title-permission{
  font-weight: bold; font-size: 20px; font-style: italic; margin: 20px 10px;
}
.cert-AS9100D{
  margin-bottom: 10px;
}
.cert-AS9100D img{
  width: 100%;
}

/*--------------
---Services
--------------*/
.container-services{
  position: static;
  display: grid;
  height: auto;
  width: 100%;
  min-height: 396px;
  margin-top: -175px;
  grid-template-rows: 1fr;
  grid-template-columns: 100%;
}
.text-service{
  text-align: justify; 
}
.text-service div{
  text-align: justify; 
  line-height: 2rem;
}
.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal.active{
  transform: translateY(0);
  opacity: 1;
}
/*--------------
---Personal Work
--------------*/
#infopersonalwork{  
  margin: 0 auto;
  max-width: 400px;
  width: 100%;
}
#infopersonalwork .img-personalwork{
  text-align: center;
}
#infopersonalwork .img-personalwork img{
  width: 100%;
}
#infopersonalwork .info{
  margin-top: 3em;
  margin-bottom: 3em;
}
@media screen and (max-width:700px)
{
  #main-info .main-banner{
    height: 350px;
  }
  .customer{
  margin-top: -250px;
}
  .box-contact{
    width: 100%; 
  }
  .line-contact{
    display: none;
  }
  #find-us{
    margin-top: 40px;
  }
  #boxes-services .boxes{
    margin-top: -175px;
  }
  .basic-info-contact{
    width: 100%; margin-top: 50px;
  }
  .parallax {
    min-height: 300px;
  }
  /*--------------
---About us-
--------------*/
.container-aboutus{
  margin-top: -100px;
  }
  /*--------------
  ---Services
  --------------*/
  .container-services{
    margin-top: -120px;
  }
}
