html{
    font-family:Arial,Helvetica,sans-serif;
   
}
body{
    padding:0;
    margin: 0;
    
}

.header-section{
    border:1px solid red;
    height:28vh;
}
#offer-text{
 text-align: center;
 color: red;
 display: block;
 transition: 1em
}
.landing-poster{
   display: flex;
   gap:2em;
   /* border:1px solid blue; */
   width:1180px;
   margin: auto;
   
}
.landing-poster div:nth-child(1){
    color: #757575;
    letter-spacing: .8px;
    display: block;
}
.landing-poster div:nth-child(2) img{
   width:30rem
}
.below-landing-poster{
    width:1180px;
    display: flex;
    /* border:1px solid red; */
    margin: auto;
    margin-top: 22px;
    gap:30px
}
.below-landing-poster ul{
    line-height: 0;
    padding: 0;
}
.below-landing-poster ul li{
   
    display: inline;
    letter-spacing: .8px;
  text-decoration: none;
}
.below-landing-poster ul li a{
    list-style: none;
    color:#757575;
    text-decoration: none;
    font-size: 12px;
}
.below-landing-poster>div:nth-child(2){
    display: flex;
    justify-content: center;
    font-size: 12px; ;
    margin-left: 10%;
}
.sort{
    margin-top: 8px;
    gap:200px
}
.sort >span{
    color:#757575
}
.sort .select-sort select{
  margin-left: 80px;
  border: 1px solid white;
  color:#757575
}
.sort .select-sort select:hover{
    cursor: pointer;
}
.sort .pagination-button button{
    border:none;
    background-color: white;
    color:#757575;
    
}
.sort .pagination-button button:hover{
    cursor: pointer;
}
.sort .pagination-button button:nth-child(1){
    color: black;;
    font-weight: bolder;
}
.categories ul li{
    margin: 0;
}
.arrival{
    display: flex;
}
.sidebar_cards{
   width:1180px;
   margin:auto;
}
.sidebar_cards{
    display: flex;
    gap:10px;
    margin-top: 50px;
}



.sidebar_cards .cards{
  
    border:1px solid red;
    width: 25%;
}

label{
    margin-left: 10px;
}

.sidebar_cards .cards{
    width:1100px;
    height:auto;
    display: grid;
    gap:10px;
    grid-template-columns: repeat(3,1fr);
    border:1px solid blue;
}
.sidebar-content >div h1{
    font-size: 14px;
    font-weight:lighter;
    color:#757575;
    text-align: left;
}
.sidebar-content .categories ul li a{
    text-align: left;
    text-decoration: none;
    color:#757575;
    line-height: 20px;
    list-style: none;
    letter-spacing: .8px;
    font-weight: lighter;
}
.sidebar-content .categories ul li{
    list-style: none;
    line-height: 20px;
    margin-top: 7px;
}
.sidebar-content .categories ul{
    text-align: left;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
   
}
.sidebar-content .categories div{
    margin-top: 7px;
    margin-bottom: 12px;
}
.sidebar-content .accordion-trigger.active .icon-arrow-right-black {
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.sidebar-content .accordion-trigger .icon-arrow-right-black {
    float: right;
    margin-right: 4px;
    width: 7px;
    height: 20px;
    transition: transform .3s ease;
}

.sidebar-content .accordion-trigger .icon-arrow-right-black {
    float: right;
    margin-right: 4px;
    width: 7px;
    height: 20px;
    transition: transform .3s ease;
}
.sidebar{
    width:40%;
}

.accordion-trigger span{
    font-size: 15px;
    font-weight:bold
    
}
.search-icon input{
   padding:15px;
   width:90%;
   border:0.5px solid #757575;
   margin-top: 10px;

} 
.search-icon input:hover{
    cursor: pointer;
}
.check-box-givenchy input{
    margin-top: 30px;
}
.check-box-givenchy:hover{
    cursor: pointer;
}
.check-box-givenchy span{
    color:#757575
}
.check-box-givenchy span:hover{
    cursor: pointer;
}
.size-box{
    height:200px;
   
    overflow: hidden;

}
.input-check-boxes{
    height:100%;
}
.input-check-boxes input{
    margin-top: 12px;
    font-size: 5px;
}

.size-box .input-check-boxes{
    overflow: auto;
    font-size: 12px;
    color:#757575
}

.color-box{
    height:200px;
 
    overflow: hidden;

}
.input-check-boxes{
    height:100%;
}
.input-check-boxes input{
    margin-top: 12px;
    font-size: 5px;
}

.color-box .input-check-boxes{
    overflow: auto;
    font-size: 12px;
    color:#757575
}


.pattern-box{
    height:200px;
   overflow: hidden;

}
.pattern-check-boxes{
    height:100%;
}
.pattern-check-boxes input{
    margin-top: 12px;
    font-size: 5px;
}

.pattern-box .input-check-boxes{
    overflow:auto;
    font-size: 12px;
    color:#757575
}

#arrow:hover{
    cursor: pointer;
}


