/* variables  */

:root{
    --clr-red : #FF2525;
    --clr-white: #FFFFFF;
    --clr-lgray: #CCCFD7;
    --clr-mgray: #9597A1;
    --clr-rgray: #FFF8F8;
    --border-r: 0.75rem;
    --font-l : 300;
    --font-r : 400;
    --font-m : 500;
    --font-sb : 600;
    --font-b : 700;
}


/* Reset the value  */

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none;
}

body{
    margin-inline: auto;
    width: 100%;
    max-width: 90rem;
    position: relative;
    background-color: var(--clr-white);
}

a{
    text-decoration: none;
}


/* ----utility classes start---- */

.menu{
    position: absolute;
    background: rgba(0, 0, 0, 0.759);
    top: 0%;
    right: 0%;
    width: 100%;
    min-height: 100vh;
    height: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    display: none;
    overflow-y: scroll;
}

.menu::-webkit-scrollbar,
    .menu::-webkit-scrollbar-thumb,
    .menu::-webkit-scrollbar-track { 
        height: 5px;
        border: none;
        background: transparent;
    }

.topBtn{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menuLogo{
    width: 55px;
}

.menuClose{
    width: 28px;
    cursor: pointer;
}

.menuClose:hover>circle{
    fill: var(--clr-white);
}

.menuClose:hover>path{
    fill: var(--clr-red);
}

.bottomBtn{
    display: grid;
    margin-inline: auto;
    width: 275px;
    margin-top: 72px;
    justify-content: center
}

.menu_copyright{
    text-align: center;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.601);
    margin-top: 15px;
    grid-row: 3/4;
}


.menu_term{
    text-align: center;
    margin-top: 30px;
    grid-row: 2/3;
    display: flex;
}

.menu_term > p{
    font-size: 14px;
    color: rgba(255, 255, 255, 0.601);
    margin-inline: 14px;
}

.menu_term > a{
    font-size: 14px;
    color: rgba(255, 255, 255, 0.601);
}

.menu_term>a:hover{
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .menu{
        padding-top: 40px;
        padding-bottom: 0px;
        background: rgba(0, 0, 0, 0.858);
        width: 40%;
    }

    .menuClose{
        width: 65px;
    }

    .topBtn{
        padding-left: 16px;
    }

    .menu_d{
        display: flex;
        flex-direction: column;
        height: 100%;
        position: relative;
        padding-bottom: 50px;

    }

    .bottomBtn{
        width: 100%;
        margin-top: auto;
    }

}

.menuSocialLink{
    fill: var(--clr-white);
    opacity: 0.6;
    width: 28px;
}

.menuSocialLink + .menuSocialLink{
    margin-left: 19px;
}

.menu_socialLinks{
    margin-inline: auto;
    margin-top: auto;
    display: flex;
    gap: 20px;
    align-items: center;
}

.menu_socialLinks>a{
    display: block;
    width: 28px;
}

.menuSocialLink:hover{
    opacity: 1;
}

.nav{
    margin-top: 25px;
    display: flex;
    flex-direction: column;
}

@media (min-width:76.25em) {

    .nav{
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        max-width: 823px;
        margin-inline: auto;
        padding-inline: 16px;
    }
}



.navlink{
    margin-top: 25px;
    font-size: 24px;
    font-weight: var(--font-sb);
    color: rgba(255, 255, 255, 0.601);
    text-transform: capitalize;
}

#dropDown{
    display: flex;
    align-items: center;
    margin-top: 25px;
    cursor: pointer;
    border: none;
}
#dropDown>p{
    font-size: 24px;
    font-weight: var(--font-sb);
    color: rgba(255, 255, 255, 0.601);
    text-transform: capitalize;
    margin-right: 14px;
}

.navlink:hover, #dropDown>p:hover, .cityLink:hover{
    color: var(--clr-white);
}

#cites>div{
    display: flex;
    flex-direction: column;
    display: none;
}

.cityLink{
    color: #6D6D6D;
    margin-top: 15px;
}

/* container  */

.container{
    padding-inline: 1rem;
}


@media (min-width:76.25em) {
    .container{
        padding-inline: 0 ;
        max-width: 1215px;
        margin-inline: auto;
    }
}


/* section styles */

.section{
    margin-top: 50px;
}

.redSection{
    padding-top: 34px;
    padding-bottom: 40px ;
    background-color: var(--clr-rgray);
}

.mb{
    margin-bottom: 50px;
}

@media (min-width:76.25em) {
    .section{
        margin-top: 75px;
    }

    .redSection{
        padding-top: 75px;
        padding-bottom: 75px ;
    }

    .mb{
        margin-bottom: 75px;
    }
}

.sectionTitle{
    font-size: 1.25rem;
    font-weight: var(--font-b);
    text-align: center;
    margin-bottom: 30px;
    text-transform: uppercase;
}

.sectionTitle>span{
    color: var(--clr-red);
}

.sectionTitleSub{
    display: none;
    text-align: center;
    color: rgba(0, 0, 0, 0.607);
    font-size: 20px;
    max-width: 810px;
    margin-inline: auto;
}

@media (min-width:76.25em) {
    .sectionTitle{
        font-size: 3rem;
        margin-bottom: 25px;
    }

    .sectionTitleSub{
        display: block;
        margin-bottom: 60px;
    }
}

.sectionBtn{
    width: 183px;
    height: 56px;
    color: var(--clr-red);
    font-weight: var(--font-sb);
    border: 1px solid var(--clr-red);
    border-radius: var(--border-r);
    display: block;
    margin-inline: auto;
    letter-spacing: 2%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}

.sectionBtn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .sectionBtn{
        width: 227px;
        height: 74px;
        margin-top: 60px;
    }
}


/* utility classes end */

a.back-to-top {
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: 9;
    right: 30px;
    bottom: 30px;
    background: var(--clr-white);
    border-radius: 50%;
    text-align: center;
    height: 45px;
    width: 45px;
    box-shadow: 0 5px 33px rgb(0 0 0 / 20%);
    transition: .3s ease;
}

a.back-to-top:hover{
    background-color: var(--clr-red);
}

.back-to-top:hover >svg{
    fill: var(--clr-white);
}

.back-to-top>svg{
    display: block;
    margin-inline: auto;
    fill: var(--clr-red);
}


/* header styler  */


.navBar{
    position: fixed;
    top: -0px;
    width: 100%;
    z-index: 99;
    max-width: 1440px;

}

@media (min-width:76.25em) {
    .navBar{
        top: 0px;
    }
    
}

.header-style{
    width: 100%;
    margin-inline: auto;
    padding-top: 3.125rem;
    padding-bottom: 1rem;
    display: flex;
    justify-content: space-between;
}

.logo{
    height: 3rem ;
}

.btns{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    margin-left: auto;
}

.priBtn{
    font-size: 0.875rem;
    color: var(--clr-white);
    background-color: var(--clr-red);
    border-radius: var(--border-r);
    font-weight: var(--font-m);
    height: 2.5rem;
    width: 6.8125rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.priBtn:hover{
    background-color: var(--clr-white);
    border: 2px solid var(--clr-red);
    color: var(--clr-red);
}

.hamburger{
    height: 1.5rem;
    margin-left: 15px;
    width: 25.45px;
    cursor: pointer;
}

#close{
    display: none;
    width: 76px;
    height: 76px;
}

@media (min-width:76.25em) {
    .priBtn{
        font-size: 1.125rem;
        height: 4.125rem;
        width: 183px;
    }

    .hamburger{
        height: 2.2rem;
        width: 44.55px;
        margin-left: 30px;
    }

    .logo{
        height: 5.4rem;

    }
}

.navigation{
    width: 100%;
    height: 100vh;
    background-color: #000;
    position: absolute;
    top: 0%;
    left: 0%;
    display: grid;
    grid-template-columns: auto auto;
    padding: 50px;
}

.logoNav{
    grid-column-start: 1;
    grid-column-end: 2;
    margin-right: auto;
    top: 50;
    width: 76px;
    height: 76px;
}

.close{
    margin-left: auto;
    margin-right: 75px;
    cursor: pointer;
}

.close:hover>circle{
    fill: var(--clr-mgray); 
}

.close:hover>path{
    fill: var(--clr-red);
}

nav{
    display: flex;
    flex-direction: column;
    grid-column-start: 1;
    grid-column-end: 3;
}

nav>a{
    color: var(--clr-white);
    opacity: 60%;
    font-weight: var(--font-sb);
}

nav>a:hover{
    opacity: 100%;
}

.cityDropDown{
    color: var(--clr-white);
}

#dropDown{
    appearance: none;
    background-color: transparent;
    color: var(--clr-white);
}


/* hero section  */

.herosection{
    position: relative;
    z-index: 1;
}

.slider{
    height: 521px;
}

.sliderContainer{
    display: flex;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none; 
    position: relative;
    height: 100%;
}

.sliderContainer::-webkit-scrollbar {
    display: none;
  }

.sliderContainer::before{
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.484),rgb(0, 0, 0));
}

.slide{
    width: 100vw;
    max-width: 1440px;
    display: none;
    object-fit: cover;
}

.show{
    display: block;
}

.mySlides {
    display:none;
}

.arrow-left{
    background: transparent;
    cursor: pointer;
    transform: rotate(180deg);
    position: absolute;
    top: 50%;
    left: 3rem;
    display: none;
    border: none;
    z-index: 9;
}

.arrow-right{
    background: transparent;
    cursor: pointer;
    position: absolute;
    top: 50%;
    right:  3rem;
    display: none;
    border: none;
    z-index: 9;
}

.sliderPoints{
    position: absolute;
    top: 90%;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
    cursor: pointer;
}

.slidePoint{
    width: 0.625rem ;
    height: 0.625rem;
    background-color: var(--clr-white);
    z-index: 10;
    border: 2px solid var(--clr-white);
    border-radius: 100%;
}

.active{
    background-color: var(--clr-red);
}

.heroSreachArea{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 100%;
}

.sreachAreaTitle{
    font-weight: var(--font-sb);
    color: var(--clr-white);
    font-size: 1.75em ;
    text-align: center;
}

.sreachOption{
    background-color: var(--clr-white);
    padding: 1.5625rem 1.25rem;
    border-radius: var(--border-r) ;
    display: flex;
    flex-direction: column;
    width: 343px;
    height: 242px;
    margin-inline: auto;
    margin-top: 20px;
    position: relative;
}

.sreachBar-wrapper{
    background-color: var(--clr-white);
    width: 100%;
    max-width: 456px;
    height: 56px;
    position: relative;
    border: 1px solid var(--clr-lgray);
    border-radius: var(--border-r);
    margin-inline: auto;  
    display: flex;
    align-items: center;
}

.sreachBar-wrapper>img{
    width: 14px;
    height: 14px;
    margin-left: 14px;
    pointer-events: none;
    position: absolute;
}

.sreachBar{
    background-color: transparent;
    padding-top: 21px;
    padding-bottom: 21px;
    padding-left: 36px;
    width: 100%;
    border-radius: var(--border-r);
    font-size: 12px;
    height: 56px;
    border: none;
}

.sreachBar:focus-visible, .cityOption:focus-visible{
    outline: 2px solid var(--clr-red);
}


.sreachBar::placeholder{
    color: var(--clr-mgray);
    font-size: 0.75rem;
    font-weight: var(--font-m);
    text-transform: capitalize;
}


.cityOption-wrapper{
    position: relative;
    width: 100%;
    border: 1px solid var(--clr-lgray);
    border-radius: var(--border-r);
    height: 56px;
    display: flex;
    align-items: center;
    margin-top: 0.625rem;
    margin-inline: auto;
}

.cityOption-wrapper>img{
    position: absolute;
    pointer-events: none;

}

.locationIcon{
    left: 14px;
    width: 12px;
    height: 15px;
}

.arrowIcon{
    right: 18px;
    width: 16px;
    height: 8px;
}

.cityOption{
    border: none;
    border-radius: var(--border-r);
    appearance: none;
    text-transform: capitalize;
    font-size: 15px;
    font-weight: var(--font-m);
    padding-left: 36px;
    height: 56px;
    width: 100%;
    background-color: transparent;
    cursor: pointer;
    color: var(--clr-mgray);
    letter-spacing: 2%;
    line-height: 99.5%;
}

.custom-options{
    display: none;
    position: absolute;
    flex-direction: column;
    background-color: var(--clr-white);
    width: 100%;
    left: 0px;
    padding-left: 36px;
    padding: 10px 0px;
    border-radius: var(--border-r);
    text-transform: capitalize;
}

.custom-option{
    padding: 10px 36px;
    cursor: pointer;

}

.custom-option:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);

}

.select__trigger{
    height: 100%;
    display: flex;
    align-items: center;
}

.showOption{
    display: flex;
}

.sreachBtn {
    background-color: var(--clr-red);
    color: var(--clr-white);
    padding: 1rem 3rem;
    border-radius: var(--border-r);
    width: fit-content;
    margin-inline: auto;
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-top: 0.9375rem;
    border: none;

}
.sreachBtn > span {
    font-weight: var(--font-sb);
    margin-left: 9px;
}

@media (min-width:76.25em) {

    .sliderContainer>img{
        width: 100%;
    }

    .arrow-left, .arrow-right{
        display: block;
    }

    .sliderPoints{
        gap: 1rem;
    }

    .slidePoint{
        width: 1rem ;
        height: 1rem;
    }

    .sreachAreaTitle{
        font-size: 70px ;
        }

    .sreachOption{
        flex-direction: row;
        width: 1008px;
        height: 98px;
        padding: 16px 30px;
        margin-top: 45px;
    }

    .sreachBar-wrapper{
        margin-inline: 0;
        height: 66px;
    }

    .sreachBar::placeholder{
        font-size: 1rem;
    }

    .sreachBar{
        font-size: 15px;
        padding-left: 40px;
        height: 65px;
    }

    .cityOption-wrapper, .cityOption, .sreachBtn{
        margin: 0;
    }

    .cityOption-wrapper,.cityOption{
        width: 252px;
        height: 65px;
    }

    .cityOption-wrapper{
        margin-left: 20px;
    }

    .sreachBtn{
        margin-left: auto;
    }
}



.sreachResult{
    width: 100%;
    position: absolute; 
    top: 90px;
    left: 0%;
    background-color: var(--clr-white);
    border-radius: var(--border-r);
    padding: 25px 0px 38px;
    z-index: 999;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.081);
    display: none;
}

@media (min-width:76.25em) {
    .sreachResult{
        top: 110px;
        padding: 30px 0px 50px;
    }
}

.sreachResult_top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-inline: 12px;
}

.sreachResult_top >p {
    font-size: 12px;
    color: #5E5E5E;

}


.sreachResult_next-btns > button{
    background-color: transparent;
    border: none;
    cursor: pointer;
}

.sreachResult_next-btns > button > svg{
    width: 19px;
    opacity: 0.6;
}

@media (min-width:76.25em) {
    .sreachResult_top{
        padding-inline: 30px;
    }

    .sreachResult_top >p {
        font-size: 14px;
    }

    .sreachResult_next-btns > button > svg{
        width: 22px;
    }

    .sreachResult_next-btns > button+button{
        margin-left: 20px;
    }
}

.sreachResult_next-btns > button:hover > svg{
    opacity: 1;
}

.sreachResult_content{
    padding-top: 14px;
}

@media (min-width:76.25em) {
    .sreachResult_content{
        padding-top: 25px;
    }
}

.sreachResult_card{
    display: flex;
    gap: 10px;
    cursor: pointer;
    align-items: center;  
    width: 100%;
    padding: 4px 12px;

}

@media (min-width:76.25em) {
    .sreachResult_card{
        padding: 10px 30px;
        gap: 24px;
    }

}

.sreachResult_card:hover{
    background-color: var(--clr-lgray);
}


.sreachResult_card>img{
    width: 85px;
    height: 66px;
    border-radius: 5px;
    display: block;
    object-fit: cover;
}

@media (min-width:76.25em) {
    .sreachResult_card>img{
        width: 236px;
        height: 131px;
        border-radius: var(--border-r);
    }
}

.sreachResult_title >h4{
    font-size: 14px;
    font-weight: var(--font-sb);
    color: #000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 22ch;
}

@media (min-width:76.25em) {
    .sreachResult_title >h4{
        font-size: 24px;
    }
}

.sreachResult_title >p{
    font-size: 10px;
    font-weight: var(--font-m);
    letter-spacing: 2%;
    line-height: 118%;
    color: #828282;
    margin-top: 4px;
    height: 4ch;
    overflow: hidden;
}

@media (min-width:76.25em) {
    .sreachResult_title >p{
        font-size: 13px;
        margin-top: 13px;
    }
}

.sreachReasult_card-text{
    width: 100%;
}

