/* Add custom CSS styles below */ 

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

body *{
font-family: "Cairo", sans-serif !important;
}
body.index .store-header {
    position: static;
}
 /*****---firs-banner--------*/
.my-main-banner-0, .my-main-banner-0> .head_img {
height:100vh;
}
.my-main-banner-0>.head_img> div{
align-items: center;
}

.my-main-banner-0 p{
width:100% ;
max-width:100% ;
opacity: 1;
font-size:20px !important;
margin-top:10px!important; 
color:#fff;
}
.my-main-banner-0  h1{
font-weight: 900;
font-size:50px !important;
margin-top:10%;
color:#fff;
}
 

@media screen and (max-width:768px){
.my-main-banner-0 , .my-main-banner-0 .head_img  {
height: 40vh;
}
.my-main-banner-0 > .head_img > .items-center {
justify-content: center;
align-items: center;
height: 40vh;
}
.my-main-banner-0>.head_img>.items-center>.text-center {
width: 100%;
margin-right: 0px;
max-width: 100%;
}
.my-main-banner-0 > .head_img > .items-center > .text-center{
text-align:center;
 
}
.my-main-banner-0 p{
display:none
}
.my-main-banner-0  h1 {
font-size: 18px !important;
line-height: 18px;
}
}
 /*------my-category---------*/
.my-category{
margin-bottom:25px;
margin-top:20px;
}
.my-category h2{
margin-bottom:15px;
font-size:24px !important;
text-align: center;
}
.my-category ul{
justify-content: center;
gap: 20px;
}
/*--------my-special-product---------*/
.my-special-product{
margin-bottom:30px
}
@media screen and (max-width:768px){
.my-special-product h1 {
text-align: center;
font-size: 20px;
}
}
 .my-special-product button a.text-lg {
color: #4a3465 !important;
}
 /*------------my-fixed-banner--------*/
.my-fixed-banner{
margin-bottom:40px
}
.my-fixed-banner .absolute {
display: none;
}
/*************************/
.details-sec .grid {
height: 100vh !important;
}
/*-------------my-advantage-----------*/
.my-advantage{
margin-top: 50px;
margin-bottom: 50px;
}
@media screen and (max-width:768px){
.my-advantage .conatiner{
    flex-direction: row;
}
}
/*----------my-info---- ---*/
.my-info p{
color:#fff;
}
.my-info .shape{
background-color:#4A3465;
}
/*----------footer --------------------*/
.store-footer__inner {
background: #fff!important;
}
@media screen and (max-width:768px){
.store-footer__inner *{
margin-left: auto;
margin-right: auto;
text-align: center;
}
}
@media screen and (min-width:991px){
.my-question .container > .flex-col  > div:nth-of-type(2){
width:50%;
max-width:50%;
}
}