/*
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/
@media (min-width: 1025px) and (max-width: 1280px) {
    /* CSS */
}

/*
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) {
    a.footer-logo-2 {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    .bm-burger-button {
        display: block;
    }

    section.our-story a.btn,
    section.our-story p,
    section.our-story span.sub-title,
    section.our-story h2,
    section.our-story .h2 {
        text-align: center;
        width: 100%;
        display: block;
    }

    section.our-story a.btn {
        display: block;
    }

    section.container-fluid.our-story img {
        margin-left: 20px;
        display: block;
        margin-top: 30px;
    }

    .blog-wrapper-home div.blog-details h4,
    .blog-wrapper-home div.blog-details .h4 {
        text-align: center;
    }

    .blog-wrapper-home div.blog-details a.btn {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    section.product-detail img.bg-left,
    section.product-detail img.bg-right {
        display: none;
    }

    section.recipe-detail .inner-content .recipe-specs .spec {
        margin-bottom: 24px;
    }

    img.img-fluid.document {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    section.section-header.contact-form form button.btn.btn-cstm-green.self {
        margin: auto !important;
        margin-top: 24px !important;
    }

    section.section-header.contact-form form .form-check.d-flex.justify-content-center {
        padding: 0;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: center;
        align-items: "";
    }

    footer p {
        text-align: center;
    }

    footer .footer-about img {
        margin: auto;
        display: block;
        margin-bottom: 32px;
    }

    footer h5,
    footer .h5 {
        text-align: center;
    }

    footer ul.nav li {
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    footer .socials {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }
}

/*
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    a.footer-logo-2 {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    .blog-wrapper-home .img-wrap img {
        margin-top: -100px;
    }

    .bm-burger-button {
        display: block;
    }

    section.our-story a.btn,
    section.our-story p,
    section.our-story span.sub-title,
    section.our-story h2,
    section.our-story .h2 {
        text-align: center;
        width: 100%;
        display: block;
    }

    section.our-story a.btn {
        display: block;
    }

    section.container-fluid.our-story img {
        margin-left: 20px;
        display: block;
        margin-top: 30px;
    }

    .blog-wrapper-home div.blog-details h4,
    .blog-wrapper-home div.blog-details .h4 {
        text-align: center;
    }

    .blog-wrapper-home div.blog-details a.btn {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    section.product-detail img.bg-left,
    section.product-detail img.bg-right {
        display: none;
    }

    section.recipe-detail .inner-content .recipe-specs .spec {
        margin-bottom: 24px;
    }

    img.img-fluid.document {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    section.section-header.contact-form form button.btn.btn-cstm-green.self {
        margin: auto;
        margin-top: 24px;
    }

    section.section-header.contact-form form .form-check.d-flex.justify-content-center {
        padding: 0;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: center;
        align-items: "";
    }

    footer p {
        text-align: center;
    }

    footer .footer-about img {
        margin: auto;
        display: block;
        margin-bottom: 32px;
    }

    footer h5,
    footer .h5 {
        text-align: center;
    }

    footer ul.nav li {
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    footer .socials {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }
}

/*
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/
@media (min-width: 481px) and (max-width: 767px) {
    a.footer-logo-2 {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    .bm-burger-button {
        display: block;
    }

    section.our-story a.btn,
    section.our-story p,
    section.our-story span.sub-title,
    section.our-story h2,
    section.our-story .h2 {
        text-align: center;
        width: 100%;
        display: block;
    }

    section.our-story a.btn {
        display: block;
    }

    section.container-fluid.our-story img {
        margin-left: 20px;
        display: block;
        margin-top: 30px;
    }

    .blog-wrapper-home div.blog-details h4,
    .blog-wrapper-home div.blog-details .h4 {
        text-align: center;
    }

    .blog-wrapper-home div.blog-details a.btn {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    section.product-detail img.bg-left,
    section.product-detail img.bg-right {
        display: none;
    }

    section.recipe-detail .inner-content .recipe-specs .spec {
        margin-bottom: 24px;
    }

    img.img-fluid.document {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    section.section-header.contact-form form button.btn.btn-cstm-green.self {
        margin: auto;
        margin-top: 24px;
    }

    section.section-header.contact-form form .form-check.d-flex.justify-content-center {
        padding: 0;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: center;
        align-items: "";
    }

    footer p {
        text-align: center;
    }

    footer .footer-about img {
        margin: auto;
        display: block;
        margin-bottom: 32px;
    }

    footer h5,
    footer .h5 {
        text-align: center;
    }

    footer ul.nav li {
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    footer .socials {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }
}

/*
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 320px) and (max-width: 480px) {
    a.footer-logo-2 {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    .bm-burger-button {
        display: block;
    }

    section.our-story a.btn,
    section.our-story p,
    section.our-story span.sub-title,
    section.our-story h2,
    section.our-story .h2 {
        text-align: center;
        width: 100%;
        display: block;
    }

    section.our-story a.btn {
        display: block;
    }

    section.container-fluid.our-story img {
        margin-left: 20px;
        display: block;
        margin-top: 30px;
    }

    .blog-wrapper-home div.blog-details h4,
    .blog-wrapper-home div.blog-details .h4 {
        text-align: center;
    }

    .blog-wrapper-home div.blog-details a.btn {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    section.product-detail img.bg-left,
    section.product-detail img.bg-right {
        display: none;
    }

    section.recipe-detail .inner-content .recipe-specs .spec {
        margin-bottom: 24px;
    }

    img.img-fluid.document {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    section.section-header.contact-form form button.btn.btn-cstm-green.self {
        margin: auto;
        margin-top: 24px;
    }

    section.section-header.contact-form form .form-check.d-flex.justify-content-center {
        padding: 0;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: center;
        align-items: "";
    }

    .product-wrapper-home {
        padding-bottom: 270px !important;
        background-size: initial !important;
        background-position: bottom !important;
    }

    .product-wrapper-home p {
        margin-bottom: 22px !important;
    }

    .corpprate {
        flex-direction: column !important;
    }

    footer p {
        text-align: center;
    }

    footer .footer-about img {
        margin: auto;
        display: block;
        margin-bottom: 32px;
    }

    footer h5,
    footer .h5 {
        text-align: center;
    }

    footer ul.nav li {
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    footer .socials {
        margin: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
    }

    .product-wrapper-home {
        background-position: bottom !important;
        background-size: initial !important;
        padding-bottom: 190px !important;
    }

    .product-wrapper-home p {
        margin-bottom: 12px;
    }

    div#recipes-slide .splide__arrows {
        display: none;
    }
}

@supports (-webkit-touch-callout: none) {

    section.page-header,
    section.product-detail,
    section.our-story {
        background-image: unset !important;
    }


}