@font-face {
    font-family:'luxurious' ;
    src: url(../font/LuxuriousScript-Regular.ttf);
}
@font-face {
    font-family:'abril' ;
    src: url(../font/AbrilFatface-Regular.ttf);
}
@keyframes move{
    0%{
        left: 0px;
    }
    50%{
        right: 100px;
    }
    100%{
        left: 0px;
    }
}

 
.animation-move:hover{
    animation-name: move;
    animation-duration: 0.6s;
}

.font-size{
    font-size: 15px;
}
.number{
    font-size: 50px;
}
.icon-size{
    font-size: 20px;
}
.main-font-size{
    font-size: 80px;
}
.second-font-size{
    font-size: 20px;
}
.h-menu{
    font-size: 30px;
    cursor: pointer;
}
.hover-color{
    color: var(--color-hover);
}
.hover-background{
    background-color: var(--color-hover);
}
.second-color{
    color: var(--color-secendry);
}
.background-black{
    background-color: var(--color-black);
}
.white-color{
    color: var(--color-white);
}
.font-abril{
    font-family:'abril';
}
.font-luxurious{
    font-family:'luxurious';
}
.text-transform-up{
    text-transform: uppercase;
}
.text-transform-low{
    text-transform: lowercase;
}
.text-transform-capital{
    text-transform: capitalize;
}


.pointer{
    cursor: pointer;
}


body{
    margin: 0;
    background-color: rgb(26, 26, 26);
}

.main-background2{
   width: 100%;
    background-image: url(../images/mainbackground2.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}
.main-background1{
    width: 100%;
    background-image: url(../images/main-background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.main-background{
    width: 100%;
    background-image: url(../images/bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.head1{
    color: rgb(221, 221, 221);
    
}
.menu-item-top:hover{
    color: var(--color-white);
}
.search:hover{
    color: var(--color-hover);
    cursor: pointer;
}
.buy:hover{
    color: var(--color-hover);
}
.buy:hover  .my-cart{
    top:80px;
    
}


.buy-number{
   
    background-color: rgb(44, 43, 43);
    border-radius: 50%;
    width: 20px;
    height:18px;
    text-align: center;
   
}
.my-cart{
    
    color: blanchedalmond;
    width: 200px;
    height: 60px;
    right: -50px;
   bottom: 500px;
   
}
.menu-item{
    right: 200px;
    bottom:-500px;
    transition: 0.6s;
}
.menu:hover .menu-item{
    right:-50px;
}
.menu-item-hover:hover{
    color: var(--color-hover);
}
.first-main{
    background-image: url(../images/slide-01.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    bottom: 40px;
    
    
}
.off{
    font-size: 50px;
}
.btn{
    color: var(--color-hover)!important;
    border: 4px solid var(--color-hover)!important;
    width: 180px;
    height: 50px;
    background-color: rgba(255, 255, 255, 0);
    font-size: 15px;
}
.btn:hover{
    color: var(--color-hover)  !important;
    background-color: var(--color-white)!important;
    
}
.second-main{ 
    background-image: url(../images/bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}  
.product-picture{
    background-color: rgb(44, 44, 44);
}
.text-decor-through{
    text-decoration:line-through;
}
.buy-btn{
    border: 4px solid var(--color-hover);
    background-color: rgba(255, 255, 255, 0);
    font-size: 15px;
    right: 0;
    
}
.main-5{
    background-image: url(../images/blog-section.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.main-6{
    background-attachment: fixed;
}
.icon{
    font-size: 30px;
}
.main-8{
    background-image: url(../images/mainbackground2\ -\ Copy.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.Testimonials{
    background-image: url(../images/testimonials.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding-top: 80px;
    padding-bottom: 80px;
    
}
.radius{
    border-radius:50% ;
    width: 50px;
    height: 50px;
}
.footer{
    background-image: url(../images/last.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position:bottom;
}
.home-page:hover{
    color: var(--color-hover);
}

.about-main-2{
    background-image: url(../images/slide-01.jpg);
}
.about-main-4{
    background-image: url(../images/about-background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position:bottom;
}
.blog-post{
    border-bottom: 1px solid var(--color-secendry);
    
}
.tt{
    font-size: 30px;
    right: 24px;
    top: 4px;
}
.tt:hover{
    color: var(--color-white);
}
.blog-title:hover{
    color: var(--color-hover);
    cursor: pointer;
}
.buy-btn:hover {
   
    border-color:var(--color-secendry);
    color: var(--color-secendry);
}

.cart-button{
    z-index: -1;
    transition: 0.6s;
    bottom: 20px;
}
.ff:hover .cart-button{
    z-index: 1;
   
}
.index{
    right: 40px;
    bottom: 150px;
   
}
.index-item:hover{
    color: var(--color-hover);
}

@media(max-width: 1900px){
    .index{
        right: 70px;
        bottom: 110px;
       
    }
    .index-item{
        font-size:20px;
    }
}
@media(max-width: 1380px){
    .index{
        right: 60px;
        bottom: 100px;
       
    }
    .index-item{
        font-size:15px;
    }
}
@media(max-width: 1130px){
    .index{
        right: 50px;
        bottom: 70px;
       
    }
    .index-item{
        font-size:20px;
    }
    
}
@media (max-width: 800px) { 
    .buy:hover  .my-cart{
        top:30px;
    }
    .main-font-size{
        font-size: 40px;
    }
    .second-font-size{
        font-size: 15px;
    }
    .index{
        right: 50px;
        bottom: 70px;
       
    }
    .index-item{
        font-size:20px;
    }
    
    
 }
 @media (max-width: 434px) { 
    .buy:hover  .my-cart{
        top:80px;
        
    }
    .main-font-size{
        font-size: 35px;
    }
    .second-font-size{
        font-size: 15px;
    }
    .index{
        right: 50px;
        bottom: 150px;
       
    }
    .index-item{
        font-size:20px;
    }
 }