@charset "utf-8";

/* CSS Document */
a[href^=tel] {
    color: #000000 !important;
    /*text-decoration: underline!important;*/
}

body {
    padding: 0px;
    margin: 0px;
    font-family: lato, sans-serif;
    background: url(../images/page-hero.png) fixed center center no-repeat;
    background: url(../images/bathroom-install-08.jpg) fixed center center no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position-y: 0px;
}

.subpage-body {
    background: none !important;
}

a {
    text-decoration: none;
    color: #000;
}

.mobile {
    display: none;
}

h1 {
    font-size: 28px;
    line-height: 34px;
    font-weight: 900;
}

h2 {
    font-size: 20px;
    line-height: 30px;
    font-weight: 900;
    margin-top: 0px;
}

.deviceMobile {
    color: #000;
}

.home-image {
    width: 100%;
    max-height: 800px;
    overflow: hidden;
    position: absolute;
    z-index: -4;
}

.home-image-img {
    /*margin-top: -320px;*/
    margin-top: 20px;
    display: none;
}

.header {
    margin-bottom: 580px;
}

.header-white {
    z-index: 127;
    background: rgba(255, 255, 255, 0.9);
}

.nav-social {
    float: right;
    padding-top: 35px;
}

.nav-social a {
    margin-left: 10px;
}

.desktop-navigation {
    display: block;
}

.logo {
    float: left;
    padding-bottom: 10px;
}

.logo img {
    max-width: 490px;
    height: auto;
}

.menu {
    padding: 20px 0px;
}

.menu .contact-details {
    text-align: right;
    font-size: 16px;
    padding-left: 25px;
    padding-top: 20px;
}

.contact-details {
    color: #000000 !important;
}

.desktop-navigation {
    clear: both;
}

.desktop-navigation .navBar {
    display: inline-flex;
}

.desktop-navigation .navBar .Menu-Item {
    min-width: 82px;
    min-height: 24px;
    text-align: center;
    margin-right: 11px;
}

.navBar .Menu-Item:hover,
.navBar .Menu-Item p:hover,
.navBar .Menu-Item:hover p a {
    color: #ffffff !important;
}

.navBar .Menu-Item:hover {
    background-color: #383838 !important;
    color: #ffffff !important;
}

.navBar .Menu-Item:hover,
.navBar .Menu-Item p:hover,
.navBar .Menu-Item p a:hover {
    color: #ffffff !important;
}

.desktop-navigation .navBar .Menu-Item:last-child {
    margin-right: 0px;
}

.desktop-navigation .navBar .Menu-Item p {
    font-size: 16px;
    line-height: 19px;
    font-family: lato, sans-serif;
    font-weight: 900;
    padding: 0px 15px;
}

.desktop-navigation .navBar .Menu-Item p a {
    color: #383838;
}

.desktop-navigation .navBar .Menu-Item a {
    text-decoration: none;
}

.desktop-navigation .navBar .Selected {
    background-color: #0E75C5 !important;
}

.desktop-navigation .navBar .Selected p a {
    color: #fff !important;
}

.subpage .desktop-navigation .navBar2 .Menu-Item p {
    margin: 15px 0px 14px 0px;
}

.subpage .desktop-navigation .navBar2 .Menu-Item {
    border-bottom: 1px solid #383838;
}

.subpage {
    margin-top: 20px;
    background-color: #383838;
}

.subpage .desktop-navigation .navBar2 {
    display: inline-flex;
}

.subpage .desktop-navigation .navBar2 .Menu-Item {}

.subpage .desktop-navigation .navBar2 .Menu-Item p {
    font-size: 16px;
    line-height: 19px;
    font-family: lato, sans-serif;
    font-weight: 900;
    padding: 0px 15px;
}

.subpage .desktop-navigation .navBar2 .Menu-Item p a {
    color: #fff;
    text-decoration: none;
}

.subpage .desktop-navigation .navBar2 .Menu-Item p a:hover,
.subpage .desktop-navigation .navBar2 .Menu-Item:hover,
.subpage .desktop-navigation .navBar2 .Menu-Item a:hover {
    color: #ffffff;
    text-decoration: underline;
    border-bottom: 1px solid #0E75C5;
    background-color: #fff color: #0E75C5;
}

