/*
Theme Name:   	Radiator Herschel Child
Theme URI:    	https://radiatordigital.com
Author:       	Radiator Digital
Author URI:     https://radiatordigital.com
Template:     	storefront
Description:  	This is a blank child theme for Herschel
Version:      	1.0.0
License:      	GNU General Public License v2 or later
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	radiator-herschel-child
Domain Path:    /languages
Tags:         	black, white, light, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, full-width-template, threaded-comments, accessibility-ready
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
Storefront is based on Underscores http://underscores.me/, (C) 2012-2014 Automattic, Inc.
Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
FontAwesome License: SIL Open Font License - http://scripts.sil.org/OFL
Images License: GNU General Public License v2 or later
*/
/*
 * Add your own custom css below this text.
 */

.site-header {padding: 0 0 0 !important; margin-bottom:0em !important; opacity: 0.8;}
.site-main {margin-bottom:0em !important;}
hr{margin-top:20px;margin-bottom:20px;border-top:1px solid #eee}

/* Backround header colour. Used in conj w opacity 0.75 */
.site-header, .secondary-navigation ul ul, .main-navigation ul.menu > li.menu-item-has-children::after, .secondary-navigation ul.menu ul, .storefront-handheld-footer-bar, .storefront-handheld-footer-bar ul li > a, .storefront-handheld-footer-bar ul li.search .site-search, button.menu-toggle, button.menu-toggle:hover {background-color: #000 !important;}

#site-navigation > div {margin-left: 10px;}

.site-header .col-full{max-width: 120em; padding-left: 6px; padding-right: 1px; text-transform:uppercase; box-sizing: content-box;}

.site-header .site-header-cart, .site-header .site-search, .site-header .site-logo-link{margin-bottom:0.1em !important;}

@media screen and (min-width:768px){
.woocommerce-active .site-header .site-branding{margin-right: 1% !important; }
.site-header-cart .cart-contents{background-color:#f2682c; padding-left:4px;padding-right:4px;}
.storefront-pro-active .site-header-cart .widget_shopping_cart *:not(.button) {color: #ffffff !important; margin-right:3px !important;}}

/* Storefront pro overrides */
body.storefront-pro-active .site-header .site-header-cart {display: none !important;}

/* Body styles */
#custom-bg h1,.centerme{width:100%;text-align:center}
#custom-bg{min-height:200px;width:100%;margin:0 0 30px;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-position:center center}
.centerme,.centerme img{margin:0 auto}#custom-bg h1{padding-top:80px;text-transform:uppercase;text-shadow:0 0 50px #000}
#custom-bg h1{padding-top:80px;text-transform:uppercase; color:#fff; text-shadow:0 0 50px #000}
.row{width:100%; margin-right:-15px}
.row:after{clear:both}
.btn{display:inline-block;margin-bottom:0;font-weight:400;text-align:center;vertical-align:middle;cursor:pointer;border:1px solid transparent;white-space:nowrap;padding:6px 12px;font-size:14px;line-height:1.428571429;border-radius:4px;-moz-user-select:none;-ms-user-select:none;user-select:none}.btn.active:focus,.btn:active:focus,.btn:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}.btn:focus,.btn:hover{color:#fff;text-decoration:none}.btn.active,.btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);-moz-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn.disabled,.btn[disabled] .btn{cursor:not-allowed;pointer-events:none;zoom:1;filter:alpha(opacity=65);-webkit-opacity:.65;-moz-opacity:.65;opacity:.65;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}
.btn .main-text{text-transform:uppercase; color:#fff;}
.btn .sub-text{font-size:13px;color:#fff;}
.btn-dark i{padding-left:5px}.btn-dark{background:#3c3c3c;color:#fff}.btn-dark i{color:#f2682c}.btn-dark:hover,.btn-dark:hover i, .btn-orange:hover a:hover{color:#fff !important;}

.btn-orange,.btn-orange a{color:#fff;}
.btn-orange{background:#f2682c}.btn-orange:hover{color:#fff;background:#f58a5c;transition:all .3s linear}
.btn-special {margin-top: 20px; margin-bottom: 20px; text-align: left; line-height: 10px; padding-top: 15px; padding-bottom: 15px;}
.btn-special .sub-text {font-family: "Raleway",sans-serif; text-transform: none;     letter-spacing: 0px; margin-bottom: 0px;}
.btn .sub-text {font-size: 13px;}
.btn-download{background-color:#f2682c;color:#fff}.btn-download:hover{background-color:#dd4d0e;color:#fff}.btn-download i{color:#fff;}
.btn-orange:hover{-webkit-transition:all .3s linear;-moz-transition:all .3s linear;-o-transition:all .3s linear}

/* testimonials slider remove post meta */
.mega-post-meta{display:none}
.mega-post-date{display:none}
/* Make titles larger homepage banner blocks */
.ult-banner-block a.bb-link {border-radius: 4px;}
.ult-banner-block .bb-top-title {font-size:24px !important;}
.post-author{display:none !important; visibility: hidden !important;}

/* Datasheets page */
.datasheetspage li{list-style:none;border-bottom:1px solid #ededed;padding:3px 0}
.datasheetspage h3{color:#3c3c3c;text-transform:uppercase;border-bottom:1px solid #ededed}.datasheetspage ul.pdf{padding:0; margin-left:0px;}
@media screen and (min-width:970px){.pdf_large{width:30%; display:inline-block; vertical-align:top;}}
/* Below 970 px do the small gallery */
@media screen and (max-width:970px){.pdf_large{width:98%; display:inline-block; vertical-align:top;}}

/* FAQ Template page */
.panel-group .panel-heading,.panel>.list-group:last-child .list-group-item:last-child,.panel>.table-bordered>tbody>tr:first-child>td,.panel>.table-bordered>tbody>tr:first-child>th,.panel>.table-bordered>tbody>tr:last-child>td,.panel>.table-bordered>tbody>tr:last-child>th,.panel>.table-bordered>tfoot>tr:last-child>td,.panel>.table-bordered>tfoot>tr:last-child>th,.panel>.table-bordered>thead>tr:first-child>td,.panel>.table-bordered>thead>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th,.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,.panel>.table-responsive>.table-bordered>thead>tr:first-child>th{border-bottom:0}
.panel-group .panel{margin-bottom:0;overflow:hidden}
.panel-group .panel+.panel{margin-top:5px}
.panel-group .panel-heading+.panel-collapse .panel-body{border-top:1px solid #ddd}
.panel-default{border-color:#ddd}
.panel-default>.panel-heading{border-color:#ddd}
.panel-default>.panel-heading+.panel-collapse .panel-body{border-top-color:#ddd}
.panel-body{padding:15px}
.panel-heading{padding:5px 5px;border-bottom:1px solid transparent;border-top-right-radius:3px;border-top-left-radius:3px}

/* Wholeseller page */
.partnerimagepage:nth-child(7){clear:left}
.partnerimagepage{position:relative;min-height:1px;padding-left:15px;padding-right:15px;margin-bottom:40px;height:130px}@media (min-width:992px){.partnerimagepage{float:left;width:16.666666666666664%}}.partnerimagepage img{display:block;max-width:100%;height:auto;max-height:100px}

/* Where to use pages */
@media screen and (min-width:970px){.image_gallery_small{display:none;visibility:hidden;padding-bottom:30px;}.iconshow{width:33.12%;display:inline-block;vertical-align:text-top; font-size:1.2em; text-transform:none;}.iconshow i{color:#f2682c;}.mobi-calc, .mobi-vid{display:none !important; visibility:hidden !important;}.image_gallery_small:after{clear:both}}
/* Below 970 px do the small gallery */
@media screen and (max-width:970px){.image_gallery{display:none;visibility:hidden; padding-bottom:30px;}.iconshow{width:33.33333333333333%;display:inline-block;vertical-align:text-top; font-size:1em;text-transform:none;}.iconshow i{color:#f2682c;}.desktop-calc, .desktop-vid{display:none !important; visibility:hidden !important;}.image_gallery:after{clear:both}}
.fullwidthbanner-container{max-height:450px;height:450px!important}
.fullwidthbanner-container .gallery.row{max-height:300px}
.gallery.row .col-three{width:33.1%; display:inline-block;}
.gallery.row .col-four{width:24.7%; display:inline-block;}
.headerblock{overflow:hidden}.headerblock img{min-height:100%;min-width:100%}
.items{display:block;background-size:cover; height:450px;background-position:center center}
.videoWrapper {position: relative;}

.wtu-leftcol h1{text-transform:uppercase;}
.wtu-leftcol h2, .wtu-rightcol h2{font-size:20px;margin-left:4px;}
.wtu-rightcol .panel-heading{font-size:14px;}
.wtu-rightcol .collapse.show p{margin-left:4px;padding:4px;-webkit-box-shadow:0 1px 10px rgba(20,20,20,.2);-moz-box-shadow:0 1px 10px rgba(20,20,20,.2);box-shadow:0 1px 10px rgba(20,20,20,.2);font-size:12px;background-color:#ededed;color:#222;}

/* This following means anything bigger than 1200 - take the following action! */
@media screen and (min-width:1200px){.wtu-leftcol{width:72%; display:inline-block;}.wtu-rightcol{width:24%; float:right; margin-left:10px; margin-right:26px;}}
/* Anything smaller than 970, do this */
@media screen and (max-width:970px){.wtu-leftcol{width:100%; display:inline-block;}}

/* Outdoor List page */
.item,.item .inner{background-size:cover}
.item{width:33%;min-height:286px;padding:3px;}.item .inner{height:95%;width:95%;display:block;margin:5%;overflow:hidden;position:inherit;background-position:center center}.item .readmore,.item a.title{display:block;width:100%;text-align:center}.item a.title{font-size:18px;line-height:24px;color:#5b5b5b;font-weight:500;float:none;clear:both;margin:0;padding:4px 12px 3px;border-radius:0;background-color:rgba(255,255,255,.73);position:absolute;bottom:0}.item .readmore{margin:30% auto 0}

/* Inspirations */
.img-responsive,.thumbnail a>img,.thumbnail>img{display:block;max-width:100%;height:auto}

/* Events Template Page */
.onecol{min-height:1px;position:relative;padding-left:15px;padding-right:15px;margin-bottom:18px}
.onecol:last-child{border:none}
.onecol p.cta-center{width:100%;position:absolute;bottom:0;left:15px;margin-bottom:0}
.thumbnail{display:block;max-width:100%;height:auto}
.thumbnail{-o-transition:all .2s ease-in-out}
@media (min-width:768px){.onecol{float:left;width:100%}}
@media (max-width:768px){.onecol{margin-bottom:38px}}

/* Woocommerce section */
.woocommerce-products-header{padding:0 0 0 !important;}
.productlistinfo ul{margin: 0 0 1.41575em 0.5em !important;  padding: 0;}
.productlistpage img,.subcategory-term_description.term_description{display:none;visibility:hidden}
.productlistpage nav.woocommerce-breadcrumb,.productlistpage nav.woocommerce-breadcrumb a,.productlistpage nav.woocommerce-breadcrumb a:hover{color:#fff}.productlistpage .productlistpage .productlistinfo{text-align:left}.productlistpage .productlistinfo ul.products li.product h3{padding:20px!important}
.woocommerce ul.products li.product h3,.woocommerce-page ul.products li.product h3{padding:8px 0}
.wc-nested-category-layout-category-title{color:#3c3c3c;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid #ededed; text-align:left;}
.wc-nested-category-layout-category-image{display:none;}

@media screen and (min-width:970px){.breadcrumb .row{height:20px}.small-bread{display:none; visibility:hidden;}}
@media screen and (max-width:970px){.breadcrumb .row{height:60px;font-size:16px;}.big-bread{display:none; visibility:hidden;}}
/*.breadcrumb .share{float:right; padding-bottom:4px;}.breadcrumb .share .addthis_sharing_toolbox{float:right;margin:2px 0 0 5px} */
.clearfix{clear:both;}

.productpage h1.product_title{font-size:26px;color:#3c3c3c;border-bottom:1px solid #ededed;padding:0 0 20px !important} 
.productpage .icons{color:#555;font-size:16px;margin-right:5px;margin-top:20px;}
.productpage .icons i{color:#f2682c}.productpage .icons i.fa.fa-leaf{color:#03b034}.productpage .quantity.buttons_added{margin:0 0 20px 15px;float:left}
.productpage .price{font-size:26px}.productpage .single_variation .price:before{content:"PRICE";padding-right:10px;padding-left:5px;color:#f2682c}
.price:before{content:"PRICE";padding-right:10px;color:#f2682c}
.wattagecal h3 span{color:#6d6d6d;}

/* Price and Calc columns */
@media screen and (min-width:970px){.prod-summary{width:49%;float:left;}.calc-col{width:49%;float:right;}}
/* Below 970 px do the small gallery */
@media screen and (max-width:970px){.prod-summary{width:100%;}.calc-col{width:100%;}}

/* disable word break add to cart button */
.added_to_cart, .button, .wc-block-grid__products .wc-block-grid__product .wp-block-button__link, button, input[type=button], input[type=reset], input[type=submit] {word-break: normal;}

/* Quantity buttons on mobile */
@media only screen and (max-width:768px){
.woocommerce .quantity input.qty, .woocommerce-page .quantity input.qty {
    width:5em !important; height:4em;}
.productpage .quantity .minus, .productpage .quantity .plus {height:15px; width:15px;}}

/* Duology more info banner */
#imega-widget-anchor #imega-see-info {display: none;}

/* Fix alignment star rating */
.woocommerce .products .star-rating {float:right !important;}
.woocommerce-product-rating {float:right !important;}
.up-sells{display:none;}

/* Change Product Isotope Price size */
.woocommerce ul.products li.product .price .from {color:#34433d !important;}
.woocommerce ul.products li.product .price{color:#F00;font-size:1.5em !important;}
.isotope{border-top: 1px solid #eeeeee;background-color:#FFF;-webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;border-radius:5px;-webkit-box-shadow:rgba(0,0,0,.50)0 2px 2px;-moz-box-shadow:rgba(0,0,0,.50)0 2px 2px;-o-box-shadow:rgba(0,0,0,.50)0 2px 2px;box-shadow:rgba(0,0,0,.50)0 2px 2px;}
.isotope li {margin-left:12px; list-style-type:circle !important;}
.imagesuround{-webkit-box-shadow:0 1px 10px rgba(20,20,20,.2);-moz-box-shadow:0 1px 10px rgba(20,20,20,.2);box-shadow:0 1px 10px rgba(20,20,20,.2); background-color:#eeeeee;}
.imagesuround img{display:block;visibility:visible; margin-left:auto; margin-right:auto;}

/*Crosssell div */
.crosssells{margin-bottom:20px;float:left;width:100%;}
.crosssells .section{width:70%;margin:20px 0 0;}
.alignleft,.crosssells img,.crosssells li,.news article.status-publish h2 {float:left}
.crosssells .btn{padding:5px 8px;margin:6px 0 0 0}
.crosssells li,.crosssells ul{padding:0;margin:0;list-style:none}
.crosssells li{padding-bottom:20px;width:100%}
.crosssells img{max-width:100px;margin-right:10px;-webkit-box-shadow:0 1px 10px rgba(20,20,20,.2);-moz-box-shadow:0 1px 10px rgba(20,20,20,.2);box-shadow:0 1px 10px rgba(20,20,20,.2)}.crosssells h3{background:#eee;color:#555;padding:10px;margin:0}.crosssells .add_to_cart_inline{width:100%;clear:left}

/* Make Magic 360 selector icon scale */
@media only screen and (max-width: 767px) {
	[data-magic-slide-id="360"] img { max-width: 100% !important; max-height: 100% !important; } }
	
.footer-widgets{padding-top:0.1em}
.footer-widget-3 .widget{margin: 0;}
.footer-widgets .widget .widget-title, .widget .widgettitle {padding: 0 0 0.5em;    margin-bottom: 0.1em;}
.footer-widgets .social i{font-size:30px;color:#fff; display:inline-block;}img.secure{display:block;max-width:100%;height:auto;margin-top:10px}
.footer-widgets .cards i{padding:0 10px 0 0; font-size:30px; color:#fff;}
.footer-widgets.col-4 .block {margin-right:0 !important;}
.footer-widget-3{width:30% !important;}
.storefront-pro-active .site-footer .widget-title, .storefront-pro-active .site-footer h3 {color: #fff; margin-top:10px;}
.site-footer a:not(.button):not(.components-button) {text-decoration:none !important;}

/* this following means anything smaller than 768 - take the following action! */
@media screen and (max-width : 768px){.footer-widget-3{width:98% !important}}

/* Beware this next one may upset things other than the footer! */
.widget_recent_entries ul li, .widget_pages ul li, .widget_categories ul li, .widget_archive ul li, .widget_recent_comments ul li, .widget_nav_menu ul li, .widget_links ul li, .widget_product_categories ul li, .widget_layered_nav ul li, .widget_layered_nav_filters ul li {
    list-style: none;
    margin-bottom: 0 !important;
    line-height: 1.41em;
}

.site-info{display:none;}
.site-footer{padding:0 0 0;}
.site-footer i{font-size:30px; color:#ffffff;}
.site-footer a:not(.button){text-decoration:none;}

.widget{margin: 0 0 0;}

/* Remove Document icons from footer */
.widget_nav_menu ul li:before {display: none;}
.widget_nav_menu ul li {padding-left: 0;}


/*
        h1,
        .huge-title,
        h2,
        .x-large-title,
        h3,
        .large-title,
        h4,
        .medium-title,
        h5,
        .normal-title,
        h6,
        .small-title{
            font-family: var(--heading-font);
            font-style: normal;
            color:rgb(var(--sps-black));
            line-height:115%;
            letter-spacing: -0.04em;
            font-weight:600;
            
        }

        h1,
        h2.huge-title,
        h3.huge-title,
        h4.huge-title,
        h5.huge-title,
        h6.huge-title,
        .huge-title{
            font-size: calc(var(--huge-mobile-heading-size) * 1px);
            margin: 0 0 0.15em;
            line-height:105%;
        }

        :root{
            --huge-title: calc(var(--huge-mobile-heading-size) * 1px);
        }


        h1.x-large-title,
        h2,
        h3.x-large-title,
        h4.x-large-title,
        h5.x-large-title,
        h6.x-large-title,
        .x-large-title{
            font-size: calc(var(--x-large-mobile-heading-size) * 1px);
            margin: 0 0 0.15em;
            line-height: 115%;
        }

        :root{
            --x-large-title: calc(var(--x-large-mobile-heading-size) * 1px);
        }

        h1.large-title,
        h2.large-title,
        h3,
        h4.large-title,
        h5.large-title,
        h6.large-title,
        .large-title{
            font-size: calc(var(--large-mobile-heading-size) * 1px);
            margin: 0 0 0.15em;
            line-height: 115%;
        }

        :root{
            --large-title: calc(var(--large-mobile-heading-size) * 1px);
        }

        h1.medium-title,
        h2.medium-title,
        h3.medium-title,
        h4,
        h5.medium-title,
        h6.medium-title,
        .medium-title{
            font-size: calc(var(--medium-mobile-heading-size) * 1px);
            margin: 0 0 0.2em;
            line-height: 115%;
        }

        :root{
            --medium-title: calc(var(--medium-mobile-heading-size) * 1px);
        }

        h1.normal-title,
        h2.normal-title,
        h3.normal-title,
        h4.normal-title,
        h5,
        h6.normal-title,
        .normal-title{
            font-size: calc(var(--normal-mobile-heading-size) * 1px);
            margin: 0 0 0.25em;
            line-height:115%;
        }

        :root{
            --normal-title: calc(var(--normal-mobile-heading-size) * 1px);
        }

        h1.small-title,
        h2.small-title,
        h3.small-title,
        h4.small-title,
        h5.small-title,
        h6,
        .small-title{
            font-size: calc(var(--small-mobile-heading-size) * 1px);
            margin: 0 0 0.2em;
            line-height:115%;
        }

        :root{
            --small-title: calc(var(--small-mobile-heading-size) * 1px);
        }

        @media screen and (min-width: 400px) {
            h1,
            h2.huge-title,
            h3.huge-title,
            h4.huge-title,
            h5.huge-title,
            h6.huge-title,
            .huge-title{
                font-size: calc((var(--huge-mobile-heading-size) * 1px) + var(--huge-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --huge-title: calc((var(--huge-mobile-heading-size) * 1px) + var(--huge-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            h1.x-large-title,
            h2,
            h3.x-large-title,
            h4.x-large-title,
            h5.x-large-title,
            h6.x-large-title,
            .x-large-title{
                font-size: calc((var(--x-large-mobile-heading-size) * 1px) + var(--x-large-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --x-large-title: calc((var(--x-large-mobile-heading-size) * 1px) + var(--x-large-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            h1.large-title,
            h2.large-title,
            h3,
            h4.large-title,
            h5.large-title,
            h6.large-title,
            .large-title{
                font-size: calc((var(--large-mobile-heading-size) * 1px) + var(--large-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --large-title: calc((var(--large-mobile-heading-size) * 1px) + var(--large-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            h1.medium-title,
            h2.medium-title,
            h3.medium-title,
            h4,
            h5.medium-title,
            h6.medium-title,
            .medium-title{
                font-size: calc((var(--medium-mobile-heading-size) * 1px) + var(--medium-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --medium-title: calc((var(--medium-mobile-heading-size) * 1px) + var(--medium-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            h1.normal-title,
            h2.normal-title,
            h3.normal-title,
            h4.normal-title,
            h5,
            h6.normal-title,
            .normal-title{
                font-size: calc((var(--normal-mobile-heading-size) * 1px) + var(--normal-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --normal-title: calc((var(--normal-mobile-heading-size) * 1px) + var(--normal-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            h1.small-title,
            h2.small-title,
            h3.small-title,
            h4.small-title,
            h5.small-title,
            h6,
            .small-title{
                font-size: calc((var(--small-mobile-heading-size) * 1px) + var(--small-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --small-title: calc((var(--small-mobile-heading-size) * 1px) + var(--small-heading-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }
        }
            
        @media screen and (min-width: 1100px) {
            h1,
            h2.huge-title,
            h3.huge-title,
            h4.huge-title,
            h5.huge-title,
            h6.huge-title,
            .huge-title{
                font-size: calc(var(--huge-desktop-heading-size) * 1px);
            }

            :root{
                --huge-title: calc(var(--huge-desktop-heading-size) * 1px);
            }

            h1.x-large-title,
            h2,
            h3.x-large-title,
            h4.x-large-title,
            h5.x-large-title,
            h6.x-large-title,
            .x-large-title{
                font-size: calc(var(--x-large-desktop-heading-size) * 1px);
            }

            :root{
                --x-large-title: calc(var(--x-large-desktop-heading-size) * 1px);
            }

            h1.large-title,
            h2.large-title,
            h3,
            h4.large-title,
            h5.large-title,
            h6.large-title,
            .large-title{
                font-size: calc(var(--large-desktop-heading-size) * 1px);
            }

            :root{
                --large-title: calc(var(--large-desktop-heading-size) * 1px);
            }

            h1.medium-title,
            h2.medium-title,
            h3.medium-title,
            h4,
            h5.medium-title,
            h6.medium-title,
            .medium-title{
                font-size: calc(var(--medium-desktop-heading-size) * 1px);
            }

            :root{
                --medium-title: calc(var(--medium-desktop-heading-size) * 1px);
            }

            h1.normal-title,
            h2.normal-title,
            h3.normal-title,
            h4.normal-title,
            h5,
            h6.normal-title,
            .normal-title{
                font-size: calc(var(--normal-desktop-heading-size) * 1px);
            }

            :root{
                --normal-title: calc(var(--normal-desktop-heading-size) * 1px);
            }

            h1.small-title,
            h2.small-title,
            h3.small-title,
            h4.small-title,
            h5.small-title,
            h6,
            .small-title{
                font-size: calc(var(--small-desktop-heading-size) * 1px);
            }

            :root{
                --small-title: calc(var(--small-desktop-heading-size) * 1px);
            }
        }
    /*END OF :: Global > Typography > Headings*/

    /*Global > Typography > Body*/
    /*
        p,
        .huge-body,
        .x-lrg-body,
        .lrg-body,
        .med-body,
        .reg-body,
        .sml-body{
            font-family: var(--body-font);
            font-style: normal;
            color:rgb(var(--sps-black));
            font-weight: 400;
            line-height: 145%;
            letter-spacing: 0.5px;
        }

        p.huge-body,
        .huge-body{
            font-size: calc(var(--huge-body-mbl) * 1px);
        }

        :root{
            --huge-body: calc(var(--huge-body-mbl) * 1px);
        }

        p.x-lrg-body,
        .x-lrg-body{
            font-size: calc(var(--x-lrg-body-mbl) * 1px);
        }

        :root{
            --x-lrg-body: calc(var(--x-lrg-body-mbl) * 1px);
        }

        p.lrg-body,
        .lrg-body{
            font-size: calc(var(--lrg-body-mbl) * 1px);
        }

        :root{
            --lrg-body: calc(var(--lrg-body-mbl) * 1px);
        }

        p.med-body,
        .med-body{
            font-size: calc(var(--med-body-mbl) * 1px);
        }

        :root{
            --med-body: calc(var(--med-body-mbl) * 1px);
        }

        p,
        p.reg-body,
        .reg-body{
            font-size: calc(var(--reg-body-mbl) * 1px);
        }

        :root{
            --reg-body: calc(var(--reg-body-mbl) * 1px);
        }

        small,
        p.sml-body,
        .sml-body{
            font-size: calc(var(--sml-body-mbl) * 1px);
            line-height: 135%;
        }

        :root{
            --sml-body: calc(var(--sml-body-mbl) * 1px);
        }

        @media screen and (min-width: 400px) {
            p.huge-body,
            .huge-body{
                font-size: calc((var(--huge-body-mbl) * 1px) + var(--huge-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --huge-body: calc((var(--huge-body-mbl) * 1px) + var(--huge-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            p.x-lrg-body,
            .x-lrg-body{
                font-size: calc((var(--x-lrg-body-mbl) * 1px) + var(--x-large-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --x-lrg-body: calc((var(--x-lrg-body-mbl) * 1px) + var(--x-large-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            p.lrg-body,
            .lrg-body{
                font-size: calc((var(--lrg-body-mbl) * 1px) + var(--large-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --lrg-body: calc((var(--lrg-body-mbl) * 1px) + var(--large-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            p.med-body,
            .med-body{
                font-size: calc((var(--med-body-mbl) * 1px) + var(--medium-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --med-body: calc((var(--med-body-mbl) * 1px) + var(--medium-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            p,
            p.reg-body,
            .reg-body{
                font-size: calc((var(--reg-body-mbl) * 1px) + var(--normal-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --reg-body: calc((var(--reg-body-mbl) * 1px) + var(--normal-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            small,
            p.sml-body,
            .sml-body{
                font-size: calc((var(--sml-body-mbl) * 1px) + var(--small-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }

            :root{
                --sml-body: calc((var(--sml-body-mbl) * 1px) + var(--small-body-size-change) * ((100vw - (var(--mobile-breakpoint) * 1px)) / var(--tablet-size)));
            }
        }

        @media screen and (min-width: 1180px) {
            p.huge-body,
            .huge-body{
                font-size: calc(var(--huge-body-dsk) * 1px);
            }

            :root{
                --huge-body: calc(var(--huge-body-dsk) * 1px);
            }

            p.x-lrg-body,
            .x-lrg-body{
                font-size: calc(var(--x-lrg-body-dsk) * 1px);
            }

            :root{
                --x-lrg-body: calc(var(--x-lrg-body-dsk) * 1px);
            }

            p.lrg-body,
            .lrg-body{
                font-size: calc(var(--lrg-body-dsk) * 1px);
            }

            :root{
                --lrg-body: calc(var(--lrg-body-dsk) * 1px);
            }

            p.med-body,
            .med-body{
                font-size: calc(var(--med-body-dsk) * 1px);
            }

            :root{
                --med-body: calc(var(--med-body-dsk) * 1px);
            }

            p,
            p.reg-body,
            .reg-body{
                font-size: calc(var(--reg-body-dsk) * 1px);
            }

            :root{
                --reg-body: calc(var(--reg-body-dsk) * 1px);
            }

            small,
            p.sml-body,
            .sml-body{
                font-size: calc(var(--sml-body-dsk) * 1px);
                line-height: 135%;
            }

            :root{
                --sml-body: calc(var(--sml-body-dsk) * 1px);
            }
        }
        
    /*Global > Default Rows & Columns*/
    /*
    .support{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
        -ms-flex-wrap:wrap;
            flex-wrap:wrap;
        -webkit-box-pack:justify;
            -ms-flex-pack:justify;
                justify-content:space-between;
        -ms-flex-line-pack:justify;
            align-content:space-around;
    }

    .section-container{
        width: 100%;
    }
    
    .content-container{
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }
    
    .row-container,
    .content-container{
        height: auto;
        padding: 0px;
        margin: 0 auto;
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
        width:100%;
        max-width: calc(var(--desktop-breakpoint) * 1px);
    }

    .col-1, 
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-10,
    .col-11,
    .col-12{
        width: 100%;
        position: relative;
        display: -webkit-box;
            display: -ms-flexbox;
                display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
    }

    @media screen and (min-width: 768px) {
        .col-1{
            width: calc(((100% / 12) * 1) - 10px);
        }
        .col-2{
            width: calc(((100% / 12) * 2) - 10px);
        }
        .col-3{
            width: calc(((100% / 12) * 3) - 10px);
        }
        .col-4{
            width: calc(((100% / 12) * 4) - 10px);
        }
        .col-5{
            width: calc(((100% / 12) * 5) - 10px);
        }
        .col-6{
            width: calc(((100% / 12) * 6) - 10px);
        }
        .col-7{
            width: calc(((100% / 12) * 7) - 10px);
        }
        .col-8{
            width: calc(((100% / 12) * 8) - 10px);
        }
        .col-9{
            width: calc(((100% / 12) * 9) - 10px);
        }
        .col-10{
            width: calc(((100% / 12) * 10) - 10px);
        }
        .col-11{
            width: calc(((100% / 12) * 11) - 10px);
        }
        .col-12{
            width: calc((100% / 12) * 12);
        }
    }

    @media screen and (min-width: 1000px) {
        .col-1{
            width: calc(((100% / 12) * 1) - 1rem);
        }
        .col-2{
            width: calc(((100% / 12) * 2) - 1rem);
        }
        .col-3{
            width: calc(((100% / 12) * 3) - 1rem);
        }
        .col-4{
            width: calc(((100% / 12) * 4) - 1rem);
        }
        .col-5{
            width: calc(((100% / 12) * 5) - 1rem);
        }
        .col-6{
            width: calc(((100% / 12) * 6) - 1rem);
        }
        .col-7{
            width: calc(((100% / 12) * 7) - 1rem);
        }
        .col-8{
            width: calc(((100% / 12) * 8) - 1rem);
        }
        .col-9{
            width: calc(((100% / 12) * 9) - 1rem);
        }
        .col-10{
            width: calc(((100% / 12) * 10) - 1rem);
        }
        .col-11{
            width: calc(((100% / 12) * 11) - 1rem);
        }
        .col-12{
            width: calc((100% / 12) * 12);
        }
    }
/*END OF :: Global > Default Rows & Columns*/