body{
    margin: 73px 0 0 0;
}

header{
    padding: 18px 0 12px 0;
}

header .phone-number label, header .phone-number {
    font-size: 16px;

}

header .phone-number a{
    font-weight: bold;
}

/*you don't need to repeat these styles in media queries below. Whatever you write for mobile will carry across for tablet and desktop*/

.header-btn {
    display: none;
    text-align: right;
    right: 200px;
    position: absolute;
    top: -15px;
    z-index: 9;

}

.header-btn a {
     background: #42c0ed;
     padding: .5em 1em;
     color: white;
     transition: .3s;
     display: inline-block;
     position: relative;
     border-radius: 10px;
     font-family: 'Source Sans Pro', sans-serif;
     min-width: 210px;
     text-align: center;
}

.header-btn a:hover, .header-btn a:focus{
    outline: none;
    background: #000;
    transition: .5s ease all;
    color: #fff!important;

}


.header-btn a .first {
    display: block;
}


.header-btn a .second {
    display: none;
 }

.header-btn a:hover .first {
    display: none;
 }

.header-btn a:hover .second {
    display: block;
 }


.overlay{
    background: rgba(0, 0, 0, .6); position: absolute; top: 0; left: 0; right: 0; bottom: 0;
}

.text{
    top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; position: absolute; width: 90%;

}

.slider-background{
    background-size: cover; background-repeat: no-repeat; background-position: center; min-height: 400px; height: 60vh; position: relative;
}

.testimonial-slider {
    margin-bottom: 0px!important;
}

.testimonial-slider .slick-dots{
    bottom: 0px;
}

.slider-background p {
    font-size: 14px;
}

.coloured-block p{
    color: #fff;
}


@media (min-width: 768px){
     
    header .container {
        width: 765px;
    }
}

@media (min-width: 992px){
    header .container {
        width: 985px;
    }
}

@media (min-width: 1200px){
    header .container {
        width: 1100px;
    }
}


#mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator:after{
    margin: 0px;
}




.title-bar{
    padding: 14px 1em;
}

.logo img{
    width: 100%;
    max-width: 200px;
}
.home-green-box:before{
    height: 100px;
    top: -50px;
}

.home-green-box:after{
    height: 100px;
    bottom: -50px;
}

.spacer{
    padding: 1em 1em;
}

:focus{
    outline: none;
}

a:focus{
    outline: none;
}
a:hover, a:focus{
    text-decoration: none;
}

p a{
    color: #bad040;
}

p a:hover, p a:focus{
    text-decoration: underline;
}




.btn{
    background: #bad040;
    padding: 1em;
    color: #000;
    text-transform: uppercase;
    border: 0px;
    transition: .5s ease all;
    margin: .5em .5em .5em 0;
    display: inline-block;
}

.btn:hover, .btn:focus{
    outline: none;
    background: #eb5b27;
    transition: .5s ease all;
    color: #fff!important;
}
 .white-btn{
    background: #fff!important;
 }

 .white-btn:hover, .white-btn:focus{
    background: #eb5b27!important;
 }

p, ul li, ol li{
    font-size: 16px;
    line-height: 1.4em;
    font-weight: 100;
}

.home-bottom-box .overlay-box p, .home-green-box p{
    font-size: 18px;
}

.home-bottom-box .overlay-box{
    left: 10%;
}

.home-green-box p{
    max-width: 90%;
}

p{
    margin-bottom: 1em;
}

.content ul, .content ol{
    margin-bottom: 1em;
}

.content h1, .content h2, .content h3 {
    font-weight: 100;
    margin-bottom: 10px;
}

.content h1{
    font-size: 26px;
    margin-bottom: 10px;
}

.content h2{
    font-size: 22px;
    color: #bad040;
}

.content h3{
    font-size: 19px;
    color: #bad040;
}

.xpad{
    padding: 2em 1em;
}

.three_popup{
    background: none;
}

.three_popup h2{
    font-weight: 100;
    font-size: 24px;
    margin-bottom: 10px;
}

.three_popup h4{
    font-weight: 100;
    font-size: 18px;
}

.three_popup a{
    color: #bad040;
    font-weight: bold;
}

.three_popup a:hover, .three_popup a:focus{
    outline: none;
}

.bottom-footer{
    background: #333;
    padding: 1em 0em;
}

.bottom-footer p{
    font-size: 12px;
    color: #fff;
    margin: 5px 0px;
}

.bottom-footer a:hover, .bottom-footer a:focus{
    text-decoration: underline;
    color: #fff!important;
}

.footer-small img {
    margin-left: 30px;
    max-height: 45px;
}

.text-right{
    text-align: right;
}

.sustainability .left, .testimonials .left{
    margin-top: -160px;
    top: 0;
}

.sustainability .left .future-content .content p{
    font-size: 14px;
}


a:hover, a:focus{
    color: #eb5b27;
}

a:hover p, a:focus p{
    color: #333; 
}

footer input[type="text"], footer input[type="email"], footer input[type="text"]:focus, footer input[type="email"]:focus, footer input:focus, footer textarea, footer textarea:focus{
    border: 0px;
    box-shadow: none;
    margin-bottom: 10px;
}

input[type="submit"]{
    font-weight: 100;
    font-size: 18px;
}
input[type="submit"]:hover, input[type="submit"]:focus{
    background: #41c0ee;
    color: #fff;
}

::placeholder{
    color: #333;
    font-weight: 100;
}

.wpcf7 form .wpcf7-response-output{
    clear: both;
    color: #fff;
}

