/*----------------------- Style here -------------------------*/
body {
  font-family: "Montserrat", sans-serif;
}

p {
  font-size: 15px;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header .logo img {
  margin: 0px;
  max-height: 46px;
}

#header span {
  color: #00366f;
  text-decoration: none;
  font-size: 13px;
}

/*--------------------------------------------------------------
# Intro Section
--------------------------------------------------------------*/
#intro {
  background: url("../stsb_image/intro-bg3.png") center bottom no-repeat;
  background-size: cover;
  padding: 350px 0 300px 0;
}

#intro h2 {
  color: #fff;
  margin-bottom: 40px;
  font-size: 48px;
  font-weight: 700;
  padding: 1rem 1rem;
  background: linear-gradient(to bottom, rgba(22, 22, 22, 0.3) 0%, rgba(22, 22, 22, 0.3) 100%, #161616 100%);
}
#intro h3 {
  color: #fff;
  margin-bottom: 40px;
  font-size: 40px;
  font-weight: 700;
  padding: 1rem 1rem;
  background: linear-gradient(to bottom, rgba(22, 22, 22, 0.3) 0%, rgba(22, 22, 22, 0.3) 100%, #161616 100%);
}

@media (max-width: 767px) {
  #intro {
    background-size: cover;
  }

  #intro .container-fluid {
    float: none;
  }
}

/*---------------------------------------------------------------
# Capabilities Section
---------------------------------------------------------------*/
#capabilities .section-header p{
  width: 80%;
}

#capabilities .description {
  font-size: 15px;
}

/*--------------------------------------------------------------
# Client Section
--------------------------------------------------------------*/
#clients .clients-wrap {
  border-top: 1px solid #d6eaff;
  border-left: 1px solid #d6eaff;
  padding-top: 60px;
  padding-bottom: 60px;
}

#client .client-container .icon-box .description {
  font-size: 15px;
}

hr {
  margin: 30px 0;
}

/*--------------------------------------------------------------
# About Us Section
--------------------------------------------------------------*/
#about .box {
  padding: 30px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  margin: 0 10px 40px 10px;
  background: #fff;
  box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1);
  transition: all 0.3s ease-in-out;
}

#about .box:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}

#about .section-header p {
  width: 80%;
}

#about .about-item h3 {
  color: #003366;
}

#about .about-item h4 {
  color:#003366;
}

#about  p {
  color:#003366;
}

#about {
  background:  rgb(235, 235, 235);
}

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
#services {
  background: #ffffff;
}

#services .card {
  background: #003366;
  border-color: #003366;
}

#services .card:hover {
  background: #1e6cc0;
}

#services .card h5 {
  font-size: 20px;
}

#services .section-header p {
  width: 82%;
  padding-bottom: 35px;
  color:#003366;
}

#services .section-header h3 {
  color:#003366;
}

#services .card:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}

/*--------------------------------------------------------------
# Contact Us Section
--------------------------------------------------------------*/
#contact .mx-auto{
  width: 80%;
}

#contact .card{
  background-color: #003366;
}

#contact h5,#contact a,#contact {
  color: white;
}

#contact a:hover{
  color: #ffcc00
}

#contact .card:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  background: #1e6cc0;
  transition: all 0.4s;
}

.one-edge-shadow {
  box-shadow: 0px 8px 6px -6px rgba(0, 0, 0, 0.3);
}

#intro .intro-info {
  width: 100%;
  float: right;
}

#intro .text-color{
  color: white;
}
