﻿*
{
    margin:0;
    padding:0;
}

body 
{
   background-color:#ffffff;
   font-family:Sans-Serif;  
   /*margin:0px;
   padding:0px;
   background-color:#C4C1C1;*/
}
.top-nav-bar
{
     height:57px;
     top:0;
     position:sticky;
     background:#fff;
     margin-bottom:20px;
     border-bottom:3px solid #c5c1d8;
     z-index:2;   
}
.logo
{
    height:40px;
    margin:5px 10px;
}

.form-control
{
    margin-top:9px;
    margin-bottom:3px;
    margin-left:30 px;
    border:1px solid #c5c1d8 !important;
   
    border-top-left-radius:20px !important;
    border-bottom-left-radius:20px !important;
    border-top-right-radius:0 !important;
    border-bottom-right-radius:0 !important;

}

.input-group-text
{
      background:#c5c1d8 !important;
      border:1px solid #c5c1d8 !important;
      margin:8.5px 10px 3px 0 !important;
      border-top-left-radius:0px !important;
      border-bottom-left-radius:0px !important;
      border-top-right-radius:20px !important;
      border-bottom-right-radius:20px !important;
      cursor:pointer;
}

.search-box
{
     display:inline-flex;
     width:60%;
}

.fa-search
{
    color:#fff;
}

.menu-bar
{
    width:40%;
    height:57px;
    float:right;
}

.menu-bar ul
{
    display:inline-flex;
    float:right;
}

.menu-bar ul li
{
    border-left:1px solid #fff;  
    list-style-type:none;
    padding:15px 35px;
    text-align:center;
    background-color:#c5c1d8;
    cursor:pointer;
}

.menu-bar ul li a
{
    font-size:16px;
    font-weight:bold;
    color:#fff;
    text-decoration:none; 
}
.menu-bar ul li:hover
{
    background:#9a9191;
     transform:scale(1.07);
    transition:all ease 0.5s;

}

.fa-shopping-basket
{
    margin-right:5px
}

@media only screen and (max-width:980px)
{
    .top-nav-bar
    {
        height:118px;
        border-bottom:0;
    }
    .search-box
    {
        width:100%;
    }
    .menu-bar
    {
        width:100%;
    }
    .menu-bar ul
    {
        margin:10px 0 ;
        width:100%;
    }
    .menu-bar ul li
    {
        height:57px;
        width:100%;
    }
}

/*--------------------Side-menu-------------------*/

.side-menu
{
    height:550px;
    width:15%;
    font-size:14px;
    float:left;
    z-index:-2;
    background-color:#ddd; 
}

.side-menu ul
{
    margin-left:10px;
}

.side-menu ul li
{
    list-style-type:none;
    font-weight:bold;
    margin-top:10px;
    cursor:pointer;
}
.side-menu ul li:hover
{
    color:#c5c1d8;
}

.side-menu ul li ul
{
    display:none;
    z-index:10;
    top:77px;
}

.side-menu ul li:hover ul
{
    display:block;
    height:400px;
    width:200px;
    margin-left:12%;
   /* padding:0 100px 10px 10px;*/
   position:fixed;
   background:#ececec;
    box-shadow:1px 1px 4px 1px rgba(0,0,0,0.5);
}

.fa-angle-right
{
    margin-top:4px;
    margin-right:8px;
    float:right;
}

#menu-btn,#close-btn
{
    font-size:30px;
    margin:10px;
    color:#c5c1d8;
    display:none;
}
@media only screen and (max-width:980px)
{
    .side-menu
    {
        width:34%;
        z-index:20;
        top:133px;
        position:fixed;
        font-size:12px;   
        display:none;
    }
    
    .side-menu ul li ul
    { 
        top:133px;
    }
    
    side-menu ul li:hover ul
    {
        margin-left:31%;
    }
    #menu-btn
    {
        display:block;
    }
}
  
