/* ##################################################

:: Template Name: PitBoss Component StyleSheet
:: Author: User10
:: Version: 1.0
:: Created: 11 November 2020
:: Last Updated: 11 November 2020

################################################## */

/* ##### Index of Stylesheet #####-

-ANNOUNCEMENT BAR

-NAVIGATION
    --CART COUNT
    --SIGN IN DROPDOWN
    --MOBILE NAVIGATION
    --MOBILE MENU LISTS
    --MOBILE SEARCH

-FOOTER STYLES
-BANNER CTA STYLES
-PAGE HEADER STYLES
-PRODUCT CARD STYLES

-CARDS
    --RECIPE CARDS
    --HOME - DISCOVER RECIPES CARD
    --BLOG CARDS
    --PRODUCT DESCRIPTION SECTIONS

-CTA SIDEBAR

-SOCIAL CALL TO ACTION

-PRODUCT FILTER DISPLAY

##### Index of Stylesheet ##### /*


/*---------- ANNOUNCEMENT BAR -----------*/

#home-message-bar {
    background-color: #147BD1;
    padding: 8px 20px;
    font-weight: bold;
    display: none;
    align-items: center;
    flex-direction: row;
    font-size: 15px;
}

.pb-home-container {
    background-color: black;
    height: 50%;
}

.home-message{
    flex: 1;
    margin-bottom: 0px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 13px;
    font-weight: 600;
    color: #ffffff !important;
}

.close-message {
    color: #ffffff;
    display: flex;
    justify-content: flex-end;
    cursor: pointer;
}

@media only screen and (max-width: 600px) {
    #home-message-bar {
        font-size: 11px;
    }
}

@keyframes showBanner{
    0%{
        transform: translateY(-45px);
    }
    100%{
        transform: translateY(0px);
    }
}

/*------------- NAVIGATION  -------------*/

.header-area {
    z-index: 12;
    width: 100%;
    background: black;
    position: fixed;
    top: 0;
}

.header-area.annoucement{
    transform: translateY(-45px);
    animation: showBanner 300ms cubic-bezier(0.16, 1, 0.3, 1) forwards 1s;
}

.classynav ul li .pb-navigation__link{
    font-family: 'BankGothic', sans-serif;
    text-transform: uppercase;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    position: relative;
    display: inline;
    transition: all ease 250ms;
    text-decoration: none;
}

.classynav ul li .pb-navigation__link:hover{
    color: #A1A1A1;
}

.cn-dropdown-item .pb-navigation__link::after {
    content: '';
    position: absolute;
    top: 250%;
    left: 50%;
    transform: translate(-50%,50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 15px solid #F5F4EF;
    display: inline;
    opacity: 0;
    /* transition: all ease 300ms; */
    transition: all ease 190ms;

}

.cn-dropdown-item:hover .pb-navigation__link::after {
    content: '';
    position: absolute;
    opacity: 1;
    top: 105%;
}

.classynav ul li a {
    padding: 0px;
    font-size: 16px;
    transition: all ease 250ms;

}

.classynav ul li a:not(.pb-navigation__link):not(.pb_btn):hover{
    /* color: #EE8032; */
    text-decoration: none;
}


.classynav ul li .pb-mega-menu__link {
    padding: 0px;
    font-size: 18px;
    line-height: 24px;
    font-weight: bold;

}

.pb-nav-container{
    background: #000;
}

.pb-nav-container .classy-navbar{
    height: auto;
}

.pb-stack-menu{
    width: 100%;
    padding-left: 50px;
}

.top-nav{
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255,255,255,0.65);
    padding: 15px 0;
}

.top-nav__links{
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-width: 220px;
}

.top-nav a{
    text-decoration: none;
    transition: all ease 300ms;
}

.top-nav a:hover{
    color: #fff;
}

.top-nav .dropdown-item:hover{
    /* color: #EE8032; */
    background: none;
}

.pb_btn--dropdown::after {
    content: '\f107';
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300;
    position: relative;
    top: 2px;
    display: inline-block;
    width: 20px;
    height: 20px;
}

.top-nav__link{
    font-family: 'BankGothic', sans-serif;
    color: rgba(255,255,255,0.65);
}

.top-nav__divider{
    width: 1px;
    border-right: 1px solid rgba(255,255,255,0.65);
    height: 20px;
}

.pb-navigation{
    display: flex;
    align-items: flex-end;
}