.subpage .desktop-navigation .navBar2 .Menu-Item p a:hover {
    border-bottom: none !important;
}

.subpage .desktop-navigation .navBar2 .Selected p a:hover {
    text-decoration: none !important;
}

.subpage .desktop-navigation .navBar2 .Selected,
.subpage .desktop-navigation .navBar2 .Selected p a {
    text-decoration: none;
    background-color: #0E75C5 !important;
    color: #ffffff !important;
}

.subpage .desktop-navigation {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}

.text-block {
    display: block;
    clear: both;
    padding-top: 10px;
}

.text-block a {
    color: #fff;
}

.sd-width {
    width: 100%;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    position: relative;
}

.main-body {
    padding-top: 15px;
    clear: both;
    position: relative;
    display: flex;
}

.bdwhite,
.bdgrey {
    padding: 20px;
    position: relative;
}

.bdwhite {
    background-color: #fff;
}

.bdwhite a {
    color: #383838;
}

.bdgrey {
    background-color: #383838;
}

.bdgrey ul {
    margin-bottom: 0px;
}

/*.bdgrey p {margin:0px;}*/
.bdgrey ul li,
.bdgrey p,
.bdgrey h1,
.bdgrey h2 {
    color: #fff;
}

.bdgrey ul li a,
.bdgrey a {
    color: #fff;
    text-decoration: underline;
}

.main-foot {
    background-color: #fff;
}

.threeBox {
    clear: both;
    display: flex;
    justify-content: space-between;
}

.threeBox .box h3 {
    color: #fff;
    font-weight: 700;
    font-size: 16px;
}

.threeBox .box {
    width: 260px;
    padding: 15px;
    border: 1px solid #fff;
}

.Locations {
    float: left;
}

.map {
    float: right;
}

.image-left,
.text-right {
    float: left;
    width: 47%;
    margin-right: 6%;
}

.text-right {
    margin-right: 0px;
}

.certifications .cert-1 {
    float: left;
    text-align: center;
}

.mobile-menu,
.navBar {
    display: none;
}

.site-foot {
    background-color: #383838;
    clear: both;
    position: relative;
}

.site-foot {
    padding-top: 10px;
    padding-bottom: 10px;
}

.site-foot .navBar {
    display: inline-flex;
    padding-top: 10px;
    padding-bottom: 10px;
}

.site-foot .navBar .Menu-Item {
    text-align: center;
    border-right: 1px solid #fff;
    padding-right: 5px;
    padding-left: 5px;
}

.site-foot .navBar .Menu-Item p {
    margin: 0px;
    font-weight: 500;
    font-size: 15px;
}

.site-foot .navBar .Menu-Item p a {
    text-decoration: none;
}

.site-foot .navBar .Menu-Item:Menu-Item p:first-child {
    padding-left: 0px !important;
}

.site-foot .navBar .Menu-Item:last-child {
    padding-right: 0px;
    border-right: none !important;
}

.site-foot .navBar .Menu-Item p a {
    color: #fff;
}

.certifications {
    display: flex;
    justify-content: space-between;
    padding-bottom: 20px;
}

.ideal,
.vaillant,
.worcester {
    margin-top: 20px;
}

.cert-regi p {
    margin: 0px;
}

/*.gallery a {
    height: 131px;
    width: 181px;
    overflow: hidden;
    display: inline-flex;
    margin-left: 5px;
    margin-bottom: 5px;
}

.gallery a img {
    width: 181px !important;
    height: auto !important;
}*/

.galley a {
    height: 131px;
    width: 181px;
    overflow: hidden;
    display: flex;
    margin-left: 5px;
    margin-bottom: 5px;
    position: relative;
    float: left;
}

.gallery a img {
    width: 181px !important;
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 131px !important;
    position: absolute;
}

.simple-lightbox {}

.deviceImg2 {
    display: none;
}

.sl-counter {
    display: none !important;
}