.sreachResult_decrption{
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.sreachResult_decrption > button{
    width: 18px;
    height: 18px;
    background-color: #EEEEEE;
    border: none;
    border-radius: 50%;
    padding: 4px;
    cursor: pointer;
    flex-shrink: 0;
}

@media (min-width:76.25em) {
    .sreachResult_decrption > button{
        width: 36px;
        height: 36px;
        padding: 9px;
    }
}

.sreachResult_decrption > button:hover{
    background-color: var(--clr-mgray);
}

.sreachResult_decrption > button > svg{
    font-size: 0;
    display: block;
    fill: var(--clr-white);
}

.redSelect> svg{
    fill: var(--clr-red) !important; 
}

.sreachResult_info{
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

@media (min-width:76.25em) {
    .sreachResult_info{
        gap: 21px;
        margin-top: 20px;
    }
}

.sreachResult_time{
    display: flex;
    gap: 2px;
    align-items: center;
    height: 11px;

}

.sreachResult_time>p{
    color: #0DA537; 
    font-size: 10px;
    font-weight: var(--font-m);
    text-transform: uppercase;
    line-height: 99.5%;
}

.clock{
    font-size: 0;
}

.clock>svg{
    fill: #0DA537;
    width: 11px;
    height: 11px;
}

@media (min-width:76.25em) {
    .sreachResult_time{
        gap: 5px;
        height: 16px;
    }

    .sreachResult_time>p{
        font-size: 14px;
    }

    .clock{
        height: 16px;
    }

    .clock>svg{
        width: 16px;
        height: 16px;
    }
}

.sreachResult_contact{
    display: flex;
    align-items: center;
    gap: 3px;
}

.sreachResult_contact>p{
    font-size: 10px;
    font-weight: var(--font-m);
    line-height: 99.5%;
    color: #000;
}

.phone{
    font-size: 0;
    width: 10px;
}

.sreachResult_btn{
    font-size: 16px;
    font-weight: var(--font-m);
    text-transform: lowercase;
    display: block;
    padding: 22px 77px;
    color: var(--clr-red);
    border: 1px solid var(--clr-red);
    border-radius: var(--border-r);
    width: fit-content;
    margin-inline: auto;
    margin-top: 40px;
}

.sreachResult_btn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .sreachResult_contact{
        gap: 7px;
    }

    .sreachResult_contact>p{
        font-size: 14px;
    }

    .phone{
        width: 15px;
    }

    .sreachResult_btn{
        padding: 22px 81px;
    }
}



/* Banner  */

.Banner {
    width: 100%;
    background: url('./asset/image/BannerImage.png') no-repeat;
    background-size: cover;
    /* height: 7.5rem; */
    padding: 0.8125rem;
    border-radius: var(--border-r);
    margin-top: 30px;

}


.Banner > div{
    background-color: rgba(255, 255, 255, 0.72);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--border-r);
    padding: 34px 21px;
}


h1{
    font-weight: var(--font-sb);
    color: black;
    font-size: 1.3125rem;
    text-transform: uppercase;
    text-align: center;
}
h1>span{
    color: var(--clr-red);
}

@media (min-width:76.25em) {
    .Banner{
        margin-top: 40px;
        background: url('./asset/image/BannerImageD.png') ;
        padding: 15px;
    }

    .Banner>div{
        background: url('./asset/image/BannerAvataar.png') bottom right no-repeat;
        background-size: 7rem;
        background-color:rgba(255, 255, 255, 0.72) ;
    }

    h1{
        font-size: 2rem;
    }
}


/* Best Market Section  */

.cityCard-Wrapper{
    margin-inline: auto;
}


.cityCard{
    width: 343px;
    height: 345px;
    border-radius: var(--border-r);
    overflow: hidden;
    position: relative;
    display: block;
    flex-shrink: 0;
    margin-inline:auto ;
    transition: all ease-in-out 0.2s;
    border-radius: var(--border-r);
}

.cityCard>img{
    border-radius: var(--border-r);
    width: 100%;
    height: 100%;

}

.cityCard:hover{
    box-shadow: 0px 0px 12px grey;
}

.cityCard-text{
    background-image: linear-gradient(to top, rgb(0, 0, 0),rgba(0, 0, 0, 0.424), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 21px;
    
}

.cityCard+.cityCard{
    margin-top: 20px;
    margin-bottom: 20px;
}

.cityCard-text>h3{
    font-size: 1.5rem;
    color: var(--clr-white);
    font-weight: var(--font-sb);
    transition: all ease-in-out 0.2s;
}

.cityCard:hover>.cityCard-text>h3{
    color: var(--clr-red);
}

.cityCard-text>p{
    font-size: 14px;
    color: var(--clr-white);
    letter-spacing: 2%;
}

@media (min-width:76.25em) {
    .cityCard-Wrapper{
        padding-top: 20px;
        display: flex;
        overflow: scroll;
        padding-bottom: 41px;
        overflow-y: hidden;
    }

    .cityCard-Wrapper::-webkit-scrollbar,
    .cityCard-Wrapper::-webkit-scrollbar-thumb,
    .cityCard-Wrapper::-webkit-scrollbar-track { 
        height: 5px;
        border: none;
        background: transparent;
    }

    .cityCard-Wrapper::-webkit-scrollbar-button,
    .cityCard-Wrapper::-webkit-scrollbar-track-piece,
    .cityCard-Wrapper::-webkit-scrollbar-corner,
    .cityCard-Wrapper::-webkit-resizer {
        display: none;
    }

    .cityCard-Wrapper::-webkit-scrollbar-thumb {
        border-radius: 0px;
        background-color: black;
    }

    .cityCard-Wrapper::-webkit-scrollbar-track {
        background-image: url("./asset/scrollbar.png");
        background-repeat: repeat-x;
        background-size: contain;
    }

    .cityCard{
        width: 384px;
        height: 411px;
        margin-inline:0 ;
    }

    .cityCard+.cityCard{
        margin: 0 ;
        margin-left: 2rem;
    }
}


/* Products section  */

.productCard-Wrapper{
    margin-bottom: 50px;
}

.productCard{
    display: block;
    margin-inline: auto ;
    width: 280px;
    height: 309px;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
    box-shadow: 10px 6px 30px rgba(0, 0, 0, 0.085);
}

.productCard>img{
    width: 280px;
    height: 309px;
    border-radius: 15px;
}

.productCard+.productCard{
    margin-top: 20px;
}

.productCard-text{
    position: absolute;
    top: 0;
    left: 0%;
    background-image: linear-gradient(to top, rgb(255, 255, 255), rgba(255, 255, 255, 0));
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    border-radius: var(--border-r);
}

.productCard-text > h3{
    font-size: 25px;
    font-weight: var(--font-sb);
    color: black;
}

.productCard-text > a {
    width: 46px;
    margin-bottom: 15px;
    margin-top: 12px;
    transition: all;
    transition-duration: 200ms;
}

.productCard-text > a:hover {
    transform: scale(1.5);
}

@media (min-width:76.25em) {
    .productCard-Wrapper{
        display: flex;
        gap: 2rem;
        margin-bottom: 100px;
    }

    .productCard{
        margin-inline: 0 ;
    }

    .productCard+.productCard{
        margin-top: 0;
    }  
}


/* best shop for clothing section  */

@media (min-width:76.25em) {
    .shopCard-wrapper{
        gap: 32px;
        display: grid;
        grid-template-columns: auto auto;
    }
}

.shopCard{
    width: 343px;
    height: 444px;
    border-radius: var(--border-r);
    margin-inline: auto;
    position: relative;
}

.shopCard>img{
   width: 343px;
   height: 351px;
   border-radius: var(--border-r);
}

.shopCard+.shopCard{
    margin-top: 20px;
}

@media (min-width:76.25em) {
    .shopCard{
        width: 592px;
        height: 500px;
    }

    .shopCard>img{
        width: 592px;
        height: 398px;
        border-radius: var(--border-r);
     }
     

    .shopCard+.shopCard{
        margin-top: 0px;
    }
}

.shopCard-detail{
    width: 316px;
    height: 187px;
    background-color: var(--clr-white);
    margin-top: -93px;
    margin-left: 13px;
    border-radius: 5px;
    text-align: center;
    position: relative;
    z-index: 9;
    padding-top: 31px;
    padding-bottom: 30px;
}

.shopCard-detail > h3{
    font-size: 18px;
    font-weight: var(--font-sb);
    color: black;
}

.shopCard-detail > div {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
}

.shopCard-detail >div >img{
    width: 12px;
    margin-right: 7px;
}

.shopCard-detail >div >p{
    font-size: 13px;
    color: rgba(0, 0, 0, 0.604);
}

@media (min-width:76.25em) {
    .shopCard-detail{
        width: 384px;
        height: 200px;
        margin-top: -113px;
        margin-left: 104px;
        padding-top: 35px;
        padding-bottom: 34px;
    }

    .shopCard-detail > h3{
        font-size: 22px;
    }

    .shopCard-detail >div >img{
        width: 12px;
        margin-right: 7px;
    }
    
    .shopCard-detail >div >p{
        font-size: 15px;
    }
    
}

.shopCard-detail > a{
    text-transform: capitalize;
    font-size: 15px;
    color: var(--clr-white);
    background-color: black;
    padding: 18px 39px;
    border-radius: 5px;
    margin-top: 27px;
    display: block;
    width: fit-content;
    margin-inline:auto ;
}

.shopCard-detail > a:hover{
    background-color: var(--clr-red);
}

.shopCard-star{
    background-color: #EEEEEE;
    border-radius: 50%;
    position: absolute;
    top: 15px;
    right: 15px;
    width: 36px;
    height: 36px;
    cursor: pointer;
    border: none;
}

.shopCard-star:hover{
    background-color: var(--clr-mgray);
}

.starBtn{
    position: absolute;
    fill: var(--clr-white);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}

@media (min-width:76.25em) {
    .shopCard-star{
        top: 21px;
        right: 26px;
        width: 36px;
        height: 36px;
        cursor: pointer;
    }
}


/* What's New Section  */


.shopBox-wrapper{
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
    gap: 13px;
    margin-inline:auto ;
}

@media (min-width:76.25em) {
    .shopBox-wrapper{
        gap:  32px;
    }
}

.shopBox{
    width: 100%;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
}

.shopBox>img{
    width: 100%;
    height: 100%;
}

.shopBox:first-child{
    grid-row-start:1 ;
    grid-row-end:3 ;
}


.shopBox-text{
    background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    border-radius: var(--border-r);
    padding-bottom: 17px;
    padding-left: 6px;
    padding-right: 2px;
    justify-content: space-between;
}

.shopBox-text> a> img{
    width: 100%;
}

@media (min-width:76.25em) {
    .shopBox-text{
        padding-bottom: 40px;
        padding-left: 35px;
        padding-right: 50px;
    }
}

.shopBox-text>div>h3{
    font-size: 12px;
    color: var(--clr-white);
}
.shopBox-text>div>p{
    font-size: 10px;
    color: var(--clr-white);
}

.shopBox-text>a{
    width: 26px;
}

.shopBox-text>a:hover{
    transform: scale(1.5);
}

@media (min-width:76.25em) {
    .shopBox-text>div>h3{
        font-size: 32px;
    }

    .shopBox-text>div>p{
        font-size: 20px;
    }
    
    .shopBox-text>a{
        width: 56px;
    }
}

/* Handicraft Shops  */


.handShop-wrapper{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

@media (min-width:76.25em) {
    .handShop-wrapper{
        flex-direction: row;
        justify-content: center;
        gap: 10px;
    }
}

.handShopCard{
    width: 296px;
    height: 350px;
    padding: 12px;
    background-color: var(--clr-white);
    border: 1px solid #E0E0E0;
    border-radius: var(--border-r);
    display: block;
    margin-inline: auto;
}

.handShopCard>img{
    width: 272px;
    height: 237px;
    border-radius: var(--border-r);
}

.handShopCard:hover{
    border: 1px solid var(--clr-red);
}

.handShopCard > h3{
    font-size: 18px;
    color: black;
    font-weight: var(--font-m);
    margin-top: 19px;
}

.handShopCard > div{
    display: flex;
    align-items: center;
}

.handShopCard > div> img{
    width: 12px;
    margin-right: 7px;
}

.handShopCard > div> p{
    font-size: 15px;
    color: rgba(0, 0, 0, 0.604);
}


/* News Letter  */

.newsLetter{
    background-color: var(--clr-red);
    margin-top: 50px;
    margin-bottom: 50px;
    padding: 30px 21px;
    border-radius: var(--border-r);
}

@media (min-width:76.25em) {
    .newsLetter{
        margin-top: 100px;
        margin-bottom: 100px;
        padding: 70px 60px;
        display: flex;
        justify-content: space-between;
    } 

}
.newsLetter>form{
    display: flex;
    flex-direction: column;
}

@media (min-width:76.25em) {
    .newsLetter>form{
        flex-direction: row;
        align-items: center;
    }
}


.newsLetter>div>h2{
    font-size: 28px;
    color: var(--clr-white);
    font-weight: var(--font-b);
    text-align: center;
}

.newsLetter>div>p{
    font-size: 14px;
    color: var(--clr-white);
    text-align: center;
    margin-top: 15px;
}

@media (min-width:76.25em) {
    .newsLetter>div>h2{
        font-size: 32px;
        text-align: left;
    }
    
    .newsLetter>div>p{
        font-size: 14px;
        color: var(--clr-white);
        text-align: left;
        margin-top: 12px;
    }
}

.emailInput{
    font-size: 12px;
    padding: 15px 28px;
    background-color: var(--clr-white);
    color: black;
    width: 100%;
    border-radius: var(--border-r);
    margin-top: 25px;
    margin-inline: auto ;
    border: none;

}

.emailInput::placeholder{
    font-size: 12px;
    color: #828282;
}

@media (min-width:76.25em) {
    .emailInput{
        font-size: 14px;
        padding: 30px 26px;
        background-color: var(--clr-white);
        color: black;
        width: 461px;
        border-radius: 10px 0px 0px 10px;
        margin-top: 0;
    
    }
    
    .emailInput::placeholder{
        font-size: 14px;
        color: #828282;
    }
}

.submitBtn{
    background: #000;
    color: var(--clr-white);
    font-weight: var(--font-sb);
    padding: 26px 39px;
    margin-top: 25px;
    border-radius: var(--border-r);
    margin-inline: auto;
    text-transform: capitalize;
    cursor: pointer;
}

.submitBtn:hover{
    color: #000;
    background-color: var(--clr-white);

}


@media (min-width:76.25em) {
    
    .submitBtn{
        margin-top: 0;
        border-radius: 0 10px 10px 0;
        padding: 30px 39px;
    }
}


/* Shop for Jewellery */

@media (min-width:76.25em) {
    .jewellaryShop-Wrapper{
        display: flex;
        flex-wrap: wrap;
    }
}

.jewellaryShopCard{
    position: relative;
    width: 343px;
    height: 447px;
    border-radius: var(--border-r);
    margin-inline: auto;
}

.jewellaryShopCard>img{
    width: 343px;
    height: 380px;
    border-radius: var(--border-r);
}

.jewellaryShopCard+.jewellaryShopCard{
    margin-top: 20px;
}

.jewellaryShopCard-detail{
    width: 316px;
    height: 187px;
    background-color: var(--clr-white);
    padding: 31px 31px 30px 30px;
    margin-top: -117px;
    margin-left: 14px;
    position: relative;
    z-index: 9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: var(--border-r);
}

@media (min-width:76.25em) {
    .jewellaryShopCard{
        width: 384px;
        height: 472px;
    }

    .jewellaryShopCard>img{
        width: 384px;
        height: 401px;
        border-radius: var(--border-r);
    }

    .jewellaryShopCard+.jewellaryShopCard{
        margin-top: 0;
    }

    .jewellaryShopCard-detail{
        width: 352px;
        height: 162px;
        margin-top: -113px;
        margin-left: 16px;
        padding-top: 35px;
        padding-bottom: 34px;
    }
}

.jewellaryShopCard-detail>h3{
    font-size: 18px;
    font-weight: var(--font-sb);
    color: #000;
}

.jewellaryShopCard-detail>div{
    display: flex;
    text-align: center;
    margin-top: 15px;
    border-radius: var(--border-r);
}



.jewellaryShopCard-detail>div >p{
    font-size: 13px;
    color: rgba(0, 0, 0, 0.609);
}

.jewellaryShopCard-detail>div >img{
    width: 12px;
    margin-right: 7px;
}

@media (min-width:76.25em) {
    .jewellaryShopCard-detail>div >p{
        font-size: 12px;
        color: rgba(0, 0, 0, 0.609);
    }
    
    .jewellaryShopCard-detail>div >img{
        width: 10px;
        margin-right: 5px;
    }
}

.jewellaryShopCard-detail>a{
    color: var(--clr-white);
    padding: 18px 39px;
    background-color: #000;
    border-radius: 5px;
    font-size: 15px;
    font-weight: var(--font-m);
    text-transform: capitalize;
    margin-top: 27px;
}
.jewellaryShopCard-detail>a:hover{
    background-color: var(--clr-red);
}


/* Blog Post section  */


@media (min-width:76.25em) {
    .blogPostCard-wrapper{
        display: flex;
        gap: 32px;
    }
}

.blogPostCard{
    width: 343px;
    height: 516px;
    background-color: var(--clr-white);
    border: 1px solid #DDDDDD;
    padding: 11px;
    border-radius: var(--border-r);
    display: block;
    margin-inline: auto;
}

.blogPostCard>img{
    width: 321px;
    height: 319px;
    border-radius: 10px;
}

.blogPostCard:hover{
    border: 1px solid var(--clr-red);
}

.blogPostCard +.blogPostCard{
    margin-top: 20px;
}


@media (min-width:76.25em) {
    .blogPostCard{
        width: 384px;
        height: 549px;
        padding: 15px;
    }

    .blogPostCard>img{
        width: 354px;
    }

    .blogPostCard +.blogPostCard{
        margin-top: 0px;
    }
}

.blogPostCard-detail{
    display: flex;
    width: 100%;
    flex-shrink: 0;
}

.blogPostCard-detail>div{
    display: flex;
    flex-shrink: 0;
    align-items: center;
}

.blogPostCard-detail>div:first-child>img{
    width: 11px;
}

.blogPostCard-detail>div:nth-child(2){
    margin-left: 15px;
}

.blogPostCard-detail>div:nth-child(2)>img{
    width: 9px;
}

.blogPostCard-detail>div:nth-child(2)>p{
    color: var(--clr-red);
}

.blogPostCard-detail>div:last-child{
    margin-left: auto;
}


.blogPostCard-detail>div:last-child>img{
    width: 17px;
}

.blogPostCard-detail>div>p{
    font-size: 10px;
    color: #535353;
    text-align: center;
    width: fit-content;
    margin-left: 5px;
}


@media (min-width:76.25em) {
    .blogPostCard-detail>div:first-child>img{
        width: 15px;
    }

    .blogPostCard-detail>div:nth-child(2){
        margin-left: 12px;
    }

    .blogPostCard-detail>div:nth-child(2)>img{
        width: 12px;
    }

    
    .blogPostCard-detail>div:last-child>img{
    width: 20px;
    }

    .blogPostCard-detail>div>p{
        font-size: 13px;
    }
}

.blogPostCard>h3{
    font-family: 'Montserrat', sans-serif;
    font-weight: var(--font-m);
    letter-spacing: 2%;
    margin-top: 20px;
    color: #000;

}

@media (min-width:76.25em) {    
    .blogPostCard>h3{
        font-size: 21px;
    }
}

.blogPostCard>p {
    font-family: 'Montserrat', sans-serif;
    color: #7E7E7E;
    margin-top: 15px;
    font-size: 14px;
    letter-spacing: 3%;
}

@media (min-width:76.25em) {    
    .blogPostCard>p {
        font-size: 15px;
        margin-top: 20px;
    }
}


/* Accessories shop section  */

@media (min-width:76.25em) {
    .acceShopCard-wrapper{
        display: grid;
        grid-template-columns: auto auto;
        gap: 32px;
    }
}

.acceShopCard{
    width: 343px;
    height: 352px;
    border-radius: var(--border-r);
    position: relative;
    margin-inline: auto;
}

.acceShopCard>img{
    width: 343px;
    height: 352px;
    border-radius: var(--border-r);
}

.acceShopCard + .acceShopCard{
    margin-top: 20px;
}

@media (min-width:76.25em) {
    .acceShopCard{
        width: 592px;
        height: 398px;
    }

    .acceShopCard>img{
        width: 592px;
        height: 398px;
    }

    .acceShopCard + .acceShopCard{
        margin-top: 0px;
    }
}


.acceShopCard-detail{
    position: absolute;
    bottom: 0%;
    left: 0%;
    background-color: var(--clr-white);
    width: 100%;
    padding-top: 15px;
    padding-bottom: 17px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 0 0 10px 10px;
}

@media (min-width:76.25em) {   
    .acceShopCard-detail{
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 24px 26px;
    }
}

.acceShopCard-detail>div{
    display: flex;
    flex-direction: column;
    align-items: center;
}

@media (min-width:76.25em) {  
    .acceShopCard-detail>div{
        align-items: flex-start; 
    }
}

.acceShopCard-detail>div>h3{
    font-size: 18px;
    color: #000;
    font-weight: var(--font-sb);
}

.acceShopCard-detail>div>div{
    display: flex;
    align-items: center;
    margin-top: 8px;
}

@media (min-width:76.25em) {  
    .acceShopCard-detail>div>div{
        margin-top: 15px; 
    }
}

.acceShopCard-detail>div>div>img{
    width: 12px;
    margin-right: 7px;
}

.acceShopCard-detail>div>div>p{
    font-size: 13px;
    color: rgba(0, 0, 0, 0.601);
    
}

.acceShopCard-detail>a{
    display: block;
    padding: 18px 39px;
    background-color: #000;
    color: var(--clr-white);
    font-size: 15px;
    font-weight: var(--font-m);
    border-radius: 5px;
    margin-top: 13px;
    text-transform: capitalize;
}

.acceShopCard-detail>a:hover{
    background-color: var(--clr-red);
}

@media (min-width:76.25em) {
    .acceShopCard-detail>a{
        margin-top: 0px;

    }    
}

/* check our delhi Button  */
.checkBtn{
    background-color: #000;
    color: var(--clr-white);
    font-size: 20px;
    font-weight: var(--font-m);
    width: 343px ;
    height: 80px ;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-inline: auto;
    border-radius: var(--border-r);
    margin-top: 50px;
    margin-bottom: 50px;
}

.checkBtn:hover{
    background-color: var(--clr-red);
}

@media (min-width:76.25em) {
    .checkBtn{
        width: 428px ;
        margin-top: 100px;
        margin-bottom: 100px;
    }
}

/* note  */

.note{
    background-color: #FBFBFB;
    padding: 35px 14px;
    border-radius: var(--border-r);
}

.note>h2{
    font-size: 22px;
    font-weight: var(--font-m);
    color: #000;
}



.note>p{
    color: #7B7B7B;
    line-height: 160%;
    font-size: 14px;
    margin-top: 15px;
}

.note> p+p{
    margin-top: 14px;
}

@media (min-width:76.25em) {
    .note{
        padding: 60px 40px;
    }

    .note>h2{
        font-size: 28px;
    }

    
    .note>p{
        font-size: 16px;
        margin-top: 25px;
    }

    .note> p+p{
        margin-top: 20px;
    }
}

#extraText, #lessBtn{
    display: none;
}

#moreBtn, #lessBtn{
    color: var(--clr-red);
    text-decoration: underline;
    cursor: pointer;
}