.pb-navigation > ul{
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.pb-navigation > ul > li {
    padding: 15px 0px !important;
    position: relative;
}

.pb-navigation > ul > li.cn-dropdown {
    display: inline;
}

.pb-mega-menu{
    min-height: 70vh;
    width: 100%;
    background: #F5F4EF;
    z-index: 99;
}

.pb-mega-menu--shop,.pb-mega-menu--recipe,.pb-mega-menu--learn{
    position: relative;
}

/* .shop {
    color:#ed6e2d !important;
} */

.pb-mega-menu .pb-mega-menu__container{
    padding: 75px;
}

.pb-mega-menu__container ul li a{
    font-family: 'BerninoSansCondensed';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    /* line-height: 24px; */
    line-height: 15px;
    padding: 0;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

.pb-mega-menu__container ul li .pb-mega-menu__link{
    font-family: "jaf-bernino-sans", sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    /* line-height: 24px; */
    line-height: 15px;
    padding: 0;
}


#blog-blurb {
  line-height: 24px !important;
}

.classynav ul li .dropdown li .pb-mega-menu__list-link{
    border-bottom: 1px solid #000;
}

.support-dropdown {
  color: black;
}

.menu--cta{
    width: 100%;
    min-height: 70vh;
    padding: 0px;

}

.menu--cta.shop{
    background: url("https://dansons-site-images.s3.us-west-2.amazonaws.com/dansons/headless-ecommerce-site/shop_navigation/pellet_pour.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    text-align: center;
    background-position: center;

}

.menu--cta.recipe{
    background: url("https://dansons-site-images.s3.us-west-2.amazonaws.com/legacy/catalog/pitboss_2021/navigation_dropdown_images/february_2021/recipe_nav/Recipe_Menu_Image.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.menu--cta.learn{
    background: url("https://dansons-site-images.s3.us-west-2.amazonaws.com/legacy/catalog/pitboss_2021/navigation_dropdown_images/february_2021/learn_nav/Learn_Menu_Image.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.menu--cta.partnership{
  background: url("https://dansons-site-images.s3.us-west-2.amazonaws.com/dansons/headless-ecommerce-site/partnership-navigation/pb_partnership_nascar.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
}

.pb-menu-cta__wrapper{
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0.7147233893557423) 12%, rgba(2,0,36,0.15449929971988796) 31%);
    display: flex;
    flex-direction: column;
    justify-content: start;
    height: 100%;
    padding: 45px 30px;
}

.pb-menu-cta__wrapper .pb_btn {
    padding: 5px 0;
    height: auto;
    width: 190px;
    margin: 0 auto;
    font-size: 18px;
}


.pb-menu-cta--display-2{
    color: #A1A1A1;
    font-family: 'ASPHALTIC CLEAN';
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    letter-spacing: 0.25em;
    line-height: 1;
    text-transform: uppercase;
}

.pb-menu-cta--display-1{
    color: #FFFFFF;
    font-family: 'ASPHALTIC CLEAN';
    font-style: normal;
    font-weight: normal;
    font-size: 60px;
    letter-spacing: 0.02em;
    line-height: 1;
    text-transform: uppercase;
}

.classynav ul li.cn-dropdown-item,.classynav ul li.cn-dropdown-item ul li {
    position: inherit;
}

li.cn-dropdown-item::after{
    position:absolute;
    width: 80px;
    height: 80px;
    background: red;
    top:0;
}

.breakpoint-off .classynav ul li .dropdown {
    width: 100%;
    background: #F5F4EF;
}

.classynav .pb__mega-menu a{
    font-weight: bold;
    font-size: 18px;
    line-height: 24px;
    text-decoration: underline;
    padding: 0px;
    color: #000;
}

.pb-mega-menu__title{
    font-size: 48px;
    line-height: 1;
    border-bottom: 1px solid #000;
    margin-bottom: 1.5rem;
}

.pb-mega-menu__title--sm{
    font-size: 36px;
    line-height: 1;
    border-bottom: 1px solid #000;
}

.pb-mega-menu__title--sm-customercare {
  font-size: 36px;
  line-height: 1;
  border-bottom: 1px solid #000;
}

.classynav ul li ul li a{
    padding: 0px;
    border-bottom: 1px solid #ccc;
}

.main-header-area {
    width: 100%;
    position: relative;
    z-index: 1;
    /*background-color: rgba(0, 0, 0, 0.4);*/
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}

.shimmer {
  -webkit-animation: color 4s infinite;
}

@keyframes color {
  0% {color: #fff;}
  100% {color:#2C77BD;}
}




@media only screen and (min-width: 768px) and (max-width: 991px) {
    .main-header-area {
        height: 70px;
    }
}

@media only screen and (max-width: 767px) {
    .main-header-area {
        height: 70px;
    }
}

.main-header-area .classy-nav-container {
    background-color: #000;
}

.main-header-area .classy-navbar {
    padding: 0px 60px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .main-header-area .classy-navbar {
        height: 70px;
    }
}

@media only screen and (max-width: 767px) {
    .main-header-area .classy-navbar {
        height: 70px;
        padding: 0.5em 30px;
    }
}

.nav-brand {
    width: 100px;
    height: auto;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-header-area .nav-brand {
        margin-right: 0;
    }
}

.main-header-area .classynav ul {
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}

.main-header-area .searchbtn {
    margin-left: 30px;
    background-color: transparent;
    width: 90px;
    text-align: center;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-header-area .searchbtn {
        margin-left: 15px;
        width: 50px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .main-header-area .searchbtn {
        margin-left: 0;
        height: 50px;
        width: 100%;
        margin-top: 15px;
        line-height: 50px;
        background-color: #8c8c8c;
    }
}

@media only screen and (max-width: 767px) {
    .main-header-area .searchbtn {
        margin-left: 0;
        height: 50px;
        width: 100%;
        margin-top: 15px;
        line-height: 50px;
        background-color: #8c8c8c;
    }
}

.main-header-area .pb-nav__search-form {
    position: relative;
    z-index: 1;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}

.pb-nav__search-form input {
    width: 300px;
    height: 30px;
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #C6C6C6;
    border-radius: 5px;
    font-size: 12px;
    margin-left: 50px;
    padding: 0 10px;
    transition: all ease 300ms;
}

.pb-nav__search-form input:hover{
    border-color: #fff;
}


.pb-nav__search-form input:focus{
    outline: none;
    border-color: #fff;
}

.pb-nav__search-form button {
    position: absolute;
    top: 0;
    right: 15px;
    height: 30px;
    width: 30px;
    background-color: transparent;
    color: rgba(255, 255, 255, 0.5);
    border: none;
    cursor: pointer;
    /*outline: none;*/
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}

.pb-nav__search-form button:hover {
    color: #ffffff;
}

#search-btn {
    color: #fff;
}

/*----CART COUNT-----*/

#cartcount {
    background: #fff;
    color: #000;
    border-radius: 50%;
    position: absolute;
    left: 7px;
    width: 15px;
    height: 15px;
    justify-content: center;
    align-items: center;
    font-size: 11px;
    top: -3px;
    display: flex;
    font-family: jaf-bernino-sans, sans-serif;
}

#cartcount:empty{
    display: none;
}

#cart {
    position: relative;
    overflow: visible;
}

/*--------- SIGN IN DROPDOWN ----------*/

.pb_signin__dropdown .form-control{
    border: 1px solid #E0E0E0;
    border-radius: 6px;
}

.pb_signin__dropdown .account-conditions p{
    font-size: 10px;
    line-height: 17px;
    color: #414142;
}

.pb_signin__dropdown .account-conditions a{
    text-decoration: underline;
}

.forgot-password{
    font-size: 10px;
}

.pb_signin__dropdown-menu {
    width: 300px;
    padding: 15px;
}

.pb_signin__dropdown-menu.show{
    animation: fadeIn 300ms ease forwards;
}

.pb_signin__dropdown-menu-header{
    margin-bottom:35px;
}

.pb_signin__dropdown-menu .pb_btn{
    padding-top:10px;
    padding-bottom:10px;
}

.pb_signin__dropdown-menu .form-control:focus{
    border-color: #000;
}

.pb_signin__dropdown-menu a:hover{
    text-decoration: underline;
    color: #000;
}


.pb_account-links__container ul li .account-dropdown-link{
    font-family: 'jaf-bernino-sans', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    padding: 10px 0;
    width:200px;
    display: block;
}

.pb_account-links__container ul li .account-dropdown-link:hover{
    text-decoration: none;
    /* color: #EE8032; */
}

@keyframes fadeIn{
    0%{
        transform: scale(.75);
        opacity: 0;
    }
    100%{
        transform: scale(1);
        opacity: 1;
    }
}

/*--------- MOBILE NAVIGATION ----------------*/

.pb_mobile-navbar{
    background: #000;
    height: 65px;
}

.pb_mobile-navbar__container{
    width: 100%;
    height: 100%;
}

.pb_mobile-navbar__wrapper{
    width: auto;
    height: 100%;
    display: flex;
    align-items:center;
    justify-content: center;
    padding: 0 20px;

}
#mobile-nav-toggle{
    width: 55px;
    display: flex;
}

.mobile-nav-logo{
    display: flex;
    justify-content: center;
    flex: 1;
    padding: 0 20px;
}

#cartcount.cartcount__mobile{
    left: 14px;
    top: -4px;
}

