* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  padding-top: 100px;
  color: rgb(75, 75, 75);
  text-align: justify;
  font-family: "EB Garamond", serif;
}

p {
  font-size: 18px;
}

h6 {
  font-weight: bold;
}

a {
  color: #000;
  text-decoration: none;
}

.hide-mobile {
  display: block;
}

.show-mobile {
  display: none;
}

.w-1100 {
  width: 1100px;
  margin: auto;
}

hr {
  margin: 0;
}

#navbar-section {
  position: fixed;
  top: 0;
  background-color: #fff;
  width: 100%;
  z-index: 99999;
}

.navbar-bottom-hr {
  margin-bottom: 50px;
}

#navbar-section .top-navbar {
  height: 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  text-align: center;
}

#navbar-section .nav-logo {
  margin: auto 0;
}

.navbar-company-name {
  font-family: "EB Garamond", serif;
  padding-top: 20px;
  margin: auto 0;
}

.navbar-company-name h5 {
  font-size: 28px;
}

#navbar-section .easy-contact {
  padding: 10px;
  font-size: 14px;
  margin: auto 0;
}

#navbar-section .easy-contact a {
  margin-right: 20px;
  color: rgba(0, 0, 0, 0.5);
}

#navbar-section .easy-contact a:hover {
  color: #000;
}

#navbar-section #navbarNav {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

#navbar-section #navbarNav .nav-item {
  margin-right: 20px;
}

.dropdown-menu {
  font-size: 14px;
  padding: 20 px 0 px;
}

.dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0px;
}

#landing-section {
  background-image: url("../images/banner-Crane-and-Pipe-Kinder-Morgan.jpg");
  min-height: 78vh;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
}

#landing-section .landing-text {
  color: #fff;
  text-align: center;
}

#landing-section .landing-text h1 {
  font-size: 150px;
  text-shadow: 0 0 15px rgba(0, 0, 0, 0.521);
}

#landing-section .landing-text .landing-hr {
  background-color: #000;
  height: 2px;
  opacity: 1;
}

#landing-section .landing-text p {
  font-size: 50px;
}

#company-overview-section {
  margin: 60px auto;
}

#company-overview-section .company-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1fr;
  grid-template-rows: 1fr;
  -ms-grid-columns: (1fr) [3];
  grid-template-columns: repeat(3, 1fr);
  /* min-height: 100vh; */
}

#company-overview-section .company-grid > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

#company-overview-section .company-grid > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}

#company-overview-section .company-grid > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

#company-overview-section .overview-img,
.projects-img,
.values-img {
  height: 60px;
  width: 60px;
  border-radius: 50%;
  background-color: #000;
  color: #fff;
  padding: 17px 0;
  margin: 20px auto;
  text-align: center;
}

#company-overview-section .overview h2,
.projects h2,
.values h2 {
  text-align: center;
}

#company-overview-section .overview-para {
  min-height: 600px;
  margin: 20px 0;
  color: rgba(88, 88, 88, 0.863);
  padding: 0 25px;
  text-align: justify;
}

#company-overview-section .overview-para li {
  margin-bottom: 15px;
}

#company-overview-section .fas {
  font-size: 25px;
}

.company-btn {
  text-align: center;
}

.company-btn a {
  background-color: #000;
  color: #fff;
  padding: 10px;
  -webkit-transition: 250ms ease-in-out;
  -o-transition: 250ms ease-in-out;
  transition: 250ms ease-in-out;
  border-radius: 5px;
  font-size: 16px;
}

.company-btn a:hover {
  background-color: rgb(204, 204, 204);
  color: #000;
}

#ceo-message-section {
  margin: auto;
}

#ceo-message-section .ceo-message-intro h1 {
  margin-bottom: 40px;
}