.wpcf7-not-valid-tip{
    color: #fff;
    font-weight: bold;
}

#mega-menu-wrap-main-menu{
    padding-top: 1em;
}


.nav-toggle {
    color: #FFFFFF;
    cursor: pointer;
    display: block !important;
    font-size: 30px;
    position: absolute;
    right: 15px;
    top: 25px;
}

header .phone-number{
    display: none;
}

.large-banner{
    min-height:400px;
}

.smaller-banner{
    min-height:200px; height: 50vh;
}

.testimonials-slide{
    text-align: center;
    padding: 2em 1em;
    position: relative;
    background: #42c0ed;
}

.testimonials-slide .container{
    position: relative;
    padding: 0;
}

.testimonials-slide h2{
    font-size: 24px;
    color: #fff;
    font-weight: 100;
    width: 85%;
    margin: 0em auto 1em;
}

.testimonials-slide h4{
    color: #fff;
    font-size: 17px;
    font-weight: 100;
    margin-bottom: 1em;
}


.testimonials-slide p{
    color: #fff;
}

.slick-dots li button:before{
    font-size: 14px;
    color: #fff;
}
.slick-dots li.slick-active button:before{
    color: #fff;
}

.slick-dots li{
    margin: 0px;
}

.left-quote{
    max-width: 35px;
    position: absolute;
    left: .25em;
    top: .25em;
}


.right-quote{
    max-width: 35px;
    position: absolute;
    right: .25em;
    bottom: .25em;
}

.about .left .about-top-content{
    padding: 1em;
}

.team-member .overlay .text{
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    width: 98%;
    margin: auto;
    padding: 3px;

}

.about .left .team-members .team-member h4{
    top: inherit;
    font-size: 14px;
    position: relative;
    margin-bottom: 5px;
}


.about .left .team-members .team-member h5{
    top: inherit;
    font-size: 12px;
    position: relative;
    margin-bottom: 5px;

}


.about .left .team-members .team-member h6{
    top: inherit;
    font-size: 12px;
    position: relative;
    padding: 0px;
    line-height: 1em;
}


@media (min-width: 550px){
    header .phone-number {
        position: absolute;
        right: 2em;
        margin-top: 15px;
        display: block;

    }

    header{
        min-height: 73px;
    }

    .about .left .team-members .team-member h4{
        font-size: 17px;
    }


    .about .left .team-members .team-member h5{
        font-size: 14px;
    }


    .about .left .team-members .team-member h6{
        font-size: 14px;
    }

/*       header .header-btn {
        display: none;
    }*/


}

@media (min-width: 769px){



    .mob-link{
        display: none!important;
    }

    .content h1{
        font-size: 34px;
    }

    .content h2{
        font-size: 30px;
    }

    .content h3{
        font-size: 24px;
    }

    .nav-toggle {
        display: none!important;
    }

    body{
        margin: 84px 0 0 0;
    }




    header{
        padding: 26px 0 12px 0;
        min-height: 83px;
    }

    header .phone-number {
        margin-top: 0px;
        right: 0;
    }

    .large-banner{
        min-height:500px;
    }


    .smaller-banner{
        min-height:400px; 
        height: 60vh;
    }

    .home-bottom-box .overlay-box p, .home-green-box p{
        font-size: 24px;
    }

    .home-green-box p{
        max-width: 80%;
    }

    .left-quote{
        left: .75em;
        top: .75em;
    }


    .right-quote{
        right: .75em;
        bottom: .75em;
    }


    .testimonials-slide h2{
        font-size: 30px;
    }

    .testimonials-slide h4{
        font-size: 20px;   
    }


    .advert-wrapper .notice-box p{
        font-size: 18px;
    }

    .header-btn {
        display: block;
    }


    .slider-background p {
        font-size: 16px;
    }


 }

@media (min-width: 480px){


}


@media (min-width: 769px){


/*    .header-btn {
        display: block;
    }

   header .header-btn a{
     font-size: 13px;
     top: -15px;
 }
 .header-btn a:hover {
    background: #000;
    color: #fff;
    }*/
}

@media (min-width: 992px){

    #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link{
        font-size: 17px;
        padding: 0px 10px;
    }


    header{
        padding: 26px 0 10px 0;
        min-height: 95px;
    }


    header nav.menu{
        margin-top: 10px;
    }

    header .container{
        padding:0px 1em;
    }

    footer h4{
        font-size: 26px;
    }

    header .phone-number {
        top: -5px;

    }

    .title-bar{
        margin-top: 10px;
    }


    .large-banner{
        min-height:700px;
    }


    .smaller-banner{
        min-height:500px; 
    }

    .home-green-box:before, .home-green-box:after{

        height: 120px;

    }

    .home-green-box:before{
        top: -70px;
    }


    .home-green-box:after{
        bottom: -70px;
    }

    .testimonials-slide{
        padding: 3em 1em;
    }


    .left-quote{
        max-width: 50px;
        left: 1em;
        top: 1em;
    }


    .right-quote{
        max-width: 50px;
        right: 1em;
        bottom: 1em;
    }

    .about .left .team-members .team-member h4{
        font-size: 18px;
        margin-bottom: 10px;
    }


    .about .left .team-members .team-member h5{
        font-size: 15px;
        margin-bottom: 10px;
    }


    .about .left .team-members .team-member h6{
        font-size: 14px;
    }

    .slider-background p {
        font-size: 18px;
    }

}


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


}


@media (min-width: 1600px){
    .home-green-box:before{
        height: 140px;
    }


    .home-green-box:after{
        
        height: 140px;
    }
}