@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }






.WMBSC {
    width: auto;
}

    .WMBSC .WMBSC-loading {
        display: none;
    }

    .WMBSC.loading .WMBSC-content {
        opacity: 0;
        height: 0;
        overflow: hidden;
        position: relative;
    }

    .WMBSC.loading .WMBSC-loading {
        display: block;
    }

    .WMBSC .slick-slider {
        position: relative;
        display: block;
        box-sizing: border-box;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -khtml-user-select: none;
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-tap-highlight-color: transparent;
    }

    .WMBSC .slick-list {
        position: relative;
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
    }

        .WMBSC .slick-list:focus {
            outline: none;
        }

        .WMBSC .slick-list.dragging {
            cursor: pointer;
            cursor: hand;
        }

    .WMBSC .slick-slider .slick-track,
    .WMBSC .slick-slider .slick-list {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .WMBSC .slick-track {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

        .WMBSC .slick-track:before,
        .WMBSC .slick-track:after {
            display: table;
            content: "";
        }

        .WMBSC .slick-track:after {
            clear: both;
        }

    .WMBSC .slick-loading .slick-track {
        visibility: hidden;
    }

    .WMBSC .slick-slide {
        display: none;
        float: left;
        height: 100%;
        min-height: 1px;
    }

    .WMBSC [dir="rtl"] .slick-slide {
        float: right;
    }

    .WMBSC .slick-slide img {
        display: block;
    }

    .WMBSC .slick-slide.slick-loading img {
        display: none;
    }

    .WMBSC .slick-slide.dragging img {
        pointer-events: none;
    }

    .WMBSC .slick-initialized .slick-slide {
        display: block;
    }

    .WMBSC .slick-loading .slick-slide {
        visibility: hidden;
    }

    .WMBSC .slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }

    .WMBSC .slick-arrow.slick-hidden {
        display: none;
    }
    /* THEME */
    .WMBSC .slick-loading .slick-list {
        background: #fff url('./ajax-loader.gif') center center no-repeat;
    }

    .WMBSC .slick-prev,
    .WMBSC .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: calc(50% - 20px);
        display: block;
        width: 30px;
        height: 30px;
        padding: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        cursor: pointer;
        color: transparent;
        border: none;
        outline: none;
        background: transparent;
        background-color: #4A5989;
        box-shadow: 3px 2px 10px 0px rgba(0,0,0,0.3);
        -webkit-box-shadow: 3px 2px 10px 0px rgba(0,0,0,0.3);
        -moz-box-shadow: 3px 2px 10px 0px rgba(0,0,0,0.3);
        z-index: 2;
    }

        .WMBSC .slick-prev:hover,
        .WMBSC .slick-prev:focus,
        .WMBSC .slick-next:hover,
        .WMBSC .slick-next:focus {
            outline: none;
        }

            .WMBSC .slick-prev:hover:before,
            .WMBSC .slick-prev:focus:before,
            .WMBSC .slick-next:hover:before,
            .WMBSC .slick-next:focus:before {
                opacity: 1;
            }

        .WMBSC .slick-prev.slick-disabled:before,
        .WMBSC .slick-next.slick-disabled:before {
            opacity: 0.25;
        }

        .WMBSC .slick-prev:before,
        .WMBSC .slick-next:before {
            font-family: "slick";
            font-size: 20px;
            line-height: 15px;
            height: 30px;
            width: 30px;
            opacity: 0.75;
            color: white;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

    .WMBSC .slick-prev {
        left: 0;
    }

    .WMBSC [dir="rtl"] .slick-prev {
        right: 0;
        left: auto;
    }

    .WMBSC .slick-prev:before {
        content: "←";
    }

    .WMBSC [dir="rtl"] .slick-prev:before {
        content: "→";
    }

    .WMBSC .slick-next {
        right: 0;
    }

    .WMBSC [dir="rtl"] .slick-next {
        right: auto;
        left: 0;
    }

    .WMBSC .slick-next:before {
        content: "→";
    }

    .WMBSC [dir="rtl"] .slick-next:before {
        content: "←";
    }

    .WMBSC .slick-dotted.slick-slider {
        margin-bottom: 30px;
    }

    .WMBSC .slick-dots {
        display: block;
        width: 100%;
        padding: 0;
        margin: 20px 0 0 0;
        list-style: none;
        text-align: center;
    }

        .WMBSC .slick-dots li {
            position: relative;
            display: inline-block;
            width: 20px;
            height: 20px;
            margin: 0 5px;
            padding: 0;
            cursor: pointer;
        }

            .WMBSC .slick-dots li button {
                font-size: 0;
                line-height: 0;
                display: block;
                width: 20px;
                height: 20px;
                padding: 5px;
                cursor: pointer;
                color: transparent;
                border: 0;
                outline: none;
                background: transparent;
                border-radius: 50%;
                background-color: #4A5989;
                opacity: 1;
            }

                .WMBSC .slick-dots li button:hover,
                .WMBSC .slick-dots li button:focus {
                    outline: none;
                }

            .WMBSC .slick-dots li.slick-active button {
                opacity: 0.5;
            }


.box {
    position: relative;
    max-width: 600px;
    width: 90%;
    height: 400px;
    background: #fff;
    box-shadow: 0 0 15px rgba(0,0,0,.1);
}

/* common */
.ribbon {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
}

    .ribbon::before,
    .ribbon::after {
        position: absolute;
        z-index: -1;
        content: '';
        display: block;
        border: 5px solid #6da322;
    }

    .ribbon span {
        position: absolute;
        display: block;
        width: 225px;
        padding: 15px 0;
        background-color: #91ce3a;
        box-shadow: 0 5px 10px rgba(0,0,0,.1);
        color: #fff;
        font: 700 18px/1 'Open Sans', sans-serif;
        text-shadow: 0 1px 1px rgba(0,0,0,.2);
        text-transform: uppercase;
        text-align: center;
    }

/* top left*/
.ribbon-top-left {
    top: -10px;
    left: -10px;
}

    .ribbon-top-left::before,
    .ribbon-top-left::after {
        border-top-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-top-left::before {
        top: 0;
        right: 0;
    }

    .ribbon-top-left::after {
        bottom: 0;
        left: 0;
    }

    .ribbon-top-left span {
        right: -25px;
        top: 30px;
        transform: rotate(-45deg);
    }

/* top right*/
.ribbon-top-right {
    top: -10px;
    right: -10px;
}

    .ribbon-top-right::before,
    .ribbon-top-right::after {
        border-top-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-top-right::before {
        top: 0;
        left: 0;
    }

    .ribbon-top-right::after {
        bottom: 0;
        right: 0;
    }

    .ribbon-top-right span {
        left: -25px;
        top: 30px;
        transform: rotate(45deg);
    }

/* bottom left*/
.ribbon-bottom-left {
    bottom: -10px;
    left: -10px;
}

    .ribbon-bottom-left::before,
    .ribbon-bottom-left::after {
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-bottom-left::before {
        bottom: 0;
        right: 0;
    }

    .ribbon-bottom-left::after {
        top: 0;
        left: 0;
    }

    .ribbon-bottom-left span {
        right: -25px;
        bottom: 30px;
        transform: rotate(225deg);
    }

/* bottom right*/
.ribbon-bottom-right {
    bottom: -10px;
    right: -10px;
}

    .ribbon-bottom-right::before,
    .ribbon-bottom-right::after {
        border-bottom-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-bottom-right::before {
        bottom: 0;
        left: 0;
    }

    .ribbon-bottom-right::after {
        top: 0;
        right: 0;
    }

    .ribbon-bottom-right span {
        left: -25px;
        bottom: 30px;
        transform: rotate(-225deg);
    }

.productBoxDiv {
    transition: .2s ease-out;
}

    .productBoxDiv:hover {
        box-shadow: 0 20px 30px rgba(0,0,0,.8);
        transform: translate3d(0,-10px,0);
    }


:root {
    --color-primary-1: #032564; /** Blue - Heading Text **/
    --color-primary-2: #414042; /** Grey - Body Text **/
    --color-primary-3: #ffffff; /** White - Main Background, Alt. Text **/
    --color-secondary-1: #0c1a33; /** Dark Blue **/
    --color-secondary-2: #032564; /** Blue **/
    --color-secondary-3: #f2f7f9; /** Light Blue **/
    --color-secondary-4: #3a91ce; /** Mid Blue Triadic **/
    /**--color-secondary-4: #3acec1;  Mid Blue Tetradic **/
    --color-highlight-1: #91ce3a; /** Green - Buttons, Highlights **/
    --color-highlight-2: #57aa46; /** Green - Button Rollovers **/

    --font-primary: 'Open Sans', sans-serif;
    --font-secondary:;
    --content-padding: 2.5rem;
    --content-padding-x2: 5rem;
    --outer-row: 0.625rem;
    --divider: 1.25rem;
    --heading-h1: 2.500em;
    --heading-h2: 2em;
    --heading-h3: 1.5em;
    --heading-h4: 1.25em;
    --heading-h5: 1.125em;
    --heading-h6: 1.125em;
    --base-font: 16px;
}





/** Warnings **/
.validation_error {
    display: none;
}

.validation_message {
    display: none !important;
}

.gfield_contains_required.gfield_error input,
.gfield_contains_required.gfield_error textarea,
.gfield_contains_required.gfield_error select,
.gfield_contains_required.gfield_error .jcf-select .jcf-select-text {
    border-color: red;
}

.gfield_contains_required.gfield_error label {
    color: red !important;
}

.gform_body::before,
.gfield::before,
.clear-multi::before,
.gform_body::after,
.gfield::after,
.clear-multi::after,
.ginput_container_checkbox::before,
.ginput_container_checkbox::after,
.ginput_container_checkbox ul::before,
.ginput_container_checkbox ul::after {
    content: ' ';
    display: table;
}

.gform_body::after,
.gfield::after,
.clear-multi::after,
.ginput_container_checkbox::after,
.ginput_container_checkbox ul::after {
    clear: both;
}




/*Request Form*/
.ginput_container_select {
    position: relative;
}

    .ginput_container_select::before {
        content: '\f107';
        color: var(--color-primary-1);
        display: block;
        font-size: 1.25em;
        font-family: "Font Awesome 5 Pro";
        font-weight: 900;
        pointer-events: none;
        position: absolute;
        top: 50%;
        right: 1rem;
        transform: translateY(-50%);
    }

.gchoice input[type="checkbox"],
.gchoice input[type="radio"] {
    background-color: transparent;
    border: 2px solid var(--color-primary-1);
    float: left;
    height: 20px;
    margin-right: 0.625rem;
    width: 20px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.gchoice input[type="radio"] {
    border-radius: 50%;
}

.gchoice input:checked {
    background-color: var(--color-primary-1);
    background-clip: content-box;
    border-color: var(--color-primary-1);
    outline: none;
    padding: 3px;
}



/** Quote Request **/

.gfield_html {
    margin-top: calc(var(--divider) * 2);
}

    .gfield_html:first-child {
        margin-top: 0;
    }

#input_4_2,
#input_4_17,
#input_4_6,
#input_4_8 {
    display: flex;
    flex-wrap: wrap;
}

#input_4_6,
#input_4_8 {
    margin-top: -1.25rem !important;
}

    #input_4_2 input,
    #input_4_17 input,
    #input_4_6 input,
    #input_4_8 input {
        opacity: 0;
        top: 0;
        left: 50%;
    }

#input_4_2 > li,
#input_4_17 > li {
    width: 33.33%;
}

#input_4_17 > li {
    padding-bottom: 0.625rem;
}

#input_4_2 label,
#input_4_17 label {
    background: url("../img/blank.gif");
    color: var(--color-primary-1);
    cursor: pointer;
    
    font-weight: 700;
    text-align: center;
}

    #input_4_2 label::before,
    #input_4_17 label::before {
        background-color: var(--color-primary-3);
        background-size: contain;
        border: 2px solid var(--color-primary-3);
        border-radius: 260px;
        content: '';
        display: block;
        margin: 0 auto 1em;
        max-height: 260px;
        max-width: 260px;
        opacity: 0.3;
        width: 100%;
        transition: border-color 0.25s ease-out, opacity 0.25s ease-out;
    }

