@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Amaranth:ital,wght@0,400;0,700;1,400;1,700&display=swap');



body, html {
    margin: auto;
    overflow-x: hidden;
    font-size: 1.125em;
    max-width: 1366px;
    background-color: #000000;
    color: #ffffff;
    line-height: 1.25;
    font-family: "Nunito", sans-serif;
    scroll-behavior: smooth;
}


h1 {
    font-family: "Amaranth", sans-serif;
    font-size: 3.5em;
    color: #ffffff;
    line-height: 1;
}

h2 {
    font-family: "Amaranth", sans-serif;
    font-size: 2.5em;
    color: #000000;
    line-height:1;
}

h3 {
    font-family: "Amaranth", sans-serif;
    font-size: 1.75em;
    color: #ffffff;
}

h4 {
    font-family: "Amaranth", sans-serif;
    font-size: 1.375em;
    font-weight: 500;
    color: #d8cbb8;
}

.mobile-nav-display {
    border-left: 1px solid #f8f9fa;
}

.contact-padding{

    padding-left:93px;

}

/* ########## CUSTOM CLASSES START ############*/

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

.tree-padding {
    margin-left: .95rem
}

.column-padding {
    padding-left: 2.75rem;
}

.vertical-list a {
    color: #ffffff;
    text-decoration: none;
}

    .vertical-list a:hover {
        color: #d77c21 !important;
    }

    .vertical-list li {
        margin-bottom: 8px;

    }


.nav-text {
    font-size: 1.25em;
    color: #000000;
}

.brew-heading {
    width: 300px;
    margin: 0 auto;
}

.border-none{

    border:none !important;
}

.hero-sub-header {
    font-size: 2em;
    color: #d77c21;
}

.about-us-header {
    font-size: 2em;
    color: #737144;
}


.nav-1 .nav-item {
    position: relative;
}

.nav-1 {
    display: flex;
    align-items: center;
}

.bg-green {
    background-color: #737144;
}

.bg-brown {
    background-color: #855914;
}

.bg-darkbrown {
    background-color: #33221a;
}


.bg-tan {
    background-color: #d8cbb8;
}


.navbar-nav .nav-link:hover {
    color: #d77c21 !important;
}


.footer-spacing1 {
    margin-top: auto;
    margin-bottom: auto;
}

.footer-spacing2 {
    margin-top: auto;
    margin-bottom: auto;
}

.custom-button-1 {
    padding: 15px 32px;
    border-radius: 30px;
    border: 1px solid #d8cbb8;
    background-color: #d8cbb8;
    color: #33221a;
    font-size: 1em;
    font-weight: bold;
}



    .custom-button-1:hover {
        padding: 15px 32px;
        border: 1px solid #d77c21;
        background-color: #d77c21;
        border-radius: 30px;
        opacity: 1.0;
        color: #33221a;
        font-size: 1em;
        font-weight: bold;
    }

.custom-button-2 {
    padding: 15px 32px;
    border-radius: 30px;
    border: 1px solid #855914;
    background-color: #855914;
    color: #ffffff;
    font-size: 1em;
    font-weight: bold;
}



    .custom-button-2:hover {
        padding: 15px 32px;
        border: 1px solid #d77c21;
        background-color: #d77c21;
        border-radius: 30px;
        opacity: 1.0;
        color: #ffffff;
        font-size: 1em;
        font-weight: bold;
    }

.custom-button-3 {
    padding: 12px 30px;
    border-radius: 30px;
    border: 1px solid #d8cbb8;
    background-color: #d8cbb8;
    color: #000000;
    font-size: 1em;
    font-weight: bold;
}



    .custom-button-3:hover {
        padding: 12px 30px;
        border: 1px solid #d77c21;
        background-color: #d77c21;
        border-radius: 30px;
        opacity: 1.0;
        color: #000000;
        font-size: 1em;
        font-weight: bold;
    }

body.modal-open {
    padding-right: 0 !important;
}


.div-no-mobile {
    display: block;
}

.div-only-mobile {
    display: none;
}

.div-no-mobile700 {
    display: block;
}

.div-only-mobile700 {
    display: none;
}

.div-no-mobile991 {
    display: block;
}

