/*global css*/
body {
  font-family: 'Poppins', sans-serif !important;
}

a {
  color: #92c45c !important;
}

.container-fluid {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

/*logo bar*/

.full-length-container-navbar {
  background-color: #02375f;
}

.logobar {
  text-align: center;
  padding:10px;
}

.navy-letters {
  color: #003366;
  font-size:33px;
  font-weight:bold;
}

.navy-letters a{
  color: #02375f !important;
  text-decoration: none !important;
}

.lightgray-lettering {
  color: lightgray;
  font-size: 20px;
}

.smaller-size {
  font-size: 20px;
}

a:hover {
  cursor:pointer !important;
}

/*hamburger css*/

#toggle-button {
  outline: none;
  border: none !important;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
  box-shadow: none !important;
}

#nav-icon3 {
  width: 60px;
  height: 45px;
  position: relative;
  margin: 50px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 6px;
  width: 75%;
  background: #4d738f;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) {
  top: 0px;
}

#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 12px;
}

#nav-icon3 span:nth-child(4) {
  top: 24px;
}

#nav-icon3.open span:nth-child(1) {
  top: 12px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}

/*navigation menu*/

.navbar {
  background: #003a63;
  padding: 0px 0 !important;
}

.navbar ul{
  margin: auto;
}

.nav-link{
  text-align: center;
  color:#fff !important;
  text-decoration: none;
  padding-left: 40px !important;
  padding-right: 40px !important;
  font-size: 18px;
}

.nav-link:hover{
  color: #92c45c  !important;
}

div.dropdown-menu{
  border-top: 2px solid #92c45c !important;
  left: 50%;
  right: auto;
  text-align: center;
  transform: translate(-50%, 0);
}

.dropdown-menu {
  border-radius: 0 !important;
  border: 0 !important;
  color: white !important;
}

.dropdown-menu a{
  color: #02375f !important;
}

.dropdown-menu a:hover {
  color: gray !important;
}

.dropdown-menu a:active {
  background-color: #92c45c  !important;
  color: !important;
}
/*more navigation css under mobile media query*/

/*main banner*/
.banner-image {
  background-image: url('images/house-pressure-washing.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 50vw;
}

/*four info boxes*/

.gray-background {
  background-color: lightgray;
  padding: 25px;
  text-align: center;
}

.picture-row {
  margin-top: 40px;
}

.four-block-img {
  width: 100%;
}

.four-block-title {
  font-size: 40px;
}

.four-block-text{
  padding-top: 25px;
  font-weight: bold;
  height: 120px;
}

.green-btn{
  background-color: #92c45c;
  color:#fff !important;
  margin: 0px auto 0px auto;
  border: 3px solid #92c45c;
  border-radius: 50px  !important;
  padding: 8px 0px 12px 0px !important;
  transition:all .5s ease;
  font-size:17px !important;
  width:150px;
  height:50px;
  display:block;
}

.green-btn:hover {
  background-color: rgba(146, 196, 92, 0.3);
  color: #fff !important;
  border: 3px solid #92c45c;
  text-decoration:none !important;
  font-size:20px !important;
  padding: 6px 0px 12px 0px !important;
}

/*welcome block*/

.welcome-container {
  margin-top: 40px;
  margin-bottom: 40px;
  padding:0px 40px 0px 40px !important;
  font-family:poppins;
}

.welcome-container p, .welcome-container li {
  font-size:17px !important;
}

.welcome-block, .areas-block {
  padding: 0px 40px 0px 40px !important;
}

.welcome-heading, .areas-heading {
  margin-bottom: 40px;
}

.welcome-text {
}

.areas-heading {
  text-align: center;
}

.areas-list ul{
  margin-left: 20px;
  font-size: 18px;
}

.vertical-divider {
  border-right: 1px solid lightgray;
  margin-top: -250px;
  height: 200px;
}

/*reviews block*/

.reviews-full-width-color {
  background-image: url(images/review-bg.jpg);
  background-size: cover;
  background-repeat: no-repeat;
}

.center-vertically {
  margin: auto;
}

.navy-letters {
  color: #02375f;
  font-size:32px !important;
}

.reviews-header {
  font-size: 44px;
  font-family:arvo;
  font-weight: 700;
  color:#000;
  padding-bottom:20px;
}

.full-height {
  height: 100%;
}

.reviews-block {
}

.reviews-buttons {
  text-align: center;
}

.reviews-container {
  color#000;
  height: 400px;
}

.reviews-container p {
  color:#000;
  font-size:22px;
  font-family:arvo;
  font-weight:normal;
}

.navy-btn{
  background-color: #02375f;
  color: #fff !important;
  border: 3px solid #02375f;
  border-radius: 0px  !important;
  width: 60%;
  padding: 14px 22px;
  margin: 20px;
  font-size:20px;
}

.navy-btn:hover {
  background-color: rgba(146, 196, 92, 0.0);
  color: #02375f;
  border: 3px solid #02375f;
  text-decoration:none;
}

/*footer*/
.footer-full-width-color {
  background-color:  #003a62;
}

.footer {
  margin-top: -20px;
  padding: 40px 20px 20px 20px;
  background-color: #003a62;
  color: white;
}

.footer h3 {
  margin-bottom: 20px;
}

.connect-heading {
  margin-top: 30px;
}

.facebook-image {
  margin-top: 50px;
}

.footer a{
  color: white !important;
}

.footer div {
  padding-left: 20px;
  padding-right: 20px;
}

/*media queries*/

@media (min-width: 980px) {

  .hide-on-large {
    display:none;
  }

  .dropdown-toggle::after {
      display:none !important;
  }

  .dropdown:hover>.dropdown-menu {
    display: block;
  }
}

@media (max-width: 979px) {

  .hide-on-mobile {
    display:none;
  }

  .center-on-mobile {
    padding: 10px;
    text-align: center !important;
  }

  .navbar {
    padding:0 !important;
  }

  div#nav-icon3, .navbar-toggler {
    height: 80px;
  }

  div#nav-icon3 {
    margin-top: 18px;
  }

  .nav-link {
    background-color: #4d738f;
    color: white !important;
  }

  .dropdown-menu {
    margin-top: 0px !important;
    border-top: 2px solid #92c45c !important;
    left:0 !important;
    transform: translate(0, 0)!important;
  }

  .nav-link:hover {
    color: #92c45c !important;
  }

  .navy-letters {
    font-size: 24px;
  }

  .four-images {
    padding-bottom: 30px !important;
  }

  .areas-heading {
    margin-top: 30px;
    border-top: 2px solid lightgray;
    padding-top: 30px;
  }

  .reviews-button-container {
    background-color: #87d5fb;
  }

  .reviews-buttons {
    margin-top: -40px;
    padding-bottom: 30px;
  }
 }

 @media (min-width: 500px) {
  .container {
    max-width: 1400px !important;
  }
}


.welcome-container ul li {
  list-style: none;
  background: url(/images/check-tick.png);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 23px;
  padding-left: 39px;
  margin-bottom: 17px;
  line-height: 25px;
}

.welcome-container h1 {
  padding-bottom:20px !important;
}

.welcome-container h2 {
  font-size:23px;
  padding:14px 0px;
}

.welcome-container img {
  max-width:800px;
  padding-bottom:10px;
}