/*
Theme Name: Gage
Theme URI: http://wordpress.org/themes/gage
Author: Aeon Creative
Description: Made for Gage & Co. Development
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gage

*/
.mq {
  position: fixed;
  top: 0px;
  left: 0px;
  background: orange;
  z-index: 100000;
  color: white;
  padding: 10px;
}

@media (max-width: 575px) {
  .mq::before {
    content: 'phone';
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .mq::before {
    content: 'tablet';
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .mq::before {
    content: 'laptop';
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .mq::before {
    content: 'desktop';
  }
}

@media (min-width: 1200px) {
  .mq::before {
    content: 'large';
  }
}

/*---------Splash Page----------*/
html {
  background-color: #426c69;
}

#front-page--splash {
  background-image: url('./house.jpg');
  position: relative;
  background-size: cover;
  background-position: center center;
  background-repeat: none;
  height: 72vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

#front-page--splash::after {
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 0;
  top: 0px;
  left: 0px;
  background: #426c69;
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.aqua-box {
  background-color: #3bbfbb;
  border-radius: 60px 0px 60px 0px;
  position: relative;
  z-index: 10;
  box-shadow: 4px 4px 16px 4px rgba(66, 108, 105, 0.3);
  padding: 24px 24px;
}

@media (max-width: 575px) {
  .aqua-box {
    max-width: 350px;
    display: block;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .aqua-box {
    width: 350px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .aqua-box {
    width: 370px;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .aqua-box {
    width: 400px;
  }
}

@media (min-width: 1200px) {
  .aqua-box {
    width: 410px;
  }
}

.call-to-action {
  transition: all 0.3s;
  position: relative;
  z-index: 10;
  color: #fff;
  font-family: 'Poppins', sans-serif;
  display: block;
  padding-left: 0;
}

@media (max-width: 575px) {
  .call-to-action {
    font-size: 0.9em;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .call-to-action {
    font-size: 1em;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .call-to-action {
    font-size: 1.1em;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .call-to-action {
    font-size: 1.2em;
  }
}

@media (min-width: 1200px) {
  .call-to-action {
    font-size: 1.3em;
  }
}

.call-to-action h1 {
  font-weight: 100;
}

.call-to-action span {
  font-weight: 500;
}

/*---------Nav----------*/
#logo_svg {
  width: 104px;
  padding: 48px 0;
}

#logo_svg path {
  fill: #fff;
}

.aqua-bar {
  background-color: #3bbfbb;
  min-height: 8px;
  width: 100vw;
}

#nav {
  background-color: #426c69;
}

/*---------Footer----------*/
#footer {
  background-color: #426c69;
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-size: 0.8em;
  padding: 33px 0px;
}

#footer h3 {
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

@media (max-width: 575px) {
  #footer h3 {
    font-size: 1.4em;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  #footer h3 {
    font-size: 1.3em;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  #footer h3 {
    font-size: 1.2em;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  #footer h3 {
    font-size: 1.1em;
  }
}

@media (min-width: 1200px) {
  #footer h3 {
    font-size: 1em;
  }
}

#footer a {
  display: block;
  color: #fff;
}

#footer a:hover {
  color: #3bbfbb;
  text-decoration: none;
}

#footer_icon {
  width: 32px;
  opacity: 0.3;
}

.contact {
  padding-left: 0;
}

.contact p {
  margin: 0;
  transition: all 0.3s;
}

@media (max-width: 575px) {
  .contact p {
    font-size: 1.4em;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .contact p {
    font-size: 1.3em;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .contact p {
    font-size: 1.2em;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .contact p {
    font-size: 1.1em;
  }
}

@media (min-width: 1200px) {
  .contact p {
    font-size: 1em;
  }
}

/*# sourceMappingURL=style.css.map */