/* common css */
*{
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
     font-family: "Poppins", sans-serif;
}
.container{
    width: 1140px;
    margin: auto;
    margin-top: 20px;
    /* height: 48px; */
}
/* .container2{
    max-width: 1128px;
      margin: auto;
       margin-top: 20px;
      
} */
.banner-button{
    padding: 5px 20px;
    margin: 8px 0;
    display: block;
    border-radius: 6px;
    background: linear-gradient(180.00deg, rgb(255, 88, 155) -0.006%,rgb(255, 19, 111) 99.994%);
    color: white;
    font-weight: bold;
    font-size: 15px;
    width: 168px;
    height: 52px;
    border: none;
}
.banner-button i{
    padding: 8px;
 
}
.common-section-title{
    font-weight: 600;
    font-size: 36px;
}

/* custom css */
nav{
    display: flex;
    justify-content: space-between;
    
    
}
.nav-items{
    display: flex;
    gap: 10px;
    
   
}
.nav-items li a{
     color: rgb(95, 92, 92);
     font-size: 18px;
     font-weight: 600;
     padding: 10px 3px;
     border-radius: 10px;
    
}
.nav-items li a:hover{
    background-color:rgb(254, 234, 233);
}
.search-parent{
    position: relative;
    color: rgb(186, 186, 186);
}
.search-parent input{
width: 508px;
height: 30px;
border-radius: 66px;
border: none;
background-color: rgb(241, 241, 241);
padding: 25px 38px;
}
.search-parent i{
    position: absolute;
    top: 18px;
    right: 20px;
}

/* banner style */
.banner{
    display: flex;
    background-color: rgb(254, 234, 233);
    align-items: center;
    justify-content: space-between;
    gap:5px;
    padding: 68px 46px;
    border-radius: 20px;
    height: 455px;
}

.para-part{
    max-width: 456px;;
}
.banner h2{
    color: rgb(31, 31, 31);
    font-size: 52px;
    font-weight: bold;
    margin: 15px 0px;
}
.banner p{
    color: rgb(60, 58, 58);
}
.banner-price{
    color:rgb(255, 19, 111);
    font-size: 52px;
    font-weight: bold;
   
    margin: 30px 0px 5px 0px;
    display: block;
    

}
.banner img{
width: 402px;
height: 378px;
}

/* category */
main p{
    color: rgb(80, 79, 79);
}

.categories{
    margin: 64px 0px;
}

/* .categories .category-card{
    margin: 50px auto;

} */
.category-card{
    display: flex;
   background: linear-gradient(151.85deg, rgb(255, 156, 53) 14.537%,rgb(255, 208, 25) 84.486%);
    font-size: 36px;
    font-weight: 500;
    color: white;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    padding: 20px;
     border-radius: 10px;
      flex: 1;
}
.category-part{
    display: flex;
    gap: 20px;
    margin: auto;
    width: 100%;
   
   
}
.category-card-1{
     background: linear-gradient(151.85deg, rgb(255, 156, 53) 14.537%,rgb(255, 208, 25) 84.486%);
}
.category-card-2{
    background: linear-gradient(180.00deg, rgb(255, 88, 155) -0.006%,rgb(255, 19, 111) 99.994%);
}
.category-card-3{
    background: linear-gradient(170.38deg, rgb(66, 137, 255) 15.416%,rgb(63, 7, 248) 74.29%);
}

/* shoes section */
.shoes-section{
   background: rgb(244, 244, 244);
   padding: 45px 0px;

   
}
.shoes-section-container{
    margin-left: 20px;
    margin-right: 20px;
}
.shoes-section-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.shoes-section-title h2{
    font-weight: bold;
    font-size: 36px;
}
.shoes-section-title p{
    font-size: 20px;
    color: #ff9d00;
}
.shoes-card-container{
    display: flex;
    justify-content: space-between;
    gap: 20px;

    
}
.shoe-card{
    background-color:white;
    border-radius: 10px;
    text-align: center;
    padding: 10px;
}
.shoe-price{
    display: block;
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 12px;
}
.shoe-card img{
width: 330px;
height: 202px;
}
.shoe-card .banner-button{
    background: black;
    text-align: center;
    margin: auto;
}
/* bag card */
.bag img{
    width: 290px;
height: 290px;

}

/* footer */
.footer-container{
    width: 1212px;
    background: rgb(255, 242, 241);
    height: 455px;
    margin: 70px auto;
}
.footer-section{
    width: 683px;
    height: 162px;
    padding: 125px 20px;
    text-align: center;
    margin: auto;
}
.footer-section h2{
    display: block;
}
.footer-section p{
    color: rgb(92, 91, 91);
}
.button-parent .button-box {
    font-weight: bold;
    font-size: 20px;
  
}
.input-box{
    width: 683px;
    height: 73px;
    padding: 0px 15px;
    border: none;
    border-radius: 5px;
}
.button-parent{
    position: relative;
}
.button-box{
    position: absolute;
    height: 70px;
    top: -6px;
    right: -39px;
   
}