#ceo-message-section .ceo-message-intro h1::before,
#ceo-message-section .ceo-message-intro h1::after,
#clients-page .clients-intro h1::before,
#clients-page .clients-intro h1::after,
#profile-section .profile-intro h1::before,
#profile-section .profile-intro h1::after,
#engineering-services-page .engineering-services-intro h1::before,
#engineering-services-page .engineering-services-intro h1::after,
#procurement-services-page .procurement-services-intro h1::before,
#procurement-services-page .procurement-services-intro h1::after,
#construction-services-page .construction-services-intro h1::before,
#construction-services-page .construction-services-intro h1::after,
#quality-page .quality-intro h1::before,
#quality-page .quality-intro h1::after,
#hse-page .hse-intro h1::before,
#hse-page .hse-intro h1::after,
#completed-projects-page .completed-projects-intro h1::before,
#completed-projects-page .completed-projects-intro h1::after,
#ongoing-projects-page .ongoing-projects-intro h1::before,
#ongoing-projects-page .ongoing-projects-intro h1::after,
#resources-page .resources-intro h1::before,
#resources-page .resources-intro h1::after,
#organization-page .organization-page-intro h1::before,
#organization-page .organization-page-intro h1::after,
#contact-us-page .contact-us-intro h1::before,
#contact-us-page .contact-us-intro h1::after {
  content: "";
  height: 8px;
  width: 40px;
  background-color: rgb(114, 114, 114);
  display: inline-block;
  vertical-align: middle;
  margin: 0 15px;
  border-radius: 20px;
}

#ceo-message-section .ceo-message-para {
  margin-bottom: 40px;
  text-align: justify;
}

#ceo-message-section .ceo-message-para p {
  margin-bottom: 20px;
}

#footer-section {
  background-color: #000;
  color: #fff;
}

/* #footer-section .pages-list,
.contact-us,
.map {
  margin-top: 50px;
} */

#footer-section .pages {
  padding-left: 30px;
}

#footer-section .pages-list li {
  list-style: none;
  font-size: 14px;
}

#footer-section .contact-us {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: end;
}

#footer-section .pages-list li a,
.contact-details a {
  color: #fff;
  -webkit-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
}

#footer-section .pages-list li a:hover,
#footer-section .contact-details a:hover {
  color: rgb(117, 117, 117);
}

.mail-img a,
.call-img a {
  color: #fff;
}

.call-img,
.mail-img,
.location-img {
  padding: 10px;
}

.contact-details {
  font-size: 14px;
}

.contact-img {
  font-size: 20px;
  padding-right: 10px;
  vertical-align: middle;
}

.copyright-section p {
  margin: 0;
  padding: 12px;
  font-size: 14px;
}

/* CEO MESSAGE PAGE */

#ceo-message-page,
#organization-page {
  min-height: 77vh;
  margin: auto;
}

#ceo-message-page .ceo-message-intro h1::before,
#ceo-message-page .ceo-message-intro h1::after {
  content: "";
  height: 8px;
  width: 40px;
  background-color: rgb(114, 114, 114);
  display: inline-block;
  vertical-align: middle;
  margin: 0 15px;
  border-radius: 20px;
}

#ceo-message-page .ceo-message-para {
  margin-bottom: 40px;
  text-align: justify;
}

#ceo-message-page .ceo-message-para p {
  margin-bottom: 20px;
  /* font-size: 20px; */
}

/* CLIENTS PAGE */

#clients-page {
  min-height: 77vh;
  margin: auto;
}

#clients-page .clients-intro h1 {
  text-align: center;
  /* margin: 50px; */
}

#clients-page .slick-track {
  margin-bottom: 30px;
}

#clients-page #clients-img img {
  width: 150px !important;
  margin: 0 20px !important;
}

/* PROFILE-PAGE */

#profile-section .profile-intro h1 {
  text-align: center;
  margin: 50px 0;
}

/* ENGINEERING-SERVICES-PAGE */

#engineering-services-page {
  min-height: 77vh;
}

#engineering-services-page .detail-design-wrapper {
  margin: 50px 0;
}

