@charset "UTF-8";

:root {
    --primary: #036b38;
    --secondary: #91c853;
    --shadow: 0 .5rem 1rem rgba(0,0,0,.15);
    --text-shadow: 1px 2px 3px rgba(0,0,0,.1);
}

body {
    font-size: 18px;
    max-width: 1920px;
    margin: 0 auto;
    box-shadow: var(--shadow);
    background-color: #fff;
    color: #222; }

body#thank-you {
    height: 100vh;
    box-shadow: none;
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center; }
    
body.thank-you { box-shadow: none; }

section { padding: 4rem 0; }

h1, h2, h3, h4, h5, h6 { color: var(--primary); }

h1 {
    text-transform: uppercase;
    margin-bottom: 1rem; }

a {
    text-decoration: none;
    transition: all .15s ease; }

.shadow-0 { box-shadow: none; }
.bg-light { background-color: #e2e7e1 !important; }
.bg-eee { background-color: #eee; }
.btn:focus { box-shadow: none; }
.badge:hover { color: #222;  }
.bg-light { background-color: #f6f6f6; }
address { margin-bottom: 0; }
button:focus:not(:focus-visible) { box-shadow: none; }

.lead {
    font-size: 1.5rem;
    font-weight: 400;}

.underline {
    margin-bottom: 5px;
    position: relative; }

.underline:hover::after  {
    width: 75%;
    background-color: var(--bs-danger); }

.underline:after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    content: '.';
    color: transparent;
    background-color: var(--bs-danger);
    height: 1px;
    transition: all .15s ease; }

.text-underline:hover { text-decoration: none; }

img.myImg {
    box-shadow: var(--shadow);
    border-radius: .5rem;
    max-width: 100%;
    height: auto; }

.circle {
    box-shadow: var(--shadow);
    border-radius: 50%;
    width: 150px;
    height: 150px; }
    
.flex-center {
    display: flex;
    justify-content: center;
    align-items: center; }

.flex-column {
    display: flex;
    flex-direction: column; }
    

/* ******************************************** Content ******************************************** */

#header { padding: 0 0 1rem 0; }
#header .container { justify-content: center !important; }

/* Brand */
nav h1 {
    margin-bottom: 0;
    display: flex;
    flex-direction: column; }

.navbar-brand {
    margin-right: 0;
    font-family: 'Times New Roman', serif;
    flex-direction: column;
    margin-bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center; }

.under-logo {
    margin-top: -2.5rem;
    margin-left: 5.5rem; }

.under-logo span, .under-logo a { color: #222; }
.under-logo a:hover { color: var(--bs-primary); }


/* Navigation */
nav li { list-style: none; }
.nav-justified .nav-item, .nav-justified>.nav-link { margin: 0.25rem; }

.nav-link { 
    color: #198754;
    border: solid 1px #198754 !important;
    text-transform: uppercase; }
    
.nav-link:hover {
    background-color: #198754;
    color: #fff; }

/* Landing */
#landing {
    background-image: url(../images/landing.jpg);
    background-size: cover;
    width: auto;
    height: 200px;
    padding: 0; }


/* About */
#about { background-color: #fff; }


/* Free Estimate */
#free-estimate {
    background-size: cover;
    background-position: center; }


/* Services */
#services li { 
    font-size: calc(1.3rem + .6vw);
    list-style-image: url(../images/check.svg);
    margin-top: 1rem;
    margin-left: 1rem;
    font-weight: 300;
    color: #222; }


/* Map */
#map {
    width: 100%;
    height: 100%; }


/* Contact Form */
.template-outside { margin: 1rem; }
.quform-input input, .quform-elements .quform-huge.quform-element textarea { width: 100%; }
.quform-group-alignment-left > .quform-group-elements > .quform-group-row > .quform-element:not(.w-100) { width: 49.3%; }
.quform-theme-light-light .quform-element > .quform-spacer > label { font-weight: normal; }
.template-outside { margin: 2rem  1rem; }
.quform-inner h2 { margin-bottom: 1rem; }


/* Footer */
footer { color: #ddd; }

.footer-wrapper {
    display: flex;
    flex-direction: column; }

.footer-wrapper li { list-style: none; }

.footer-wrapper h2 {
    text-align: left;
    color: #fff; }

.footer-wrapper ul { padding-left: 0; }
    
.footer-wrapper li {
    text-align: left;
    margin-top: .5rem;
    color: #fff; }
    
.footer-wrapper li, .footer-wrapper a { font-weight: 400 !important; }
    
#contact { 
    background-color: var(--primary);
    padding: 0; }
    
#contact ul li { padding-left: 1rem; }

/* MSWD */
.mswd-links p {
    font-size: 13px !important;
    display: block; }

.mswd-links a {
    transition: all .15s ease;
    text-decoration: underline;
    color: inherit;
    font-size: inherit; }

.mswd-links a:hover {
    opacity: .7;
    text-decoration: none; }


/* ******************************************** REPONSIVE ******************************************** */

@media (min-width: 768px) {
    body { font-family: 'Open Sans', sans-serif; }
    
    p, li:not(.nav-item) {
        font-size: 18px; }
}

@media (min-width: 1200px) {
    .container { max-width: 1140px; }
}

@media (min-width: 768px) and (max-width: 991px) {
    nav svg { display: none; }
    .footer-wrapper h2 { font-size: 1.5rem !important; }
    #about { padding-top: 2.5rem; }
    #services .card { margin-top: 0.15rem; }
    
    #services .card-title { 
        margin-top: 0;
        font-size: 1.25rem; }
}

@media (max-width: 767px) {
    body#thank-you, body#thank-you .col-12 { display: block; }
    body#thank-you h1 { margin-top: 1rem; }
    
    section { padding: 2rem 0; }
    .lead { line-height: normal; }
    .extra { display: none }

    /* Navigation */
    .navbar-brand img { 
        max-width: 100%;
        height: auto;
        margin: auto; }
        
    .under-logo span, .under-logo a { font-size: 18px; }
    
    .under-logo {
        margin-top: -2.25rem;
        margin-left: 5rem; }
    
    .nav-link svg { 
        width: 16px;
        height: 16px; }

    .nav-link {
        margin-top: .5rem;
        padding: 0.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        font-size: 18px; }
        
    /* Landing */
    #landing { 
        width: 1125px;
        white-space: nowrap; }
        
    #about .align-items-end { 
        padding: 2rem;
        align-items: unset !important; }
    
        
    /* Services */
    #services { padding: 2rem 0; }
    #services .card { margin-top: 0; }
    #services .col:first-of-type { margin-top: 1rem; }
    
    #services .card-title {
        margin-top: -0.15rem;
        font-size: 1.35rem; }
    
    #services .flex-center { 
        align-items: flex-start;
        flex-direction: column }
        
    #services h1 {
        margin: 1rem 0;
        font-size: 1.5rem; }
    
    img.leaf {
        width: 100px;
        height: auto; }
}

@media (max-width: 991px) {
    footer p, .footer-links a, footer .fs-5 { font-size: 16px !important; }
    .footer-wrapper { padding: 1.5rem; }
}
