/*
Theme Name: Hello Elementor Child 
Theme URI:  https://www.wpserveur.net
Author:     WPServeur
Author URI: https://www.wpserveur.net
Template:   hello-elementor
Version:    1.0
License:    GNU General Public License v2 or later
*/

/* ======================= Custom CSS ======================= */

#masterheader .astm-search-menu a {
    padding: 0;
    line-height: normal;
    background: #E60000 !important;
    color: white !important;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}

#masterheader .astm-search-menu a svg {
    width: 25px;
    height: 25px;
    fill: white !important;
    color: white !important;
}

#masterheader {
    right: 0;
}

#masterheader .elementor-element-a5273ba {
    justify-content: center;
    align-items: center;
}

#masterheader .elementor-element-85df500 li {
    list-style: none;
}

#masterheader #menu-1-e0dfd48 a:hover {
    transform: unset !important;
}

.elementor-element-c32fdfe .search-close::before, .elementor-element-c32fdfe .search-close::after {
    border-color: #000;
}

.snacks_container_wrap {
    display: block !important;
}

.vr-card h3 {
    margin: 0 0 12px;
    text-align: center !important;
    padding: 0;
}

.vr-card a {
    text-align: center;
    display: block;
    color: #e60000;
    text-decoration: none;
}

.elementor-element.elementor-element-36c4b50 {
    box-shadow: none !important;
}

.recipe-thumb img {
    height: 270px !important;
}

.recipe-play-overlay img {
    width: 80% !important;
    height: 80% !important;
}

.search-results #content, .error404 #content {
    padding-top: 180px;
    padding-bottom: 40px;
}

/* ======================= Custom CSS ======================= */


/* ============================= Responsice CSS ============================= */

@media (min-width: 1200px) {
.vr-grid {
    flex-wrap: nowrap !important;
}
#videorecipe_wrap .vr-card .wp-post-image {
    height: 200px !important;
}
.vr-play-overlay {
    top: 32% !important;
    width: 50px !important;
}
}


@media screen and (min-width: 1px) and (max-width: 767px) {
/* Home Page */
#videorecipe_wrap .vr-card .wp-post-image { height: 200px !important; }
#videorecipe_wrap .vr-play-overlay { top: 32%; width: 50px; }
/* Recipes Page */
.page-heading { padding: 90px 20px 60px !important; font-size: 45px !important; margin-bottom: 35px !important; }
button.rs-tab { padding: 5px 8px !important; font-size: 17px !important; }
.recipe-list { gap: 22px !important; padding: 0 15px 25px !important; }
.tabs-slider { gap: 8px !important; padding: 2px !important; }
.page-id-300 .elementor-swiper-button-prev, .page-id-300 .elementor-swiper-button-next { top: -60px !important; }
}


@media screen and (min-width: 768px) and (max-width: 1024px) {
/* Home Page */
#herowelcome { padding: 110px 0px 70px !important; }
#videorecipe_wrap .vr-card .wp-post-image { height: 200px !important; object-fit: cover; }
#videorecipe_wrap .vr-play-overlay { width: 55px; top: 36%; }
/* Recipes Page */
.page-heading { padding: 140px 60px 80px !important; font-size: 60px !important; }
.recipe-title { padding: 12px 15px 5px !important; }
.recipe-thumb img { height: 220px !important; }
.recipe-list { padding: 0 30px 35px !important; }
.recipe-play-overlay img { height: 80% !important; }
}


@media screen and (min-width: 1025px) and (max-width: 1200px) {
/* Header CSS */
#masterheader .astm-search-menu a { width: 40px; height: 40px; }
#masterheader .menu-item .elementor-item { padding-left: 15px; padding-right: 15px; font-size: 17px; }
/* Home Page */
.elementor-element.elementor-element-80dc1ac { display: none; }
#videorecipe_wrap .wp-post-image { height: 200px !important; } 
#videorecipe_wrap .vr-play-overlay { width: 55px; top: 34%; }
/* Recipes Page */
.page-heading { padding: 180px 60px 95px !important; font-size: 70px !important; }
.recipe-thumb img { height: 235px !important; }
.recipe-play-overlay img { height: 80% !important; }
/* About Page */
.about-banner-repon { padding: 0 !important; }
.about-banner-repon .e-con-inner {padding-top: 160px !important;padding-bottom: 100px !important;} 
.about-banner-repon .e-con-inner .elementor-heading-title { font-size: 65px !important; }
}


@media screen and (min-width: 1200px) and (max-width: 1440px) {
#masterheader .astm-search-menu a { width: 45px; height: 45px; }
#masterheader .menu-item .elementor-item { padding-left: 18px; padding-right: 18px; font-size: 20px; }
/* Home Page */
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-80dc1ac { left: 50px !important; top: 170px; }
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-8151342 { right: 50px !important; bottom: 130px; }
#herowelcome .e-con-inner { padding-left: 50px; padding-right: 50px; }
.owl-carousel .owl-item img { height: 200px; }
.rs-smoothies-grid { grid-template-columns: repeat(auto-fill, minmax(204px, 1fr)) !important; gap: 20px !important; }
.rs-grid { grid-template-columns: repeat(auto-fill, minmax(204px, 1fr)) !important; }
/* Footer */
.elementor-element.elementor-element-43f767b { padding-left: 40px; padding-right: 40px; }
/* About Page */
.about-banner-repon { padding: 0 !important; }
.about-banner-repon .e-con-inner {padding-top: 220px !important;padding-bottom: 130px !important;} 
.about-banner-repon .e-con-inner .elementor-heading-title { font-size: 80px !important; }
}


@media screen and (min-width: 1424px) and (max-width: 1440px) {
.rs-smoothies-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important; }
.rs-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; }
}


@media screen and (min-width: 1200px) and (max-width: 1600px) {
#masterheader { padding-left: 50px; padding-right: 50px; }
.containerplpr { padding-left: 50px !important; padding-right: 50px !important; }
}


@media screen and (min-width: 1440px) and (max-width: 1600px) {
/* Home Page */
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-80dc1ac { left: 20px !important; top: 150px; }
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-8151342 { right: 30px !important; bottom: 120px; }
.owl-carousel .owl-item img { height: 200px; }
.rs-smoothies-grid { grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)) !important; }
/* Footer */
.elementor-element.elementor-element-43f767b { padding-left: 50px; padding-right: 50px; }
}

@media screen and (min-width: 1601px) and (max-width: 1750px) {
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-80dc1ac { left: 30px !important; top: 180px; }
body:not(.rtl) .elementor-72 .elementor-element.elementor-element-8151342 { right: 90px !important; bottom: 150px; }
}


/* ============================= Responsice CSS ============================= */