/* Do you Know Banner */

.doYouKnowBanner{
    position: relative;
    /* height: 219px; */
    width: 100%;
    overflow: hidden;
}

.cover{
    background-image: url('./asset/image/DoYouKnowBanner.png');
    background-size: cover;
    background-repeat: no-repeat;
    filter: blur(35px);
    width: 100%;
    height: 219px;
    overflow: hidden;
    margin-top: 40px;
    position: absolute;
    top: 0;
    left: 0%;
    z-index: -2;
}

.blackLayer{
    background-color: rgba(0, 0, 0, 0.403);
    width: 100%;
    height: 100%;
    padding-bottom: 30px;
}

.bg-container{
    padding-top: 30px;
}


@media (min-width:76.25em) {

    .doYouKnowBanner{
        height: 250px;
        display: flex;
        align-items: center;
    }
    .cover{
    background-image: url('./asset/image/DoYouKnowBannerD.png');
    }

    .bg-container{
        padding-top: 76px;
        padding-bottom: 76px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }
}

.doYouKnow-textArea{
    
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media (min-width:76.25em) {
    .doYouKnow-textArea{
        flex-direction: row;
        align-items: center;
    }
}

.doYouKnow-title{
    font-size: 22px ;
    font-weight: var(--font-sb);
    color: var(--clr-white);
    text-transform: capitalize;
}

.doYouKnow-text{
    color: var(--clr-white);
    font-size: 12px;
}

.doYouKnow-btn{
    padding: 19px 47px ;
    font-size: 14px;
    letter-spacing: 2%;
    background-color: var(--clr-white);
    color: #000;
    text-transform: capitalize;
    border-radius: var(--border-r);
    font-weight: var(--font-sb);
    margin-top: 22px;
    width: fit-content;
    font-size: 14px;
}

.doYouKnow-btn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}


@media (min-width:76.25em) {
    .doYouKnow-title{
        font-size: 36px ;
    }
    .doYouKnow-text{
        font-size: 16px;
    }

    .doYouKnow-btn{
        margin-inline: auto;
        margin-top: 0;
        font-size: 16px;
    }

}

/* footer  */

footer{
    margin-top: 50px ;
    margin-bottom: 50px ;
}

.footer-grid{
    display: grid;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
}

.one{
    grid-column-start: 1;
    grid-column-end: 3;
    margin-bottom: 72px;
}


@media (min-width:76.25em) {
    footer{
        margin-top: 100px;
    }
    
    .footer-grid{
        grid-template-columns: auto auto auto;
        grid-template-rows: auto;
        gap: 60px;
    } 

    .one{
        grid-column-start: 1;
        grid-column-end: 2;
    }
}

.one>a{
    display: block;
}

.one>a>img{
    width: 86px;
}

.one>p{
    font-size: 15px;
    font-weight: var(--font-l);
    color: #666666;
    margin-top: 20px;
}

.socialLinks{
    margin-top: 30px;
}

.link{
    fill: rgba(0, 0, 0, 0.404);
    cursor: pointer;
}

.link:hover{
    fill: rgb(0, 0, 0);
}

.link+.link{
    margin-left: 20px;
}

@media (min-width:76.25em) {

    .two, .three{
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
}

.two>h4 , .three>h4{
    font-size: 15px;
    font-weight: var(--font-sb);
    text-transform: uppercase;
    margin-bottom: 20px;
}

.pages>a , .bestLehanga>a, .bestPlaces>a, .artificialJewellery>a{
    display: block;
    margin-top: 20px;
    font-size: 16px;
    color: #5E5E5E;
}

.pages>a:hover , .bestLehanga>a:hover, .bestPlaces>a:hover, .artificialJewellery>a:hover{
    color: var(--clr-red);
}

.bestLehanga , .artificialJewellery{
    margin-top: 30px;
}

@media (min-width:76.25em) {
    .bestLehanga , .artificialJewellery{
        margin-top: 0;
        margin-left: 65px;
    }
}

.four{
    border-top: 2px solid #E9E9E9;
    text-align: center;
    margin-top: 50px;
}

@media (min-width:76.25em) {
    .four{
    margin-top: 100px;
    }

    .four-flex{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }
}

.sitemap, .term, .copyright{
    display: block;
    font-size: 15px;
}


.sitemap:hover, .term:hover, .copyright:hover{
    color: var(--clr-red);
}

.sitemap{
    color: #000;
    text-decoration: underline;
    margin-top: 17px;
}

.term{
    color: rgba(0, 0, 0, 0.603);
}

.four-flex>div{
    display: flex;
    align-items: center;
    margin-top: 20px;
    justify-content: center;
}

.four-flex>div>p{
    color: rgba(0, 0, 0, 0.603);
    margin-inline: 15px;
}

.copyright{
    color: rgba(0, 0, 0, 0.608);
    margin-top: 40px;
}

@media (min-width:76.25em) {
    .four-flex>div ,.copyright{
        margin-top: 17px;
    }
    .four-flex>div{
        order: 3;
        margin-left: auto;
    }

    
    .sitemap{
        order: 1;
        margin-right: auto;
    }

    .copyright{
        order: 2;
    }
}


/* ------------Get Listed pages styling start---------- */

/* other pages nav bar  */

.nav-btns{
    display: flex;
    grid-column-start: 2;
    grid-column-start: 3;
    align-items: center;
}

.nav-btns_first{
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: 0%;
    flex-direction: row-reverse;
}

.sb-search{
    margin-left: 1rem;
    position: relative;
}

.navSerachBar{
    position: absolute;
    background-color: var(--clr-white);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 283px;
    right: 0;
    top: 50px;
    border-radius: 15px;
    height: 54px;
    display: none;
}

.sb-search_submit{
    background-color: transparent;
    cursor: pointer;
    padding-right: 20px;
    padding-top: 15px;
    padding-bottom: 14px;
    position: absolute;
    top: 0%;
    right: 0%;
    border: none;
}

.sb-icon-search> svg{
    width: 20px;
    cursor: pointer;
}

.sb-search-input{
    font-size: 14px;
    border-radius: 15px;
    padding-top: 8px;
    padding-left: 8px;
    padding-bottom: 8px;
    width: 100%;
    height: 100%;
    border: none;
    border: 1px solid var(--clr-red);
}

.sb-search-input::placeholder{
    color: #ADADAD;
}

@media (min-width:76.25em) {
    .nav-btns_first{
        flex-direction: row;
    }

    .sb-search{
        position: relative;
    }

    .sb-icon-search{
        display: none;
    }

    .navSerachBar{
        position: relative;
        background-color: var(--clr-white);
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-radius: 15px;
        right: 0;
        top: 0px;
        height: 66px;
        width: 283px;
        margin-right: 40px;
    }

    .sb-search_submit{
        padding: 23px 23px 18px 0 ;
    }

    .sb-search-input{
        padding-right: 46px;
        border: none;
    }

    
}


/* page start here  */

/* page Banner  */

.pageBanner{
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.652) 0%, rgba(0, 0, 0, 0.361), rgba(0, 0, 0, 0));
    width: 100%;
    min-height: 283px;
    padding-top: 138px;
    position: relative;
}