/*------------------------------Slider--------------------------------------------*/
/*.slider
{
    width:85%;
    margin-left:15%;
    margin-bottom:300px;
    padding :0 10px;
}

.carousel
{
    box-shadow:1px 1px 4px 1px rgba(0,0,0,0.5)
}

.carousel:hover
{
    transform:scale(1.01);
    transition:all ease 0.5s;
}

.carousel-item
{
    height:550px;
}

.carousel-indicators
{
    z-index:1 !important;
}

.carousel-inner img
{
    width:100%;
    height:100%;
}

@media only screen and (max-width:980px)
{
    .slider
    {
        width:100%;
        margin-left:0;
    }
}
 */
 /*---------featured categories---------*/
 .featured-categories
 {
     margin:50px 0;
 }
 
 .featured-categories img
 {
     height: 272px;
     width:100%;
     padding:20px 0;
     transition:1s;
     cursor:pointer;
 }
 
 .featured-categories img:hover
 {
  transform:scale(1.1);   
 }
 
 
 /*------------On Sale Product CSS--------------*/
 .title-box
 {
     background:#c5c1d8;
     color:#fff;
     width:180px;
     padding:4px 10px;
     height:40px;
     margin-bottom:30px;
     display:flex;
 }
 
 .title-box h2
 {
    font-size:24px; 
 }
 
 .title-box::after
 {
     content:'';
     border-top:40px solid #c5c1d8;
     border-right:50px solid transparent;
     position:absolute;
     display:flex;
     margin-top:-4px;
     margin-left:170px;
 }
 

 
 /*----------PRODUCT -TOP CSS------------*/
 .product-top img
 {
     width:250px;
     height:180px;
      
 }
 
 
 
 .product-top img:hover
 {
    transform:scale(1.07);
    transition:all ease 0.5s;
 }
 
 
 
 .overlay-right
 {
     display:block;
     opacity:0;
     position:absolute;
     top:10%;
     margin-left:0;
     width:70px;
 }
 
 .overlay-right .fa
 {
     cursor:pointer;
     background-color:#fff;
     color:#000;
     height:35px;
     width:35px;
     font-size:20px;
     padding:7px;
     margin-top:5%;
     margin-bottom:5%;
     
 }
 
  .overlay-right .btn-secondary
  {
     background:none !important;
     border:none !important;
     box-shadow:none !important; 
  }
  
  .product-top:hover .overlay-right
  {
      opacity:1;
      margin-left:5%;
      transition:0.5s;
    
  }
  
   @media only screen and (max-width:980px)
{
    .product-top img
 {
    margin-left:130px;
 }
     
}
  
  /*-----------------PRODUCT BOTTOM CSS----------------*/
  .product-bottom .fa
  {
      color:#c5c1d8;
      font-size:10px;
  }
  
  .product-bottom h3
  {
      font-size:20px;
      font-weight:bold;
  }
  .product-bottom h5
  {
      font-size:15px;
      padding-bottom:10px;
  }
  
   /*-----------------NEW PRODUCT----------------*/
   .new-products
   {
       margin:60px 0;
   }
   
    /*-----------------website-features----------------*/
    .website-features
    {
        
        margin:60px 0;
    }
     .website-features img
    {
        width:20%;
        /*margin-left:70px;*/
    }
    
    .feature-text
    {
        margin-top:10px;
        float:right;
        width:80%;
        padding-left:20px;
    }
    .feature-box
    {
        padding-top:20px;
    }
    
    /*------------------------FOOTER-------------------------*/
    
    /*.footer
    {
        margin-top:50px;
        background:#000;
        color:#fff;
    }
    
    .footer h1
    {
        font-size:15px;
        margin:25px 0;
    }
    
    .footer p
    {
        font-size:12px;
    }
    
    .copyright
    {
        margin-bottom:-80px;
        text-align:center;
        font-size:15px;
        padding-bottom:20px;
    }
    
    .fa-heart-o
    {
        color:Red;
        font-size:15px;
    }
    
    .footer hr
    {
        margin-top:10px;
        background-color:#ccc;
    }
    
    .footer-image img
    {
        width:150px;
    }
    
    .footer .row .fa
    {
        padding-right:20px;
        font-size:15px;
    }*/
/*--------------------------SINGLE-PRODUCT--------------------*/
.single-product
{
    margin-top:70px;
}    

.new-arrival
{
    background:green;
    width:50px;
    color:#fff;
    font-size:12px;
    font-weight:bold;
    margin-top:20px;
}

.col-md-7 h2
{
    color:#555;
}

.single-product .fa
{
    color:#c5c1d8;
}

.single-product .price
{
    color:#c5c1d8;
    font-size:26px;
    font-weight:bold;
    padding-top:20px;
}

.single-product input
{
    border:1px solid #ccc;
    font-weight:bold;
    height:33px;
    text-align:center;
    width:30px;
}

.single-product .btn-primary
{
    background:#c5c1d8 !important;
    color:#fff;
    font-size:15px;
    margin-left:20px;
    border:none;
    box-shadow:none !important;
}

.single-product .carousel-item
{
    height:350px;
}

/*-----------Product Description---------------*/
.product-description h6
{
    margin-top:50px;
    color:#c5c1d8;
}

.product-description p
{
    margin-top:30px;
}

.product-description hr
{
    margin-bottom:50px;
}

/*-----------Slider-Box---------------*/
.heading
{
    display:flex;
    justify-content:center;
}
.heading h1
{
    border-left:2px solid #000000;
    border-right:2px solid #000000;
    background-color:#a69ed6;
    text-shadow:2px 2px 12px rgba(69,66,66,0.3);
    padding:0px 10px;
    color:#FFFFFF;
    margin:20px;
    font-size:30px;
    font-family:Calibri;
}
.swiper-slide
{
    width:280px !important;
   
}
.slider-box
{
    margin:20px;
    height:240px;
    width:250px;
    position:relative;
    /*background-color:#ffffffba;*/
    border-radius:20px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    border:0px solid rgba(187,187,187,0.40);
   
}

.slider-box a
{
    text-decoration:none;
    text-align:center;  
}
/*.slider-box:hover
{
    box-shadow:2px 2px 12px rgba(47,47,47,0.40);
    background:#ffffff;
}*/
.slider-box:hover .img-box img
{
    transform:scale(1.07);
    transition:all ease 0.3s;
}
.img-box
{
    height: 180px;
    margin-top: 31px;
}
.img-box img
{
    height:auto;
   /* max-width:100%;*/
    width:80%;
    max-height:100%;
    border-radius:20px;
}
.time
{
    position:absolute;
    top:0px;
    right:20px;
    color:#f16007;
}
.detail
{
    display:flex;
    flex-direction:column;
    align-items:center;
    box-sizing:border-box;
    font-size:17px;
    line-height:35px;
}
.price
{
    color:black;
    /*background-color:#c5c1d8;*/
    line-height:25px;
}
.cart
{
    position:absolute;
    bottom:0px;
    height:45px;
    background-color:#a69ed6;
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:20px;
}
.cart a
{
    color:#FFFFFF;
}

.cart:hover
{
    transform:scale(1.1);
    background-color:#9a9191;
    box-shadow:2px 2px 12px rgba(47,47,47,0.40);
    transition:all ease 0.1s;
}