.div-only-mobile991 {
    display: none;
}


.privacy-link {
    color: #d77c21;
    text-decoration: none;
    cursor: pointer;
}

    .privacy-link:hover {
        text-decoration: underline !important;
    }


.social-media-header{

    text-align:center;

}

.club-background-1 {
    height: 415px ;
    aspect-ratio: auto ;
    background-image: url(../images/coffee-club-background.jpg);
    background-size: cover;
    background-position: center;
}

.right-width-club {
    width: 60%;
    
}

.left-width-club {
    width: 40%;
    
}

.coffee-club-input {
    height: 55px;
    width: 425px;
    padding-left: 15px;
}

.club-size {
    min-width: 620px;
    min-height: 320px;
    text-align: left;
}




.slider-background-1 {
    height: 620px !important;
    aspect-ratio: auto !important;
    background-image: url(../images/Hero-Image-Background.jpg);
    background-size: cover;
    background-position: right;
}

.right-width {
    width: 50%;
}

.left-width {
    width: 50%;
}

.header-text-padding {
   
    padding-left:60px;
}

.header-size {
   
    text-align: left;
}

.header-sizing{

    width:500px;


}

.header-text-size {
    width: 460px;
    
}

.nav-bar-padding {
    padding-left: 210px;
}

.faq-section {
    background-color: #302018;
}

.faq-question {
    color: #d8cbb8;
    
    padding: 15px 0;
    border-bottom: 1px solid #765127;
    cursor: pointer;
}

.faq-icon {
    color: #d88a20;
    font-size: 1.4em;
    font-weight: 300;
}

.faq-answer {
    color: #d8cbb8;
    padding: 20px 0;
    border-bottom: 1px solid #765127;
    
}


.contact-border{

    border-right:1px solid black;


}


.text-mobile-lg-center {
    text-align: left;
}

.horizontal-list {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    
}

    .horizontal-list li {
        display: inline;
    }

        .horizontal-list li a {
            display: block;
            color: #ffffff;
            padding: 16px;
            text-decoration: none;
        }

            .horizontal-list li a:hover {
                
                color: #d77c21;
            }

.footer-bg-img {
    height: 100px !important;
    aspect-ratio: auto !important;
    background-image: url(../images/footer-image.png);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
}





/* ########## MOBILE CLASSES START ############*/

@media screen and (max-width: 1300px) {
    .header-text-padding {
        padding-left: 60px;
    }
}

@media screen and (max-width: 1200px) {
    .header-text-padding {
        padding-left: 60px;
    }
}

@media screen and (max-width: 1100px) {
    .header-text-padding {
        padding-left: 60px;
    }
}


