/*!
 * Start Bootstrap - Full Slider (https://startbootstrap.com/template-overviews/full-slider)
 * Copyright 2013-2017 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-full-slider/blob/master/LICENSE)
 */

 @font-face {
     font-family: 'ABook';
     src: url(avenir/AveniBoo.otf);
 }
 @font-face {
     font-family: 'ALight';
     src: url(avenir/AveniLig.otf);
 }
 @font-face {
     font-family: 'AMed';
     src: url(avenir/AveniMed.otf);
 }

 @font-face {
     font-family: 'FBook';
     src: url(futura/FuturaPTBook.otf);
 }
 @font-face {
     font-family: 'FLight';
     src: url(futura/FuturaPTLight.otf);
 }
 @font-face {
     font-family: 'FMedium';
     src: url(futura/FuturaPTMedium.otf);
 }

body {
  font-family: 'ABook';
}

.whatsapp {
  position: fixed;
  right: 30px;
  bottom: 60px;
  cursor: pointer;
  z-index: 100;
}

#map {
  width: 100%;
  height: 500px;
}

#product-divider {
  background-color: #27384c;
}

#product-divider h3 {
  color:#FFF;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 13px;
  margin-top: 10px;
}

#product-list img {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}

#product-list .col-md-4 {
  margin-bottom: 20px;
}

.prodesc {
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  font-family: 'AMed';
}

.propara {
  font-size: 12px;
  margin-top: 0px;
  line-height: 20px;
}

.bg-light {
  background-color: rgba(255,255,255,0.9) !important;
  box-shadow: 2px 2px 5px #333;
}

.vertical-line {
  background-color: #fccf31;
  padding: 10px;
  padding-top: 15px;
  padding-bottom: 15px;
  color:#FFF;
  width: 350px;
  padding-left: 30px;
  margin-left: -125px;
}

.vertical-header-left {
  border-left: 3px solid #FFF;
  padding-left: 25px;
}
.vertical-header-left h3 {
  margin-top: 0 !important;
  margin-bottom: -5px !important;
}

.vertical-line-2 {
  background-color: #fccf31;
  padding: 10px;
  padding-top: 15px;
  padding-bottom: 15px;
  color:#FFF;
  width: 350px;
  padding-right: 30px;
  margin-left: 325px;
  position: relative;
  z-index: 2;
}

.vertical-header-right {
  border-right: 3px solid #FFF;
  padding-right: 25px;
  text-align: right;
  height: 50px;
}
.vertical-header-right h3 {
  margin-top: 0 !important;
  margin-bottom: -5px !important;
}

.carousel-item {
  height: 100vh;
  min-height: 300px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.nav-link {
  font-size: 12px;
  margin-left: 20px;
  color:#283f52;
  font-weight: 600;
  letter-spacing: 1px;
}

.navbar {
  border-top: 6px solid #283f52;
  color: #283f52;
}
.navbar-toggler {
  border: none;
  outline: none !important;
  cursor: pointer;
}
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,102,203, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.carousel-caption {
  top: 43%;
  left: 11.5% !important;
  text-align: left;
  left: auto;
  padding:5px;
}

.carousel-caption p {
  text-transform: uppercase;
  font-size: 17px;
  font-family: 'AMed';
  letter-spacing: 1px;
  line-height: 28px;
}

.carousel-caption h1 {
  text-transform: uppercase;
  letter-spacing: 1px;
}

.carousel-caption hr {
  width:100px;
  border:none;
  border-bottom:5px solid #ffd03d;
  margin-left:0
}

.hist-box {
  background-color: #eaeaea;
  padding: 30px;
  height: 250px;
  margin-bottom: 25px;
}

.hist-box p {
  color: #283f52;
  font-size: 13px;
  text-align: center;
}

.hist-box h3 {
  color: #283f52;
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.hist-box:hover {
  background-color: #ffd03d;
  transition: 0.5s;
}

.hist-box:hover > img {
  filter: brightness(0) invert(1);
  transition: 0.3s;
}

.hist-box:hover > p, .hist-box:hover > h3 {
  color:#FFF;
  transition: 0.3s;
}

#about {
  background: url('../slice/1b_history_BG.jpg') no-repeat top center;
  background-size: cover;
}

#about .about-para {
  font-size: 13px;
  line-height: 27px;
  margin-top: 25px;
  text-align: justify;
  padding: 10px;
}

#products {
  background: url('../slice/1b_history_BG.jpg') no-repeat top center;
  background-size: cover;
}

