body{font-family: Arial, Helvetica, sans-serif; overflow: hidden; overflow-y: auto; background-color: #f5f5f5;}
::-webkit-scrollbar {width: 5px;}
::-webkit-scrollbar-track {box-shadow: inset 0 0 5px grey; border-radius: 5px;}
::-webkit-scrollbar-thumb {background: whitesmoke; border-radius: 5px;}
::-webkit-scrollbar-thumb:hover {background: white; }
form{z-index: 1; margin: 0% 10% 0% 10%; height: auto; float: left;}
input{width: 45%; margin: 0% 2.5% 5% 2.5%; float: left; font-size: small; background-color: #fffef2; border: 1px solid #c0c0c0; border-radius: 4px; padding: 10px 10px;}
input.full{width: 95%;}
.top-banner p{margin: 0.3% 0% 0.3% 0%; color: #000; font-size: large;}
h1{z-index: 1; color: #000; font-weight: 900; font-size: 2.8rem; display: block;}
h2{z-index: 1; font-style: italic; color: #000; font-size: 1.8rem; margin-top: 5%;}
.top-header{width: 80%; float: left; margin-left: 10%;}
.top-phone{font-size: 1.7rem; color: #276301; font-weight: bold; text-align: center; float: left; margin: auto;}
.navigation{padding: 1% 0% 1% 0%; width: 100%; position: fixed; background-color: #fff; z-index: 10;}
.main-body{background-image: url(../media/background-alt.jpg); background-size: cover; position: absolute;}
.nav-item{float: left; width: 25%; bottom: 10; text-align: center; margin: 0% 2.5% 0% 2.5%;}
.nav-item:hover{font-weight: bold;}
.content-section{ width: 100%; height: 50%; float: left; z-index: 1;}
.contact-box{ z-index: 1; width: 80%; margin: 5% 0% 5% 10%; background-color: #f5f5f5; float: left;}
.contact-box-head{ z-index: 1; width: 100%; padding: 5% 0% 5% 0%; text-align: center; font-size: large; font-family: inherit; float: left;}
.mobile-contact{font-size: 1.7rem; background-color: #276301;color: #fff;width: 100%;font-family: Arial, Helvetica, sans-serif;font-weight: bold;text-align: center;}
.review-prompt{font-size: 1.2rem; margin: 1% 5% 1% 5%; color: #fff;}
.service-heading{font-size: 2rem; color: #276301; font-weight: 700; text-align: left; padding-top: 2%;}
.top-banner{background-color: #d3d3d3; z-index: 100; position: absolute; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; opacity: 0;}
.service-text{width: 90%; margin: 1% 5% 1% 5%; font-size: 1rem; text-align: justify; }
.service-panel{width: 95%; margin: 15% 2.5% 10% 2.5%; background-color: #fff; height: auto; padding-bottom: 5%;}
.overlay-screen{width: 100%; height: 100%; background-color: rgba(3, 3, 3, 0.98); z-index: 100; position: absolute; visibility: hidden;}
.body-button-box{background-color: #f5f5f5;}
.gallery-close-button{position: relative; width: 2%; float: right; top: 5; right: 5; margin-bottom: 0.5%; cursor: pointer;}
.close-strip{width: 100%; height: auto; background-color: rgba(3, 3, 3, 0.98); z-index: 110; position: fixed;}
.gallery-image{width: 100%; margin: 4% 0% 4% 0%;}
.info-banner{background-color: #3B3A39; width: 100%; margin: 0% 0% 0% 0%; color: #fff; text-align: center; font-size: 1.3rem; font-weight: 600; padding: 0.75%;}
.review-count{margin: 0% 0% 2% 10%; font-size: 0.7rem; color: #000; font-weight: normal;}
.powered-by{width: 80%; margin: 1% 10% 2% 10%;}
.top-nav{font-size: 1rem; color: #000; font-weight: bold; text-align: center; float: left; margin: auto; cursor: pointer;}
.powered-by-text{text-align: center; font-size: 1.2rem; font-weight: 700;}
.top-nav:hover{color: #276301;}
#free{color: #276301; font-weight: 1000; font-size: larger;}
.services-pane{background-color: #f5f5f5;height: auto;}
.submit-nav{width: 60%; margin-left: 20%; background-color: #276301; color: #fff;font-weight: 600; padding: 2%;}
.services-heading{width: 100%; font-size: 1.5rem; color: #276301; font-weight: 750; margin-bottom: 2%;}
.services{width: 80%; margin: 5% 10% 5% 10%;}
.service-desc{color: #000; font-size: 1.1rem;}
.service-area{width: 100%; margin: 2% 0% 2% 0%; background-color: #f5f5f5; height: auto;}
.service-area-map{width: 50%; margin: 2% 25% 2% 25%; border:#000 1px solid;}
.gallery-main{background-color: #f5f5f5; padding: 2% 5% 2% 5%;}
.mobile-nav-item{font-size: 1.2rem; background-color: #f5f5f5; color: #000; width: 100%; margin-top: 1%; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-align: center; float: left;}
.footer{padding-top: 2%; margin: 0% 0% 5% 0%; height: auto; width: 100%; position: absolute; float: left; left: 0;}
.main-content-text{width: 80%; margin-left: 10%; margin-top: 12%; margin-bottom: 10%; z-index: -1;}
.review-form{ background-color: #c0c0c0; margin: 20% 10% 12.5% 10%; width: 80%;}
.review-form h1{color: #276301; font-size: 1.4rem; text-align: center; width: 80%; margin: 5% 10% 2% 10%;}
.review-form h2{ color: #000; text-align: center; margin: 0% 0% 1% 0%; font-size: 1rem;}
.review-form form .reviewInput{width: 80%; margin: 1% 10% 1% 10%; font-size: small; background-color: #fffef2; border: 1px solid #c0c0c0; border-radius: 4px;}
.review-form form{width: 90%; margin: 0% 5% 0% 5%;}
.review-close-button{position: relative; width: 7%; float: right; top: -15; right: -15;}
.review-panel{width: 95%; overflow-x: hidden; margin: 1% 2.5% 1% 2.5%; white-space: nowrap; display: inline-block; z-index: 1;}
#reviewButton-left{width: 3.5%; height: 60%; top: 20%; left: 0; position: absolute; background-color: rgba(220, 220, 220, 0.7);}
#reviewButton-right{width: 3.5%; height: 60%; top: 20%; right: 0; position: absolute; background-color: rgba(220, 220, 220, 0.7);}
#reviewLeft{margin: auto 0 auto 0; width: 80%; height: 100%; position: absolute; top: 0; bottom: 0; z-index: 0;}
#reviewRight{margin: auto 0 auto 0; width: 80%; height: 100%; position: absolute; top: 0; bottom: 0; z-index: 0;}
.review{width: 22%; padding: 1% 2% 1% 2%; height: 80%; display: inline-block;}
.review-vl{border-left: 4px solid darkgray; height: 80%; display: inline-block; margin: 0% 1% 0% 1%;}
.review-content{width: 100%; height: 80%; text-align: justify; white-space: pre-wrap;}
.review-author{width: 100%; height: 10%; white-space: pre-wrap; font-weight: 700;}
.footer-section{width: 100%; padding: 2% 5% 2% 5%; background-color: #e8e8e8; border-top: 4px solid darkgray;}
.footer-text{color: #000; text-align: center;}
.footer-icon{width: 50%; margin-top: 0;}
#copywrite{text-align: center; font-size: small;}
a{text-decoration: none; color: #000;}

@media (max-width: 1024px){
  h1{font-size: 2.5rem;}
  h2{font-size: 1.3rem;}
  .review{width: 29%;}
  .gallery-close-button{width: 3%;}
  .review-content{font-size: 0.8rem;}
  .service-heading{font-size: 1.6rem;}
  .service-desc{font-size: 1rem;}
  .services-heading{font-size: 1.3rem;}
  .service-area-text{font-size: 1rem;}
  .service-area-map{width: 80%; margin: 5% 20% 5% 20%;}
  .submit-nav{width: 80%; margin-left: 10%;}
  #free{font-size: large;}
}

@media (max-width: 600px){
  .info-banner{font-size: 0.8rem;}
  .gallery-close-button{width: 5%;}
  .service-area-map{width: 80%; margin: 5% 10% 5% 10%;}
  .footer-icon{width: 80%; margin-left: 10%; margin-right: 10%;}
  .review-panel{width: 80%; margin: 1% 10% 1% 10%; }
  .review{width: 100%; padding: 1% 2% 1% 2%;}
  #reviewButton-left{width: 10%; }
  #reviewButton-right{width: 10%; }
  .review-mobile{margin-top: 5%; margin-bottom: 5%;}
}
