/* Add custom CSS styles below */ 
@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400..700&display=swap');

body  * {
font-family: "El Messiri", sans-serif;
}
:root {
--main-text-color: #B01F23;
}
/*-header------------*/
 .main-nav-container .mobile-menu ul li a {
color: #fff;
}

i.header-btn__icon {
color: #fff !important;
}

.sub-menu * {
color: #000 !important;
}
@media screen and (max-width:768px){
body.index .store-header {
position: static;
}
}
/*---------------header-when-scroll----------*/
.main-nav-container.fixed-header .inner .mobile-menu ul li a,
.main-nav-container.fixed-header .inner i.header-btn__icon {
color: #fff!important;
}
/*****---firs-banner--------*/
.my-main-banner-0, .my-main-banner-0> .head_img {
height:100vh;
}
.my-main-banner-0  h1 {
font-weight: 700;
color: transparent;
-webkit-text-stroke: 4px transparent;
background: linear-gradient(to bottom, #fff, #fff, #fff);
-webkit-background-clip: text;
-webkit-text-fill-color: #000;
font-size: 69px !important;
}
.my-main-banner-0 > .head_img > div > div {
max-width:35%;
margin-right:12%;
}
@media screen and (max-width:768px){
.my-main-banner-0 , .my-main-banner-0 .head_img  {
height: 35vh;
}
.my-main-banner-0 > .head_img > div {
align-items: center;
height: 35vh;
padding-bottom: 0px;
}
.my-main-banner-0 > .head_img > div > div {
max-width: 50%;
}
.my-main-banner-0 p{
display:none
}
.my-main-banner-0  h1 {
font-size: 18px !important;
line-height: 25px;
}
}
 /*------my-category---------*/
.my-category{
margin-bottom:25px;
margin-top:20px;
}
.my-category a.text-lg.font-bold {
color: #fff !important;
}
.my-category img {
filter: none !important;
}
/***********/
.s-products-slider-card.swiper-slide , .s-product-card-content {
background: #3A3C3E !important;
}
.s-product-card-content *{
color:#fff !important;
}
.s-product-card-entry .s-product-card-content-footer .s-product-card-wishlist-btn {
background: none !important;
}
/*--------my-special-product---------*/
.my-special-product{
margin-bottom:30px
}
.my-special-product h1{
color:#fff;
}
@media screen and (max-width:768px){
.my-special-product h1 {
text-align: center;
font-size: 20px;
}
}
/*------------my-fixed-banner---- ----*/
.my-fixed-banner {
margin-bottom: 40px
}
.my-fixed-banner button {
color: #fff;
border-color: #fff;
}
.my-fixed-banner .absolute {
width: 100% !important;
left: 0px;
}
.my-fixed-banner button a {
color: #fff ;

}
.my-fixed-banner h1 {
color: #fff !important;
font-size: 21px !important;
line-height: 30px;
}
@media screen and (max-width:768px) {
.my-fixed-banner h1 {
font-size: 14px !important;
}
}
/*----------my-info-------*/
.my-info p {
color: #fff;
}
.my-info .shape {
background:#B01F23
}

/****** my-advantage*****/
@media screen and (max-width:768px) {
.my-advantage .conatiner  {
flex-direction: row;
}
.my-advantage {
margin-bottom: 5px;
}
}
section.my-advantage *  {
color: #fff;
}
.first-of-type\:border-b-\[var\(--m-color\)\]:first-of-type {
border-bottom-color: #ffe;
}
section.my-advantage .bg-\[var\(--m-color\)\] {
background-color: var(--m-color);
background: #fff;
}
/*--------my-banner-photo-----------*/
.my-banner-photo>div {
justify-content: space-around;
}

.my-banner-photo>div>div {
justify-content: center;
}
.my-banner-photo button a  {
color: #fff!important;
 
}
.my-banner-photo button {
border-color: #fff !important;
}
@media screen and (max-width:768px) {
.my-banner-photo h1 {
font-size: 12px !important;
line-height: 23px;
padding: 5px;
}
}
.opinions p {
color: #fff;
}
/*********footer******/
@media screen and (max-width:768px){
.store-footer__inner *{
margin-left: auto;
margin-right: auto;
text-align: center;
}
}
.product-index h1#page-main-title ,.description p , .main-content  h1{
color: #fff !important;
}
.s-product-card-vertical .s-product-card-price {
    font-size: 18px;
    color: #ffffff !important;
    font-weight: 600;
}
.text-\[var\(--m-color\)\] {
    color: #ffffff;
}