/* Mobile css */
@media only screen and (max-width:737px) {
    .desktop {
        display: none !important;
    }

    .mobile {
        display: block !important;
    }

    body,
    .wrap,
    .innerwrap,
    .header,
    .home-image,
    .header-white,
    .sd-width,
    .Menu-Item,
    .image-left,
    .text-right,
    .certifications,
    .cert-1,
    .map,
    .Locations,
    .gallery {
        width: 100% !important;
    }

    body {
        background: none !important;
    }

    .deviceImg2 {
        display: block !important;
        background: url(../images/bathroom-install-08.jpg) center center no-repeat;
        -webkit-background-size: cover;
        /* display: block; */
        clear: both;
        min-height: 200px;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        position: relative;
        width: 100%;
    }

    img {
        width: 100% !important;
        height: auto !important;
    }

    .deviceImg {
        max-height: 45px !important;
        width: auto !important;
    }

    .site-foot .navBar {
        display: block;
    }

    .container {
        margin-left: auto;
        margin-right: auto;
        width: fit-content;
    }

    .bar1,
    .bar2,
    .bar3 {
        width: 35px;
        height: 5px;
        background-color: #333;
        margin: 6px 0;
        transition: 0.4s;
    }

    .change .bar1 {
        -webkit-transform: rotate(-45deg) translate(-9px, 6px);
        transform: rotate(-45deg) translate(-9px, 6px);
    }

    .change .bar2 {
        opacity: 0;
    }

    .change .bar3 {
        -webkit-transform: rotate(45deg) translate(-8px, -8px);
        transform: rotate(45deg) translate(-8px, -8px);
    }

    .desktop-navigation {
        display: none !important;
    }

    .mobile-menu {
        display: block !important;
        text-align: center;
        background: rgba(255, 255, 255, 0.7);
        padding-bottom: 10px;
    }

    .navBar {
        display: none;
    }

    .nav-social {
        float: none;
        margin-left: auto;
        margin-right: auto;
        width: fit-content;
    }

    .logo {
        float: none;
        padding: 10px;
        text-align: center;
    }

    .contact-details {
        padding: 0px !important;
        text-align: center !important;
        color: #000 !important;
    }

    .contact-details p {
        margin: 0px;
        color: #000 !important;
    }

    .contact-details p a,
    .deviceMobile {
        color: #000 !important;
    }

    a[href^=tel],
    .appleLinks a,
    .appleLinksWhite a {
        color: #000 !important;
    }

    .telephone {
        color: #000 !important;
    }

    .telephone a[href^=tel],
    .contact-details p a[href^=tel] {
        text-decoration: inherit;
        color: #000 !important;
    }

    .header {
        /*margin-bottom:220px;*/
        margin-bottom: 0px !important;
    }

    .home-image-img {
        /*width: 1300px!important;margin-top: -440px!important;*/
        width: 100% !important;
        margin-top: 300px !important;
    }

    .certifications {
        justify-content: center;
        display: block;
    }

    .cert-1 {
        min-width: 50% !Important;
        height: auto !important;
    }

    .cert-1 img {
        max-width: 50% !important;
        height: auto;
    }

    .cert-1:last-child {
        padding-bottom: 50px;
    }

    .gallery a {
        height: 250px;
        width: 46%;
        overflow: hidden;
        display: inline-flex;
        margin-left: 2%;
        margin-bottom: 2%;
    }

    .gallery a img {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }

    .mobile-menu {
        z-index: 500;
        overflow: hidden;
        position: fixed;
        /* Set the navbar to fixed position */
        top: 0;
        /* Position the navbar at the top of the page */
        width: 100%;
        /* Full width */
    }

    #myMenu ul {
        margin: 0px;
        padding: 0px;
    }

    #myMenu ul li {
        list-style: none;
        display: block;
        border-bottom: 1px solid #999;
        padding: 10px;
        background-color: #383838;
        color: #fff;
    }

    #myMenu ul li a {
        color: #fff;
        text-decoration: none;
    }

    #myMenu ul .Selected {
        background-color: #0E75C5;
    }
}

@media only screen and (max-width:415px) {
    .gallery a {
        height: 150px;
    }

}