@media screen and (max-width: 1150px) {
    .column-padding {
        padding-left: 1.70rem;
    }
}






    @media screen and (max-width: 600px) {
        .div-no-mobile {
            display: none;
        }

        .hero-sub-header {
            font-size:1.5em;
            color: #d77c21;
        }

        .div-only-mobile {
            display: block;
        }

        .coffee-club-input {
            height: 55px;
            width: 300px;
            padding-left: 15px;
        }

        .text-mobile-center {
            text-align: center;
        }



        .social-media-header {
            text-align: center;
        }

        .brew-heading {
            width: 300px;
            margin: 0 auto;
        }



        .contact-border {
            border-right: 1px solid black;
        }
    }

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

        .contact-border {
            border-right: none;
            border-bottom: 1px solid black;
        }

        .header-text-size {
            width: 460px;
            margin-left:auto;
            margin-right:auto;
        }

        .column-padding {
            padding-left: 15px;
        }

        .header-sizing {
            width: 500px;
            margin-left: auto;
            margin-right: auto;
        }

        .contact-padding {
            padding-left: 2.5rem;
            padding-right:2.5rem;
        }



        .footer-spacing1 {
            margin-top: auto;
            margin-bottom: auto;
        }

        .footer-spacing2 {
            margin-top: 15px;
        }

        .footer-bg-img {
            height: 130px !important;
            aspect-ratio: auto !important;
            background-image: url(../images/footer-image.png);
            background-size: cover;
            background-position: center;
        }

        .mobile-nav-display {
            width: 100%;
            padding-right: 15px;
            padding-left: 15px;
            margin-right: auto;
            margin-left: auto;
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
        }

        .nav-bar-padding {
            padding-left: 0px;
        }

        .nav-link {
            text-align: center !important;
        }

        .text-mobile-lg-center {
            text-align: center;
        }

        .club-background-1 {
            height: 428px;
            aspect-ratio: auto;
            background-image: url(../images/coffee-club-background.jpg);
            background-size: cover;
            background-position: center;
        }

        .club-size {
            min-width: 363px !important;
            padding: 30px;
            min-height: 363px !important;
            text-align: left;
        }

        .right-width-club {
            width: 100% !important;
        }

        .left-width-club {
            width: 0% !important;
        }

        .brew-heading {
            width: 300px;
            margin: 0 auto;
        }
    }


    @media screen and (min-width: 931px) and (max-width: 1296px) {

        .brew-heading {
            width: auto;
            margin: 0 auto;
        }
    }


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

    .club-size {
        min-width: 363px !important;
        padding: 30px;
        min-height: 363px !important;
        text-align: left;
    }

}




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

        .div-no-mobile991 {
            display: none;
        }

        .div-only-mobile991 {
            display: block;
        }
    }

    @media screen and (max-width: 700px) {
        .div-no-mobile700 {
            display: none;
        }

        .div-only-mobile700 {
            display: block;
        }
    }


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

        .club-background-1 {
            height: 452px;
            aspect-ratio: auto;
            background-image: url(../images/coffee-club-background.jpg);
            background-size: cover;
            background-position: center;
        }
    }


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

        .custom-button-3 {
            padding: 10px 17px;
            border-radius: 30px;
            border: 1px solid #d8cbb8;
            background-color: #d8cbb8;
            color: #000000;
            font-size: 0.9em;
            font-weight: bold;
        }



            .custom-button-3:hover {
                padding: 10px 17px;
                border: 1px solid #d77c21;
                background-color: #d77c21;
                border-radius: 30px;
                opacity: 1.0;
                color: #000000;
                font-size: 0.9em;
                font-weight: bold;
            }
    }



    @media screen and (max-width: 1240px) {
        .club-size {
            min-width: 670px;
            min-height: 363px;
            text-align: left;
        }

        .right-width-club {
            width: 70%;
        }

        .left-width-club {
            width: 30%;
        }
    }



    @media screen and (max-width: 1100px) {
        .club-size {
            min-width: 670px;
            min-height: 363px;
            text-align: left;
        }

        .right-width-club {
            width: 78%;
        }

        .left-width-club {
            width: 22%;
        }
    }



   




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

        .slider-background-1 {
            height: 620px !important;
            aspect-ratio: auto !important;
            background-image: url(../images/Hero-Image-Background.jpg);
            background-size: cover;
            background-position: right;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
        }

        .header-text-padding {
            padding-top: 20px;
            padding-left: 60px;
        }

        .right-width {
            width: 0%;
        }

        .left-width {
            width: 100%;
        }
    }


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

        .slider-background-1 {
            height: 620px !important;
            aspect-ratio: auto !important;
            background-image: url(../images/Hero-Image-Background.jpg);
            background-size: cover;
            background-position: right;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
        }

        .header-text-padding {
            padding-top: 20px;
            padding-left: 60px;
        }

        .right-width {
            width: 1%;
        }

        .left-width {
            width: 99%;
        }
    }


    /*

@media screen and (max-width: 799px) {
    .slider-background-1 {
        height: 330px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
       
        
    }

    .header-text-padding {
        padding-top: 35px;
        padding-left: 80px;
    }

    .right-width {
        width: 70%;
    }

    .left-width {
        width: 30%;
    }
}

@media screen and (max-width: 798px) {
    .slider-background-1 {
        height: 330px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
       
       
    }

    .header-text-padding {
        padding-top: 73px;
        padding-left: 80px;
        text-align: center;
    }

    .right-width {
        width: 90%;
    }

    .left-width {
        width: 10%;
    }
}

@media screen and (max-width: 773px) {
    .slider-background-1 {
        height: 330px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
        
        
    }

    .header-text-padding {
        padding-top: 45px;
        padding-left: 80px;
        text-align: center;
    }

    .right-width {
        width: 90%;
    }

    .left-width {
        width: 10%;
    }
}

@media screen and (max-width: 750px) {
    .slider-background-1 {
        height: 330px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
        
       )
    }

    .header-text-padding {
        padding-top: 40px;
        padding-left: 80px;
    }

    .right-width {
        width: 90%;
    }

    .left-width {
        width: 10%;
    }
}

@media screen and (max-width: 710px) {
    .slider-background-1 {
        height: 331px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
        font-size: 20px;
        
    }

    .header-text-padding {
        padding-top: 35px;
        padding-left: 80px;
    }

    .right-width {
        width: 90%;
    }

    .left-width {
        width: 10%;
    }
}

@media screen and (max-width: 700px) {
    .slider-background-1 {
        height: 331px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        background-position: center;
        font-size: 20px;
       
    }

    .header-text-padding {
        padding-top: 33px;
        padding-left: 80px;
    }

    .right-width {
        width: 90%;
    }

    .left-width {
        width: 10%;
    }
}

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

    .slider-background-1 {
        height: 650px !important;
        aspect-ratio: auto !important;
        background-image: url(../images/Hero-Image-Background.jpg);
        background-size: cover;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-inline: auto;
        
       
    }

    .header-text-padding {
        padding: 195px 20px 20px 20px;
        text-align: center;
    }

    .header-size {
        color: #ffffff;
        width: 100%;
        max-width: 400px;
        height: auto;
        text-align: center;
    }

    .right-width {
        width: 100%;
    }

    .left-width {
        width: 0%;
        text-align: center;
    }
}
*/


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

        .slider-background-2 {
            background-image: url(../images/Hero-Image-Background.jpg);
            background-position: right;
            background-size: cover;
            display: flex !important;
            flex-direction: column !important;
            justify-content: center !important;
            align-items: center !important;
            padding: 0 !important;
            height: 550px !important;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
            background-size: cover !important;
        }


        .slider-background-1 {
            height: 620px !important;
            aspect-ratio: auto !important;
            background-image: url(../images/Hero-Image-Background.jpg);
            background-size: cover;
            background-position: right;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
        }

        .slider-background-2 .row {
            width: 100%;
            margin: 0;
        }
    }

    @media (max-width: 930px) {
        .card-deck {
            display: block;
        }

            .card-deck .card {
                margin-bottom: 1.5rem;
            }

        .card {
            max-width: 500px;
            margin-left: auto !important;
            margin-right: auto !important;
        }
    }



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

        .footer-bg-img {
            height: 200px !important;
            aspect-ratio: auto !important;
            background-image: url(../images/footer-image.png);
            background-size: cover;
            background-position: center;
        }

        .brew-heading {
            width: 250px;
            margin: 0 auto;
        }

        .slider-background-2 {
            background-image: url(../images/Hero-Image-Background.jpg);
            background-position: 500px 0px;
            background-size: cover;
            display: flex !important;
            flex-direction: column !important;
            justify-content: center !important;
            align-items: center !important;
            padding: 0 !important;
            height: 700px !important;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
            background-size: cover !important;
        }

        .club-background-1 {
            height: 515px;
            aspect-ratio: auto;
            background-image: url(../images/coffee-club-background.jpg);
            background-size: cover;
            background-position: center;
        }
    }


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

    .club-background-1 {
        height: 515px;
        aspect-ratio: auto;
        background-image: url(../images/coffee-club-background.jpg);
        background-size: cover;
        background-position: center;
    }

    .coffee-club-input {
        height: 55px;
        width: 250px;
        padding-left: 15px;
    }

    .brew-heading {
        width: 250px;
        margin: 0 auto;
    }
}


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


        .slider-background-2 {
            background-image: url(../images/Hero-Image-Background.jpg);
            background-position: 500px 0px;
            background-size: cover;
            display: flex !important;
            flex-direction: column !important;
            justify-content: center !important;
            align-items: center !important;
            padding: 0 !important;
            height: 700px !important;
            box-shadow: inset 0 0 0 100vmax rgba(51, 34, 26, .6);
            background-size: cover !important;
        }
    }