@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}
nav{
    height: 64px;
    padding:0px 10rem;
    background-color: #fff;
    display:flex;
    justify-content:space-between;
    align-items: center;
}
nav .ab{
   display:flex;
   gap:15px;
   align-items: center;
}
nav .ab button{
    padding:10px;
    padding-right:5rem;
    border-radius:8px;
    border:1px solid #eeeeee;
    background-color: #fff;
    color:#99a6ba;
    font-size:15px;
}
nav .b{
    display: flex;
    gap:20px;
    align-items: center;
}
nav .b select{
    border:none;
    outline:none;
}
nav .b button{
    padding:5px 10px;
    border-radius: 5px;
    background-color: #eb4e62;
    border:none;
    color:#fff;
}
nav .b i{
    /* width:60px; */
    font-size:25px;
}
.main{
    height: 40px;
    background-color: #f5f5f5;
    padding:0px 10rem;
    display:flex;
    justify-content: space-between;
    align-items:center;
}
.main .main1 ul{
    display:flex;
    gap:20px;
}
.main .main1 ul li{
    list-style: none;
}
.main .main1 ul li a{
    color:#000;
    text-decoration: none;
    text-transform: capitalize;
}
.f{
    margin-bottom:30px;
    height:300px;
    width:100%;
    animation:picture;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}
@keyframes picture {
    0%{
       background-image: url("https://assets-in-gm.bmscdn.com/promotions/cms/creatives/1755763132646_21staugplaycarddesktophpc.jpg");
       transform: translateX(50%,100%);
    }
    30%{
       background-image: url("https://assets-in-gm.bmscdn.com/promotions/cms/creatives/1755763132646_21staugplaycarddesktophpc.jpg");
       transform: translateX(50%,100%);
    }
    60%{
        background-image: url("https://assets-in-gm.bmscdn.com/promotions/cms/creatives/1755581918156_lollapaloozaindia2026web.jpg");
        transform: translateX(50%,100%);
    }
    90%{
        background-image: url("https://assets-in-gm.bmscdn.com/promotions/cms/creatives/1755602172105_sinnersflashsaleweb.jpg");
        transform: translateX(50%,100%);
    }
    100%{
        background-image: url("https://assets-in-gm.bmscdn.com/promotions/cms/creatives/1755602172105_sinnersflashsaleweb.jpg");
        transform: translateX(50%,100%);
    }
}
h3{
    margin:0 10rem;
    margin-bottom:10px;
    color: #333333;
    font-family: Roboto;
    font-size: 24px;
    font-weight: 700;
}
.first{
    margin:0 10rem;
    margin-bottom:40px;
    display:flex;
    gap:30px;
}
.first .first1{
    border-radius:10px;
}
.first .first1 .first1-1{
    border-radius:10px;
    margin-bottom:10px;
}
.first .first1 .first1-1 img{
    width:224px;
    border-radius:10px;
}
.first .first1 .first1-2 p{
    color:#000;
    font-family: Roboto;
    margin-bottom:10px;
    font-size:18px;
    font-weight:500;
}
.first .first1 .first1-2 article{
    color:#796666;
    font-family: Roboto;
    font-size:16px;
    font-weight:normal;
}
.second{
    margin:0 10rem;
    margin-bottom:30px;
}
.second img{
    width:100%;
}
.third{
    display:flex;
    gap:20px;
    margin:0 10rem;
    margin-bottom:30px;
}
.third .third1{
    border-radius:10px;
    width:224px;
}
.third .third1 img{
    width:224px;
    border-radius:10px;
}
.fourth{
    background-color: #2b3148;
    padding-top:10px;
    padding-bottom:2px;
    margin-bottom:30px;
}
.fourth .fourth2 .first .first1 .first1-2 p{
    color:#fff;
}
.fourth .fourth2 .first .first1 .first1-2 article{
    color:#fff;
}
.fourth .fourth1{
     margin:0 10rem;
     margin-bottom:10px;
}
.fourth .fourth2 h3,.fourth .fourth2 h4{
     color:#fff;
     margin:0 10rem;
     margin-bottom:5px;
}
.fourth .fourth2 .first{
    margin-bottom:10px;
}
.fourth .fourth1 img{
    width:80%;
}
.fifth{
    margin:0 10rem;
    display: flex;
    gap:30px;
    padding-bottom:10px;
    background-color:#f5f5f5;
}
.fifth .fifth1{
    padding:14px 45px 12px 16px;
    border:1px solid #fff;
    background-color: #fff;
}
.fifth .fifth1 a{
    font-family: Roboto;
    font-size:16px;
    font-weight:500;
    text-decoration: none;
    color:#f94464;
}
.fifth .fifth1 p{
    font-family: Roboto;
    font-size:14px;
}
.sixth{
    margin-bottom:40px;
}
footer{
    background-color: #333338;
    padding-top:20px;
}
footer .f1{
    margin:0 10rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom:20px;
}
footer .f1 .f2{
    display:flex;
    align-items: center;
    gap:20px;
    color:#fff;
}
footer .f1 .f3 button{
    background-color: #ec5e71;
    padding:10px 20px;
    color:#fff;
    text-decoration: none;
    border-radius:3px;

}
footer .f1 .f3 button:hover{
    cursor: pointer;
}
.ims{
    background-color: #404043;
    margin-bottom:20px;
}
.im{
    margin:0 10rem;
    margin-top:25px;
    padding-bottom:15px;
    display:flex;
    justify-content: space-between;
}
.im .im2:hover{
    color:#fff;
}
.im .im2 svg{
    margin:10px 0px;
    width:50px;
    height:50px;
    fill:#859fa2;
}
.im .im2 a{
    color:#859fa2;
    text-decoration: none;
    font-weight:400;
}
footer .content p{
    font-size:12px;
    font-weight:400;
    text-transform: uppercase;
    margin:0px 0px 10px;
    color:#a5a5a5;
}
footer .content{
    margin:0px 10rem;
}
footer .sp{
    color: #7f7f7f;
    margin-right:4px;
}
footer .content a{
    text-decoration: none;
    font-size:11px;
    color: #7f7f7f;
    letter-spacing:0.1px;
    transition: color o.25s ease-in-out;
    margin:0px 5px 5px 0px;
    margin-right:5px;
    border-radius:1px solid #7f7f7f;
}
footer .co{
     margin-bottom:25px;
}
footer .content a:hover{
    color:#fff;
    cursor:pointer;
}
footer .he{
    display:flex;
    align-items: center;
    justify-content: center;
    height:125px;
    padding:0px 10px;
    margin-bottom:10px;
}
footer .he img{
    width:115px;
    height:34px;
}
footer .hes{
    border-bottom:10px solid #5d5d5f;
    /* height:1px; */
    /* background-color:#5d5d5f; */
}
footer .cir{
    display:flex;
    align-items: center;
    justify-content: center;
    gap:10px;
    margin-bottom:10px;
}
footer .cir .cir1 svg{
    fill:#5d5d5f;
    width:37px;
    height:37px;
}
footer .cir .cir1 svg:hover{
    fill:#fff;
}
footer .copy{
    padding:30px;
    font-size:11px;
    color:#666666;
    text-align:center;
}