.pageBanner-bg{
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.pageBanner-style{
    display: flex;
    align-items: center;
    flex-direction: column;
}

.pageBanner-title{
    font-size: 34px;
    font-weight: var(--font-sb);
    color: var(--clr-white);
    max-width: 891px;
}

.pageBanner-links{
    margin-top: 25px;
}

.pageBanner-links>a{
    color: var(--clr-white);
    font-size: 15px;
    text-transform: uppercase;
    text-decoration: underline;
    position: relative;
}

.pageBanner-links>a:hover{
    color: var(--clr-red);
}

.pageBanner-links>a+a{
    margin-left: 8px;
}

.pageBanner-links>a:not(:last-child)::after{
    content: ' |';
    position: absolute;
    right: -8px;
    top: 50%;
    color: var(--clr-white);
    transform: translateY(-50%);
    font-size: 15px;
}

@media (min-width:76.25em) {
    .pageBanner{
        min-height: 352px;
        padding-top: 181px;
    }

    .pageBanner-title{
        font-size: 58px;
        font-weight: var(--font-b);
        line-height: 58px;
    }

    .pageBanner-links{
        margin-top: 40px;
    }

}


/* page content  */

 /* watch video section  */
.watchVideo{
    margin-inline: auto;
    max-width: 488px;
}



.sectionHeading{
    font-weight: var(--font-sb);
    color: #000;
    font-size: 28px;
}



.howToVideo{
    width: 100%;
    margin-top: 30px;
}

.sectionHeading2{
    font-size: 20px;
    font-weight: var(--font-sb);
    margin-top: 40px;
}

@media (min-width:76.25em) {
    .watchVideo{
        margin-inline: 0;
        padding-top: 50px;
        padding-left: 30px;
        padding-right: 30px;
        background-color: #FAFAFA;
        border-radius: var(--border-r);
    }

    .sectionHeading{
        font-size: 22px;
    }

    .sectionHeading2{
        font-size: 22px;
    }

    .watchPara{
        letter-spacing: 3%;
    }
}

.watchVideo>*>p, .watchVideo>*>*>p{
    line-height: 161%;
    color: #656565;
    margin-top: 15px;
}

.shopOwners>p{
    margin-bottom: 50px;
}

.watchVideo>*>*>p>a, .watchVideo>*>p>a{
    color: var(--clr-red);
    font-weight: var(--font-m);
}

.pressRelease{
    margin-top: 50px;

}

.pressRelease-title{
    font-weight: var(--font-b);
    font-size: 22px;
    margin-bottom: 25px;
}

.pressRelease-article>h4{
    font-size: 18px;
    color: var(--clr-red);
    text-decoration: underline;
    font-weight: var(--font-sb);
}

.pressRelease-article+.pressRelease-article{
    margin-top: 30px;
}


/* get linked section  */

.getLinked{
    margin-top: 50px;
    margin-inline: auto;
}

@media (min-width:76.25em) {
    .watch_listed{
        display: flex;
        gap: 60px;
    }

    .getLinked{
        margin-top: 00px;
    }
}

.getLinked-title{
    font-size: 36px;
    color: #000;
    font-weight: var(--font-r);
    margin-bottom: 25px;
    text-transform: capitalize;
}

.formPart-title{
    margin-top: 20px;
    font-size: 18px;
    font-weight: var(--font-m);
    color: rgba(0, 0, 0, 0.604);
    text-transform: uppercase;
}



.form_input{
    font-size: 14px;
    padding: 20px 15px;
    width: 100%;
    margin-top: 16px;
    background-color: #FDFDFD;
    border: 1px solid #D8D8D8;
    border-radius: 5px;
    resize: none;
}

.form_input::placeholder{
    text-transform: capitalize;
    font-size: 14px;
    color: #797979;
}

.form_input + .form_input {
    margin-top: 12px;
}

.checkBox-title{
    font-size: 13px;
    color: #000;
    font-weight: var(--font-r);
    margin-top: 20px;
}


.form-Boxgroup{
    display: flex;
    flex-wrap: wrap;
}

@media (min-width:76.25em) {
    .getLinked-title{
        font-size: 42px;
    }

    .formPart-title{
        font-size: 22px;
        margin-top: 30px;
    }

    .form_input{
        font-size: 16px;
        padding: 27px 20px;
    }

    .form_input::placeholder{
        font-size: 16px;
    }

    .form_input + .form_input {
        margin-top: 15px;
    }

    .checkBox-title{
        font-size: 15px;
        margin-top: 25px;

    }

    .form-Boxgroup>div{
        margin-top: 20px;
        margin-right: 15px;
    }
}




.form-Box{
    position: relative;
      border: 2px solid #000;
      border-radius: 2px;
      background: none;
      cursor: pointer;
      line-height: 0;
      margin: 0 .4rem 0 0;
      outline: 0;
      padding: 0 !important;
      vertical-align: middle;
      height: 18px;
      width: 20px;
      -webkit-appearance: none;
    opacity: 1;
}

.form-Box:checked {
    background-color: #000;
    opacity: 1;
}

.form-Box:before {
    content: '';
    position: absolute;
    right: 50%;
    top: 50%;
    width: 4px;
    height: 10px;
    border: solid #FFF;
    border-width: 0 2px 2px 0;
    margin: -1px -1px 0 -1px;
    transform: rotate(45deg) translate(-50%, -50%);
    z-index: 2;
  }

  
.form-Box_labels{
    font-size: 14px;
    color: #797979;
    margin-left: -6px;
    margin-right: 12px;
    position: relative;
    cursor: pointer;
}


  .form-radio_group{
    display: flex;
    align-items: center;
  }

  .form-radio_group> div+div{
    margin-left: 20px;
  }

  .form-radio{
    appearance: none;
    accent-color: #000;
    position: relative;
    width: 23px;
    height: 23px;
    vertical-align: middle;
  }

  .form-radio:checked::before{
    background-color: #000;
  }

  .form-radio::before{
    content:  '';
    position: absolute;
    top: 0%;
    left: 0%;
    width: 23px;
    height: 23px;
    border: 1px solid #000;
    border-radius: 50%;
    background: #FCFCFC;
    cursor: pointer;

  }

  .form-radio_label{
    font-weight: var(--font-m);
    font-size: 14px;
    margin-left: 10px;
    text-transform: capitalize;
    cursor: pointer;
  }


  .form-radio_title{
    font-size: 16px;
    font-weight: var(--font-r);
    color: #626262;
    margin-bottom: 15px;
    text-transform: capitalize;
  }

  .form-radio_group2{
    margin-top: 20px;
  }

  @media (min-width:76.25em) {
    .form-radio_group2{
        margin-top: 30px;
    }
  }

  .form-radio_container{
    display: flex;
  }

  .form-radio_container> div:last-child{
    margin-left: 30px;
  }

  .form_file::-webkit-file-upload-button{
    visibility: hidden;
  }


  .form_file{
    width: 100%;
    margin-top: 16px;
    background-color: #FDFDFD;
    border: 1px solid #D8D8D8;
    border-radius: 5px;
    padding: 11px 0px 11px 11px ;
    pointer-events: none;
  }

  .form_file::before {
    content: 'choose files';
    display: inline-block;
    background: #FFFDFD;
    color: var(--clr-red);
    border: 1px solid var(--clr-red);
    border-radius: 5px;
    padding: 13px 25px;
    outline: none;
    white-space: nowrap;
    -webkit-user-select: none;
    cursor: pointer;
    font-weight: var(--font-m);
    font-size: 14px;
    text-transform: capitalize;
    pointer-events: all;
  }

  @media (min-width:76.25em) {
    .form_file::before {
        font-size: 16px;
    }
  }

  .form_file:hover:before{
    background-color: var(--clr-red);
    color: var(--clr-white);
  }

  .form_terms{
    margin-top: 16px;
  }

 

  .form_btns{
    margin-top: 40px;
    display: flex;
    width: fit-content;
    flex-direction: column;
    margin-inline: auto;
  }

 


  .form_btns>button{
    font-size: 15px;
    font-weight: var(--font-sb);
    text-transform: capitalize;
    border-radius: var(--border-r);
  }

  .form_btns>button+button{
    margin-top: 25px;
  }

  .form-submitBtn{
    padding: 24px 75px;
    background-color: var(--clr-red);
    color: var(--clr-white);
    border: none;
  }

  .form-submitBtn:hover{
    background-color: #000;
  }

  .form-resetBtn{
    padding: 24px 81px;
    background-color: var(--clr-white);
    color: #000;
    border: 1px solid #9E9E9E;
  }

  .form-resetBtn:hover{
    background-color: #000;
    color: var(--clr-white);
  }

  @media (min-width:76.25em) {
    .form_btns{
        flex-direction: row-reverse;
        justify-content: space-between;
        width: 100%;
    }

    .form_btns>button{
        font-size: 16px;
        cursor: pointer;
    }

    .form_btns>button+button{
        margin-top: 0;
    }
  }

  

 

  .sectionTitle_25{
    font-weight: var(--font-b);
    font-size: 25px;
    color: #000;
  }

  /* horizontal Scroll Blog post card  */

  .cardHorizontal_container{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    scroll-behavior: smooth;
  }

  .cardHorizontal_container>.blogPostCard{
      flex: 0 0 auto;
  }

  .cardHorizontal_container>.blogPostCard+.blogPostCard{
    margin-top: 0;
    margin-left: 12px;
  }


  .cardHorizontal_container::-webkit-scrollbar,
  .cardHorizontal_container::-webkit-scrollbar-thumb,
  .cardHorizontal_container::-webkit-scrollbar-track { 
      height: 0px;
      border: none;
      background: transparent;
      display: none;
  }

  .cardHorizontal_arrow{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }

  .cardHorizontal_arrow-left,
  .cardHorizontal_arrow-right{
    opacity: 0.6;
  }

  .cardHorizontal_arrow-left:hover,
  .cardHorizontal_arrow-right:hover{
    opacity: 1;
  }

  .cardHorizontal_arrow-right{
    margin-left: 35px;
  }

/* ------------ Get listed Page End Here  ------------------*/

/*------------- Delhi City Page Start here  ----------------*/
.pageBanner-title_cityPage{
    font-size: 24px;
    font-weight: var(--font-sb);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .pageBanner-title_cityPage{
            font-size: 58px;
            font-weight: var(--font-b);
            line-height: 58px;
            max-width: 891px;
    
    }
}

.cityPage_nav{
    background-color: #F8F8F8;
    padding-top: 32px;
    padding-bottom: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.cityPage_nav>p {
    font-size: 16px;
    font-weight: var(--font-m);
    color: #CCCFD7;
    text-transform: uppercase;
    position: relative;
    width: fit-content;
}

.cityPage_nav>p>a ,.cityPage_nav>p>span{
    cursor: pointer;
}

.cityPage_nav>p>span:hover, .cityPage_nav>p>a:hover{
    color: var(--clr-red) !important;
}

.cityPage_nav>p>a, .cityPage_nav>p>span{
    color: #000;
}

.productListBlock{
    position: absolute;
    top: 74px;
    left: 50%;
    transform: translateX(-50%);
    width: 343px;
    background-color: var(--clr-white);
    border-radius: 5px;
    box-shadow: 1px 7px 21px rgba(0, 0, 0, 0.081);
    z-index: 9;
    display: none;
}

.productListCatagory {
    background-color: #F2F2F2;
    width: 122px;
    padding-top: 13px;
    padding-bottom: 22px;
    border-radius: 5px 0 0 5px;
}

.productListCatagory > p{
    color: #555555;
    font-size: 14px;
    line-height: 256.5%;
    font-weight: var(--font-m);
    padding-left: 12px;
    text-transform: capitalize;
    width: 100%;
    cursor: pointer;
}

.productListCatagory > p:hover{
    background-color: var(--clr-white);
    color: #000;
}

.productListArchor{
    padding-left: 26px;
    padding-top: 13px;
    padding-bottom: 22px;
}

.productListArchor >div{
    display: none;
}

.showList{
    display: block !important;
}

.productListArchor >div>a{
    display: block;
    color: #696969;
    font-size: 16px;
    line-height: 256.5%;
}

.productListArchor >div>a:hover{
    color: #000;
}

.showCatagory{
    background-color: var(--clr-white);
    color: #000 !important;
}

@media (min-width:76.25em) {
    .cityPage_nav>p {
        font-size: 18px;
    }

    .productListBlock{
        width: 1216px;
        background-color: var(--clr-white);
        border-radius: 0px 0px 10px 10px;
        box-shadow: 0px 17px 30px rgba(0, 0, 0, 0.081);
        flex-direction: column;
    }

    .productListCatagory {
        background-color: var(--clr-white);
        width: 100%;
        padding-top: 17px;
        padding-bottom: 0px;
        padding-left: 40px;
        padding-right: 40px;
        display: flex;
        justify-content: space-between;
        border-radius:0;
        border-bottom: 1px solid #DFDFDF;
    }

    .productListCatagory > p{
        color: #555555;
        font-size: 20px;
        line-height: 256.5%;
        font-weight: var(--font-m);
        padding-left: 0px;
        width: 100%;
        cursor: auto;
        pointer-events: none;
        flex-shrink: 0;
    }

    .productListCatagory > p:hover{
        color: #555555;
    }

    .showCatagory{
        background-color: var(--clr-white);
        color: #555555 !important;
    }

    .productListArchor{
        display: flex;
        justify-content: space-between;
    }

    .productListArchor{
        padding-left: 40px;
        padding-right: 40px;
        padding-top: 9px;
        padding-bottom: 56px;
    }

    .productListArchor >div{
        display: block;
    }

    .catagoryBtn:first-child{
        width: 96px;
    }

    .catagoryBtn:nth-child(2){
        width: 118px;
    }
    .catagoryBtn:nth-child(3){
        width: 184px;
    }
    .catagoryBtn:nth-child(4){
        width: 143px;
    }
    .catagoryBtn:nth-child(5){
        width: 169px;
    }
    .catagoryBtn:last-child{
        width: 159px;
    }


}



.cityPage_section-markets{
    display: grid;
    gap: 16px;
    width: 343px;
    margin-inline: auto;
    margin-top: 34px;
}

.cityPage_section-title{
    font-size: 20px;
    font-weight: var(--font-b);
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 8px;
}

@media (min-width:76.25em) {
    
    .cityPage_section-markets{
        margin-top: 100px;
        width: 100%;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto 332px 332px;
        gap: 32px;
    }

    .cityPage_section-markets> h2 +.bestMarket-card_city{
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row: 2/3;
    }

    .cityPage_section-title{
        font-size: 48px;
        text-align: left;
        grid-column-start:1 ;
        grid-column-end: 3;
    }
}

.cityPage_sectionBtn{
    width: 183px;
    height: 56px;
    color: var(--clr-red);
    font-weight: var(--font-sb);
    border: 1px solid var(--clr-red);
    border-radius: var(--border-r);
    display: block;
    margin-inline: auto;
    letter-spacing: 2%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}

.cityPage_sectionBtn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .cityPage_sectionBtn{
        width: 227px;
        height: 74px;
        margin: 0px;
        margin-left: auto;
        grid-column-start:3 ;
        grid-column-end: 4;
        grid-row-start: 1;
        grid-row-end:2 ;
    }
}


.bestMarket-card_city--first{
    width: 100%;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
}

.bestMarket-card_city--first>img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bestMarket-card_city{
    width: 100%;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
}


.bestMarket-card_city>img{
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.bestMarket-card_city-text--first{
    background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    border-radius: var(--border-r);
    padding-bottom: 24px;
    padding-inline: 21px;
    justify-content: space-between;
}

.bestMarket-card_city-text--first>a>img{
    width: 100%;
}


.bestMarket-card_city-text{
    background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    border-radius: var(--border-r);
    padding-bottom: 24px;
    padding-inline: 21px;
    justify-content: space-between;
}

.bestMarket-card_city-text>a>img{
    width: 100%;
}

.bestMarket-card_city-text--first>div>h3{
    font-size: 24px;
    color: var(--clr-white);
}

.bestMarket-card_city-text--first>div>p{
    font-size: 14px;
    color: var(--clr-white);
    text-transform: capitalize;
}

.bestMarket-card_city-text--first>a{
    width: 40px;
}


.bestMarket-card_city-text>div>h3{
    font-size: 24px;
    color: var(--clr-white);
}

.bestMarket-card_city-text>div>p{
    font-size: 14px;
    color: var(--clr-white);
    text-transform: capitalize;
}

.bestMarket-card_city-text>a{
    width: 40px;
}


.bestMarket-card_city-text>a:hover ,
.bestMarket-card_city-text--first>a:hover{
    transform: scale(1.5);
}

.desktopMap{
    margin-top: 150px;
    display: none;
}

.desktopMap>iframe{
    width: 100%;
    height: 704px;
    border-radius: 20px;
    margin-top: 50px;
}

.desktopMap>h2{
    font-size: 32px;
    font-weight: var(--font-sb);
    line-height: 99.5%;
    text-align: center;
}

@media (min-width:76.25em) {
    .bestMarket-card_city--first{

        grid-column: 1/4;
    }  
    .desktopMap{
        margin-top: 150px;
        display: block;
    }

    .bestMarket-card_city-text--first{
        padding-bottom: 40px;
        padding-inline: 30px;
    }


    .bestMarket-card_city-text{
        padding-bottom: 24px;
        padding-right: 30px;
        padding-left:20px ;
    }

    .bestMarket-card_city-text--first>div>h3{
        font-size: 36px;
    }

    .bestMarket-card_city-text--first>div>p{
        font-size: 20px;
    }
    
    .bestMarket-card_city-text--first>a{
        width: 60px;
    }
    
    .bestMarket-card_city-text>div>p{
        font-size: 18px;
    }

    .bestMarket-card_city-text>a{
        width: 36px;
    }
}


.cityPage_section-mall{
    margin-top: 64px;
    display: grid;
    width: 343px;
    margin-inline: auto;
    gap: 16px;
}

@media (min-width:76.25em) {
    .cityPage_section-mall{
        width: 100%;
        gap: 32px;
        grid-template-columns: 1fr 1fr;
        grid-row: auto auto auto;
        margin-top: 100px;
    }

    .cityPage_section-mall>h2{
        grid-column: 1/2;
    }

    .cityPage_section-mall>.cityPage_sectionBtn{
        grid-column: 2/3;
    }

    .cityPage_section-mall>h2+div{
        grid-row: 2/4;
        grid-column: 1/2;
    }

    .bestMall-sec{
        grid-column: 2/3;
        grid-row: 2/3;
        height: 284px;
    }

    .bestMall-third{
        grid-column: 2/3;
        grid-row: 3/4;
        height: 284px;
    }
}


.bestMall-card_city{
    width: 100%;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
}

.bestMall-card_city>img{
    width: 343px;
    height: 345px;
    border-radius: var(--border-r);
}

.bestMall-card_city--text{
    background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    border-radius: var(--border-r);
    padding-bottom: 24px;
    padding-inline: 21px;
    justify-content: space-between;
}

.bestMall-card_city--text>div>h3{
    font-size: 24px;
    color: var(--clr-white);
}

.bestMall-card_city--text>div>p{
    font-size: 14px;
    color: var(--clr-white);
    text-transform: capitalize;
}

.bestMall-card_city--text>a{
    width: 40px;
}

.bestMall-card_city--text>a>img{
    width: 100%;
}
.bestMall-card_city--text>a:hover{
    transform: scale(1.5);
}

/* .bestMall-card_city--text */


@media (min-width:76.25em) {
    .bestMall-card_city>img{
        width: 100%;
        height: 100%;
    }

    .bestMall-card_city--text{
        padding-left:35px;
        padding-right:50px;
        padding-bottom:25px;
    }

    .bestMall-card_city--text>div>h3{
        font-size: 32px;
    }
    
    .bestMall-card_city--text>div>p{
        font-size: 20px;
    }
    
    .bestMall-card_city--text>a{
        width: 56px;
    }
}


.bestShop-section_cityPage{
    margin-top: 64px;
    display: grid;
    width: 343px;
    margin-inline: auto;
    gap: 16px;
}



.bestShop-card_city{
    width: 100%;
    position: relative;
    border-radius: var(--border-r);
    overflow: hidden;
    height: 345px;
}

.bestShop-card_city>img{
    width: 100%;
    border-radius: 15px;
    height: 100%;
}

.bestShop-card_city--text{
    background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: flex-end;
    border-radius: var(--border-r);
    padding-bottom: 24px;
    padding-inline: 21px;
    justify-content: space-between;
}

.bestShop-card_city--text>div>h3{
    font-size: 24px;
    color: var(--clr-white);
}

.bestShop-card_city--text>div>p{
    font-size: 14px;
    color: var(--clr-white);
    text-transform: capitalize;
}

.bestShop-card_city--text>a{
    width: 40px;
}

.bestShop-card_city--text>a>img{
    width: 100%;
}
.bestShop-card_city--text>a:hover{
    transform: scale(1.5);
}

@media (min-width:76.25em) {
    .bestShop-section_cityPage{
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: auto auto auto;
        width: 100%;
    }

    .bestShop-section_cityPage>h2{
        grid-column: 1/4;
    }

    .bestShop-section_cityPage>.cityPage_sectionBtn{
        grid-column: 4/5;
    }

    .bestShop-card_city--text{
        padding-bottom: 25px;
        padding-left: 15px;
        padding-right:12px ;
    }
    
    .bestShop-card_city--text>div>h3{
        font-size: 20px;
    }
    
    .bestShop-card_city--text>div>p{
        font-size: 15px;
    }
    
    .bestShop-card_city--text>a{
        width: 26px;
    }

    .bestShop_first{
        grid-column: 1/3;
        grid-row: 2/4;
        height: 100%;
    }

    .bestShop_first>.bestShop-card_city--text{
        padding-bottom: 44px;
        padding-left: 25px;
        padding-right:40px ;
    }
    
    .bestShop_first>.bestShop-card_city--text>div>h3{
        font-size: 36px;
    }
    
    .bestShop_first>.bestShop-card_city--text>div>p{
        font-size: 20px;
    }
    
    .bestShop_first>.bestShop-card_city--text>a{
        width: 60px;
    }
}

.mapForMobile-section{
    margin-top: 64px;
    width: 100%;
    background-color: #F1F1F1;
    border-radius: 15px;
    margin-inline: auto;
    padding: 24px 32px;
}

.mapForMobile-section>img{
    width: 100%;
    margin-inline: auto;
    max-width: 585px;
    display: block;
}

.mapForMobile-section>h2{
    font-size: 20px;
    font-weight: var(--font-b);
    text-align: center;
    text-transform: uppercase;
}

@media (min-width:76.25em) {
    /* .mapForMobile-section{
        display: none;
    } */

    .mapForMobile-section>h2{
        font-size: 32px !important;
    }

    .bestShop_clothing-m{
        display: none;
    }

    .bestShop_cloth-D{
        background-color: var(--clr-white);
    }
}


.bestShopCard_clothing-citypage{
    position: relative;
    padding: 12px;
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    border-radius: var(--border-r);
    width: 100%;
    max-width: 384px;
    height: 391px;
    display: block;
}

.bestShopCard_clothing-citypage>div>img{
    width: 100%;
    max-width: 360px;
    /* height: 268px; */
    border-radius: 10px ;
}

.bestShopCard_clothing-citypage:hover{
    border: 1px solid var(--clr-red);
}

.bestShopCard_clothing_cityPage-title{
    font-size: 24px;
    font-weight: var(--font-m);
    color: #000;
    margin-top: 10px;
}

.bestShop_clothing-citypage-D-wrapper{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    margin-inline: auto;
    width: fit-content;
    gap:32px;
}

.bestShopCard_clothing_cityPage-title+div{
    display: flex;
    align-items: center;
    margin-top: 15px;
    /* margin-inline: auto; */
}

.bestShopCard_clothing_cityPage-title+div>img{
    width: 15px;
    margin-right: 7px;
}

.bestShopCard_clothing_cityPage-title+div>img+p{
    color: rgba(0, 0, 0, 0.603);
}

@media (min-width:76.25em) {
    .bestShop_clothing-citypage-D-wrapper{
        flex-direction: row;
    }
}


/* shop Khoj recommended secion  */

.cityPage_extra-shopKhoj_title{
    margin-bottom: 0%;
}

.shopKhoj-recommed_sub{
    font-size: 12px;
    color: rgba(0, 0, 0, 0.597);
    text-align: center;
    margin-top: 12px;
    margin-bottom: 30px;
    width: 322px;
    margin-inline: auto;
}

@media (min-width:76.25em) {
    .shopKhoj-recommed_sub{
        font-size: 20px;
        width: 810px;
        margin-top: 25px;
        margin-bottom: 60px;
    }
}

/* Best Shops for Handicrafts */

.bestShop_handCard-cityPage{
    display: block;
    width: 296px;
    height: 350px;
    padding: 12px;
    background-color: #FFFFFF;
    border: 1px solid #E0E0E0;
    margin-inline: auto;
}

.bestShop_handCard-cityPage>div>img{
    width: 272px;
    height: 237px;
    border-radius: 10px;
}

.bestShop_handCard-cityPage:hover{
    border: 1px solid var(--clr-red);
}

.bestShop_handCard-cityPage+.bestShop_handCard-cityPage{
    margin-top: 20px;
}

.bestShop_handCard-cityPage>div{
    position: relative;
}

.bestShop_handCard-cityPage_title{
    color: #000;
    font-weight: var(--font-m);
    font-size: 18px;
    margin-top:10px;
}

.bestShop_handCard-cityPage_detail{
    display: flex;
    align-items: center;
    margin-top: 13px;

}


.bestShop_handCard-cityPage_detail>img{
    width: 12px;
    margin-right: 7px;
}

.bestShop_handCard-cityPage_detail>p{
    font-size: 15px;
    color: rgba(0, 0, 0, 0.6);
}

@media (min-width:76.25em) {
    .bestShop_hand-cityPage-wrapper{
        display: flex;
        justify-content: space-between;
    }

    .bestShop_handCard-cityPage+.bestShop_handCard-cityPage{
        margin-top: 0px;
    }

    .bestShop_hand_hidden-D{
        display: none;
    }
}

/* do you know city Page  */

.extra_my-citypage{
    margin-top: 50px;
    margin-bottom: 50px;
}


@media (min-width:76.25em) {
    .extra_my-citypage{
        margin-top: 100px;
        margin-bottom: 100px;
    }
}


.design_a_jew-cityPage{
    height: 447px;
}

.design_a_jew-cityPage + .design_a_jew-cityPage{
    margin-top: 20px;
}

.extra_mt-jewl_city{
    margin-top: 80px;
}

.hide_m{
    display: none;
}

@media (min-width:76.25em) {
    .hide_m{
        display: flex;
    }
}

/*-------------  Delhi City Page end here   ----------------*/


/*------------ Shop in City start here  ------------*/
.pagination{
    margin-top: 32px;
    margin-bottom: 108px;
}


.shopCard_wrapper-shopInCity{
    display: grid;
    gap: 16px;
}

@media (min-width:76.25em) {
    .pagination{
        margin-top: 100px;
    margin-bottom: 150px;
    }

    .shopCard_wrapper-shopInCity{
        grid-template-columns: 1fr 1fr 1fr;
        gap: 32px;
    }
}






.shopCard_shopInCity{
    width: 343px;
    height: 329px;
    margin-inline: auto;
    background-color: var(--clr-white);
    border: 1px solid #E0E0E0;
    border-radius: var(--border-r);
    display: block;
    flex: 0 0 auto;
}

.shopCard_shopInCity:hover{
    border: 1px solid var(--clr-red);
}


.shopCard_shopInCity-top{
    position: relative;
    height: 180px;
}

.shopCard_shopInCity_image{
    height: 180px;
    width: 100%;
    border-radius: 10px 10px 0 0;
}

.shopCard_shopInCity-detail{
    padding: 16px;
}

.shopCard_shopInCity-title{
    font-size: 20px;
    font-weight: var(--font-sb);
    color: var(--clr-red);
    line-height: 20px;
    text-transform: capitalize;
}

.shopCard_shopInCity-star{
    position: absolute;
    background-color: #EEEEEE;
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: none;
}

.shopCard_shopInCity-star:hover{
    background-color: var(--clr-mgray);
}

.shopCard_shopInCity-about{
    font-size: 13px;
    color: #828282;
    letter-spacing: 2%;
    line-height: 130%;
    margin-top: 12px;
}

.shopCard_shopInCity-contact{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    height: 14px;
}

.shopCard_shopInCity-num{
    display: flex;
    align-items: center;
}

.shopCard_shopInCity-num>img{
    width: 14px;
    margin-right: 4px;
}

.shopCard_shopInCity-num>p{
    font-size: 13px;
    font-weight: var(--font-m);
    color: #000;
}

.shopCard_shopInCity-time{
    display: flex;
    align-items: center;
}

.shopCard_shopInCity-time>img{
    width: 14px;
    margin-right: 4px;
}

.shopCard_shopInCity-time>p{
    font-size: 12px;
    color: #0DA537;
    font-weight: var(--font-m);
}



@media (min-width:76.25em) {
    .shopCard_shopInCity{
        width: 384px;
        height: 411px;
        margin-inline:0;
        border-radius: 15px;
        box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.099);
    }
    
    .shopCard_shopInCity_image{
        height: 223px;
        border-radius: 15px 15px 0 0;
    }

    .shopCard_shopInCity-top{
        height: 223px;
    }

    .shopCard_shopInCity-detail{
        padding: 18px;
    }

    .shopCard_shopInCity-title{
        font-size: 24px;
        line-height: 99.5%;
    }

    .shopCard_shopInCity-contact{
        height: 16px;
        margin-top: 25px;
    }

    .shopCard_shopInCity-num>p, .shopCard_shopInCity-time>p{
        font-size: 14px;
        line-height: 99.5%;
    }

    .shopCard_shopInCity-time>img{
        width: 16px;
        margin-right: 7px;
    }

    
    .shopCard_shopInCity-num>img{
        width: 15px;
        margin-right: 7px;
    }
}

.pageBtnArea{
    display: flex;
    margin-top: 24px;
    justify-content: center;
}

.numberBtn{
    display: flex;
}


.pageBtnArea-next, .pageBtnArea-perv,.numberBtn>a{
    width: 32px;
    height: 32px;
    background-color: transparent;
    border: 1px solid #D2D2D2;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.numberBtn>a>span{
    font-weight: var(--font-m);
    color: #949494;
}

.numberBtn>a+a{
    margin-left: 24px;
}



.pageBtnArea-perv{
    margin-right: 68px;
}
.pageBtnArea-next{
    margin-left: 68px;
}

.pageBtnArea-perv>img, .pageBtnArea-next>img{
    width: 6px;

}

.pageBtnArea-next:hover, .pageBtnArea-perv:hover,  .numberBtn>a:hover, .currentPage{
    background-color: #F4F4F4 !important;
}



@media (min-width:76.25em) {
    .pageBtnArea{
        margin-top: 60px;
    }

    .pageBtnArea-next, .pageBtnArea-perv,.numberBtn>a{
        width: 76px;
        height: 70px;
    }

    .pageBtnArea-perv>img, .pageBtnArea-next>img{
        width: 10px;
        height: 18px;
    
    }

    .numberBtn>a>span{
        font-size: 24px;
    }

    .numberBtn>a+a{
        margin-left: 25px;
    }

    .pageBtnArea-perv{
        margin-right: 25px;
    }
    .pageBtnArea-next{
        margin-left: 25px;
    }
}

.aboutDelhi_shop{
    background-color: #FAFAFA;
    margin-bottom: 50px;
    padding: 16px;
    
}

.aboutDelhi_shop>h2{
    font-size: 24px;
    color: var(--clr-red);
    font-weight: var(--font-b);
}

.aboutDelhi_shop>h3{
    margin-top: 24px;
    font-size: 22px;
    font-weight: var(--font-sb);
    color: #000;
}

.aboutDelhi_shop>p{
    font-size: 16px;
    color: #5E5E5E;
    letter-spacing: 3%;
    line-height: 176%;
    margin-top: 16px;
}

.aboutDelhi_shop>p>a{
    text-decoration: underline;
    color: #5E5E5E;
}

@media (min-width:76.25em) {
    .w_limit_shopDelhi{
        max-width: 616px;
    }

    .hide_D-shopsDlehi{
        display: none;
    }

    .aboutDelhi_shop{
        border-radius: 15px;
        max-width: 1216px;
        margin-inline: auto;
        margin-top: 150px;
        margin-bottom: 100px;
        padding: 80px 50px;
    }

    .aboutDelhi_shop>h2{
        font-size: 32px;
        font-weight: var(--font-sb);
    }

    .aboutDelhi_shop>h3{
        margin-top: 40px;
        font-size: 28px;
    }
}




/*------------ Shop in City end here  ------------*/

/*------------ Shop Page Start Here --------------*/
.shopDetail_container{
    background-color: #FAFAFA;
    padding-top: 30px;
    padding-bottom: 38px;
    width:375px;
    margin-inline:auto;
}

@media (min-width:76.25em) {
    .shopDetail_container{
        width: 100%;
        max-width: 1328px;
        margin-top: 80px;
        border-radius: 10px 0 0 10px;
        
    }

    .shopDetail_container-D{
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto auto;
        gap: 33px 45px;
    }
}

.shopName_catagory{
    font-size: 15px;
    color: #6B6B6B;
    line-height: 99.5%;
    text-transform: uppercase;
}

.shopName_title{
    text-align: left;
    font-size: 26px;
    line-height: 99.5%;
    color: #000;
    margin-top: 11px;
    text-transform: capitalize;
    font-weight: var(--font-r);
}

.shopName_speciality{
    color: var(--clr-red);
    font-size: 18px;
    line-height: 99.5%;
    margin-top: 6px;
    text-transform: capitalize;

}


.shopImage{
    width: 343px;
    height: 325px;
    margin-top: 20px;
    border-radius: 10px;
}

@media (min-width:76.25em) {
    .shopName{
        grid-column: 2/3;
    }

    .shopName_catagory{
        font-size: 20px;
    }

    .shopName_title{
        font-size: 34px;
        margin-top: 12px;
    }

    .shopName_speciality{
        font-size: 24px;
        margin-top: 25px;
    }

    .shopImage{
        width: 600px;
        height: 515px;
        margin-top: 0;
        grid-row: 1/3;
    }
}

.shopContactInfo{
    background-color: var(--clr-white);
    border-radius: 5px;
    padding: 24px 15px 30px;
    margin-top: 20px;
}



.shopContactInfo_link{
    display: flex;
    align-items: center;

}

.shopContactInfo_link>img{
    width: 16px;
    margin-right: 7px;
}

.shopContactInfo_link>a{
    color: #3044F4;
}

.shopContactInfo_link>a:hover{
    color: var(--clr-red);
}

.shopContactInfo_interset{
    font-weight: var(--font-l);
    color: #6B6B6B;
    margin-top: 21px;
    font-size: 14px;
    line-height: 99.5%;

}

.shopContactInfo_interset>span{
    font-size: 15px;
    font-weight: var(--font-m);
    margin-left: 7px;
}

.shopContactInfo_products{
    font-weight: var(--font-l);
    color: #6B6B6B;
    margin-top: 15px;
    font-size: 14px;
    line-height: 99.5%;
}

.shopContactInfo_products>span{
    font-size: 15px;
    font-weight: var(--font-m);
    margin-left: 7px;
}

.shopContactInfo_location{
    display: flex;
    align-items: flex-start;
    margin-top: 24px;
}

.shopContactInfo_location>img{
    width: 12px;
    margin-right: 10px;
}

.shopContactInfo_location>p,
.shopContactInfo_phone>p, 
.shopContactInfo_time>p,
.shopContactInfo_range>p{
    font-weight: var(--font-m);
    font-size: 15px;
    line-height: 99.5%;
    color: #6B6B6B;
    
}

.shopContactInfo_phone,
.shopContactInfo_time,
 .shopContactInfo_range{
    display: flex;
    align-items: center;
    margin-top: 18px;
}

.shopContactInfo_phone>img{
    width: 15px;
    margin-right: 9px;
}

.shopContactInfo_time>img{
    width: 16px;
    margin-right: 9px;
}

.shopContactInfo_range>img{
    width: 10px;
    margin-right: 11px;
}

@media (min-width:76.25em) {
    .shopContactInfo{
        grid-column: 2/3;
        grid-row: 2/3;
        margin-top:0 ;
        padding: 24px;
    }

    .shopContactInfo_link>img{
        width: 20px;
        margin-right: 15px;
    }
    
    .shopContactInfo_link>a{
        font-size: 20px;
    }

    .shopContactInfo_interset, .shopContactInfo_products{
        margin-top: 24px;
        font-size: 20px;
    
    }
    
    .shopContactInfo_interset>span,
    .shopContactInfo_products>span{
        font-size: 20px;
        margin-left: 11px;
    }
    
    .shopContactInfo_location>img{
        width: 18px;
        margin-right: 16px;
    }

    .shopContactInfo_location>p,
    .shopContactInfo_phone>p, 
    .shopContactInfo_time>p,
    .shopContactInfo_range>p{
        font-size: 20px;
    }
    .shopContactInfo_phone,
    .shopContactInfo_time,
    .shopContactInfo_range{
        margin-top: 25px;
    }


    .shopContactInfo_phone>img{
        width: 21px;
        margin-right: 14px;
    }
    
    .shopContactInfo_time>img{
        width: 22px;
        margin-right: 14px;
    }
    
    .shopContactInfo_range>img{
        width: 13px;
        margin-right: 19px;
    }
}

.shopDetail{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-top: 25px;
}



.shopDetail_heading{
    font-size: 16px;
    color: #000;
    line-height: 99.5%;
    font-weight: var(--font-m);
}

.shopDetail_info{
    font-size: 15px;
    color: #6B6B6B;
    line-height: 99.5%;
}



.days, .market{
    grid-column: 1/3;
}

.bus{
    grid-column: 1/4;
}

@media (min-width:76.25em) {
    .shopDetail{
        grid-column: 1/3;
        display: flex;
        justify-content: space-between;
    }
    
    .shopDetail_heading{
        font-size: 20px;
    }

    .shopDetail_info{
        font-size: 20px;
    }

    .days{
        width: 138px;
    }

    .landmark{
        width: 103px;
    }

    .market{
       width:  230px;
    }

    .parking{
        width: 141px;
    }

    .bus{
        width: 353px;
    }
}

.shopMap{
    background-color: var(--clr-white);
    width: 343px;
    height: 414px;
    border-radius: 10px;
    margin-top: 25px;
    padding: 10px 8px;
}

.shopMap>iframe{
    border-radius: var(--border-r);
}

@media (min-width:76.25em) {
    .shopMap{
        grid-column: 1/3;
        width: 100%;
        height: 418px;
        margin-top: 35px;
        padding: 12px 15px;
    }
}

.shopPlusPoint{
    margin-inline: auto;
    margin-top: 50px;
}

.shopPlusPoint_title{
    font-size: 24px;
    font-weight: var(--font-b);
    letter-spacing: 3%;color: var(--clr-red);
    text-align: left;
    margin-bottom: 20px;
}

.shopPlusPoint>p{
    color: #5E5E5E;
    line-height: 174%;
    letter-spacing: 3%;

}

.shopPlusPoint>p+p{
    margin-top: 19px;
}

.shopPageDivder{
    margin-top: 50px;
    border: 1px solid #EBEBEB;
}


@media (min-width:76.25em) {
    .shopPlusPoint{
        margin-top: 100px;
    }

    .shopPlusPoint_title{
        font-size: 32px;
        margin-bottom: 30px;
    }

    .shopPlusPoint>p{
        font-size: 20px;
    }

    .shopPlusPoint>p+p{
        margin-top: 20px;
    }

    .shopPageDivder{
        margin-top: 80px;
    }
}

.shopTags{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 25px;
}

.shopTags>a{
    padding: 14px 11px;
    font-size: 12px;
    color: var(--clr-red);
    background-color: var(--clr-white);
    border: 1px solid var(--clr-red);
    border-radius: 5px;
    display: inline-block;
}


.shopTags>a:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .shopTags{
        gap: 20px 26px;
    }

    .shopTags>a{
        font-size: 15px;
        padding: 17px 21px;
    }
}


