﻿/********** PRODUCT LISTING *********/

#product-selector {
    padding-top: 75px;
    background-image: url(/images/wallpapers/full-top-blue.jpg?format=webp);
    background-repeat: no-repeat;
    background-size: 100% 400px;
}

    #product-selector .top-section {
        padding-bottom: 150px;
    }

        #product-selector .top-section h1 {
            font-size: 80px;
            line-height: 90px;
            padding-bottom: 25px;
            color: white;
        }

        #product-selector .top-section p {
            color: white;
            font-weight: 300;
            font-size: 24px;
            line-height: 36px;
            width: 745px;
        }

        #product-selector .top-section img.floating-image {
            width: 45%;
            position: absolute;
            right: -50px;
            top: 15px;
        }

#product-listing.col-md-9 {
    padding: 0;
}

.product { /*border: 1px solid #e6e6e6;*/
    height: 313px;
    padding: 5px !important;
    position: relative;
    margin: 0 0 18px;
    background-color: #F2F2F2;
}

    .product h3 {
        color: #212e84;
    }

    .product .product-img {
        position: relative;
        background-color: #fff;
        display: block; /*float: left;*/
        height: 215px;
        width: 100%; /*margin-bottom: 11px;*/
    }

        .product .product-img > a {
            display: block;
        }

    .product img {
        margin: 0 auto;
        background: #fff;
        padding-top: 35px;
        display: block;
        width: auto;
        height: 175px;
        -ms-interpolation-mode: bicubic;
    }

    .product .action {
        border: 1px solid rgba(0,0,0,0.06);
    }

.row.product-selector-content {
    padding-bottom: 20px;
    margin: 0px;
}

.product-details {
    padding: 15px;
    text-align: left;
    display: block; /*float: left;*/
    width: 100%;
}

    .product-details h3 {
        font-weight: 300;
        word-wrap: break-word;
        display: block;
        padding: 0 0 4px;
    }

        .product-details h3 a, .product-details h3 a:visited {
            text-align: left;
            font-size: 18px;
            font-weight: 300;
            line-height: 26px;
            display: block;
            white-space: normal;
            color: #000;
            cursor: pointer;
        }

            .product-details h3 a:hover {
                text-decoration: underline;
            }

    .product-details h6 {
        font-size: 1em;
        padding: 0 0 10px;
    }

    .product-details span {
        font-size: 12px;
        line-height: 18px; /*height: 4.5em;*/
        text-overflow: ellipsis;
        overflow: hidden;
        word-wrap: break-word;
        display: inline-block;
    }

.product div.checkbox-title {
    font-size: .8em;
    position: absolute;
    bottom: 10px;
    right: 15px;
}

    .product div.checkbox-title span.custom-checkbox {
        float: right;
        margin: 0 0 0 10px;
    }
/********** PRODUCT COMPARISON WIDGET **********/

.handle, .handle:visited {
    float: left;
    background: #eeeef0;
    width: 54px !important;
    height: auto;
    box-shadow: 0 4px 4px rgba(0,0,0,0.4);
    text-indent: 0 !important;
    text-align: center;
    text-decoration: none;
    z-index: 9;
}

    .handle:hover {
        text-decoration: none;
    }

.icon-bucket {
    background: url(/Images/icon-bucket.png?format=webp) 12px 10px no-repeat;
    background-size: 28px;
    border-bottom: 1px solid #e8e8e8;
    display: block;
    position: relative;
    height: 48px;
    width: 100%;
    text-align: center;
}

    .icon-bucket .badge {
        position: absolute;
        top: -10px;
        right: 2px;
    }

.icon-arrow {
    display: table;
    height: 48px;
    width: 100%;
}

#comparisonContainer {
    z-index: 999;
}

    #comparisonContainer .icon-arrow i { /*display: table-cell;*/
        padding: 15px 0 10px;
        font-size: 18px;
        line-height: 22px; /*vertical-align: middle;*/
        opacity: .5;
    }

    #comparisonContainer a:hover .icon-arrow i {
        opacity: 1.0;
    }

.productSelector .sliding-panel .icon-arrow-left {
    display: block;
}

.productSelector .sliding-panel .icon-arrow-right {
    display: none;
}

.productSelector .sliding-panel.open .icon-arrow-left {
    display: none;
}