.detail-design-wrapper ul {
  padding-left: 15px;
}

.detail-design-wrapper ul li {
  margin-bottom: 10px;
  text-align: justify;
}

/* PROCUREMENT-SERVICES-PAGE */

#procurement-services-page {
  min-height: 77vh;
}

/* CONSTRUCTION-SERVICES-PAGE  */

#construction-services-page {
  min-height: 77vh;
}

/* QUALITY-PAGE */
#quality-page {
  min-height: 77vh;
}

#quality-page .quality-content {
  text-align: justify;
}

#ceo-message-section .ceo-message-intro,
#ceo-message-section .ceo-message-intro,
#clients-page .clients-intro,
#clients-page .clients-intro,
#profile-section .profile-intro,
#profile-section .profile-intro,
#ceo-message-page .ceo-message-intro,
#ceo-message-page .ceo-message-intro,
#engineering-services-page .engineering-services-intro,
#engineering-services-page .engineering-services-intro,
#procurement-services-page .procurement-services-intro,
#procurement-services-page .procurement-services-intro,
#construction-services-page .construction-services-intro,
#construction-services-page .construction-services-intro,
#quality-page .quality-intro,
#quality-page .quality-intro,
#hse-page .hse-intro,
#hse-page .hse-intro,
#completed-projects-page .completed-projects-intro,
#completed-projects-page .completed-projects-intro,
#ongoing-projects-page .ongoing-projects-intro,
#ongoing-projects-page .ongoing-projects-intro,
#resources-page .resources-intro,
#resources-page .resources-intro,
#organization-page .organization-page-intro,
#organization-page .organization-page-intro,
#contact-us-page .contact-us-intro,
#contact-us-page .contact-us-intro {
  text-align: center;
}

/* HSE PAGE */

#hse-page {
  text-align: justify;
}

#hse-page ul {
  padding-left: 15px;
}

/* COMPLETED-PAGE */

/* RESOURCES PAGE */

#resources-page .accordion {
  margin: 50px auto;
}

#resources-page .accordion-button {
  font-size: 22px;
}

#resources-page .accordion-button:focus {
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.accordion-button:not(.collapsed) {
  color: #000;
  background-color: #80808025;
}

.table {
  margin-top: 50px;
  border-color: #cdd0d37d;
  text-align: left !important;
}

.project-table {
  text-align: center;
}

.table .project-table-body .body-content {
  vertical-align: middle;
  text-align: center !important;
}

.table .project-table-body .body-content p {
  text-align: justify;
  font-size: 16px;
}

.table-head {
  text-align: center;
}

/* CONTACT US */

#contact-us-page {
  min-height: 100vh;
}

.input-field {
  margin-bottom: 30px;
}

.form-style {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid #000;
}

#submit-btn {
  background-color: #000;
  color: #fff;
  padding: 10px 28px;
  border: none;
  -webkit-transition: 200ms ease-in-out;
  -o-transition: 200ms ease-in-out;
  transition: 200ms ease-in-out;
}

#submit-btn:hover {
  background-color: rgba(0, 0, 0, 0.521);
}

.contact-details .contact-address {
  display: inline-block;
  vertical-align: top;
}

.contact-details p {
  font-size: 16px;
}

.contact-details address {
  width: 55%;
  display: inline-block;
  text-align: justify;
  margin-left: 20px;
}

.contact-details .email-details {
  margin-left: 130px;
}

.contact-details .number-details {
  margin-left: 16px;
}

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

.number-details a,
.email-details a {
  color: #000;
}

/* MEDIA QUERIES */

@media (max-width: 1025px) {
  .w-1100 {
    width: 980px;
    margin: auto;
  }
}

@media (max-width: 950px) {
  .w-1100 {
    width: 100%;
    margin: auto;
  }
}

