/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    font-family: "Montserrat", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
    
a {
    text-decoration: none;
    color: #55bb33;
}
        
a:hover {
    color: black;
}


b {font-weight: 550;}
   
body {
    padding-bottom: 40px;
    background-color: #fdfbf8;
}    

h1 {
        font-size: 30px;
        margin-bottom: 1em;
        text-align: center;
        line-height: 1.4;
        font-weight: 550;
}

.fake-h1 {
        display: block;
        font-size: 30px;
        margin-bottom: 1em;
        text-align: center;
        line-height: 1.4;
        font-weight: 550;
}

h2 {
        font-size: 18px;
        margin-bottom: 1em;
        font-weight: 550;
}

.map {
    width: 100%;
    aspect-ratio: 1.4;
}
    
.container {
    padding: 20px 5%;
}
    
.head-image img {
    width: 100%;
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    display: block;
}
        
.text-body {
    padding: 5px 5% 25px;
    width: 100%;
    font-size: 16px;
    line-height: 1.4;
}
        
.text-services {
    padding: 20px 5%;
    width: 100%;
    font-size: 16px;
    line-height: 1.4;
}
        
.contact {
    /*top right bottom left*/
    padding: 5px 5% 10px 5%;
    text-align: center;
    font-size: 20px;
    line-height: 1.4;
}
        
.centered {
    text-align: center;
    padding: 40px 5%;
    width: 100%;
    font-size: 16px;
    line-height: 1.4;
}

.footer {
    text-align: center;
    padding: 7em 0 0;
    width: 100%;
    font-size: 12px;
    line-height: 1.4;
}
        
.image-gallery {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    /*gap: 10px;
    grid-row-gap: 10px;*/
    font-size: 16px;

    --column-gap: 10px; 
    --row-gap: 10px;
    margin-bottom: calc(-1 * var(--row-gap));
    margin-right: calc(-1 * var(--column-gap));
}

.image-gallery > li {
    margin-bottom: var(--row-gap);
    margin-right: var(--column-gap);
}
        

.image-gallery > li {
    -ms-flex-preferred-size:90%;
        flex-basis:90%;
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    flex-grow: 1;
}

.image-gallery li img {
    background: #b3cccc;
    display: block;
    -o-object-fit: cover;
       object-fit: cover;
    max-width: 100%;
    height:auto;
    vertical-align: middle;
    border-radius: 5px;
}
        
      /*  .image-gallery::after {
            content: "";
            flex-basis: 350px;
        }*/
        
        /*
        .overlay {
            position: absolute;
            width: 100%;
            height: auto%;
            background: rgba(57, 57, 57, 0.502);
            top: 0;
            left: 0;
            transform: scale(0);
            transition: all 0.2s 0.1s ease-in-out;
            color: #fff;
            border-radius: 5px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .image-gallery li:hover .overlay {
            transform: scale(1);
        }
        */
        
ul {list-style: none;}

.head-image img{
    margin-top: 0px;
    margin-bottom: 0px;
    display: block;
}

/*desktop only:*/
@media (min-width: 600px) {
          
    .map {
        width: 650px;
    }
            
    .container {
        padding: 20px 8%;
    }
            
    .text-services {
        padding: 20px 8%;
    }
            
    .head-image img{
        margin-top: 0px;
        margin-bottom: 0px;
        display: block;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
            
    .text-body:not(.testimonial-container){
        padding: 5px 8% 25px;
        width: 90%;
        margin: auto;
    }
    
    .testimonial-container {
        padding: 5px 8% 25px;
        width: 95%;
        margin: auto;
    }
            
    .contact {
        /*top right bottom left*/
        padding: 6px 8% 25px 8%;
        font-size: 22px;
    }
            
    .image-gallery > li {
        -ms-flex-preferred-size: 30%;
            flex-basis: 30%;
    }
            
    .image-gallery li img {
        min-height: 100%
    }
        
    .extra-wide {
        -ms-flex-preferred-size: 40% !important;
            flex-basis: 40% !important;
    }
}


/*PHONE NUMBER LINK ONLY ON MOBILE*/

@media (max-width: 600px) {
  .not-phone { display: none; }  /* show it on small screens */
}
        
@media (min-width: 601px) {
  .phone-only { display: none; }   /* hide for all below 601px*/
}
        
        
.topnav {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
        
.menucontainer {
    margin-top: 0px;
    margin-bottom: 20px;
    border-top-width: 2px;
    border-top-style: solid;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}
        
.topnav a {
    float: left;
    display: block;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 18px;
    color: black;
}
        
.topnav a:hover {
    color: black;
    color: #55bb33;
}
        
.topnav a.active {
    color: black;
    color: #55bb33;
}
        
.topnav .icon {
    display: none;
}
        
@media (max-width: 600px) {
    .topnav {display: block;}
    .topnav a {display: none; padding: 10px 16px;}
    .topnav a.icon {
        float: none;
        display: block;
        text-align: center;
    }
    
    .topnav.responsive {position: relative;}
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: center;
    }

    .menucontainer {
        margin-top: 0;
        padding-top: 0;
    }
}
        
.bio-text {
    font-size: 16px;
    line-height: 1.4;
}        
        
@media (min-width: 600px) {

    .bio-image {
        -ms-flex-preferred-size: 250px !important;
            flex-basis: 250px !important;
    }

    .bio-text {
        -ms-flex-preferred-size: calc(90% - 250px) !important;
            flex-basis: calc(90% - 250px) !important;
    }

    .bio-image > img {
        width: 250px !important;
    }
}

 @media (max-width: 600px) {
    
    .bio-text {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}


@media (min-width: 750px) { .head-image img{width: 65%;}}
@media (min-width: 900px) { .head-image img{width: 50%;}}