#input_4_2 input:checked + label::before,
#input_4_17 input:checked + label::before {
    border-color: var(--color-highlight-1);
    opacity: 1;
}

#input_4_2 #label_4_2_0::before,
#input_4_17 #label_4_17_1::before {
    content: url("icon-solar-energy-white.svg");
}

#input_4_2 #label_4_2_1::before,
#input_4_17 #label_4_17_2::before {
    content: url("icon-battery-storage-white.svg");
}

#input_4_2 #label_4_2_2::before {
    content: url("icon-complete-system-white.svg");
}

#input_4_17 #label_4_17_3::before {
    content: url("icon-air-conditioning-white.svg");
}

#input_4_17 #label_4_17_4::before {
    content: url("icon-ev-charging-white.svg");
}

#input_4_17 #label_4_17_5::before {
    content: url("hot-water-icon-white.svg");
}

#input_4_17 #label_4_17_6::before {
    content: url("induction-cook-top-icon-white.svg");
}

#input_4_6 > li,
#input_4_8 > li {
    margin-top: 0;
    padding-top: 1.25rem;
    width: 100%;
}

#input_4_6 label,
#input_4_8 label {
    background-color: var(--color-primary-3);
    color: var(--color-primary-1);
    cursor: pointer;
    display: block;
    font-weight: 700;
    padding: 0 1em 1em;
    text-align: left;
}

    #input_4_6 label::before,
    #input_4_8 label::before {
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        content: '';
        display: block;
        margin: 0 -1em 0.85em;
        max-width: auto;
        padding-top: 100%;
        opacity: 0.3;
        transition: opacity 0.25s ease-out;
    }

