/* ==========================================================================
   Author's custom styles
   ========================================================================== */
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,500');

p, h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto';
  font-weight: 300;
}
p {
  font-size: 16px;
  color: #545454;
}
h2 {
  font-size: 34px;
  color: #0e688e;
}
body {
  padding-bottom: 0;
  overflow-x:hidden;
}

/* NAVBAR Styles */
.navbar {
  padding-top: 15px;
  padding-bottom: 15px;
}
.navbar-default {
  background-color: #3d474f;
  background-image: none;
  border: none;
}
.navbar-brand img {
  width: 200px;
  margin-top: -5px;
}
.navbar-nav>li>a {
  text-shadow: none;
  font-size: 16px;
}
.navbar-default .navbar-nav>li>a {
  color: #ffffff;
  font-weight: 100;
  letter-spacing: 1px;
}
.navbar-default .navbar-nav>li>a:hover {
  color: #0aafdf;
}
.navbar-toggle {
  border-radius: 0;
}
a.anchor {
    display: block;
    position: relative;
    top: -140px;
    visibility: hidden;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #0e688e;
}

/* Background colors */

.darkblue-bg {
  background-color: #0e688e;
}
.lightblue-bg {
  background-color: #09acdc;
}
.gray-bg{
  background-color: #f7f7f7;
  border-top: 1px solid #efefef;
}
.dark-bg {
  background-color: #3d474f;
}

/* Padding styles */

.lg-padding {
  padding: 60px 0;
}
.sm-padding {
  padding: 40px 0 25px;
}
.xlg-padding {
  padding: 100px 20px;
}
.hero-padding {
  height: 500px;
}
.hero-padding h1 {
  margin-left: 100px;
  margin-right: 100px;
  padding-top: 150px;
  color: #ffffff;
  font-size: 45px;
  font-weight: 500;
  padding-bottom: 10px;
}
.hero-padding p {
  margin-left: 100px;
  margin-right: 100px;
  padding-bottom: 60px;
  color: #ffffff;
  font-size: 22px;
  line-height: 30px;
  font-weight: 100;
}

/* CUSTOM Heading styles */
h1.heading-white {
  color: #ffffff;
}
.about-section h2, .experience-section h2 {
  text-align: center;
  padding-bottom: 10px;
}
.about-section p, .experience-section p {
  text-align: center;
  padding-bottom: 10px;
}
.experience-section {
  padding-bottom: 30px;
}
.cta-section h4 {
  color: #ffffff;
  font-size: 24px;
  text-align: center;
  font-weight: 100;
  line-height: 30px;
}
.cta-section h4 a {
  color: #ffffff;
  text-decoration: underline;
}

/* SERVICES SECTION */
.card {
  display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    box-shadow: 0 0.3rem 2rem rgba(0,0,0,.20)!important;
    padding: 25px 30px 25px;
    margin-bottom: 30px;
}
.card-bg {
  background-color: #0e678e;
  border-radius: 3px;
}
.card h3 a {
  font-weight: 300;
  color: #ffffff;
}
.card h3 a:hover {
  color: #09acdc;
  text-decoration: none;
}
.card p {
  font-size: 14px;
  font-weight: 300;
  color: #ffffff;
}
.card .fas {
  font-size: 36px;
  color: #ffffff;
  padding-top: 20px;
}
.card h3, .card p, .card .fas {
  text-align: center;
}

/* BUTTON STYLING */
.btn-default {
  background-color: #ffffff;
  color: #0e688e;
  background-image: none;
  text-shadow: none;
  box-shadow: none;
  font-family: 'Roboto';
  font-weight: 300;
  border: none;
  padding: 15px 24px;
  border-radius: 3px;
  font-size: 16px;
  margin-top: 20px;
}
.btn-default:hover {
  background-color: #0e688e;
  color: #ffffff;
}


/* FOOTER STYLING */
.contact-info h4 {
  color: #ffffff;
  font-size: 20px;
}
.contact-info p, .contact-info a {
  color: #d6d6d6;
  font-size: 14px;
}
.copyright-footer p {
  text-align: center;
  font-size: 14px;
  color: #d6d6d6;
}
.copyright-section {
  border-top: 1px solid #565f67;
  padding: 20px 0 10px;
}

footer {
  background-color: #3d474f;
}

/* MOBILE STYLING */
@media screen and (max-width:768px) {
  .lg-padding {
    padding-right: 30px;
    padding-left: 30px;
  }
  .hero-padding {
    height: auto;
  }
  .hero-padding h1 {
    margin-left: 60px;
    margin-right: 60px;
    padding-top: 80px;
    padding-bottom: 5px;
    font-size: 35px;
  }
  .hero-padding p {
    margin-left: 60px;
    margin-right: 60px;
    padding-bottom: 60px;
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 0;
  }
  a.anchor {
      display: block;
      position: relative;
      top: -270px;
      visibility: hidden;
  }
  .container>.navbar-header {
    padding-bottom: 15px;
  }
  .navbar-default .navbar-nav>li>a {
    border-bottom: 1px solid #57616b;
  }
  .contact-info p {
    padding-bottom: 20px;
  }
  .cta-section h4 {
    font-size: 20px;
  }
}

@media screen and (max-width:1150px) and (min-width:769px) {
  .hero-padding h1 {
    margin-left: 60px;
    margin-right: 60px;
  }
  .hero-padding p {
    margin-left: 60px;
    margin-right: 60px;
  }
}

@media screen and (max-width:1150px) and (min-width:769px) {
  .hero-padding h1 {
    padding-top: 80px;
  }
}