.productSelector .sliding-panel.open .icon-arrow-right {
    display: block;
}

#comparisonBucket {
    background-color: #fff;
    border: 1px solid #e6e6e6;
    float: right;
    padding: 15px 15px 25px;
    position: relative;
    box-shadow: -2px 4px 4px rgba(0,0,0,0.1);
    width: 264px;
    z-index: 99;
}

    #comparisonBucket .ng-scope {
        float: left;
    }

        #comparisonBucket .ng-scope ul + p {
            float: right;
            padding: 25px 15px 0px;
        }

    #comparisonBucket.products .action {
        top: 0;
        bottom: inherit;
        line-height: 19px;
    }

    #comparisonBucket.products img {
        height: 89px;
        -ms-interpolation-mode: bicubic;
    }

    #comparisonBucket ul {
        float: left;
    }

    #comparisonBucket.thumbs li:nth-child(2n) {
        margin: 0 0 0 5px;
    }

    #comparisonBucket .button {
        float: left;
        clear: both;
        margin: 30px 0 0;
    }

    #comparisonBucket.thumbs ul li {
        text-align: center;
    }
/********** PRODUCT COMPARISON WIDGET **********/

.productComparison .product-image {
    height: 200px;
}

.ProductComparer .row {
    border-bottom: none;
}

    .ProductComparer .row.feature {
        border-bottom: 1px solid #ccc;
    }

.productComparison .action {
    border: 1px solid rgba(0,0,0,0.06);
}

.productComparison h3 {
    font-weight: 300; /*height: 2.5em;    overflow: hidden;*/
    word-wrap: break-word;
    display: block;
}

    .productComparison h3 a, .productComparison h3 a:visited {
        font-weight: 300;
        line-height: 28px;
        display: block;
        white-space: normal;
        color: #212e84;
        cursor: pointer;
    }

        .productComparison h3 a:hover {
            font-weight: 400;
            text-decoration: none;
        }
/********** PRODUCT DETAILS **********/

#productDetails {
    margin-top: 40px;
    margin-bottom: -40px;
}
 
    #productDetails h1 {
        line-height: 82px;
    }

    #productDetails hr {
        margin: 0 0 20px;
    }

    #productDetails .product-image {
        margin-top: 15px;
        line-height: 30px;
        border: 1px solid #F1F1F1;
        border-radius: 5px;
        position: relative;
        padding: 25px;
    }

    #productDetails .product-badge {
        margin-top: 30px;
        margin-bottom: 60px;
        padding: 0 10px;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

        #productDetails .product-badge > [class*="col-"] {
            border-left: 1px solid #F1F1F1;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -ms-flex-align: center !important;
            align-items: center !important;
            -ms-flex-align: center !important;
            align-items: center !important;
            -ms-flex: 1 1 auto !important;
            flex: 1 1 auto !important;
        }

            #productDetails .product-badge > [class*="col-"]:last-child {
                border-right: 1px solid #F1F1F1;
            }

            #productDetails .product-badge > [class*="col-"] img {
                display: block;
                margin: 0 auto;
                width: auto;
                height: auto;
                max-height: 80px;
                max-width: 100%;
            }

    #productDetails button.small, #productDetails button.small + button.small {
        float: left;
        clear: both;
        margin: 0 0 18px;
        width: 220px;
    }

    #productDetails .load-more {
        width: 240px;
    }

    #productDetails .product-buttons .load-more {
        float: left;
        margin: 0px;
        width: 286px;
        height: 48px;
        font-size: 16px;
        line-height: 22px;
        font-weight: 600;
        padding: 13px 31px;
        margin-bottom: 25px;
        border-radius: 3px;
        background: #004F9D;
        border: 1px solid #004F9D;
        color: #FFFFFF;
    }
    #productDetails .product-buttons .load-more:hover {
        background: transparent;
        color: #004F9D;
    }
    #productDetails .product-buttons .bt-bunnings {
        float: left;
        margin: 0px;
        width: auto;
        height: 48px;
        font-size: 16px;
        line-height: 22px;
        font-weight: 600;
        padding: 13px 19px 13px 18px;
        margin-bottom: 16px;
        border-radius: 5px;
        background: #004F9D;
        border: 1px solid #004F9D;
        color: #FFFFFF;        
    }
    #productDetails .product-buttons .bt-step {
        float: left;
        margin: 0px;
        width: auto;
        height: 48px;
        font-size: 16px;
        line-height: 22px;
        font-weight: 600;
        padding: 13px 19px 13px 18px;
        margin-bottom: 16px;
        border-radius: 5px;
        background: #E5EAF4;
        border: 1px solid #004F9D;
        color: #003595;
    }