@media (max-width: 769px) {
  .w-1100 {
    width: 100%;
    margin: auto;
  }

  .show-mobile {
    display: block;
  }

  .hide-mobile {
    display: none;
  }

  #company-overview-section .company-grid {
    -ms-grid-rows: 1fr 50px 1fr 50px 1fr;
    grid-template-rows: repeat(3, 1fr);
    -ms-grid-columns: 1fr;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 50px;
  }

  #company-overview-section .company-grid > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }

  #company-overview-section .company-grid > *:nth-child(2) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }

  #company-overview-section .company-grid > *:nth-child(3) {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }

  #company-overview-section .overview-para {
    min-height: 350px;
  }

  .copyright-section p {
    text-align: center;
  }

  #footer-section .contact-us {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  #contact-us-page .contact-text {
    margin-top: 50px;
  }
}

@media (max-width: 426px) {
  .navbar-brand img {
    width: 150px;
  }

  #landing-section {
    min-height: 52vh;
  }

  .navbar-company-name h5 {
    font-size: 18px;
  }
}

@media (max-width: 380px) {
  #ceo-message-section .ceo-message-intro h1,
  #ceo-message-section .ceo-message-intro h1,
  #clients-page .clients-intro h1,
  #clients-page .clients-intro h1,
  #profile-section .profile-intro h1,
  #profile-section .profile-intro h1,
  #ceo-message-page .ceo-message-intro h1,
  #ceo-message-page .ceo-message-intro h1,
  #engineering-services-page .engineering-services-intro h1,
  #engineering-services-page .engineering-services-intro h1,
  #procurement-services-page .procurement-services-intro h1,
  #procurement-services-page .procurement-services-intro h1,
  #construction-services-page .construction-services-intro h1,
  #construction-services-page .construction-services-intro h1,
  #quality-page .quality-intro h1,
  #quality-page .quality-intro h1,
  #hse-page .hse-intro h1,
  #hse-page .hse-intro h1,
  #completed-projects-page .completed-projects-intro h1,
  #completed-projects-page .completed-projects-intro h1,
  #ongoing-projects-page .ongoing-projects-intro h1,
  #ongoing-projects-page .ongoing-projects-intro h1,
  #resources-page .resources-intro h1,
  #resources-page .resources-intro h1,
  #organization-page .organization-page-intro h1,
  #organization-page .organization-page-intro h1,
  #contact-us-page .contact-us-intro h1,
  #contact-us-page .contact-us-intro h1 {
    font-size: 21px;
  }

  #footer-section .contact-us {
    display: block;
    text-align: center;
  }
}

@media (max-width: 330px) {
  #ceo-message-section .ceo-message-intro h1,
  #ceo-message-section .ceo-message-intro h1,
  #clients-page .clients-intro h1,
  #clients-page .clients-intro h1,
  #profile-section .profile-intro h1,
  #profile-section .profile-intro h1,
  #ceo-message-page .ceo-message-intro h1,
  #ceo-message-page .ceo-message-intro h1,
  #engineering-services-page .engineering-services-intro h1,
  #engineering-services-page .engineering-services-intro h1,
  #procurement-services-page .procurement-services-intro h1,
  #procurement-services-page .procurement-services-intro h1,
  #construction-services-page .construction-services-intro h1,
  #construction-services-page .construction-services-intro h1,
  #quality-page .quality-intro h1,
  #quality-page .quality-intro h1,
  #hse-page .hse-intro h1,
  #hse-page .hse-intro h1,
  #completed-projects-page .completed-projects-intro h1,
  #completed-projects-page .completed-projects-intro h1,
  #ongoing-projects-page .ongoing-projects-intro h1,
  #ongoing-projects-page .ongoing-projects-intro h1,
  #resources-page .resources-intro h1,
  #resources-page .resources-intro h1,
  #organization-page .organization-page-intro h1,
  #organization-page .organization-page-intro h1,
  #contact-us-page .contact-us-intro h1,
  #contact-us-page .contact-us-intro h1 {
    font-size: 16px;
  }
}