.cardHorizontal_container>.shopCard_shopInCity+.shopCard_shopInCity{
    margin-left: 30px;
}


/*------------ Shop Page End Here --------------*/



/*----------- Markets in Delhi start here  -----------*/
.marketCard_marketInCity{
    width: 343px;
    height: 358px;
    border-radius: 15px;
    margin-inline: auto;
    box-shadow: 4px 0px 30px rgba(0, 0, 0, 0.105);
    flex: 0 0 auto;
}

.marketCard_marketInCity:hover{
    box-shadow: 4px 0px 30px rgba(0, 0, 0, 0.31);
}

.add_fav-market>svg{
    fill: var(--clr-red);
}

.mt_marketsPage{
    margin-top: 50px;
}

.marketCard_marketInCity-location{
    display: flex;
    align-items: flex-start;
    margin-top: 18px;
}

.marketCard_marketInCity-location>img{
    width: 12px;
    margin-right: 7px;
}

.marketCard_marketInCity-location>p{
    line-height: 99.5%;
    font-size: 12px;
    color: #6B6B6B;
    text-transform: capitalize;
    
}

@media (min-width:76.25em) {
    .marketCard_marketInCity{
        width: 384px;
        height: 411px;
        background-color: var(--clr-white);
    }

    .marketCard_marketInCity-location{
        margin-top: 16px;
    }


    .marketCard_marketInCity-location>p{
        font-size: 14px;

    }

    .mt_marketsPage{
        margin-top: 150px;
    }
}