.mobile-nav__icon{
    background: none;
    color: #fff;
    border:none;
    font-size: 20px;
}

.mobile-nav__icon:hover i{
    color: #fff;
}


.mobile-nav__actions{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 55px;
}


.pb_mobile-menu{
    background: #000;
    color: #fff;
    width: 100%;
    height: 100vh;
    padding: 0px;
    display: none;
    opacity: 0;
}

.pb_mobile-menu.open{
    display: block;
    animation: fadeIn 300ms ease-out forwards;
}

.pb_mobile-menu__main-menu{
    margin: 0;
    width: auto;
    height: 100%;
    padding: 0px;
    position: relative;
    overflow-x: hidden;
}

.pb_mobile-menu__main-menu > li {
    list-style: none;
    width:100%;
}


.pb_mobile-menu__main-menu > li a{
    width: auto;
    height: 55px;
    padding: 0 35px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    font-size: 18px;
    border-bottom: 1px solid #333;
    text-decoration: none;
    font-family: 'BankGothic';

}

.pb_mobile-menu__main-menu > li a > span{
    pointer-events: auto;
}

.toggle-secondary-menu-link span{
    pointer-events: auto;
}

.pb_mobile-menu__main-menu > li a.pb_mobile-menu__back-link{
    justify-content: flex-start;
    font-family: 'BankGothic';
    font-size: 18px;
    border-bottom: 1px solid #333;
}