#products .para {
  font-size: 13px !important;
  line-height: 23px;
  margin-top: 25px;
  text-align: right;
  padding: 10px;
}

#product-list {
  line-height: 28px;
}
#product-list h5 {
  text-transform: uppercase;
  font-size: 14px;
  font-family: 'AMed';
  color: #555;
  margin-top: 0;
  margin-bottom: 5px;
  letter-spacing: 1px;
}
#product-list h4 {
  text-transform: uppercase;
  font-size: 17px;
  font-family: 'AMed';
  color: #555;
  margin-top: 0;
  margin-bottom: 15px;
  letter-spacing: 1px;
}

#product-list a {
  font-size: 12px;
  color: #333;
}

#product-list hr {
  width: 40px;
  border:none;
  border-bottom: 3px solid #3a4b5b;
  margin-left: 0;
  margin-bottom: 10px;
  margin-top: 10px;
}

.product-desc {
  font-size: 13px;
  line-height: 25px;
}

#services {
  background: url('../slice/1c_services_BG.jpg') no-repeat top center;
  background-size: cover;
  min-height: 650px;
  padding-top: 100px;
  padding-bottom: 50px;
}

#services .hd {
  text-align: right;
  color: #FFF;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 300;
  font-size: 18px !important;
}

#services .para {
  text-align: right;
  color: #FFF;
  font-size: 13px;
  font-weight: 300;
  line-height: 27px;
}

#services hr {
  width:50px;
  border:none;
  border-bottom:3px solid #ffd03d;
  margin-right:0
}

#projects {
  background: url('../slice/1e_BG_project.png') no-repeat top center;
  background-size: cover;
  min-height: 750px;
  padding-top: 50px;
  padding-bottom: 50px;
}

.view-contact {
  text-align: right;
}
.btn-view {
  background-color: #fccf31;
  border-radius: 0;
  margin-top: 50px;
  padding-left: 25px;
  padding-right: 25px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 1px;
  cursor: pointer;
}

.btn-view:hover {
  opacity: 0.8;
  transition: 0.5s;
}

.project-para {
  font-size: 13px;
  line-height: 27px;
  margin-top: 167px;
  text-align: justify;
  padding: 10px;
}

.project-paraf {
  font-size: 13px;
  line-height: 27px;
  margin-top: 22px;
  text-align: justify;
  padding: 10px;
}

.project-header {
  color: #283f52;
  font-weight:600;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 33px;
  margin-top: 30px;
  line-height: 45px;
}

footer {
  min-height: 550px;
  background: url('../slice/1f_footer_BG.jpg') no-repeat top center;
  background-size: cover;
}

.ft-head {
  text-transform: uppercase;
  color:#FFF;
  font-size: 14px;
}
.ft-body {
  width: 100%;
  color:#FFF;
  font-size: 12px;
}
.ft-body td {
  padding-top: 5px;
  padding-bottom: 5px;
}

.ft-header {
  text-transform: uppercase;
  color:#FFF;
  font-size: 25px;
  margin-top: 60px;
}
#form-contact input[type=text] {
  background: none;
  border: none;
  border-radius: 0;
  border-bottom :1px solid #FFF;
  font-size: 12px;
  outline: none !important;
  padding-left: 1px;
  color:#FFF;
  margin-top: 10px;
}
#form-contact textarea {
  background: none;
  border: none;
  border-radius: 0;
  border-bottom :1px solid #FFF;
  font-size: 12px;
  outline: none !important;
  padding-left: 1px;
  color:#FFF;
  margin-top: 10px;
  resize: none;
}

#form-contact button {
  border:1px solid #FFF;
  background: none;
  color:#FFF;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 0;
  cursor: pointer;
  padding-left: 20px;
  padding-right: 20px;
}

#form-contact button:hover {
  background-color: #FFF;
  color: #283f52;
}

.copyright {
  font-size: 11px;
  color:#000;
  padding-top: 15px;
  padding-bottom: 15px;
}

.copyright a {
  color:#283f52;
}
.copyright a:hover {
  opacity: 0.8;
  transition: 0.5s;
}


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

  #about .about-para {
    font-size: 13px;
    line-height: 27px;
    margin-top: 20px;
    text-align: justify;
  }

  .vertical-line {
    margin-left: 0;
    width: 100%
  }

  .vertical-line-2 {
    margin-left: 0;
    width: 100%
  }

  .project-para {
    margin-top: 0px;
  }

  .view-contact {
    text-align: center;
  }

  .btn-view {
    margin-top: 5px
  }

}