#input_4_6 input:checked + label,
#input_4_8 input:checked + label {
    background-color: var(--color-highlight-1);
    color: var(--color-primary-3);
}

    #input_4_6 input:checked + label::before,
    #input_4_8 input:checked + label::before {
        opacity: 1;
    }

#input_4_6 #label_4_6_0::before {
    background-image: url("../img/property-type-house.jpg");
}

#input_4_6 #label_4_6_1::before {
    background-image: url("../img/property-type-town-house.jpg");
}

#input_4_6 #label_4_6_2::before {
    background-image: url("../img/property-type-unit.jpg");
}

#input_4_6 #label_4_6_3::before {
    background-image: url("../img/property-type-apartment.jpg");
}

#input_4_8 #label_4_8_0::before {
    background-image: url("../img/roof-type-tin.jpg");
}

#input_4_8 #label_4_8_1::before {
    background-image: url("../img/roof-type-concrete.jpg");
}

#input_4_8 #label_4_8_2::before {
    background-image: url("../img/roof-type-terracotta.jpg");
}

#input_4_8 #label_4_8_3::before {
    background-image: url("../img/roof-type-klip-lok.jpg");
}

/** Form Body **/

.gform_wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.gform_fields,
#gform_fields_4 .gfield_radio,
#gform_fields_4 .gfield_checkbox,
.ginput_container_address {
    font-size: 1em;
    margin-left: calc(var(--outer-row) * -1);
    margin-right: calc(var(--outer-row) * -1);
}

    ul.gform_fields > li,
    #gform_fields_4 .gfield_radio > li,
    #gform_fields_4 .gfield_checkbox > li,
    .ginput_container_address > span {
        display: block;
        margin-bottom: var(--divider);
        padding-left: var(--outer-row) !important;
        padding-right: var(--outer-row) !important;
    }

    #gform_fields_4 .gfield_radio:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li,
    #gform_fields_4 .gfield_checkbox:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li {
        padding-left: calc(var(--outer-row) + 30px) !important;
    }

        #gform_fields_4 .gfield_radio:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li input,
        #gform_fields_4 .gfield_checkbox:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li input {
            left: var(--outer-row) !important;
        }

    .ginput_container_address > span:last-child {
        margin-bottom: 0;
    }