.pb_mobile-menu__main-menu > li a i{
    font-size: 16px;
}

.pb_mobile-menu__back-link i{
    margin-right:10px;
}

.secondary-menu.account-links li a{
    border: none;
    font-size: 14px;
    font-family: 'jaf-bernino-sans', sans-serif;
    text-transform: Capitalize;
}

.secondary-menu.account-links li .pb_mobile-menu__back-link{
    justify-content: flex-start;
    font-family: 'BankGothic';
    font-size: 18px;
    border-bottom: 1px solid #333;
}


/*------ MOBILE MENU LISTS  --------*/

.pb_mobile-menu ul > li > ul {
    width:100%;
    padding-inline-start: 0px;
    list-style: none;

}

.secondary-menu {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    transform: translateX(100%);
    display: block;
}

.secondary-menu.open{
    animation: menuSlideIn 350ms cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.secondary-menu.closed{
    animation: menuSlideOut 350ms cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.secondary-menu > li a{
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-size: 40px;
    text-transform: uppercase;
    border-bottom: 0px;
}


.sub-menu{
    height: 71px;
    transition: all ease 250ms;
    overflow:hidden;
    border-bottom: 1px solid #333;
}

.sub-menu.open{
    height: 100%;
}

.sub-menu ul > li a{
    border: none;
    font-size: 14px;
    font-family: 'jaf-bernino-sans', sans-serif;
    text-transform: capitalize;
}


/*---- MOBILE SEARCH -----*/

#mobile-search{
    display: none;
    background: #000;
    padding: 15px 20px;
    position: relative;
}

#mobile-search.open{
    animation: fadeIn 300ms ease forwards;
    display: block;
}

.pb-nav__search-form.mobile input{
    width: 100%;
    margin: 0px;
    height: 45px;
}


.pb-nav__search-form.mobile button{
    top: 50%;
    right: 25px;
    height: 40px;
    width: 40px;
    transform: translate(0%, -50%);
}

/*----navigation animations-----*/

@keyframes fadeIn{
    0%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}

@keyframes menuSlideIn{
    0%{
        transform: translateX(100%);
    }
    100%{
        transform: translateX(0%);
    }
}


@keyframes menuSlideOut{
    0%{
        transform: translateX(0%);
    }
    100%{
        transform: translateX(100%);
    }
}

@media only screen and (max-width: 1280px){

    .main-header-area .classy-navbar{
        padding: 0px 30px;
    }
    .pb-nav__search-form input{
        width: 250px;
    }
}

/*--------------- FOOTER STYLES --------------------*/

footer{
    background: #000;
}

footer .footer__container{
    padding: 4rem 0 1rem 0;
}

footer p, footer a{
    color: #fff;
}

footer a{
    font-size: 15px;
    line-height: 2.25;
    font-style: normal;
}

footer a:hover{
    color: #fff;
    text-decoration: underline;
}

footer h4{
    color: #a1a1a1;
    font-style: normal;
    font-weight: normal;
    font-size: 35px;
    margin-bottom: .75rem;
}

footer h5{
    color: #fff;
    font-family: "jaf-bernino-sans", sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 24px;
}

.where-to-buy__wrapper{
    display: flex;
    flex-wrap: wrap;
}

.where-to-buy__wrapper > div{
    width: 90px;
    height: 90px;
    margin: 0 10px 10px 0;
}


.social-icons{
    display: flex;
    justify-content: space-between;
    width: 220px;
}

.social-icons a {
    color: #fff;
    font-size: 18px;
    line-height: 20px;
}

.footer-byline{
    margin-top: 2rem;
    flex-direction: row;
}

.footer-byline p{
    opacity: .5;
}

/*Newsletter Form*/

/* .form-control.input__newsletter{*/
/*    font-family: "BankGothic";*/
/*    border: 1px solid rgba(255, 255, 255, 0.3);*/
/*    border-radius: 5px;*/
/*    height: 42px;*/
/*    max-width: 360px;*/
/*    margin-bottom: 0px;*/
/*    background: #000;*/
/*    color: #fff;*/
/*}*/

/*.input__newsletter::placeholder{*/
/*    font-family: "BankGothic";*/
/*    font-size: 16px;*/
/*    color: #fff;*/
/*    opacity: 0.5;*/
/*}*/

/*.input__newsletter:focus{*/
/*    border-color: #fff;*/
/*}*/

