
/* ------------------------------------------------------------------- */
/* LAYOUT */
/* ------------------------------------------------------------------- */

    @media all and (min-width: 1601px) {

    }


@media all and (max-width: 1440px), screen and (max-device-width: 1440px) and (orientation : portrait) {

    /*  maps filter top */
    
    #selection-filter-envelope {
        left: -380px;
    }
   
    /*  maps */
    #google-maps-mapcontainer {
        width: calc(100% - 380px);
        margin-left: 380px;
    }

    /* postcode search */
    #stkistpcodesrch-wrapper {
        padding-left: 40px;
        padding-right: 40px;
    }
    #stockistpcdschresults-wrapper {
        max-width: 380px;
        min-width: 380px;
    }
    #stockistpcdschresults-column-1 {
        padding-left: 40px;
        padding-right: 40px;
    }

}

@media all and (max-width: 1380px), screen and (max-device-width: 1380px) and (orientation : portrait) {
    #google-maps-brandlist > ul {
        column-gap: 1.8vw;
    }
}

@media all and (max-width: 1340px), screen and (max-device-width: 1340px) and (orientation : portrait) {
    #google-maps-brandlist {
        column-gap: 30px;
    }
    #google-maps-brandlist > ul {
        column-gap: 2.4vw;
    }
    /*#google-maps-brandlist > span, #selection-filter-envelope span.filter-header {
        min-width: 70px;
        max-width: 70px;
    }*/
    #google-maps-brandlist > ul > li input[type="checkbox"] + label,
    #google-maps-brandlist > ul > li .brand-description {
        max-width: 70px;
    }
}


    @media all and (max-width: 1280px), screen and (max-device-width: 1280px) and (orientation : portrait) {

        /*  header logo */
        #website-logo-wrapper {
            margin-left: 20px;
        }

            #website-logo-wrapper a {
                width: 175px;
                height: 58px;
            }

            /*  filter  */
        #selection-filter-envelope {
            left: -330px;
            min-width: calc(100% + 330px - 120px);
        }

        /* stockist dearch on left */

        #stkistpcodesrch-wrapper {
            padding-left: 30px;
            padding-right: 30px;
            max-width: 270px;
            min-width: 270px;
        }

        #stockistpcdschresults-wrapper {
            max-width: 330px;
            min-width: 330px;
        }

        #stockistpcdschresults-column-1 {
            padding-left: 30px;
            padding-right: 30px;
        }

        /*  maps */
        #google-maps-mapcontainer {
            margin-left: 330px;
            width: calc(100% - 330px);
        }
    }

    @media all and (max-width: 1240px), screen and (max-device-width: 1240px) and (orientation : portrait) {

        #google-maps-brandlist > ul {
            /* column-gap: 38px; */
            /*column-gap: 20px;*/
            column-gap: 1.8vw;
        }
    }


@media all and (max-width: 1180px), screen and (max-device-width: 1180px) and (orientation : portrait) {
        /*  maps filter */
        /*#google-maps-brandlist > ul > li input[type="checkbox"] + label,
        #google-maps-brandlist > ul > li .brand-description {
            max-width: 60px;
        }*/
    /*#google-maps-brandlist {
        column-gap: 20px;
    }*/
    #google-maps-brandlist > ul {
        column-gap: 2.0vw;
    }
    #google-maps-brandlist > span, #selection-filter-envelope span.filter-header {
        min-width: 70px;
        max-width: 70px;
    }
    .more-options-wrapper:before {
        margin-right: 20px;
    }
}

    @media all and (max-width: 1150px), screen and (max-device-width: 1150px) and (orientation : portrait) {
        /*  more option popup */
        .google-maps-subset-wrapper .close-link {
            left: calc(50% + 45vw - 55px);
        }

        .google-maps-subset-main-wrapper {
            left: 50%;
            margin-left: -45vw;
        }

        .main-section .category-name {
            min-width: 170px;
        }

        .feature-category-item {
            column-gap: 80px;
        }
    }