.currentPage_section{
    color: var(--clr-red) !important;
}

.mapMargin_market{
    margin-top: 40px;
    margin-bottom: 40px;
}

.mapHeadin_marketPage{
    font-size: 16px !important;

}

/*----------- Markets in Delhi end here  -----------*/


/*------------ Market Detail Page start here-------------  */

.shopKhoj_marketDetailPage{
    margin-top: 50px;
}


.shopKhoj_marketDetailPage>h2{
    font-size: 25px;
    font-weight: var(--font-b);
    line-height: 99.5%;
    margin-bottom: 20px;
}




.shopPlusPoint_title-marketDetailPage{
    font-size: 24px;
    color: #000;
    font-weight: var(--font-b);
    margin-bottom: 6px;
}

.marketDetailInfo>p{
    font-size: 14px;
    line-height: 168.5%;
    color: #5E5E5E;
}

#extraText_marketDetailPage, #lessBtn_marketDetailPage{
    display: none;
}

#moreBtn_marketDetailPage, #lessBtn_marketDetailPage{
    color: var(--clr-red);
    text-decoration: underline;
    cursor: pointer;
}


.mt_marketDetailPage{
    margin-top: 40px;
}

.marketDetailPage_video{
    width: 100%;
    max-width: 716px;
    max-height: 386px;
    margin-inline: auto;
    display: block;
    margin-top: 50px;
    border-radius: 5px;
}

@media (min-width:76.25em) {
    .shopPlusPoint_title-marketDetailPage{
        font-size: 28px;
        font-weight: var(--font-sb);
        margin-bottom: 27px;
    }

    .shopKhoj_marketDetailPage{
        margin-top: 100px;
    }

    .shopKhoj_marketDetailPage>h2{
        margin-bottom: 60px;
        font-size: 32px;
    }

    .mt_marketDetailPage{
        margin-top: 125px;
    }

    .marketDetailInfo>p{
        font-size: 16px;
    }

    .marketDetailPage_video{
        margin-top: 150px;
    }
}

.padding_marketDetailPage{
    padding-top: 1rem;
    padding-bottom:1rem ;
}

.cardHorizontal_container>.marketCard_marketInCity+.marketCard_marketInCity{
    margin-left: 30px;
}

/*------------ Market Detail Page end here-------------  */


/*------------ Blog List Page start here --------------- */
.trendingBlog-section{
    margin-top: 50px;
}

.trendingBlog-wrapper{
    display: flex;
    overflow-x: scroll;
    gap: 16px;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
}

.trendingBlog-wrapper::-webkit-scrollbar{
    height: 0;
    width: 0;
}

.trendingBlogCard{
    display: block;
    width: 343px;
    height: 285px;
    overflow: hidden;
    position: relative;
    color: var(--clr-white);
    flex: 0 0 auto;
    scroll-snap-align: center;
}

.trendingBlogCard-img{
    width: 343px;
    height: 285px;
    object-fit: cover;
}

.trendingBlogCard-textArea{
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background-image: linear-gradient(to top, rgb(0, 0, 0),rgba(0, 0, 0, 0.424), rgba(0, 0, 0, 0));
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 16px;
}

.trendingBlogCard-top{
    display: flex;
}

.trendingBlogCard-trending{
    background-color: var(--clr-red);
    border-radius: 5px;
    font-size: 14px;
    font-weight: var(--font-b);
    padding: 8px;
    margin-right: 16px;
    text-transform: uppercase;
}

.trendingBlogCard-title{
    font-size: 20px;
    font-weight: var(--font-sb);
    margin-top: 12px;
}

.trendingBlogCard-view{
    display: flex;
    align-items: center;
}

.trendingBlogCard-view>img{
    width: 25px;
    height: 13px;
    margin-right: 6px;
}

.trendingBlogCard-view>p{
    font-size: 18px;
}

.blogSubmitBtn{
    font-size: 12px;
    font-weight: var(--font-sb);
    color: var(--clr-red);
    border: 1px solid var(--clr-red);
    border-radius: var(--border-r);
    padding: 17px 36px;
    line-height: 99.5%;
    display: block;
    margin-inline: auto;
    width: fit-content;
    margin-top: 40px;
    text-transform: capitalize;
}

.blogSubmitBtn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

.blogOptions_form{
    position: relative;
}


.sreachOption-blog{
    font-size: 14px;
    line-height: 99.5%;
    padding: 19px 16px;
    background-color: var(--clr-white);
    border: 1px solid #DFDFDF;
    border-radius: var(--border-r);
    width: 100%;
}

.sreachOption-blog::placeholder{
    color: #ADADAD;
    font-size: 14px;
    line-height: 99.5%;
}


.sreachOption-blog:focus-visible{
    outline: 1px solid var(--clr-red);
}

.sreachOption_label-blog{
    border: none;
    fill: #000;
    cursor: pointer;
    background-color: var(--clr-white);
    position: absolute;
    top: 0;
    right: 0;
    padding: 19px 15px 19px 0;
    background-color: transparent;
}

.blogOptions{
    margin-top: 25px;
}

.filterPageLink_group{
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    margin-top: 30px;
}

.filterPageLink{
    appearance: none;
}

.filterPageLink+label{
    font-size: 24px;
    color: #9C9C9C;
    font-weight: var(--font-m);
    text-transform: capitalize;
    line-height: 99.5%;
    cursor: pointer;
}



.filterPageLink+label:hover, .filterPageLink:checked+label{
    color: var(--clr-red);
}

.currentPageFilter{
    color: var(--clr-red);
}

.blogOptionDivider{
    border-radius: var(--border-r);
    border: 1px solid #DFDFDF;
    display: none;
}

.blogListWrapper{
    margin-top: 30px;
    display: grid;
    gap: 20px;
}

.blogPostCard_blogList{
   padding: 8px;
   background-color: var(--clr-white);
   border: 1px solid #E2E2E2;
   width: 343px;
   height: 578px;
   display: block;
   border-radius: var(--border-r);
   margin-inline: auto;
}

.blogPostCard_blogList:hover{
    border: 1px solid var(--clr-red);
}

.blogPostCard_blogList-img{
    width: 325px;
    height: 341px;
    object-fit: cover;
    border-radius: var(--border-r);
}

.blogPostCard_blogList-title{
    font-size: 20px;
    text-transform: uppercase;
    color: #000;
    font-weight: var(--font-m);
    margin-top: 15px;
}

.blogPostCard_blogList-desp{
    color: #5E5E5E;
    margin-top: 6px;
}

.blogPostCard-detail_blogList{
    display: flex;
    align-items: center;
    margin-top: 16px;
}

.blogPostCard-detail_blogList-date,
.blogPostCard-detail_blogList-aurthor,
.blogPostCard-detail_blogList-view{
    display: flex;
    align-items: center;
}

.blogPostCard-detail_blogList-aurthor{
    margin-left: 15px;
}

.blogPostCard-detail_blogList-view{
    margin-left: auto;
}

.blogPostCard-detail_blogList-date>img{
    width: 12px;
    margin-right: 5px;
}

.blogPostCard-detail_blogList-aurthor>img{
    width: 11px;
    margin-right: 5px;
}

.blogPostCard-detail_blogList-view>img{
    width: 15px;
    margin-right: 5px;
}

.blogPostCard-detail_blogList-date>p{
    font-size: 12px;
    line-height: 99.5%;
    color: #6B6B6B;
}

.blogPostCard-detail_blogList-aurthor>p{
    font-size: 12px;
    line-height: 99.5%;
    color: var(--clr-red);
}

.blogPostCard-detail_blogList-view>p{
    font-size: 10px;
    color: #535353;
    line-height: 99.5%;
}

.filterPageLink_group>a{
    display: inline-block;
    font-size: 24px;
    font-weight: var(--font-m);
    color: #9C9C9C;
    text-transform: capitalize;
}

.filterPageLink_group>a:hover{
    color: var(--clr-red);
}

.filterPageLink_group>a.current{
    color: var(--clr-red);
}

@media (min-width:76.25em) {
    .trendingBlog-section{
        margin-top: 100px;
    }


    .trendingBlogCard{
        width: 800px;
        height: 285px;

    }

    .trendingBlogCard-img{
        width: 800px;
        height: 285px;
    }

    .trendingBlogCard-textArea{
        padding: 40px;
    }

    .trendingBlogCard-trending{
        padding: 10px 16px;
        font-size: 16px;
        font-weight: var(--font-r);
        margin-right: 24px;
    }

    .trendingBlogCard-title{
        font-size: 28px;
    }

    .blogSubmitBtn{
        font-size: 16px;
        padding: 25px 70px;
        display: block;
        margin:0%;
        margin-left: auto;
        margin-top: 25px;
    }

    .blogOptions{
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
    }

    .blogOptions>form{
        width: 283px;
        margin-left: auto;
    }

    .filterPageLink_group{
        margin-top: 0;
    }

   

    .blogOptionDivider{
        display: block;
        margin-top: 20px;
    }

    .blogListWrapper{
        margin-top: 50px;
        grid-template-columns: 1fr 1fr;
        gap: 52px 32px;
        margin-bottom: 100px;

    }

    .blogPostCard_blogList{
        padding: 21px;
        width: 592px;
        height: 636px;
        margin-inline: 0;
     }

     .blogPostCard_blogList-img{
        width: 548px;
        height: 341px;
        object-fit: cover;
        border-radius: var(--border-r);
    }

    .blogPostCard-detail_blogList{
        margin-top: 23px;
    }

    .blogPostCard-detail_blogList-aurthor{
        margin-left: 28px;
    }

    .blogPostCard-detail_blogList-date>img{
        width: 18px;
        margin-right: 8px;
    }
    
    .blogPostCard-detail_blogList-aurthor>img{
        width: 17px;
        margin-right: 9px;
    }
    
    .blogPostCard-detail_blogList-view>img{
        width: 24px;
        margin-right: 7px;
    }

    .blogPostCard-detail_blogList-date>p,
    .blogPostCard-detail_blogList-aurthor>p,
    .blogPostCard-detail_blogList-view>p{
        font-size: 18px;
    }

    .blogPostCard_blogList-title{
        font-size: 28px;
        margin-top: 25px;
    }

    .blogPostCard_blogList-desp{
        font-size: 18px;
        margin-top: 8px;
    }
  
}

/*------------ Blog List Page end here --------------- */

/*------------ Blog Detail Page start here ------------*/

.blogContent{
    margin-top: 50px;
    margin-bottom: 50px;
}

.tagList{
    overflow-x: scroll;
    display: flex;
    gap: 8px;
}

.tagList::-webkit-scrollbar{
    width: 0;
    height: 0;
}

.tagListLink{
    padding: 9px 16px;
    color: var(--clr-white);
    background-color: #000;
    font-size: 14px;
    line-height: 99.5%;
    display: inline-block;
    border-radius: 5px;
    text-transform: capitalize;
    font-weight: var(--font-r);
}

.tagListLink:hover{
    background-color: var(--clr-red);
}

.blogTitle_blogDetailPage{
    font-size: 20px;
    font-weight: var(--font-m);
    color: #000;
    text-align: left;
    text-transform: uppercase;
    margin-top: 25px;
    line-height: 99.5%;
}


.blogInfo_comment{
    align-items: center;
    margin-left: auto;
}

.blogInfo_comment>img{
    width: 22px;
    margin-right: 8px;
}

.blogInfo_comment>p{
    font-size: 16px;
    font-weight: var(--font-m);
    color: #535353;
    line-height: 99.5%;
    text-transform: uppercase;
}

.comment_d{
    display: none;
}

.comment_m{
    display: flex;
    margin-top: 30px;
}

@media (min-width:76.25em) {
    .blogContent{
        margin-top: 100px;
        margin-bottom: 100px;
        display: flex;
        gap: 8px;
        align-items: flex-start;

    }

    .blogTitle_blogDetailPage{
        font-size: 25px;
        margin-top: 20px;
    }

    .blogInfo{
        display: flex;
        align-items: center;
        margin-top: 32px;
    }

    .blogInfo>.blogPostCard-detail_blogList{
        margin-top: 0%;
    }

    .blogInfo>.blogPostCard-detail_blogList>.blogPostCard-detail_blogList-view{
        margin-left: 28px;
    }

    .comment_d{
        display: flex;
    }

    .comment_m{
        display: none;
    }
    
}

.blogTextArea>img{
    width: 100%;
    height: 308px;
    border-radius: var(--border-r);
    object-fit: cover;
    margin-top: 16px;
    margin-inline: auto;
    display: block;
}

.blogTextArea>p{
    font-size: 16px;
    line-height: 169%;
    letter-spacing: 3%;
    color: #5E5E5E;
    margin-top: 16px;
}

.blogTextArea>p>a{
    text-decoration: underline;
    color: #5E5E5E;
    font-size: 16px;
    line-height: 169%;
    letter-spacing: 3%;
}