/*.btn-newsletter {*/
/*    background: #A1A1A1;*/
/*    position: relative;*/
/*    right: 10px;*/
/*    height: 42px;*/
/*    padding: 0px 25px;*/
/*    text-transform: uppercase;*/
/*    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;*/
/*    font-size: 18px;*/
/*    letter-spacing: 0.25rem;*/
/*    border-radius: 0px 6px 6px 0px;*/
/*    border: none;*/
/*}*/

/*.newsletter-form.form-group{*/
/*    display: flex;*/
/*}*/

#_form_601AEA7416C91_{
    margin: 0px !important;
    background: #000 !important;
    padding: 0px !important;
}


@media only screen and (max-width:992px){
    footer .footer__container{
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media only screen and (max-width:600px){

    footer a{

        line-height: 1.25;
        padding: 8px 0px;

    }

    .newsletter-form.form-group{
        flex-direction: column;
    }

    .form-control.input__newsletter{
        max-width: 100%;
    }

    .btn-newsletter{
        right: 0px;
        margin-top: 10px;
        border-radius: 6px;
    }

    .where-to-buy__wrapper > div {
        width: 45%;
        height: 170px;
        margin: auto;
    }

    .where-to-buy__wrapper > div:nth-child(odd){
        padding-right: 7.5px;
    }

    .where-to-buy__wrapper > div:nth-child(even){
        padding-left: 7.5px;
    }

    .where-to-buy__wrapper img {
        width: 170px;
    }
}



/*------------- BANNER CTA STYLES located in CMS -> Information ->	Pit Boss US Ad Category Banner and Pit Boss US Ad Banner Home Page ------------- */

.banner-cta-home{
    padding: 30px;
    border-top: 15px solid #147BD1;
    background: black url("https://dansons-site-images.s3.us-west-2.amazonaws.com/legacy/catalog/pitboss_2021/pitboss_2021_banners/cta-ad-banner-background.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom right;
}

.banner-cta__header{
    text-transform: uppercase;
    color: #fff;
    font-family: 'jaf-bernino-sans', sans-serif;
    letter-spacing: -0.03em;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0;
}

.banner-cta__sub-header{
    text-transform: uppercase;
    font-family: 'jaf-bernino-sans', sans-serif;
    letter-spacing: 0.03em;
    margin-bottom: 0;
    color: #a1a1a1;

}

.banner-cta__text, .banner-cta__text a{


    color: #fff;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-size: 1rem;
    letter-spacing: 0.1em;
    margin-bottom: 0;
    text-transform: uppercase;
}

.banner-cta .divider{
    max-height: 100%;
    width: 1px;
    background: #fff;
    opacity: 0.5;
}

@media screen and (max-width: 600px){
    .banner-cta{
        padding: 20px;
    }


    .banner-cta__header{
        font-size: 15px;
        line-height: 1;
    }

    .banner-cta__sub-header{
        font-size: 10px;
        line-height: 1.75;
    }

    .banner-cta__text, .banner-cta__text a{
        font-size: 13px;
        line-height: 1;
    }
}


/*-----------  PAGE HEADER STYLES ---------------*/

.pb_page-header{
    min-height: 420px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position:  center;
    position: relative;
    display: flex;
    align-items: center;

}

.pb_page-header:after {
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.pb_page-header--blog:after {
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #000000 19.93%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.pb_page-header__wrapper{
    position: relative;
    z-index: 1;
    width: 100%;
    margin: 0;
    /*padding: 0px calc(20px + (60 - 20) * ((100vw - 450px) / (1430 - 450)));*/
}

.pb_page-header--smoke-science{
    padding-top: calc(30px + (75 - 30) * ((100vw - 450px) / (1430 - 450)));
    padding-bottom: calc(75px + (150 - 75) * ((100vw - 450px) / (1430 - 450)));
}

@media only screen and (max-width: 992px){
    .pb_page-header--blog:after {

        background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%);
        background: -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%);
        background: -o-linear-gradient(90deg, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%);
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%);
    }
}

@media only screen and (max-width: 600px){
    .pb_page-header{
        min-height: 340px;
    }
}

/*--------------- PRODUCT CARD STYLES ----------------*/

.pb_product-card{
    border: 1px solid rgba(0,0,0,0.2);
    min-height: 100%;
    padding: calc(15px + (30 - 15) * ((100vw - 450px) / (1430 - 450)));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pb_product-card__column{
    min-height: 100%;
    padding: 10px;
}

.pb_product-card__image-container{

    min-height: 330px;
    display: flex;
    width: 100%;
    margin: auto;
    justify-content: center;
    align-items: center;
}

.pb_product-card__image-container.compelete-package-product{

    min-height: calc(280px + (330 - 280) * ((100vw - 450px) / (1430 - 450)));;
    width: calc(70% + (100 - 50) * ((100vw - 450px) / (1430 - 450)));;
    margin: auto;
}


.pb_product-card__details{

    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
    justify-content: space-between;
    flex: 1;

}

.pb_product-card__title{
    font-size: 30px;
    line-height: 32px;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.pb_product-card__info{
    font-family: 'jaf-bernino-sans', sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
    margin: 0px;
}

.pb_product-card__info--normal{
    font-family: 'jaf-bernino-sans', sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 24px;
    margin: 0px;
}


@media screen and (max-width: 600px){
    .pb_product-card__column{
        padding: 10px 0px;
    }
}


/*----------------- RECIPE CARDS ----------------------*/

.pb_recipe-card__column{
    /*55px*/
    margin-bottom: calc(35px + (55 - 35) * ((100vw - 500px) / (1430 - 500)));
}

.pb_recipe-card {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    min-height: 520px;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
    border-radius: 20px;
}

.pb_recipe-card__image{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: all 500ms cubic-bezier(0.65, 0, 0.35, 1);
    overflow: hidden;
}

.pb_recipe-card__image::after {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    background: linear-gradient(0deg, #000 10%, rgba(0, 0, 0, 0) 100%);
}

.pb_recipe-card:hover .pb_recipe-card__image {
    transform: scale(1.1);
}

.pb_recipe-card__wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: auto;
    justify-content: flex-start;
    width: 100%;
    position: relative;
    z-index: 1;
}

.pb_recipe-card__wrapper::after {
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 10%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    z-index: -1;
    bottom: 20px;
}

.pb_recipe-card__caption {
    display: flex;
    flex-direction: column;
    padding: 0px 20px;
    min-height: calc(100px + (140 - 100) * ((100vw - 500px) / (1830 - 500)));
    justify-content: flex-start;
}

.pb_recipe-card__caption a{
    /* 40 px */
    font-size:calc(32px + (40 - 32) * ((100vw - 500px) / (1430 - 500)));
    letter-spacing: .05em;
    line-height: 1;
    color: #fff;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
}

.pb_recipe-card__caption a:hover{
    text-decoration: none;
}


.pb_recipe_card__details {
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #333;
    width: 100%;
    padding: 20px 15px;
    background: black;
}

.pb_recipe-card__icons{
    color: #fff;
    opacity: 0.75;
    font-size: 12px;
}

.pb_recipe-card__icons span{
    font-size: 12px;
}

/*------------------- HOME - DISCOVER RECIPES CARD -------------------*/


.discover-recipes{
    padding-top: 75px;
    margin-bottom: 150px;
    background: url('../../../theme/default/image/Discover-New-Recipes-Home-BG.png');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

.pb_recipe-card.discover{
    min-height: calc(300px + (520 - 300) * ((100vw - 450px) / (1430 - 450)));
    max-height: 520px;
    /*background: url('../../../theme/default/image/new-recipe-macNcheese-img.png');*/
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 20px;
    border-radius: 5px;
    top: 70px;
    overflow: hidden;
    position: relative;
}

.pb_recipe-card.discover:focus{
    box-shadow: 0px 0px 4px #A1A1A1;
}

.pb_recipe-card.discover:focus-within {
    box-shadow: 0px 0px 4px #A1A1A1;
}


.pb_recipe-card.discover:after {
    width: 100%;
    height: 100%;
    background: linear-gradient(133.33deg, rgba(0, 0, 0, 0) 18.77%, rgba(0, 0, 0, 0.75) 104.11%);
    content: '';
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 0;
}

.pb_recipe-card.discover .pb_recipe-card__wrapper::after{
    background: none;
}

.pb_recipe-card.discover .title{
    position: relative;
    z-index: 1;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    color: #fff;
    font-style: normal;
    font-weight: normal;
    font-size: calc(45px + (55 - 45) * ((100vw - 450px) / (1430 - 450)));
    line-height: 1;
    text-align: center;
    text-transform: capitalize;
}

.pb_recipe-card.discover .pb_recipe_card__wrapper:after{
    background: none;
}

.pb_recipe-card.discover .pb_recipe-card__caption{
    padding: 0px;
}

@media only screen and (min-width: 992px){

    .discover-recipe__cards li:nth-child(2){
        bottom: 40px;
    }
}

@media only screen and (max-width: 992px){
    .discover-recipes{
        background-position-y: -600px;
    }

    .pb_recipe-card.discover{
        width: 90%;
        margin: auto;
    }
}




/*----------------- BLOG CARDS ----------------------*/

.pb_blog-card__column{
    /*55px*/
    margin-top: calc(35px + (55 - 35) * ((100vw - 500px) / (1430 - 500)));
}

.pb_blog-card {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
    max-width: 350px;
    height: 100%;
    min-height: 500px;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
    border-radius: 20px;
}

.pb_blog-card__image{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: all 500ms cubic-bezier(0.65, 0, 0.35, 1);
}

.pb_blog-card__image::after {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    background: linear-gradient(0deg, #000 10%, rgba(0, 0, 0, 0) 100%);
}

.pb_blog-card:hover .pb_blog-card__image {
    transform: scale(1.1);
}

.pb_blog-card__wrapper {
    background: url('../../../theme/default/image/pb_blog-card-background.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    justify-content: flex-start;
    width: 100%;
    z-index: 1;
}

.pb_blog-card__wrapper::after {
    content: '';
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, #000 10%, rgba(0, 0, 0, 0) 100%);
    z-index: -1;
    bottom: 0px;
}

.pb_blog-card__caption {
    display: flex;
    flex-direction: column;
    padding: 30px 20px 0;
    min-height: calc(150px + (200 - 150) * ((100vw - 500px) / (1430 - 500)));
    justify-content: flex-start;
}

.pb_blog-card__caption a{
    color: #fff;
    /* 40 px */
    font-size:calc(32px + (40 - 32) * ((100vw - 500px) / (1430 - 500)));
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    letter-spacing: .05em;
    line-height: 1;
}


/*------------------PRODUCT DESCRIPTION SECTIONS-------------*/

.pb_description-caption__container{
    margin: calc(15px + (45 - 15) * ((100vw - 450px) / (1430 - 450))) 0;
}

.pb_description-caption__wrapper{
    margin: calc(15px + (45 - 15) * ((100vw - 450px) / (1430 - 450))) 0;
}

.pb_description-image__container {
    display: flex;
    justify-content: center;
    position: relative;
    padding: 30px;
    flex-direction: column;
}

.pb_description-image__container h2 {
    color: #fff;
}

.pb_description-image__container img {
    margin: auto;
    width: 450px;
}


.pb_description-list {
    margin-bottom: 1rem;
}


.pb_description-list li {
    position: relative;
    padding-left: 15px;
    line-height: 2;
    font-style: italic;
}

.pb_description-list li:before {
    content: '';
    width: 5px;
    height: 5px;
    background: #A1A1A1;
    position: absolute;
    top: 15px;
    left: -1px;
    transform: translate(50%,-50%);
}

/*------- CTA SIDEBAR -----------*/

.cta-sidebar{
    position: sticky;
    top: 150px;
    padding-bottom: 50px;
}

.cta-sidebar__container-overlay {
    position: absolute;
    width: 110%;
    height: 60px;
    background: #fff;
    bottom: 0px;
    z-index: 99;
    left: -5%;
}

.cta-sidebar__container-overlay {
    box-shadow: 0px -29px 18px #fff;
}

@media only screen and (min-width: 992px){

    .cta-sidebar__container{
        height: 550px;
        overflow: scroll;
    }

    .cta-sidebar__container::scrollbar{
        display: none;
    }

}

@media only screen and (max-width: 992px){
    .cta-sidebar{
        margin-top: 48px;
    }

}



/*------- SOCIAL CALL TO ACTION -----------*/

.pb_social-cta{
    width: 100%;
    margin-bottom: 100px;
}

.pb_social-cta-content{
    padding: 35px calc(50px + (100 - 50) * ((100vw - 450px) / (1430 - 450)));
}

.pb_social-cta-feature{
    background-image: url('https://dansons-site-images.s3.us-west-2.amazonaws.com/legacy/catalog/pitboss_2021/blog_pages/follow-on-social-media-footer.jpg');
}

.pb_social-cta h3{

    max-width: 400px;
    color: #fff;
    font-family: ASPHALTIC CLEAN;
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    line-height: 38px;
    letter-spacing: 0.05em;

}

.pb_social-cta p{
    max-width: 400px;
}

.pb_social-cta-banner{
    background: #A1A1A1;
    position: relative;
    z-index: 1;
    padding: 25px 0px;
    margin: 30px 0px;
}

.pb_social-cta-banner .social-links{
    display: flex;
    justify-content: space-between;
    width: 270px;
    flex-wrap: wrap;
}

.social-link{

    align-items: center;
    color: #000000;
    display: flex;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.05em;
    text-transform: uppercase;

}

.pb_social-cta-banner:before {
    content: '';
    width: 160%;
    height: 100%;
    background: #A1A1A1;
    position: absolute;
    bottom: 0;
    z-index: -1;
    margin-left: -20%;
}

@media only screen and (max-width: 992px){
    .pb_social-cta-content{
        overflow: hidden;
    }
}

/*-------------- PRODUCT FILTER DISPLAY -------------*/

.pb_product-filter-sidebar{
    position: sticky;
    top: 175px;
}

.pb_filter-display__title{
    font-family: 'jaf-bernino-sans', sans-serif;
    font-size: 1rem;
    line-height: 24px;
    color: #414142;
    font-weight: 700;
    margin-bottom: 25px;
}

.pb_filter-display__filter {
    margin-bottom: 15px;
    cursor: pointer;
}

.pb_filter-display__filter .custom-control-label{
    font-family: 'jaf-bernino-sans', sans-serif;
    font-size: 14px;
    color: #414142;
    line-height: 1.8;
    cursor: pointer;
}

.pb_filter-display__filter .custom-control-label::before {
    background-color: white;
    border: 1px solid #000;
    border-radius: 0.15rem;
    cursor: pointer;
}

.pb_filter-display__filter .custom-control-input:checked ~ .custom-control-label::before {
    cursor: pointer;
    background-color: #000;
}

/* :: ----- mobile styles for filter display ------*/

.pb_btn--filter-toggle{

    position: relative;
    top: 3px;
    width: 100%;
    height: 40px;
    background: #A1A1A1;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: 0.25em;
    text-align: center;
    text-transform: uppercase;
    border-radius: 5px;
    transition: all ease 250ms;
}

.pb_btn--filter-toggle:hover{
    text-decoration: none;
}

.mobile-filter-btn{
    min-width: auto;
    height: 42px;
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: #FFFFFF;
    background: #000;
    border: none;
    border-radius: 5px;
    padding: 0px 10px;
}

.mobile-filter-actions {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items:center;
    background: #A1A1A1;
    padding: 10px 20px;
    border-top: 1px solid rgba(0,0,0,0.2);
    position: relative;
    z-index: 1;

}

.mobile-filter-actions a{
    font-family: "pitboss-ASPHALTIC-CLEAN", sans-serif;
    font-size: 15px;
    letter-spacing: 0.25em;
    text-decoration-line: underline;
    text-transform: uppercase;
}

.pb_filter-group-title {
    width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #000;
    padding: 0px 20px;
    pointer-events: auto;
    cursor: pointer;
}

.pb_filter-group-title {
    color: #fff;
    font-family: 'jaf-bernino-sans', sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 24px;
    pointer-events: auto;
    text-transform: capitalize;
}

.pb_filter-group-title:hover{
    color: #fff;
}

.pb_filter-group-title::after{
    content: '\f068';
    color: #fff;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
}

.pb_filter-group-title.collapsed::after{
    content: '\f067';
    color: #fff;
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400;
}

.pb_filter-group-option{
    color: #fff;
    background: #000;
}

@media only screen and (max-width: 992px){

    .pb_filter-display__filter .custom-control-label::before {
        background-color: #000;
        border: 1px solid #fff;
    }

    .pb_filter-display__filter .custom-control-label{
        color: #ffffff;
    }

    .pb_filter-group-option{
        padding: 0px 20px 20px;
    }
}

/* :: ------------- MODAL STYLES -------------*/

.modal-title{
    font-size: 35px;
}

/* :: ------------- Preloader Area CSS -------------*/

#preloader {
    overflow: hidden;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100000;
    background-color: #ffffff;
}

.south-load {
    -webkit-animation: 1500ms linear 0s normal none infinite running south-load;
    animation: 1500ms linear 0s normal none infinite running south-load;
    background: transparent;
    border-color: #ffffff;
    border-top-color: #8c8c8c;
    border-left-color: #8c8c8c;
    border-right-color: #8c8c8c;
    border-radius: 50%;
    border-style: solid;
    border-width: 2px;
    height: 50px;
    left: calc(50% - 25px);
    position: relative;
    top: calc(50% - 25px);
    width: 50px;
    z-index: 9;
}

@-webkit-keyframes south-load {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes south-load {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* ::-------------  Scroll Up Area CSS -------------*/

#scrollUp {
    background-color: #8c8c8c;
    border-radius: 50%;
    bottom: 40px;
    right: 40px;
    box-shadow: 0 0 5px 0 rgba(255, 255, 255, 0.1);
    color: #ffffff;
    font-size: 24px;
    height: 50px;
    text-align: center;
    width: 50px;
    line-height: 46px;
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}

#scrollUp:hover {
    background-color: #000000;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    #scrollUp {
        bottom: 30px;
        right: 30px;
        height: 50px;
        width: 50px;
        line-height: 46px;
    }
}

@media only screen and (max-width: 767px) {
    #scrollUp {
        bottom: 30px;
        right: 30px;
        height: 50px;
        width: 50px;
        line-height: 46px;
    }
}

.recommended-image {
  width: 260px;
  height: 260px;
}

.recoprodtitle-div{
  width: 15em;
  margin: auto;
}

.product-recommendations-title {
  overflow: hidden;
  word-wrap: break-word;
  -webkit-line-clamp: 3;
  text-overflow: ellipsis;
  width: 633px;
  line-height: normal;
  font-family: jaf-bernino-sans-condensed, sans-serif;
  font-weight: 700 !important;
  font-style: normal;
}

.recommended-price {
  font-family: jaf-bernino-sans-condensed, sans-serif;
  font-weight: 700 !important;
  font-style: normal;
  font-size: 16px !important;
}

.banner-shop {
  background: black url(https://dansons-site-images.s3.us-west-2.amazonaws.com/dansons/headless-ecommerce-site/banner/cta-ad-banner-background-wood.jpg);
}

ul li a #blog-blurb {
  line-height: 1.5em !important;
}

