@font-face {
    font-family: 'Bohemian typewriter';
    src: url('../fonts/Bohemiantypewriter.woff2') format('woff2'),
        url('../fonts/Bohemiantypewriter.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Mitogen Display';
    src: url('../fonts/MitogenDisplay-Regular.woff2') format('woff2'),
        url('../fonts/MitogenDisplay-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Mitogen Signature';
    src: url('../fonts/MitogenSignature.woff2') format('woff2'),
        url('../fonts/MitogenSignature.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Agethsa';
    src: url('../fonts/Agethsa.woff2') format('woff2'),
        url('../fonts/Agethsa.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Honeypirls Regular Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Honeypirls Regular Regular'), url('../fonts/honeypirls-regular.woff') format('woff');
    }






body{background: #fff;} 
*{padding: 0; margin: 0; border: 0;}
.banner-text,
.banner-footer{height: 100%;left: 10%;top: 0;display: flex;align-items: center; text-align: left;}
.banner-text h2{color:#f9140c;font-size: 70px;font-family: 'Honeypirls Regular Regular';letter-spacing: 7px;line-height: 82px;}
.banner-text h3{color:#414141;font-size: 44px;font-family: 'Mitogen Display'; letter-spacing: 1px; margin: 30px 0;}
.price-text{color: #f9140c; font-size: 30px; font-family: 'Bohemian typewriter'; text-decoration: underline;}

.sale-container{font-size: 48px; color: #f9140c; font-family: 'Honeypirls Regular Regular';letter-spacing: 7px;}

.prod-name-sale{font-size: 22px;color: #f9140c;font-family: 'Honeypirls Regular Regular';letter-spacing: 1px;text-align: left;float: left;padding: 5px 10px;display: block;line-height: 24px;}
.prod-pric-sale{font-size: 20px;color: #6a6a6a;font-family: 'Bohemian typewriter';padding: 0px 10px;display: block;clear: both;text-align: left;letter-spacing: 2px;}


.prod-cat-name{color:#f9140c; font-family: 'Mitogen Display'; font-size: 24px; letter-spacing: 3px;}


.owl-dots,
.owl-theme .owl-nav{display: none;}

.bg-val-coll{background: #f7f7f7;}
.overlay-dtl{background-color: rgba(255, 255, 255,0.7);bottom: 50px;left: 10%;width: 80%;padding: 20px;}
.overlay-dtl h2{color:#f9140c;font-size: 40px;font-family: 'Honeypirls Regular Regular';letter-spacing: 2px;line-height: 42px;}
.overlay-dtl p,
.btn-shop-now{color:#6a6a6a; font-size:20px;  font-family: 'Bohemian typewriter'; line-height: 24px; }
.btn-shop-now{color:#f9140c; text-decoration: underline; margin-top: 20px; display: inline-block;}

.banner-footer{text-align: center;justify-content: start;width: 100%;text-align: center;left: 0;min-width: 90vw;top: -29px;}
.banner-footer h2{font-size: 60px;color:#f9140c;font-family: 'Honeypirls Regular Regular';text-align: center;margin: 0 0 20px;line-height: 45px;}
.banner-footer p{font-size: 22px;color:#f9140c;font-family: 'Mitogen Display';width: 100%;margin-bottom: 260px;}

.email-box{position: absolute;border: 1px solid #f9140c;max-width: 400px;margin: 0 auto;border-radius: 5px;padding: 5px;height: 50px;bottom: 50px;left: calc(50% - 200px);}
.email-box .form-control{background-color: transparent;height: 40px;font-size: 22px;font-family: 'Mitogen Display';color:#f9140c;padding: 0px 10px;width: calc(100% - 90px);line-height: 40px;}
.email-box .form-control:focus{outline: none;}
.btn-join{position: absolute; background-color: #f9140c; color: #fff; padding: 4px 18px 0; border-radius: 5px; right: 6px; top: 6px; font-size: 22px; font-family: 'Mitogen Display'; line-height: 35px; height: 35px;}

.img-desktop{display: block;}
.img-mob{display: none;}

.product-sale-container{ display: flex; flex-wrap: wrap;}
.prod-box{padding: 0 15px; margin: 0 0 30px; width: 25%;}

/*Laptop*/
@media (max-width: 1280px){

.logo{max-width: 400px;}
.banner-text h2{font-size: 60px; line-height: 70px;}
.banner-text h3{font-size: 32px; margin: 20px 0;}
.price-text{font-size: 24px;}
.sale-container h2{font-size: 40px; }
.banner-footer p,
.prod-name-sale{font-size: 18px;}
.overlay-dtl p, .btn-shop-now,
.email-box .form-control,
.btn-join,
.prod-pric-sale{font-size: 16px;}
.overlay-dtl h2{font-size: 32px;}    
.banner-footer h2{font-size: 50px;}

.email-box{height: 44px;}
.email-box .form-control{height: 34px; line-height: 34px;}
.btn-join{height: 32px; line-height: 28px;}

}





/*Tablet*/
@media (max-width: 1024px){

    .logo{max-width: 270px;}
.banner-text h2{font-size: 50px;line-height: 54px;}
.banner-text h3{font-size: 29px;margin: 15px 0;}
.price-text{font-size: 22px;}
.sale-container h2{font-size: 40px; }
.banner-footer p,
.prod-name-sale{font-size: 16px;}
.overlay-dtl p, .btn-shop-now,
.email-box .form-control,
.btn-join,
.prod-pric-sale{font-size: 14px;}
.overlay-dtl h2{font-size: 32px;}    
.banner-footer h2{font-size: 36px;margin-bottom: 10px;}

.email-box{height: 44px;}
.email-box .form-control{height: 34px; line-height: 34px;}
.btn-join{height: 32px; line-height: 28px;}

.banner-footer p{
    margin-bottom: 180px;
}

.prod-box{width: 33.33%;}


}


/*Mobile*/
@media (max-width: 767px){

    .header{padding: 30px 0 !important;}    
    .logo{max-width: 300px;}
    .banner-text {left:24px;}
.banner-text h2{font-size: 32px;line-height: 34px;letter-spacing: 3px;}
.banner-text h3{font-size: 22px;margin: 9px 0;}
.price-text{font-size: 18px;}
.sale-container h2{font-size: 28px;letter-spacing: 4px;}
.banner-footer p,
.prod-name-sale{font-size: 20px;}
.overlay-dtl p, .btn-shop-now,
.email-box .form-control,
.btn-join,
.prod-pric-sale{font-size: 18px;}
.overlay-dtl h2{font-size: 32px;}    
.banner-footer h2{font-size: 30px;margin-bottom: 3px;line-height: 25px;}

.email-box{height: 40px;margin-top: 10px !important;}
.email-box .form-control{height: 30px;line-height: 30px;}
.btn-join{height: 30px;line-height: 26px;top: 4px;right: 4px;}

.banner-footer p{
    margin-bottom: 150px;
    font-size: 16px;
}

.img-desktop{display: none;}
.img-mob{display: block;}

.prod-box{width:100%;}

}