.ginput_container_checkbox,
.ginput_container_radio {
    margin-top: -0.625rem;
}

    .ginput_container_checkbox li,
    .ginput_container_radio li {
        margin-bottom: 0 !important;
        margin-top: 0.625rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        position: relative;
    }

        .ginput_container_checkbox li input,
        .ginput_container_radio li input {
            position: absolute;
            left: 0;
            top: 0;
        }

            .ginput_container_checkbox li input + label,
            .ginput_container_radio li input + label {
                display: block;
                line-height: 20px;
                margin-bottom: 0;
            }


/* Small screens */
@media only screen {
}
/* Define mobile styles */

@media only screen and (max-width: 40em) {
}
/* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* Medium screens - min-width 640px */
@media only screen and (min-width: 40em) {

    :root {
        --content-padding: 3.75rem;
        --content-padding-x2: 7rem;
        --outer-row: 0.9375rem;
        --divider: 1.875rem;
        --heading-h1: 2.778em;
        --heading-h2: 2.222em;
        --heading-h3: 1.556em;
        --heading-h4: 1.333em;
        --heading-h5: 1.111em;
        --heading-h6: 1.111em;
        --base-font: 18px;
    }

    .site-logo {
        height: 70px;
        width: 235px;
    }

    .site-navigation {
        padding-top: 130px;
    }

    #location-map {
        height: 500px;
    }

    .divider--small {
        padding-top: 0 !important;
    }

    .figure-contained {
        max-width: 320px;
    }

    .figure-contained--large {
        max-width: 400px;
    }

    .alm-listing {
        padding-top: calc(var(--divider) / 2) !important;
    }

    .alm-btn-wrap button.alm-load-more-btn {
        max-width: 220px;
    }

    #input_4_2 > li {
        width: 25%;
    }

    #input_4_17 > li {
        width: 33.33%;
    }

    #input_4_6,
    #input_4_8 {
        margin-top: -1.875rem !important;
    }

        #input_4_6 > li,
        #input_4_8 > li {
            padding-top: 1.875rem;
            width: 50%;
        }

    .input_left,
    .input_right,
    .name_first,
    .name_last,
    .input_third,
    .ginput_container_address > span:not(.ginput_full) {
        float: left;
        width: 50%;
    }

    .input_third,
    .ginput_container_address > span:not(.ginput_full) {
        width: 33.33%;
    }

    .ginput_container_address > span:not(.ginput_full) {
        margin-bottom: 0;
    }

    .name_first {
        margin-bottom: 0;
        padding-right: var(--outer-row);
    }

    .name_last {
        padding-left: var(--outer-row);
    }
}

