/* Add custom CSS styles below */ 
body#app {
    background-color:#F5F2EE;
}
/*transparent to img*/
.s-block--fixed-banner .banner--fixed img ,
.s-block--banners  .grid .banner-entry {
    background-color:transparent !important;
}


/*photos slider full width */
section.s-block--photos-slider .swiper{
    padding:0;
}
section.s-block--photos-slider .swiper .swiper-slide{
    padding:0;
    width:100%;
}
section.s-block.s-block--photos-slider {
    margin-top:0;
}
section.s-block--photos-slider  button.s-slider-nav-arrow.swiper-button-disabled {
    visibility:hidden;
}

/*element list */
.s-block--banners > .grid a.banner-entry {
        grid-row: span 1 / span 2 ;
}
@media(min-width:768px){
   .s-block--banners > .grid {
        grid-template-columns:repeat(3, minmax(0, 1fr));
        max-width: 900px;
        margin: auto;
    } 
}
@media(max-width:768px){
    .s-block--banners > .grid {
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }
    .s-block--banners > .grid a.banner-entry {
        height:100px;
    }
}
.store-footer__inner {
    background-color: #321919 !important;
    color:white !important;
}
.md\:flex.items-center.justify-between.py-4.container.text-center {
    background-color: #321919 !important;
    margin: 0;
    max-width: 100% !important;
}
.md\:flex.items-center.justify-between.py-4.container.text-center p{
    color:white;
}

/* Navbar */
.store-header,
.main-nav-container,
header,
.header-is-sticky .store-header {
    background-color: #321918 !important; /* برجندي */
}

/* إذا كان الهيدر ثابت */
.store-header.is-sticky {
    background-color: #321918 !important;
}

/* لون روابط القائمة */
.main-nav a,
.store-header a {
    color: #BFA98E !important;
}

/* عند المرور بالماوس */
.main-nav a:hover,
.store-header a:hover {
    color: #F5D7DD !important;
}


.store-header .icon,
.store-header svg,
.store-header i,
.store-header button svg,
.store-header a svg {
    color: #BFA98E !important;
    fill: #BFA98E !important;
    stroke: #BFA98E !important;
}


/* تغيير خط القائمة */
.store-header,
.store-header a,
.main-nav,
.main-nav a {
    font-family: "Cairo", sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

.store-header {
    min-height: 100px !important;
}

.store-logo img {
    max-height: 100px !important;
}