@media all and (max-width: 1100px), screen and (max-device-width: 1100px) and (orientation : portrait) {
    /*  maps filter */
    #google-maps-brandlist > ul > li input[type="checkbox"] + label,
    #google-maps-brandlist > ul > li .brand-description {
        max-width: 64px;
    }

    #google-maps-brandlist > ul {
        column-gap: 18px;
    }
    #google-maps-brandlist {
         column-gap: 20px; 
    }
}

    @media all and (max-width: 1050px), screen and (max-device-width: 1050px) and (orientation : portrait) {

        /*  map filter */
        /*#google-maps-brandlist > ul {
            column-gap: 20px;
        }*/
        .more-options, .google-maps-subset-show {
            white-space: normal;
            padding-right: 10px;
        }
        /*  filter */
        .feature-category-item {
            column-gap: 50px;
        }
        /*.main-filter-div,*/
        .main-section {
            padding: 0 25px;
        }
    }

    @media all and (max-width: 991px), screen and (max-device-width: 991px) and (orientation : portrait) {

        /* font size adjustment */
        #introduction-wrapper h4,
        #summary-wrapper h4,
        #section-a-wrapper h4,
        #section-b-wrapper h4,
        #section-c-wrapper h4,
        #section-d-wrapper h4,
        #section-e-wrapper h4 {
            font-size: 28px !important;
            font-size: 2.8rem !important;
            line-height: 36px !important;
            line-height: 3.6rem !important;
        }

        /* General Layout */
        #container-d,
        #container-wrapper-efgh {
            width: auto;
            float: none;
        }

        #container-wrapper-efgh {
            width: auto;
        }

        #container-f {
            padding-bottom: 30px;
            padding-top: 20px;
        }

        /*  general layout */
        #container-wrapper-defgh {
            grid-column-gap: 20px;
            -ms-grid-columns: minmax(210px,210px) 1fr;
            grid-template-columns: minmax(210px,210px) 1fr;
        }


        .col-2.botpad-50,
        .col-2.botpad-80 {
            padding-bottom: 40px;
        }

        .col-2.toppad-50,
        .col-2.toppad-80 {
            padding-top: 40px;
        }
        /*  content section */
        div.content-section .col-2.botpad-80 {
            padding-bottom: 20px;
        }

        div.content-section .col-2.toppad-80 {
            padding-top: 20px;
        }


        .grid-col-2 {
            column-gap: 30px;
        }

        .col-2.colgap-100 {
            grid-column-gap: 40px;
        }

        /* Forms */
        textarea, input[type="number"], input[type="text"], input[type="password"] {
            font-size: 16px;
        }

        form li {
            width: 100%;
        }
        /*  general content */
        .col-2 .col-left,
        .col-2 .col-right {
            padding-top: var(--padding-top-991);
            padding-bottom: var(--padding-bottom-991);
            max-width: 100% !important;
        }

        .col-2 .col-left {
            padding-right: calc(var(--padding-right-resp) / 2);
        }

        .col-2 .col-right {
            padding-left: calc(var(--padding-left-resp) / 2);
        }

            .col-2 .col-left h3,
            .col-2 .col-left h4,
            .col-2 .col-right h3,
            .col-2 .col-right h4 {
                max-width: 100% !important;
            }

        .max-width-container {
            margin-top: var(--padding-top-991);
            margin-bottom: var(--padding-bottom-991);
        }

        h1, h2, h3, h4,
        .general-summary p,
        p,
        #blog-content-wrapper p {
            margin-bottom: 20px;
        }

        .general-summary p,
        .general-summary {
            line-height: 30px;
            line-height: 3.0rem;
        }

        /*  base  */
        body {
            -webkit-text-size-adjust: 100%;
            min-width: 320px;
            width: 100%;
            margin-left: 0 !important;
        }

        .body-fixed {
            overflow: hidden;
            position: fixed;
        }

            .body-fixed #container-a {
                position: absolute !important;
            }

        #container-a {
            min-width: 320px !important;
        }


        /* hide/show on mob only */
        .mobile-only {
            display: block;
        }

        .desktop-only {
            display: none !important;
        }

        /*  maps */

        #stkistpcodesrch-wrapper {
            /*margin-left: 35px;
            padding: 28px 25px 30px;*/
            max-width: 260px;
            min-width: 260px;
            padding-left: 25px;
            padding-right: 25px;
            padding-top: 150px;
            height: 100%;
        }

        #stockistpcdschresults-wrapper {
            /*left: 35px;
            padding: 0;*/
            max-width: 310px;
            min-width: 310px;
            /*top: calc(230px + 150px);*/
        }

        #stockistpcdschresults-column-1 {
            padding: 2px 25px 15px;
            max-height: 540px;
        }

        #google-maps-resetmap {
            left: 245px;
        }


        /* filter system  */


        /*  map filter */
        #google-maps-brandlist > ul {
            column-gap: 18px;
        }

        /*.main-filter-div,*/
        .main-section .top-level-category-name{
            font-size: 22px;
            font-size: 2.2rem;
            line-height: 32px;
            line-height: 3.2rem;

        }

        .google-maps-subset-inner-wrapper {
            padding: 25px;
            width: calc(100% - 50px);
            height: calc(100% - 50px);
        }

        .google-maps-subset-wrapper .close-link {
            left: calc(50% + 45vw - 50px);
            top: calc(50% - 45vh + 18px);
        }

        .main-section .category-name {
            font-size: 20px;
            font-size: 2.0rem;
            line-height: 30px;
            line-height: 3.0rem;
        }

        .main-section .top-level-category-name.smaller,
        .main-section .feature-category-item.generaldentistry .category-name,
        .main-section .feature-category-item.cosmeticdentistry .category-name,
        .main-section .feature-category-item.restorativedentistry .category-name,
        .main-section .feature-category-item.teethstraightening .category-name {
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 22px;
            line-height: 2.2rem;
        }

        .main-section .category-name {
            min-width: 150px;
        }


        .feature-category-item input[type="checkbox"] + label,
        .feature-category-item.location ul li input[type="radio"] + label {
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 20px;
            line-height: 2.0rem;
        }

        #google-maps-mapcontainer {
            margin-left: 310px;
            width: calc(100% - 310px);
        }

        #selection-filter-envelope {
            left: -310px;
        }
        /*   main filter */
        #selection-filter-envelope {
            left: -310px;
            min-width: 100%;
            padding-left: 40px;
            padding-right: 40px;
        }

        .more-options-wrapper:before {
            margin-right: 20px;
        }
        .more-options, .google-maps-subset-show {
            white-space: normal;
            padding-right: 10px;
        }

        .google-maps-subset-envelope .subset-items {
            top: 8px;
            right: 12px;
        }
    }


    @media all and (max-width: 950px), screen and (max-device-width: 950px) and (orientation : portrait) {
        /*  hide filter */
        #google-maps-brandlist {
            display:none;
        }
        #selection-filter-envelope {
            max-height: 100px;
            min-height: 100px;
        }
        .google-maps-subset-envelope {
            max-height: 100px;
            padding: 0;
            margin-left: auto;
        }
        .more-options-wrapper:before {
            display: none;
        }
        .more-options, .google-maps-subset-show {
            padding-right: 20px;
        }
        .google-maps-subset-envelope .subset-items {
            top: -15px;
            right: 20px;
        }

        /* stockist search layout */
        #stkistpcodesrch-wrapper {
            padding-top: calc(150px - 20px);
        }
        /*  hide maps */
        #google-maps-mapaddressinnercontainer,
        #google-maps-mapcontainer > div > div.gm-style {
            display: none !important;
        }

        #stkistpcodesrch-wrapper {
            min-width: calc(100% - 50px);
            max-width: calc(100% - 50px);
        }

        #stockistpcdschresults-wrapper {
            min-width: calc(100% - 0px);
            max-width: calc(100% - 0px);
            /*top: calc(230px + 95px);*/
            top: calc(230px + 95px - 20px);
            max-height: calc(560px + 20px);
        }
        #stockistpcdschresults-column-1 {
            padding-bottom: 30px;
            max-height: calc(540px - 20px);
        }
        #stockistpcdschresults-wrapper ul li > span.row-viewmap-link {
            display: none;
        }

        #stkistpcodesrch-locationsuggestions ul {
            max-width: 100%;
        }
        span.stkistpcodesrch-summary {
            max-width: 100%;
        }

    }



    @media all and (max-width: 930px), screen and (max-device-width: 930px) and (orientation : portrait) {

        /*  filter */
        .google-maps-subset-inner-wrapper {
            width: calc(100% - 50px);
            height: calc(100% - 50px);
            padding: 25px;
            row-gap: 10px;
        }
        /*.options-breakdown {
        column-gap: 25px;
    }*/
        .feature-category-item {
            column-gap: 30px;
            row-gap: 30px;
            padding: 30px 0;
        }

        /* .feature-category-item.location {
                padding-top: 10px;
            }*/

        .main-section {
            padding: 0 22px 0 10px;
        }

            .main-section .category-name {
                min-width: 120px;
                font-size: 18px;
                font-size: 1.8rem;
                line-height: 28px;
                line-height: 2.8rem;
            }

        .feature-category-item.location ul li a,
        .feature-category-item.location ul li input[type="radio"] + label {
            padding: 55px 16px 13px;
            background-position: top 15px left 15px !important;
        }

        .google-maps-subset-main-wrapper .close-link {
            top: calc(50% - 45vh + 17px);
            left: calc(50% + 45vw - 50px);
        }
    }

    @media all and (max-width: 815px), screen and (max-device-width: 815px) and (orientation : portrait) {
        .feature-category-item {
            flex-direction: column;
        }

        .feature-category-item {
            row-gap: 20px;
            padding: 25px 0 30px;
        }
        /*.options-breakdown {
        row-gap: 15px;
    }*/
        .main-section .category-name {
            min-height: auto;
        }
    }

    @media all and (max-width: 768px), screen and (max-device-width: 768px) and (orientation : portrait) {

        /*  hide primary nav */
        #primary-nav-wrapper {
            display: none;
        }


        /* Font Size Adjust */
        h2,
        h3 {
            font-size: 30px !important;
            font-size: 3.0rem !important;
            line-height: 36px !important;
            line-height: 3.6rem !important;
        }

        form .btn,
        input[type="button"],
        input[type="submit"],
        .button-submit {
            padding: 20px 15px;
        }

        #introduction-wrapper h4,
        #summary-wrapper h4,
        #section-a-wrapper h4,
        #section-b-wrapper h4,
        #section-c-wrapper h4,
        #section-d-wrapper h4,
        #section-e-wrapper h4 {
            font-size: 28px !important;
            font-size: 2.8rem !important;
            line-height: 36px !important;
            line-height: 3.6rem !important;
        }

        .col-2 {
            -ms-grid-columns: 1fr !important;
            grid-template-columns: 1fr !important;
            grid-row-gap: 40px;
        }

            .col-2 .text-content {
                grid-row-start: 2;
            }

            .col-2.colgap-5 {
                grid-row-gap: 5px;
            }

            .col-2.colgap-10 {
                grid-row-gap: 10px;
            }

            .col-2.colgap-100,
            .col-2.colgap-80,
            .col-2.colgap-60,
            .col-2.colgap-50 {
                grid-row-gap: 40px;
            }

        .max-width-container.nopad .col-2 .col-right:not(.text-content) {
            padding-top: 20px;
            padding-bottom: 0;
        }

        .col-2 .col-left.text-content,
        .col-2 .col-right.text-content {
            margin-left: auto;
            margin-right: auto;
        }

        .view-all-envelope.leftmargin-0 {
            margin-left: auto;
        }

        #introduction-wrapper h3,
        #summary-wrapper h3,
        #section-a-wrapper h3,
        #section-b-wrapper h3,
        #section-c-wrapper h3,
        #section-d-wrapper h3,
        #section-e-wrapper h3 {
            max-width: 100% !important;
        }

        #gbl-google-maps-wrapper .mapaddressinnercontainer .tab-content .location-heading .business-name2 {
            font-size: 35px !important;
            font-size: 3.5rem !important;
            line-height: 40px !important;
            line-height: 4.0rem !important;
        }



        /* padding */
        div#container-b-inner,
        div#container-c,
        #container-wrapper-defgh,
        #container-x,
        #container-y,
        #container-z {
            padding-left: var(--padding-left-tablet);
            padding-right: var(--padding-right-tablet);
        }

        #container-e {
            padding-top: 15px;
        }



        #summary-wrapper, #page-header-wrapper {
            text-align: center;
        }

        /*  bct */
        #bct-wrapper {
            text-align: center;
        }

        /*   layout for general page */
        #container-d,
        #container-wrapper-efgh {
            grid-column-start: span 2;
            padding: 0;
        }

        #general-navigation-wrapper {
            display: none !important;
        }

        /* hero div */
        div.hero {
            min-height: 200px;
        }

        div.legal {
            min-height: 150px;
        }

        .tiny-heading {
            font-size: 14px;
            font-size: 1.4rem;
        }

        /*  footer nav */
        #container-y-inner {
            justify-content: center;
            flex-direction: column;
            align-items: center;
        }


        #container-y,
        #container-z {
            padding: 20px 20px;
        }

        /*  content - 2 cols*/
        .max-width-container {
            margin: 50px auto;
        }

            .max-width-container.reduced-margin-nobottom {
                margin-top: 50px;
            }

        .col-2 {
            -ms-grid-columns: 1fr;
            grid-template-columns: 1fr;
            -ms-grid-rows: auto auto;
            grid-template-rows: auto auto;
        }

            .col-2 .col-left, .col-2 .col-right {
                padding: 25px 20px;
            }

                .col-2 .col-left.image-bg, .col-2 .col-right.image-bg {
                    background-position: top center;
                    min-height: 320px;
                    padding: 0;
                    grid-row-start: 1;
                }


        /* content */
        #introduction-wrapper,
        #summary-wrapper,
        #section-a-wrapper,
        #section-b-wrapper,
        #section-c-wrapper,
        #section-d-wrapper,
        #section-e-wrapper {
            text-align: center;
        }


        /*  make everything center*/
        .left-section,
        .right-section {
            margin-left: auto;
            margin-right: auto;
        }

        .text-left,
        .text-right {
            text-align: center;
        }

        h3 > br {
            display: none;
        }



        /*  maps */
        #stkistpcodesrch-wrapper {
            margin-left: 0px;
        }

        /*#stockistpcdschresults-wrapper {
            left: 20px;
        }*/

        #google-maps-resetmap {
            left: 220px;
        }

        /*  filter  */
        #selection-filter-envelope {
            padding-left: 20px;
            padding-right: 20px;
        }
        /*#stockistpcdschresults-column-1 {
            padding: 0 0 25px;
        }*/
        /*#stockistpcdschresults-wrapper ul {
            width:calc(100% - 30px);
        }*/
    }

    @media all and (max-width: 650px), screen and (max-device-width: 650px) and (orientation : portrait) {
        /* lightbox */
        .google-maps-subset-main-wrapper .close-link {
            top: calc(50% - 45vh + 12px);
            left: calc(50% + 45vw - 42px);
        }

        .main-section {
            padding: 0 12px 0 0px;
        }

        .feature-category-item {
            row-gap: 15px;
        }

            .feature-category-item ul {
                column-gap: 15px;
                row-gap: 15px;
            }

            .feature-category-item.location ul {
                column-gap: 10px;
                row-gap: 10px;
            }

            .feature-category-item.atoz {
                margin-right: 0px;
            }

            /* .feature-category-item.atoz ul {
                    column-gap: 10px;
                    row-gap: 10px;
                    margin-right: 0;
                }*/

            .feature-category-item ul li {
                width: calc((100% - (15px * 2)) / 3);
            }

            .feature-category-item.location ul li {
                width: calc((100% - (10px * 3)) / 4);
            }

                /* .feature-category-item.atoz ul li {
                width: calc((100% - (10px * 8)) / 9);
            }*/

                .feature-category-item.location ul li a,
                .feature-category-item.location ul li input[type="radio"] + label {
                    padding: 45px 12px 10px;
                    background-position: top 12px left 12px !important;
                }

                .feature-category-item input[type="checkbox"] + label,
                .feature-category-item.location ul li input[type="radio"] + label {
                    font-size: 13px;
                    font-size: 1.3rem;
                    line-height: 20px;
                    line-height: 2.0rem;
                }

                    .feature-category-item input[type="checkbox"] + label:before {
                        background-size: 42px !important;
                        width: 42px !important;
                        height: 42px !important;
                        top: calc(50% - 21px) !important;
                    }

            .feature-category-item input[type="checkbox"] + label {
                padding-left: 55px;
            }
    }

    @media all and (max-width: 568px), screen and (max-device-width: 568px) and (orientation : portrait) {

        /* Font Size Adjust */
        h2,
        h3 {
            font-size: 28px !important;
            font-size: 2.8rem !important;
            line-height: 34px !important;
            line-height: 3.4rem !important;
            margin-bottom: 20px !important;
            /*font-weight: 200 !important;*/
        }

        #page-header-wrapper h3 {
            font-size: 30px !important;
            font-size: 3.0rem !important;
        }

        #introduction-wrapper h4,
        #summary-wrapper h4,
        #section-a-wrapper h4,
        #section-b-wrapper h4,
        #section-c-wrapper h4,
        #section-d-wrapper h4,
        #section-e-wrapper h4 {
            font-size: 26px !important;
            font-size: 2.6rem !important;
            line-height: 32px !important;
            line-height: 3.2rem !important;
        }


        .col-2.colgap-100, .col-2.colgap-80, .col-2.colgap-60, .col-2.colgap-50 {
            grid-row-gap: 35px;
        }


        #container-f {
            padding-bottom: 20px;
            padding-top: 10px;
        }

        /* Footer */

        #container-x {
            padding-left: var(--padding-left-mobile);
            padding-right: var(--padding-right-mobile);
        }

        #container-x-inner {
            -ms-grid-columns: 1fr;
            grid-template-columns: 1fr;
            grid-row-gap: 10px;
            grid-column-gap: 0px;
        }

        #container-y {
            text-align: center;
        }

        /* bct title */
        #container-c {
            padding: 0;
        }

        #bct-wrapper {
            display: none;
        }

        #container-wrapper-defgh {
            padding-top: 15px;
        }
        /*  footer section */

        #container-z {
            text-align: center;
        }

        /* Default Table */

        table td,
        table th {
            padding: 5px;
        }


        /* Form */
        input[type="button"],
        input[type="submit"],
        .button-submit {
            padding: 0 10px 0 10px;
            height: 60px;
        }

        /*  content - 2 cols*/
        .max-width-container {
            margin: 35px auto;
            padding-left: var(--padding-left-mobile);
            padding-right: var(--padding-right-mobile);
        }

            .max-width-container.reduced-margin-nobottom {
                margin-top: 30px;
            }



        /*  cookies */
        #website-cookies {
            background-size: 45px;
        }

        #website-cookies-prompt {
            padding-left: 78px;
        }

        /*----------------------------*/
        /*  map lightbox filtering */
        .feature-category-item ul {
            row-gap: 10px;
        }

            .feature-category-item ul li {
                width: calc((100% - (15px * 1)) / 2);
            }

                .feature-category-item ul li label span {
                    max-width: 90px;
                }

        /*  tags */
        .feature-category-item.tags ul {
            column-gap: 8px;
            row-gap: 3px;
        }
    }


    @media all and (max-width: 480px), screen and (max-device-width: 480px) and (orientation : portrait) {
    }

    @media all and (max-width: 425px), screen and (max-device-width: 425px) and (orientation : portrait) {

        /*----------------------------*/
        /*  map - filtering system */
        .feature-category-item input[type="checkbox"] + label:before {
            background-size: 38px !important;
            width: 38px !important;
            height: 38px !important;
            top: calc(50% - 18px) !important;
        }
        .main-section .feature-category-item.restorativedentistry,
        .main-section .feature-category-item.cosmeticdentistry, 
        .main-section .feature-category-item.generaldentistry {
            padding: 10px 0;
            row-gap: 10px;
        }
        .feature-category-item ul {
            column-gap: 0;
            row-gap: 4px;
        }

            .feature-category-item ul li {
                width: 100%;
            }

                .feature-category-item ul li label span {
                    max-width: none;
                }

        /*  main */
        .main-section {
            margin-bottom: 140px;
        }

        /*  bottom section */
        .bottom-section {
            flex-direction: column;
            row-gap: 10px;
            align-items: stretch;
            padding: 10px 25px 25px;
        }

            .bottom-section a {
                display: flex;
                justify-content: center;
                padding: 15px 20px !important;
                max-width: 180px;
            }
    }


    @media only screen and (max-device-width : 320px) and (orientation : portrait) {
    }