@media only screen and (min-width: 40em) and (max-width: 64em) {
}
/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Large screens - min-width 1024px */
@media only screen and (min-width: 64em) {

    :root {
        --content-padding: 5rem;
        --content-padding-x2: 5rem;
        --outer-row: 1.875rem;
        --heading-h1: 3.333em;
        --heading-h2: 2.444em;
        --heading-h3: 1.667em;
        --heading-h4: 1.444em;
        --heading-h5: 1.222em;
        --heading-h6: 1.111em;
    }

    .bottom-bar__legality {
        padding-bottom: calc(var(--content-padding) / 4);
        padding-top: calc(var(--content-padding) / 4);
    }

    .divider--medium {
        padding-top: 0 !important;
    }

    #input_4_6 > li,
    #input_4_8 > li {
        width: 25%;
    }

    ul.gform_fields,
    #gform_fields_4 .gfield_radio,
    #gform_fields_4 .gfield_checkbox,
    .ginput_container_address {
        margin-left: calc(var(--outer-row) * -0.5);
        margin-right: calc(var(--outer-row) * -0.5);
    }

        ul.gform_fields > li,
        #gform_fields_4 .gfield_radio > li,
        #gform_fields_4 .gfield_checkbox > li,
        .ginput_container_address > span {
            padding-left: calc(var(--outer-row) / 2) !important;
            padding-right: calc(var(--outer-row) / 2) !important;
        }

        #gform_fields_4 .gfield_radio:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li,
        #gform_fields_4 .gfield_checkbox:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li {
            padding-left: calc((var(--outer-row) / 2) + 30px) !important;
        }

            #gform_fields_4 .gfield_radio:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li input,
            #gform_fields_4 .gfield_checkbox:not(#input_4_17):not(#input_4_6):not(#input_4_8) > li input {
                left: calc(var(--outer-row) / 2) !important;
            }

    .name_first {
        padding-right: calc(var(--outer-row) / 2);
    }

    .name_last {
        padding-left: calc(var(--outer-row) / 2);
    }

   
}