.blogTextArea>h3{
    color: #000;
    line-height: 169%;
    font-weight: var(--font-sb);
    font-size: 22px;
    margin-top: 24px;
}

.blogTextArea>q{
    background-color: #FFF6F6;
    border-radius: var(--border-r);
    padding: 16px;
    font-size: 20px;
    font-style: italic;
    line-height: 169%;
    letter-spacing: 3%;
    margin-top: 16px;
    display: block;
    quotes: none;
}

.blogTextArea-heading_one, .blogTextArea>h2{
    font-size: 24px;
    font-weight: var(--font-b);
    letter-spacing: 3%;
    color: var(--clr-red);
    margin-top: 32px;
}

.blogTextArea>h2+p{
    font-size: 16px;
    line-height: 169%;
    color: #000;
    margin-top: 8px;
}

.bestKnowList_blog{
    font-size: 18px;
    font-weight: var(--font-m);
    color: #000;
    margin-top: 16px;
}

@media (min-width:76.25em) {
    .blogTextArea>img{
        margin-top: 30px;
        margin-inline: auto;
    }

    .blogTextArea>p{
        margin-top: 25px;
    }

    .blogTextArea>h3{
        margin-top: 35px;
    }

    .blogTextArea>q{
        padding: 52px 24px 52px 43px;
    }

    .blogTextArea-heading_one, .blogTextArea>h2{
        font-size: 28px;
        margin-top: 50px;
    }

    .bestKnowList_blog{
        margin-top: 20px;
        line-height: 120%;
    
    }

}

.sideReadBlock{
    width: 343px;
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: #FAFAFA;
    border-radius: var(--border-r);
    margin-inline: auto;
}

.sideReadBlock>h4{
    font-size: 22px;
    line-height: 99.5%;
    color: rgba(0, 0, 0, 0.601);
    text-transform: uppercase;
    font-weight: var(--font-m);
    margin-bottom: 20px;
    padding-inline: 16px;
}

.sideReadBlock_divider{
    border: 1px solid #E1E1E1;
}

.readMore-link{
    padding-top: 30px;
    padding-bottom: 20px;
    font-size: 18px;
    color: #636363;
    line-height: 99.5%;
    display: flex;
    justify-content: space-between;
    padding-inline: 16px;


}

.readMore-link:hover{
    color:var(--clr-red);
}

.sideBarRecentBlog{
    display: flex;
    padding-inline: 16px;
    gap: 16px;
    margin-top: 24px;
}

.sideBarRecentBlog-img{
    width: 80px;
    height: 80px;
    border-radius: 5px;
}

.sideBarRecentBlog-info{
    display: flex;
    justify-content: space-between;
}

.sideBarRecentBlog-info_date{
    font-size: 14px;
    line-height: 99.5%;
    color: #6B6B6B;
}

.sideBarRecentBlog-info_aurthor{
    font-size: 12px;
    line-height: 99.5%;
    color: var(--clr-red);
}

.sideBarRecentBlog-title{
    font-size: 16px;
    line-height: 160%;
    font-weight: var(--font-m);
    color: #000;
}

.sideBarRecentBlog:hover{
    outline: 1px solid var(--clr-red);
}

.sideBarRecentBlog-detail{
    display: flex;
    flex-direction: column;
    width: 100%;
}

.sideReadBlock+ .sideReadBlock{
    margin-top: 16px;
}

.mt_blogDetailPage{
    margin-top: 43px;
}

.sideBar_ad{
    width: 100%;
    max-width: 343px;
    height: 338px;
    border-radius: var(--border-r);
    margin-inline: auto;
    text-align: center;
    margin-top: 25px;
}

.sideBar_ad>img{
    width: 100%;
    max-width: 343px;
}

.blogSubmitBtn_blogDetail{
    width: 343px;
    padding: 24px;
    background-color: #FAFAFA;
    margin-inline: auto;
    border-radius: var(--border-r);
    margin-top: 44px;
}

.blogSubmitBtn_blogDetail>a{
    padding: 24px 88px;
    margin-inline: auto;
    border: 1px solid var(--clr-red);
    color: var(--clr-red);
    font-weight: var(--font-sb);
    text-transform: capitalize;
    display: block;
    border-radius: var(--border-r);
}

.blogSubmitBtn_blogDetail>a:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .blogSideBar_blogDetailPage{
        width: 384px;
        display: flex;
        flex-direction: column;
        gap: 32px;
    }

    .sideReadBlock{
        width: 384px;
        height: fit-content;
        padding-bottom: 53px;
        margin-inline: 0;
        order: 2;
    }

    .sideReadBlock+ .sideReadBlock{
        margin-top: 0px;
    }

    .blogSubmitBtn_blogDetail{
        width: 384px;
        padding: 43px 25px;
        background-color: #FAFAFA;
        margin-inline: auto;
        border-radius: var(--border-r);
        margin-top:0px ;
        order: 4;
    }

    .sideBarRecentBlog{
        padding-inline: 20px;
        gap: 13px;
        margin-top: 20px;
    }

    .sideBarRecentBlog-img{
        width: 126px;
        height: 100px;
        border-radius: 5px;
    }

    .sideBarRecentBlog-title{
        font-size: 18px;
    }

    .sideBarRecentBlog-detail{
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .blogSubmitBtn_blogDetail>a{
        padding: 25px 100px;
    }

    .sideBar_ad{
        width: 384px;
        height: 369px;
        margin-top: 0;
        order: 5;
    }

    
    .mt_blogDetailPage{
        margin-top: 0px;
    }

    .sreach-wrapper{
        background-color: #FAFAFA;
        padding: 40px 25px;
        order: 1;
    }

}


/*------------ Blog Detail Page end here ------------*/

/*------------ Contact Us Page Start Here---------  */

.contactContent{
    margin-top: 152px;
}

.contactForm{
    width: 375px;
    margin-inline: auto;
    background-color: #FAFBFB;
    position: relative;

}

.form_contactUs{
    padding-top: 125px;
    display: flex;
    flex-direction: column;
    margin-inline: auto;
    padding-bottom: 47px;

}

.contactForm-img{
    width: 343px;
    height: 207px;
    margin-inline: auto;
    display: block;
    object-fit: cover;
    object-position: top center;
    margin-top: -102px;
    position: absolute;
    left: 16px;
}

.contactForm-heading{
    font-size: 40px;
    color: #27252A;
    text-transform: capitalize;
    font-weight: var(--font-r);
    text-align: left;
    padding-left: 20px;
}

.contactForm-input{
    border: none;
    width: 333px;
    font-size: 14px;
    text-transform: capitalize;
    padding-bottom: 14px;
    border-bottom: 1px solid #A09DA8;
    margin-top: 25px;
    background-color: transparent;
    margin-inline: auto;
}

.contactForm-input::placeholder{
    font-size: 14px;
    color: #A09DA8;
    text-transform: capitalize;

}

.contactForm-input:focus-visible{
    outline: none;
    border-bottom: 1px solid var(--clr-red);
}

.contactForm-input+ .contactForm-input{
    margin-top: 30px;
}

.contactForm-textArea{
    resize: none;
}

.form_contactUs-submit{
    font-size: 15px;
    font-weight: var(--font-sb);
    letter-spacing: 2%;
    line-height: 99.5%;
    color: var(--clr-red);
    border: 1px solid var(--clr-red);
    width: fit-content;
    margin-inline: auto;
    padding: 24px 85px;
    background-color: transparent;
    border-radius: 15px;
    margin-top: 40px;
    text-transform: capitalize;
    cursor: pointer;
}

.form_contactUs-submit:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

@media (min-width:76.25em) {
    .contactContent{
        margin-top: 100px;
    }

    .contactForm{
        width: 1181px;
        margin-right: 0;
        background-color: #FAFBFB;
        display: flex;
    }

    .form_contactUs{
        padding-top: 100px;
        padding-bottom: 131px;
        padding-left: 118px;
    }

    .contactForm-img{
        width: 556px;
        height: 633px;
        margin-inline: 0;
        margin-top: 0px;
        left: -256px;
        top: 91px;
    }

    .contactForm-heading{
        font-size: 60px;
        padding-left: 00px;
    }

    .contactForm-input{
        width: 548px;
        font-size: 16px;
        padding-bottom: 20px;
        margin-top: 42px;
        margin-inline: 0;
    }

    .contactForm-input::placeholder{
        font-size: 16px;
    }

    .contactForm-input+ .contactForm-input{
        margin-top: 53px;
    }

    .form_contactUs-submit{
        font-size: 16px;
        margin-left: 0;
        padding: 29px 83px;
        margin-top: 60px;
    }
}

.contactInfo{
    margin-top: 40px;
}

.contactInfo-group{
    display: flex;
    align-items: flex-start;
    width: 336px;
    margin-inline: auto;
}

.contactInfo-group+.contactInfo-group{
    margin-top: 33px;
}

.contactInfo-img{
    width: 29px;
    margin-top: 9px;
    margin-right: 20px;
}

.contactInfo-title{
    font-size: 20px;
    font-weight: var(--font-sb);
    color: #000;
    text-transform: capitalize;
    line-height: 186%;
}

.contactInfo-des{
    color: #27252A;
    line-height: 172.5%;
}

.contactMap{
    width: 100%;
    height: 142px;
    margin-top: 50px;
}

@media (min-width:76.25em) {
    .contactInfo{
        margin-top: 80px;
        display: flex;
        justify-content: flex-end;
        gap: 145px;
    }
    .contactInfo-group{
        display: flex;
        align-items: flex-start;
        width: fit-content;
        margin-inline: auto;

    }

    .contactInfo-group{
        width: 336px;
        margin: 0;
    }

    .contactInfo-group+.contactInfo-group{
        margin: 0;
        width: fit-content;
    }

    .contactMap{
        margin-top: 80px;
        height: 396px;
    }
}

/*------------ Contact Us Page End Here---------  */


/*------------ FAQ section and page start here---------  */
.FAQ_section{
    margin-top: 50px;
    margin-bottom: 50px;
}

.faq{
    background-color: #FCFCFC;
    padding: 20px 16px;
    border-radius: 5px;
}

.faq+.faq{
    margin-top: 20px;
}

.faq>summary{
    font-size: 14px;
    font-weight: var(--font-sb);
    line-height: 150%;
    color: #27252A;
    cursor: pointer;
    list-style: none;
    position: relative;
    padding-right: 110px;
}

.faq>summary::before{
    content: '';
    position: absolute;
    background-color: var(--clr-red);
    width: 12px;
    height: 2px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    border-radius: 50px;
}

.faq>summary::after{
    content: '';
    position: absolute;
    background-color: var(--clr-red);
    border-radius: 50px;
    width: 12px;
    height: 2px;
    top: 50%;
    right: 0;
    transform: translateY(-50%) rotate(90deg);
    transition: all 0.125s ease-in-out;
}

.faq[open]>summary::after{
    transform: translateY(-50%) rotate(0deg);
}

.faq>p{
    font-size: 13px;
    line-height: 166.5%;
    letter-spacing: 2%;
    color: #A09DA8;
    margin-top: 8px;
}

@media (min-width:76.25em) {
    .FAQ_section{
        margin-top: 100px;
        margin-bottom: 150px;
    } 

    .faq{
        padding: 50px 30px;
    }

    .faq+.faq{
        margin-top: 26px;
    }

    .faq>summary{
        font-size: 20px;
        padding-right: 254px;
    }

    .faq>summary::before{
        width: 21px;
        height: 3px;
    }

    .faq>summary::after{
        width: 21px;
        height: 3px;
    }

    .faq>p{
        font-size: 18px;
        line-height: 186.5%;
        letter-spacing: 5%;
        margin-top: 26px;
    }
}


/*------------ FAQ section and page end here---------  */

/* ---------------About start here----------- */
.about_first{
    margin-top: 50px;
    display: grid;
    gap: 30px;
}

.aboutPage-heading_two{
    font-weight: var(--font-m);
    font-size: 18px;
    color: #000;
}

.aboutPage-img_one{
    width: 343px;
    height: 246px;
    display: block;
    margin-inline: auto;
    border-radius: var(--border-r);
}

.about_first-p{
    color: #696969;
}

.about_first-p>a{
    color: var(--clr-red);
}

@media (min-width:76.25em) {
    .about_first{
        margin-top: 100px;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto;
        gap: 50px 58px;
    }

    .aboutPage-img_one{
        width: 488px;
        height: 482px;
        display: block;
        margin-inline: auto;
        border-radius: var(--border-r);
        grid-column: 1/2;
        grid-row: 1/3;
    }

    .aboutPage-heading_two{
        font-size: 36px;
        grid-column: 2/3;
        grid-row: 1/2;
        padding-top: 40px;
        line-height: 125%;
    }

    .about_first-p{
        font-size: 24px;
        /* padding-bottom: 48px; */
    }
}


.about_sec{
    margin-top: 20px;
}

.about_sec-heading{
    font-size: 22px;
    font-weight: var(--font-sb);
    font-style: italic;
    line-height: 150%;
    color: #000;
}

.about_sec-img{
    width: 343px;
    height: 246px;
    margin-inline: auto;
    display: block;
    margin-top: 30px;
}

.about_sec-p{
    font-size: 13px;
    line-height: 156%;
    letter-spacing: 3%;
    color: #454545;
    margin-top: 20px;
}

@media (min-width:76.25em) {
    .about_sec{
        margin-top: 150px;
        display: grid;
        grid-template-columns: auto auto;
        grid-template-rows: auto auto;
        gap: 32px;
    }

    .about_sec-heading{
        font-size: 40px;
        grid-column: 1/2;
        grid-row: 1/2;
    }

    .about_sec-img{
        width: 591px;
        height: 641px;
        margin: 0;
        grid-column: 2/3;
        grid-row: 1/3;
    }

    .about_sec-p{
        font-size: 18px;
    }
}

.about_third{
    margin-top: 50px;
    background-color: #FFF3F3;
    padding-top: 30px;
    padding-bottom: 30px;
}

.about_third-heading{
    font-size: 30px;
    color: #000;
    font-weight: var(--font-sb);
    font-style: italic;
    text-align: left;
    line-height: 99.5%;
}

.about_third>.container>p{
    font-size: 13px;
    color: #454545;
    line-height: 156%;
    letter-spacing: 3%;
    margin-top: 14px;
}

.about_card-wrapper{
    margin-top: 30px;
}

.about_third>.container>p>span{
    color: var(--clr-red);
    font-weight: var(--font-sb);
}

.about_third>.container>p>span>a{
    color: var(--clr-red);
    text-decoration: underline;
}

.about_card{
    display: block;
}

.about_card:hover{
    outline: 1px solid var(--clr-red);
}

.about_card+.about_card{
    margin-top: 15px;
}

.about_card-img{
    width: 343px;
    height: 223px;
    object-fit: cover;
    border-radius: var(--border-r);
    display: block;
    margin-inline: auto;
}

.about_card-h{
    font-size: 20px;
    font-weight: var(--font-sb);
    line-height: 99.5%;
    color: var(--clr-red);
    text-align: center;
    margin-top: 23px;
}

.about_card-p{
    font-size: 13px;
    line-height: 120%;
    letter-spacing: 3%;
    color: #717171;
    margin-top: 9px;
    text-align: center;
}

@media (min-width:76.25em) {
    .about_third{
        margin-top: 150px;
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .about_third-heading{
        font-size: 56px;
    }

    .about_third>.container>p{
        font-size: 18px;
        margin-top: 50px;
    }

    .about_third>.container>p+.about_third>.container>p{
        margin-top: 40px;
    }

    .about_card-wrapper{
        margin-top: 60px;
        display: flex;
        justify-content: space-between;
    }

    .about_card{
        width: 387px;
    }

    .about_card+.about_card{
        margin-top: 0px;
    }

    .about_card-img{
        width: 383px;
        height: 223px;
    }

    .about_card-h{
        font-size: 24px;
        margin-top: 20px;
    }

    .about_card-p{
        font-size: 16px;
        margin-top: 14px;
    }
    
}

.about_founder{
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #F8F8F8;
    font-size: 21px;
    font-weight: var(--font-m);
    line-height: 99.5%;
    text-align: center;
    width: 100%;
    margin-top: 40px;
    color: #000;
    display: flex;
    justify-content: center;
    align-items: center;

}

#ceo, #advisor{
    appearance: none;
}

#ceo+label, #advisor+label{
    cursor: pointer;
    color: #000;
}

#ceo:checked+label, #advisor:checked+label{
    color: var(--clr-red);

}

#advisorContainer{
    display: none;
}

.staffDiveder{
    background-color: #CCCFD7;
    width: 2px;
    height: 35px;
    margin-inline: 50px;
}

.about_founder>.red{
    color: var(--clr-red);
}

.about_founder>.black{
    color: #000;
}

.founder_card{
    margin-bottom: 50px;
}

.founder_card-img{
    width: 343px;
    height: 244px;
    display: block;
    margin-inline: auto;
    border-radius: var(--border-r);
    margin-top: 20px;
    object-fit: cover;
}