.cards> div hr{
    width:80%;
    margin: 0;
    margin-top: 2px;
    margin-bottom: 4px;
}
.cards > div .bottom{
    text-align: center;
    line-height: 2px;
}
.cards > div .bottom img{
    margin-bottom: 25px;
}
.cards > div .bottom{
    line-height: 5px;
    margin-top: 8px;
}
.cards img{
    height:16rem; 
}
.cards img:hover{
    cursor: pointer;
}
.cards > div .bottom>p{
    color:#757575
}
.icon:hover{
    cursor: pointer;
}
.cards > div .top{
    display: flex;
    justify-content: space-around
}
.cards > div .top p{
    margin: 0;
    padding: 0px;
    font-size: 40px;
    
    color:rgb(223, 238, 251);
}
.cards > div .top p:hover{
    cursor: pointer;
}*/
.pagination-liner{
   width:1180px;
   margin:auto
} 
.pagination-liner div{
    text-align: right;
    margin-top: 40px;
}
.pagination-liner div button{
    border:none;
    margin: 2px;
    background-color: white;
    color:#757575;
}
.pagination-liner div button:hover{
  cursor: pointer;;
}
.pagination-liner div button:nth-child(1){
    font-weight: bold;
}
.bottom-posters{
    width:1180px;
    margin: auto;
    margin-top: 20px;
    display: flex;
    gap:35px;
    text-align: center;
    position: relative;
    /* border-bottom: 1px solid #757575; */
    margin-bottom: 50px;
}
.bottom-posters img{
    width:35rem
}
.bottom-posters img:hover{
    cursor: pointer;
}
.bottom-posters > div > div{
    line-height: 35px;
    text-align: center;
    position:absolute;
    bottom:20px;
   margin-left: 190px;
}
.bottom-posters > div > div:hover{
    cursor: pointer;
}
.bottom-posters > div > div button:hover{
    cursor: pointer;
}
.bottom-posters > div:nth-child(1) button{
    background-color: black;
    color:white;
    border:none;
    padding:8px
}
.bottom-posters > div:nth-child(2) button{
    padding:8px;
    border:none;
}
.bottom-posters > div:nth-child(2) p{
    font-size: 28px;
    color:white;
    font-weight: lighter;
}

.above-footer{
    width:1180px;
    margin: auto;
    margin-top: 30px;
    text-align: center;
    
}
.above-footer button{
    border:1px solid black;
    background-color: white;
    padding:10px
}
.above-footer button:hover{
    cursor: pointer;
}
.above-footer p:nth-child(2){
    width:60rem;
    text-align: center;
    margin-left: 100px;
    font-size: 13px;
}
.above-footer a{
   
    color: black;
}
.arrival{
    font-size: 10px;
    color: #757575;
}
.cards > div{
    border:1px solid aliceblue
}




hr{
    width: 1180px;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}


.my-cards{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap:20px;
}
.my-cards>div{
    /* border:1px solid red; */
    text-align: center;
}
.my-cards>div img{
    height: 70%;
    width:100%;
}
.my-arrival{
    display: flex;
    justify-content: space-between;
}
.my-parent-div .my-arrival img{
    width:50%;
}
.my-parent-div .my-arrival p:nth-child(2){
    font-size: 35px;
    color:rgb(212, 234, 253)
}
.my-bottom{
    line-height: 25px;
}


.my-below-landing-poster{
    width:1180px;
    margin: auto;
    /* border:1px solid red; */
    display: flex;
    justify-content: space-between;
    align-items: center;
   margin-top: 10px;
    margin-bottom: 20px;
    color: #757575;
}
.my-below-landing-poster ul  a{
   color: #757575;
}
.pagination-liner button{
    padding: 7px;
}
.mypage{
    background-color: white;
    border: none;
    font-size: 13px;
}
.my-below-landing-poster button{
    padding: 7px;
}
.my-card-image:hover{
  cursor: pointer;
}
.icon:hover{
    cursor: pointer;

    
} 
.mypage:hover{
  cursor: pointer;
}
.landing-poster{
    display: block;
    unicode-bidi: isolate;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin-inline-start: auto;
    margin-inline-end: auto;
    overflow: hidden;
    border-style: inset;
    }
hr{
    width: 1180px;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;

}
.my-pagination-liner{
    width:1180px;
    margin:auto;
    display: flex;

    justify-content: flex-end;
}