.bunnings-icon {
    background-image: url(/images/shopping-cart-white.svg);
    background-repeat: no-repeat;
    width:36px;
    height:26px;
    margin:0px;
    padding-left:0px;
    padding-right:36px;
}
.paint-icon {
    background-image: url(/images/format-paint.svg);
    background-repeat: no-repeat;
    width: 34px;
    height: 26px;
    margin: 0px;
    padding-left: 0px;
    padding-right: 34px;
}
#productDetails .product-buttons .bt-bunnings:hover {
    background: transparent;
    color: #004F9D;
}
#productDetails .product-buttons .bt-bunnings:hover .bunnings-icon {
    background-image: url(/images/shopping-cart-blue.svg);
    background-repeat: no-repeat;
}
#productDetails .product-buttons .bt-step:hover {
    background: transparent;
    color: #004F9D;
}
#productDetails .product-buttons .bt-step:hover .paint-icon {
    background-image: url(/images/format-paint.svg);
    background-repeat: no-repeat;
}
#productDetails .product-buttons .div-inline {
    display:inline-block
}
#productDetails .product-buttons .div-inline-left {
    margin-right: 16px;
}
@media (max-width: 1199px) {
    #productDetails .product-buttons .bt-bunnings {
        width: 100% !important;
        margin-bottom: 13px !important;
        text-align: center;
    }
    #productDetails .product-buttons .bt-step {
        width: 100% !important;
        margin-bottom: 13px !important;
        text-align: center;
    }
    #productDetails .product-buttons .div-inline-left {
        margin-right: 0px;
    }
    #productDetails .product-buttons .div-inline {
        width:100% !important;
    }
    .material-pdf {
        text-align: left;
    }
}
    #productDetails label.fighter-category {
        font-size: 14px;
        line-height: 19px;
        margin-bottom: 16px;
    }

    #productDetails button#searchBtn.small {
        float: left;
        clear: none;
        margin: 0px;
        width: auto;
    }

    #productDetails .action.zoom {
        bottom: 20px;
        right: 20px;
    }

    #productDetails p {
        clear: both;
    }

    #productDetails .product-lead {
        margin-bottom: 27px;
    }

    #productDetails .product-desc p {
        color: #4C4C4C;
        font-weight: 300;
        font-size: 24px;
        line-height: 36px;
        padding: 0 0 25px;
    }

    #productDetails .product-desc a, #productDetails .product-desc a:visited {
        font-size: 0.86em;
        font-weight: 700;
        text-decoration: underline;
    }

        #productDetails .product-desc a:hover {
            text-decoration: none;
        }

    #productDetails .product-features {
        margin-top: 40px;
        margin-bottom: 74px;
    }

    #productDetails .row.product-features {
        margin-bottom: 50px;
        padding: 51px 0 33px;
    }

    #productDetails .product-features ul {
        margin: 0;
        list-style: none;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

        #productDetails .product-features ul li {
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 33.3333%;
            font-size: 16px;
            font-weight: normal;
            color: #505050;
            position: relative;
            margin-bottom: 17px;
        }
            /*#productDetails .product-features ul li:last-of-type {                margin-bottom: 0;            }*/

            #productDetails .product-features ul li:before {
                content: "";
                display: block;
                width: 32px;
                min-width: 32px;
                height: 32px;
                margin-right: 13px;
                background-image: url("/Images/check_circle_24px_outlined.svg");
            }
    /*#productDetails .product-features li {        font-size: 1.38em;        padding: 0 0 26px;        line-height: 26px;    }*/

    .product-summary {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .heading-detail {
        margin-bottom: 20px;
        font-size: 30px;
        line-height: 170%;
        font-weight: normal;
        color: #4C4C4C;
    }

    .product-summary .summary-item {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        font-style: normal;
        font-weight: 600;
        font-size: 18px;
        line-height: 170%;
        color: #4C4C4C;
        margin-bottom: 43px;
        width: 25%;
    }

        .product-summary .summary-item span.small {
            font-style: normal;
            font-weight: normal;
            font-size: 16px;
            line-height: 170%;
            color: #6C6C6C;
            padding: 0 0 3px;
        }

    .gloss-level p {
        padding-right: 17px !important;
    }

    #productDetails .other-products {
        margin-top: 60px;
        margin-bottom: 0px;
        text-align: center;
    }

        #productDetails .other-products a.button.load-more {            
        }

        #productDetails .other-products .product {
            min-height: 295px;
        }

            #productDetails .other-products .product .product-details {
                padding: 11px;
            }

        #productDetails .other-products h2 {
            width: 50%;
            margin: auto;
            padding-bottom: 40px;
        }

        #productDetails .other-products #related-products-carousel {
            margin-bottom: 45px;
        }

            #productDetails .other-products #related-products-carousel.thumbs.products .item {
                width: 100%;
            }

            #productDetails .other-products #related-products-carousel.thumbs.products .product-item .image {
                background-color: white;
                margin: 10px;
                padding: 20px;
            }

            #productDetails .other-products #related-products-carousel.thumbs.products .product-item {
                background-color: #F2F2F2;
            }

                #productDetails .other-products #related-products-carousel.thumbs.products .product-item img {
                    height: 170px;
                    background-color: white;
                }

    #productDetails .thumbs.swatches .plus-more {
        float: left;
        font-size: 0.86em;
        clear: both;
        padding: 8px 0 0;
    }

    #productDetails #related-products-carousel.thumbs {
        padding: 0;
    }

    #productDetails .pre-footer .store-locator-widget {
        float: left;
        margin: 0;
        width: 100%;
    }

        #productDetails .pre-footer .store-locator-widget input[type="text"] {
            max-width: 254px;
            width: 100%;
        }

    #productDetails .other-helpful h2 {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    /********** PAINT CALCULATOR **********/

    .paintCalculator input {
        text-align: center;
        color: #0A519A;
    }
    /** ROOM FIELDS **/

    label.meter-field {
        position: relative;
        width: 100%;
    }

        label.meter-field:after {
            content: "m";
            color: #0A519A;
            position: absolute;
            display: block;
            right: 12px;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
        }

        label.meter-field input {
            text-align: center;
        }

    .p-0 {
        padding: 0 !important;
    }
    /** TITLE + TOOLTIP **/

    .help-tag {
        position: relative;
        display: inline-block;
    }

        .help-tag a {
            position: absolute;
            font-size: 18px;
            right: -20px;
            top: -15px;
        }

    #tooltipPaintPrimeBlock {
        position: absolute;
        right: 0px;
        top: -15px;
    }

    .help-tag .tooltip {
        width: 180px;
        left: 51% !important;
        top: 15px !important;
    }

        .help-tag .tooltip.in {
            opacity: 1;
        }

        .help-tag .tooltip .tooltip-arrow {
            color: #0A519A;
            left: 92% !important;
            top: -4px;
            margin-left: -4px;
            border-width: 0 10px 10px;
            border-bottom-color: #0A519A;
        }

        .help-tag .tooltip .tooltip-inner {
            background-color: white !important;
            border: 1px solid #0A519A;
            border-radius: 0px;
            color: #4C4C4C;
            padding: 8px;
            text-align: left;
        }

        .help-tag .tooltip .panel {
            border-radius: 1px;
            margin-bottom: 5px;
        }

        .help-tag .tooltip .panel-default {
            border: 2px solid #f5f5f5;
        }

        .help-tag .tooltip .panel-footer {
            padding: 5px 5px;
            border-top: none;
            font-size: 10px;
        }

        .help-tag .tooltip .tooltip-inner span {
            font-size: 11px;
        }
    /** CUSTOM RADIO BUTTONS **/

    .radio-container p {
        padding-bottom: 10px;
    }

    .input-custom {
        display: inline-block;
        position: relative;
        padding-left: 35px;
        padding-right: 35px;
        cursor: pointer;
        font-size: 16px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
        /* Hide the browser's default checkbox */

        .input-custom input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
            height: 0;
            width: 0;
            transition: all 0.2s ease;
        }
    /* Create a custom checkbox */

    .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 24px;
        width: 24px;
        border-radius: 50%;
        background-color: #fff;
        border: 1px solid #0a519a;
    }
    /* On mouse-over, add a grey background color */

    .input-custom:hover input ~ .checkmark {
        box-shadow: 0 0 10px #0A519A;
        transition: all 0.2s ease;
    }
    /* When the checkbox is checked, add a blue background */

    .input-custom input:checked ~ .checkmark {
        background-color: #0A519A;
    }
    /* Create the checkmark/indicator (hidden when not checked) */

    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }
    /* Show the checkmark when checked */

    .input-custom input:checked ~ .checkmark:after {
        display: block;
    }
    /* Style the checkmark/indicator */

    .input-custom .checkmark:after {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 13px;
        height: 13px;
        background-color: #fff;
        border-radius: 50%;
    }

    #calculatorPresetMacro .top-section { /*padding-bottom: 10%;*/
        padding-bottom: 200px;
        margin: 0 auto !important;
        max-width: 1200px !important;
        min-height: 320px;
    }

        #calculatorPresetMacro .top-section h1 {
            line-height: 90px;
            padding-bottom: 25px;
            color: white;
            width: 60%;
        }

        #calculatorPresetMacro .top-section p {
            color: white;
            font-weight: 300;
            line-height: 36px;
            width: 50%;
            font-size: 24px;
            width: 50%;
        }

    #calculatorPresetMacro.container {
        padding: 30px 10px 0;
    }

    .text-right {
        text-align: right;
    }
    /*#calculatorPresetMacro .top-section {    background: transparent url('/Images/brush_grey-dark.png') 0% 0% no-repeat padding-box;    opacity: 1;}*/

    #calculatorPresetMacro {
        padding-top: 75px;
        background-image: url(/Images/brush_grey-dark_top.jpg?format=webp);
        background-repeat: no-repeat;
        background-size: 100% 400px;
    }

        #calculatorPresetMacro .top-section img.floating-image {
            width: 46%;
            position: absolute;
            right: -50px;
            top: 0;
        }

        .paintCalculator h4, #calculatorPresetMacro h4 {
            font-weight: 300;
            text-align: center;
        }

    .paintCalculator input[type="text"] {
        width: 100%;
    }

    .paintCalculator #calculateBtn, #calculatorPresetMacro #calculateBtn {
        width: 100%;
    }

    .paintCalculator .disclaimer hr {
        margin: 0 0 1em;
    }

    #estimatedLitresOfPaint {
        color: #212e84;
        font-size: 100px;
        font-weight: 600;
    }

    #select-space {
        padding: 0 0 20px;
    }

        #select-space button {
            border-radius: 0px;
            border: none;
            opacity: 1;
            position: relative;
            padding: 0;
            width: 99%;
            height: 180px; /*width: 262px;    height: 180px;*/
        }

            #select-space button:hover, #select-space button:active, #select-space button:focus, #select-space button.selected {
                outline: 4px solid #0A519A;
            }

                #select-space button:hover p, #select-space button:active p, #select-space button:focus p, #select-space button.selected p { /*font-weight: 600;    color: #212e84;*/
                }

            #select-space button p {
                font-size: 1.5em;
                height: 61px;
                width: 100%;
                position: absolute;
                left: 0;
                bottom: 0px;
                opacity: 1;
                font-weight: lighter;
                letter-spacing: 0;
                color: #FFFFFF;
                opacity: 1;
                text-align: center;
                padding: 15px !important;
            }

                #select-space button p.interior {
                    background: #2895CF 0% 0% no-repeat padding-box;
                }

                #select-space button p.exterior {
                    background: #A4C74F 0% 0% no-repeat padding-box;
                }

    #select-coats > div > div > label {
        color: #4d4d4d;
    }

        #select-space p strong, #select-coats > div > div > label > strong, #select-measurement p strong {
            font-weight: 700;
        }

    #select-space .header, #select-measurement .header, .calculator-results .header {
        font-size: 1.5em;
        text-align: left;
        font-weight: lighter;
        letter-spacing: 0;
        color: #4C4C4C;
        opacity: 1;
    }

    .paint-estimate {
        background: #0A519A 0% 0% no-repeat;
        opacity: 1;
        width: 100%;
        height: 180px;
    }

        .paint-estimate p {
            text-align: center;
            letter-spacing: 0;
            color: #FFFFFF;
            opacity: 1;
            text-align: center;
            line-height: 100px;
        }

    #select-space h3 {
        padding: 0 0 20px;
    }

    #select-space p {
        padding: 0 !important;
    }

    #select-doors span, #select-windows span {
        width: 120px;
        display: inline-block;
    }

    #select-doors select, #select-windows select { /*text-align: center;    -ms-text-align-last: center;    -moz-text-align-last: center;    text-align-last: -moz-center;    text-align-last: -webkit-center;    text-align-last: center;*/
        text-indent: 45%;
    }

    #CalculatorSectionLeft, #CalculationSectionRight {
        padding: 0;
    }

    #CalculatorSectionLeft { /*border-right: 2px solid #F2F2F2;*/ /*padding-right: 20px;*/
        position: relative;
    }

        #CalculatorSectionLeft:after {
            content: "";
            width: 3px;
            height: 100%;
            display: block;
            background-color: #f2f2f2;
            position: absolute;
            right: 0;
            top: 0;
        }

    #CalculationSectionRight {
        padding-left: 20px;
    }

    .calculator-results .paint-estimate {
        display: table;
        margin: 0 auto;
        text-align: center;
        background-color: #0A519A;
    }

    .paint-estimate > div {
        display: table-row;
    }
        /*.paint-estimate > div > div {    display: table-cell;    vertical-align: middle;}*/

        .paint-estimate > div > div {
            height: 100%;
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-flex-direction: row;
            -moz-flex-direction: row;
            -ms-flex-direction: row;
            -o-flex-direction: row;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }

    .paint-estimate span {
        color: #FFFFFF !important;
        font-size: 30px;
        line-height: normal;
        padding: 15px;
        font-weight: lighter;
    }

    #broadwallLitres, #evesGuttersLitres, #doorsWindowsTrimLitres, #undercoatLitres, #ceilingOrRoofLitres {
        color: #0A519A;
    }

    #select-coats { /*padding: 0 0 20px;*/
    }

        #select-coats select {
            width: 100%;
        }
    /*#select-measurement {    padding: 0 0 20px;}*/

    #select-measurement select {
        width: 100%;
    }

    #CalculatorSectionLeft select {
        color: #0A519A;
    }

    #CalculationSectionRight .calculator-results {
        padding: 0;
    }

    #CalculationSectionRight h3 {
        font-size: 1.7em;
    }

    #CalculationSectionRight .col-md-9 {
        word-wrap: break-word;
    }

        #CalculationSectionRight .col-md-9 strong {
            font-weight: 700;
        }

    #CalculationSectionRight .actions {
        float: right;
        padding: 10px 0px 0;
        width: auto;
    }

    #CalculationSectionRight hr {
    }

    #CalculationSectionRight .calculator-results .col-md-3 {
        text-align: center;
    }

    #estimatedLitresOfPaint p {
        line-height: 36px;
    }

    #calculatorPresetMacro .disclaimer {
        font-size: 70%;
        margin-top: 70px;
    }
    /********* PAINT CALCULATOR MODAL **********/

    #calculatorPreset .col-md-10 {
        float: none;
        margin: 0 auto;
    }

    #calculatorPreset #select-space button {
        height: 104px;
        width: 104px;
    }

#calculatorPresetMacro .top-section .bannerHeaderText {
    line-height: 90px;
    padding-bottom: 25px;
    color: white;
    width: 60%;
    font-weight: 300;
    font-size: 60px;
    letter-spacing: normal;
    color: white;
}

.video-pop-up {
    top: 69px !important;
}

.video-pop-up .fancybox-close {
    top: -37px !important;
    right: 0 !important;
}

.video-thumbnail-sm {
    margin-top: 20px;
    margin-bottom: 40px;
    width: 210px;
    height: 118px;
    position: relative;
}

.video-thumbnail-xs {
    margin-top: 30px;
    margin-bottom: 30px;
    width: 347px;
    height: 195px;
    position: relative;
}

.video-thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
}

.video-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 82px;
    height: 82px;
    cursor: pointer;
    background-image: url("/Images/play-circle-outline.png?format=webp");
    background-size: contain;
}

.video-thumbnail-sm .video-play-button {
    width: 50px;
    height: 50px;
}

.product-video {
    display: flex;
    justify-content: center;

    margin-bottom: 45px;
}