.founder_card-text{
    text-align: center;
    margin-top: 20px;
}

.founder_card-text_name{
    font-size: 22px;
    font-weight: var(--font-sb);
    font-style: italic;
    line-height: 150%;
    color: #000;
}

.founder_card-text_about{
    font-size: 13px;
    line-height: 156%;
    letter-spacing: 3%;
    color: #454545;
    margin-top: 4px;
}

@media (min-width:76.25em) {
    .about_founder{
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 34px;
        margin-top: 150px;
    }

    .founder_card{
        margin-top: 40px;
        display: flex;
        gap: 32px;
        align-items: center;
        margin-bottom: 180px;
    }

    .founder_card-img{
        width: 592px;
        height: 387px;
        margin-inline: 0;
        border-radius: 0;
        margin-top: 0;
    }

    .founder_card-text{
        text-align: left;
        margin-top: 0;
    }

    .founder_card-text_name{
        font-size: 40px;
    }

    .founder_card-text_about{
        font-size: 18px;
        margin-top: 24px;
    }
}
/* ---------------About end here----------- */



/*-------- Online Shop Page Start Here -------- */
.onlineShop_section{
    margin-top: 50px;
}

.onlineShop_heading{
    font-size: 24px;
    font-weight: var(--font-b);
    color: #000;
    line-height: 107%;
    text-transform: uppercase;
}

.onlineShop_p{
    font-size: 15px;
    line-height: 109%;
    color: rgba(0, 0, 0, 0.604);
    letter-spacing: 3%;
    margin-top: 10px;
}

@media (min-width:76.25em) {
    .onlineShop_section{
        margin-top: 100px;
    }

    .onlineShop_heading{
        font-size: 42px;
        line-height: 99.5%;
    }

    .onlineShop_p{
        font-size: 20px;
        line-height: 99.5%;
        margin-top: 30px;
        max-width: 810px;
    }
}

.onlineShop-Card_title{
    font-size: 24px;
    font-weight: var(--font-sb);
    line-height: 99.5%;
    color: #000;
    margin-top: 20px;
}


.onlineShop_card-wrapper_one, .onlineShop_card-wrapper{
    display: grid;
    margin-top: 30px;
}

.mb_onlineShop{
    margin-bottom: 50px;
}

.aboutDelhi_shop> .onlineShop_cta{
    margin-top: 24px;
    font-size: 20px;
    font-weight: var(--font-m);
    line-height: 174%;
    letter-spacing: 3%;
    color: #000;
}


@media (min-width:76.25em) {
    .onlineShop_card-wrapper_one{
        gap: 20px 10px;
        margin-top: 60px;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: auto auto;
    }

    .onlineShop_card-wrapper{
        display: grid;
        margin-top: 60px;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 10px;
    }

    .mb_onlineShop{
        margin-bottom: 150px;
    }

    .aboutDelhi_shop> .onlineShop_cta{
        margin-top: 40px;
    }
    
}




/*-------- Online Shop Page End Here -------- */


/*-------- western wear page start here --------- */
.null_mt{
    margin-top: 0;
}
/*-------- western wear page end here --------- */

/*---------- video page start here  ------------*/
.aboutDelhi_shop>p>span{
    font-weight: var(--font-sb);
    color: #000;
    letter-spacing: 3%;
}

.aboutDelhi_shop>a{
    color: var(--clr-red);
    font-weight: var(--font-sb);
    line-height: 169%;
    font-size: 28px;
    text-decoration: underline;
    margin-top: 20px;
    display: block;
}

.aboutDelhi_shop> .aboutDelhi_section-bye{
    font-size: 14px;
    font-weight: var(--font-m);
    line-height: 169%;
    color: #000;
    margin-top: 21px;
}

@media (min-width:76.25em) {
    .aboutDelhi_shop> .aboutDelhi_section-bye{
        font-size: 18px;
    }   
}

.intro_video{
    margin-top: 50px;
}

.intro_video>h1{
    font-size: 24px;
    font-weight: var(--font-b);
    line-height: 107%;
    color: #000;
    text-align: left;
}

.intro_video>p{
    font-size: 15px;
    color: rgba(0, 0, 0, 0.601);
    line-height: 109%;
    letter-spacing: 3%;
    margin-top: 11px;
}

@media (min-width:76.25em) {
    .intro_video{
        margin-top: 164px;
    }

    .intro_video>h1{
        font-size: 30px;
        line-height: 99.5%;
    }

    .intro_video>p{
        font-size: 16px;
        line-height: 161%;
        margin-top: 20px;
    }
}


.latest{
    margin-top: 40px;

}

.latest>h2{
    color: rgba(0, 0, 0, 0.601);
    font-size: 18px;
    line-height: 99.5%;
    font-weight: var(--font-m);
    text-transform: uppercase;
}

.latest>hr{
    border: 1px solid #E1E1E1;
    margin-top: 15px;
}

@media (min-width:76.25em) {
    .latest{
        margin-top: 64px;
    
    }
    
    .latest>h2{
        font-size: 22px;
    } 
}

.latest_video-container{
    width: 343px;
    height: 193px;
    position: relative;
    margin-inline: auto;
    border-radius: 5px;
    overflow: hidden;
    margin-top: 20px;
}

.latest_video-container>img{
    width: 100%;
    height: 100%;
}

.videoPlayContainer{
    position: fixed;
    top: 0%;
    left: 0;
    z-index: 999;
    background-color: rgba(0, 0, 0, 0.755);
    width: 100vw;
    height: 100vh;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    display: none;
}

.videoPlayContainer>.menuClose{
    justify-self: flex-end;
}

.videoPlayContainer>iframe{
    width: 100%;
    max-width: 600px;
}

.latest_video-container>div{
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.773), rgba(0, 0, 0, 0));
    display: flex;
    align-items: flex-end;
    flex-direction: column-reverse;
}

.latest_video-container>div>p{
    color: var(--clr-white);
    line-height: 99.5%;
    font-weight: var(--font-r);
    padding: 14px;
}

.playBtn{
    width: 44px;
    height: 44px;
    background-color: var(--clr-white);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.playBtn:hover{
    background-color: rgb(238, 228, 228);
}

.playBtn>svg{
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
}

.all_video{
    margin-top: 50px;
    margin-bottom: 40px;
}


@media (min-width:76.25em) {
    .latest_videoWrapper{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 32px;
        margin-top: 30px;
    }

    .latest_video-container{
        width: 280px;
        margin: 0;
    }
     
    .all_video{
        margin-top: 80px;
        margin-bottom: 150px;
    }

    .allvideo_wrapper{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 32px;
        margin-top: 40px;
    }
    
}


/*---------- video page End here  -----------*/

/*------- product List Page start here ------- */
.section_products{
    margin-top: 50px;
    margin-bottom: 50px;
}

.section_products>h2{
    font-size: 25px;
    line-height: 99.5%;
    font-weight: var(--font-b);
    color: #000;
    text-transform: uppercase;
}

.section_clothing-wrapper{
    display: grid;
    grid-template-columns: 166px 166px;
    grid-template-rows: 160px 160px 160px;
    gap: 20px 11px;
    margin-top: 20px;
    margin-bottom: 30px;
    margin-inline: auto;
    width: fit-content;
}

.section_product-btn{
    display: block;
    font-weight: var(--font-sb);
    color: var(--clr-red);
    background-color: var(--clr-white);
    border: 1px solid var(--clr-red);
    border-radius: 10px;
    width: fit-content;
    padding: 20px 59px;
    margin-inline: auto;
}

.section_product-btn>span{
    display: none;
}

.section_product-btn:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

.clothing_section-card{
    width: 100%;
    height: 100%;
    border-radius: 15px;
    display: block;
    overflow: hidden;
    position: relative;
    margin-inline: auto;
}

.clothing_section-card>img{
    width: 100%;
    height: 100%;
    border-radius: 15px;
}
.clothing_section-card>p{
    position: absolute;
    bottom: 0%;
    left: 0%;
    border-radius: 0 0 15px 15px ;
    font-size: 13px;
    font-weight: var(--font-sb);
    color: var(--clr-white);
    background-image: linear-gradient(to top, rgb(0, 0, 0) ,rgba(0, 0, 0, 0));
    width: 100%;
    padding: 25px 0 18px 14px;
    text-transform: capitalize;
}

.clothing_section-card:hover>p{
    color: var(--clr-red);
    background-image: none;
    background: #ffffffa8;
}

@media (min-width:76.25em) {
    .section_products{
        margin-top: 113px;
        margin-bottom: 113px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        gap: 40px;
    }

    .section_products>h2{
        font-size: 48px;
        align-self: center;
    }

    .section_product-btn{
        border-radius: 15px;
        padding: 29px 48px;
        margin-inline: 0;
        letter-spacing: 2%;
        margin-left: auto;
    }

    .section_clothing-wrapper{
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 332px 332px;
        gap: 32px;
        margin: 0;
        grid-row: 2/3;
        grid-column: 1/3;
    }

    .section_product-btn>span{
        display: inline;
    }

    .clothing_section-card{
        display: block;
    }

    .clothing_section-card>p{
        font-size: 34px;
        padding: 57px 0 40px 40px;
        line-height: 99.5%;
    }

}



.section_jewellery-wrapper{
    display: grid;
    grid-template-columns: 166px 166px;
    grid-template-rows: 74px 74px;
    gap: 11px;
    width: fit-content;
    margin-inline: auto;
    margin-top: 20px;
    margin-bottom: 30px;
}
.section_jewellery-wrapper> .clothing_section-card:first-child{
    grid-row: 1/3;
}

@media (min-width:76.25em) {
    .section_jewellery-wrapper{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 284px 284px;
        gap: 32px;
        margin: 0px;
        grid-row: 2/3;
        grid-column: 1/3;
    }
}

.section_handicrafts-wrapper{
    display: grid;
    grid-template-columns: 343px;
    grid-template-rows: 148px 148px 148px 148px;
    margin-inline: auto;
    width: fit-content;
    margin-top: 20px;
    margin-bottom: 30px;
    gap: 15px;
}

@media (min-width:76.25em) {
    .section_handicrafts-wrapper{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 332px 332px;
        margin:0;
        gap: 24px;
        grid-column: 1/3;
        grid-row: 2/3;
    }
}

.section_accessories-wrapper{
    margin-inline: auto;
    width: fit-content;
    margin-top: 20px;
    margin-bottom: 30px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 148px 148px;
    gap: 12px;
}

.section_accessories-wrapper>.clothing_section-card:first-child{
    grid-column: 1/3;
    grid-row: 1/2;
}

.section_accessories-wrapper>.clothing_section-card:last-child{
    grid-column: 2/4;
    grid-row: 2/3;
}

@media (min-width:76.25em) {
    .section_accessories-wrapper{
        margin: 0px;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 332px 332px;
        gap: 24px;
        grid-row: 2/3;
        grid-column: 1/3;
    }
}


/*------- product List Page end here ------- */

/*------ product type page start here ------- */
.pageBanner-style>p{
    margin-top: 20px;
    max-width: 685px;
    text-align: center;
    color: var(--clr-white);
    font-size: 13px;
}

.pb-product{
    padding-bottom: 46px;
}

.pageBanner-style>p>a{
    color: var(--clr-white);
    text-decoration: underline;
}

@media (min-width:76.25em) {
    .pageBanner-style>p{
        margin-top: 16px;
        line-height: 130%;
        font-size: 24px;
    }

    .pb-product{
        padding-bottom: 80px;
    }
}

.productType_card{
    display: block;
    border: 1px solid #E0E0E0;
    background-color: var(--clr-white);
    border-radius: 10px;
    width: 296px;
    height: 317px;
    padding: 12px;

}

.productType_card:hover{
    border: 1px solid var(--clr-red);
}

.productType_card>img{
    border-radius: 10px;
    width: 100%;
    height: 237px;
}

.productType_card>p{
    font-size: 20px;
    font-weight: var(--font-sb);
    line-height: 99.5%;
    color: #000;
    margin-top: 20px;
}

.productType_section-wrapper{
    display: flex;
    flex-direction: column;
    width: fit-content;
    margin-inline: auto;
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
}

@media (min-width:76.25em) {
    .productType_section-wrapper{
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        margin: 0;
        gap: 0px;
        grid-column: 1/3;
        grid-row: 2/3;
    }
}

.red_section-productType{
    background-color: #FFF3F3;
    padding-top: 50px;
    padding-bottom: 42px;
}

.productType_special>h2{
    font-size: 28px;
    font-weight: var(--font-sb);
    font-style: italic;
}

.productType_video-container{
    position: relative;
    width: 100%;
    height: 209px;
    border-radius: 5px;
    overflow: hidden;
    margin-top: 30px;
}

.productType_video{
    width: 100%;
    height: 100%;
}

.productType_video[poster]{
    object-fit: fill;
}

.overlay-productType{
    position: absolute;
    top: 0%;
    left: 0%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.653), rgba(0, 0, 0, 0));
    padding-bottom: 22px;
}

.overlay-productType>p{
    color: var(--clr-white);
    line-height: 99.5%;
    text-transform: uppercase;
}

@media (min-width:76.25em) {
    .red_section-productType{
        padding-top: 80px;
        padding-bottom: 80px;
    }


    .productType_special>h2{
        font-size: 56px;
    }

    .productType_video-container{
        height: 386px;
        margin-top: 50px;
    }

    .overlay-productType{
        padding-bottom: 32px;
    }

    .overlay-productType>p{
        font-size: 34px;
    }
}


.productType_special>h3{
    font-size: 18px;
    color: #000;
    font-weight: var(--font-sb);
    text-transform: capitalize;
    margin-top: 40px;
}

.productType_special>p{
    color: #454545;
    font-size: 15px;
    letter-spacing: 3%;
    line-height: 156%;
    margin-top: 15px;
}

.productType_special>p>a{
    color: var(--clr-red);
    font-weight: var(--font-sb);
    text-decoration: underline;
}

@media (min-width:76.25em) {
    .productType_special>h3{
        font-size: 24px;
        line-height: 150%;
        margin-top: 50px;
    }

    .productType_special>p{
        font-size: 18px;
        margin-top: 24px;
    }
}
/*------ product type page end here ------- */



/*-------- Kurti page start here ----------*/
.kurti_content{
    margin-top: 50px;
}

.kurti_textArea{
    margin-bottom: 50px;
}

.kurti_textArea>h1{
    font-size: 28px;
    font-weight: var(--font-sb);
    line-height: 99.5%;
    color: #000;
    text-align: left;
}

.kurti_textArea>img{
    width: 343px;
    height: 211px;
    margin-inline: auto;
    border-radius: var(--border-r);
    display: block;
    margin-top: 30px;
}

.kurti_textArea>p{
    line-height: 169%;
    letter-spacing: 3%;
    color: #5E5E5E;
    margin-top: 20px;
}

.kurti_textArea>p>span{
    font-weight: var(--font-m);
    color: #000;
}

.kurti_textArea>p>a{
    font-weight: var(--font-sb);
    color: var(--clr-red);
    text-decoration: underline;
}

.kurti_textArea>h2{
    font-weight: var(--font-sb);
    font-size: 20px;
    line-height: 150%;
    color: #000;
    margin-top: 30px;
}

.kurti_textArea>.type{
    margin-top: 33px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.type>a{
    display: inline-block;
    color: var(--clr-red);
    border: 1px solid var(--clr-red);
    padding: 16px 24px;
    border-radius: 5px;
    font-size: 15px;
    background-color: var(--clr-white);
}

.type>a:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);
}

.goTo_kurti{
    width: fit-content;
    border-radius: var(--border-r);
    padding: 24px;
    margin-inline: auto;
    background-color: #FAFAFA;
    margin-top: 32px;
}

.goTo_kurti>a{
    color: var(--clr-red);
    font-weight: var(--font-sb);
    text-transform: capitalize;
    padding: 24px 87px;
    border: 1px solid var(--clr-red);
    border-radius: var(--border-r);
    display: block;
    background-color: var(--clr-white);
}

.goTo_kurti>a:hover{
    background-color: var(--clr-red);
    color: var(--clr-white);

}

@media (min-width:76.25em) {
    .kurti_content{
        margin-top: 100px;
        display: flex;
        gap: 8px;
    }

    .kurti_textArea{
        margin-bottom: 0px;
    }

    .kurti_textArea>h1{
        font-size: 56px;
    }

    .kurti_textArea>img{
        width: 100%;
        height: 344px;
        margin-inline: auto;
        margin-top: 24px;
    }

    .kurti_textArea>p{
        margin-top: 24px;
    }

    .kurti_textArea>h2{
        font-size: 24px;
        margin-top: 48px;
    }

    .goTo_kurti{
        width: fit-content;
        border-radius: var(--border-r);
        padding: 42px 25px;
        margin-inline: auto;
        background-color: #FAFAFA;
        margin-top: 0px;
        order: 1;
    }

    .goTo_kurti>a{
        padding: 25px 105px;
        font-size: 16px;
    }
}
/*-------- Kurti page end here ----------*/