/* XS - Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 
  /********** index page **********/
  .navbar .Div-Login{
    margin-right: 23px;
    margin-top: 20px;
}

.nav-link{
    padding-right: 0;
}

.bg-danger{
    top: 222px;
    left: 106px;
}

span#cart-count{
    top: 222px;
    left: 54px;
    padding: 7px;
    height: 22px;
    line-height: 8px;
}

.Advantages{
    padding: 0px 100px;
    height: 1445px;
}

.Advantages .advantage-div .Icon-V{
    margin: 0px 17px;
}

.Advantages .Advantages-parent h3{
    font-size: 20px;
    width: 240px;
    margin-right: -63px;
}

.about-section h2{
    padding-top: 65px;
}

.Main-image h1{
    font-size: 30px;
    line-height: 50px;
}

.Main-image .Main-image-a{
    padding: 18px 50px;
    width: 72%;
}

.Hairdressing-products .Product a{
    padding: 10px 36px;
}

.contact{
    max-width: 300px;
}

.contact .contactus .input-group{
    width: 130%;
    margin-right: -31px;
}

.contact .contactus .send{
    width: 70%;
}

.about-section p{
    font-size: 19px;
    margin-top: 19px;
}

.about-section{
    height: 821px;
}

.Categories-section .Categorie p{
    font-size: 20px;
}

.Hairdressing-products .Product .icon-Preferred{
    left: 40px;
}

.Hairdressing-products .Product .Product-img{
    width: 90px;
}

.Advantages .Advantages-parent{
    flex-wrap: wrap;
    gap: 70px;
}

.Advantages .advantage-div p{
    width: 247px;
    margin-right: -70px;
}

.Advantages .advantage-div{
    width: 100%;
    height: 220px;
}

footer .footer-Links{
    display: none;
}

.row.Categories-row{
    flex-direction: column;
}

.Categories-section .Categorie{
    height: 70px;
    width: 250px;
    margin-right: 33px;
}

.Categories-section .Categorie p{
    line-height: 70px;
}

.Categories-section{
    height: 450px;
}

.Hairdressing-products .Hairdressing-product{
    flex-direction: column;
}

footer{
    flex-direction: column;
    align-items: center;
    margin-right: -30px;
}

footer .footer-Contactus h3{
    margin-top: -25px;
}

footer .footer-logo .footer-logo-img{
    margin-top: -40px;
}


     /********** shop page **********/
     .Products-section .grid-container{
        margin-right: -16px;
     }

     .Products-section .grid-container{
        grid-template-columns: 190px;
     }

     .Products-section .Product .Product-img{
        width: 90px;
     }

     .Products-section .Product a{
        padding: 10px 56px;
     }
     
     .Category-section .Category ul li a.active{
        margin-right: -100px;
        padding: 15px 85px;
     }

     .Category-section .Category ul li a{
        padding: 15px 85px;
        margin-right: -102px;
     }

     .Category-section .Category ul li:first-child{
        margin-right: 70px;
     }

     .Category-section .Category ul li .active{
        padding: 15px 185px;
        margin-right: 0;
     }

     .Category-section .Category ul li{
        margin-bottom: 50px;
     }

     .Category-section .Category ul{
        margin-top: 30px;
        margin-bottom: -40px;
     }


          /********** contact page **********/
          .section-contactus{
            margin-right: 31px;
            width: 349px;
        }

        .section-contactus .contactus .input-group{
            width: 137%;
            margin-right: -37px;
        }

        .section-contactus .contactus{
            width: 85%;
            margin-bottom: 40px;
        }

        .map iframe{
            width: 280px;
        }

             /********** login-form **********/
             form.login-form.login-form2{
                margin-top: 20px;
            }

            .input-row{
                flex-direction: column;
            }

              /********** checkout page **********/
              .Main-payment-parent{
                flex-direction: column;
                height: 1530px;
              }

              .checkout-container{
                margin-top: 8px;
              }

              .cart-item{
                width: 250px;
              }

}


/* SM - Small devices (landscape phones, 576px and up to 768)*/
@media (min-width: 576px) and (max-width: 767.98px) {
	  /********** index page **********/
      .navbar .Div-Login{
        margin-right: 23px;
        margin-top: 20px;
    }

    .nav-link{
        padding-right: 0;
    }

    .bg-danger{
        top: 221px;
        left: 321px;
    }

    span#cart-count{
        top: 222px;
        left: 272px;
        padding: 7px;
        height: 22px;
        line-height: 8px;
    }

    .Advantages{
        padding: 0px 100px;
        height: 1165px;
    }

    .Advantages .advantage-div .Icon-V{
        margin: 0px 135px;
    }

    .Advantages .Advantages-parent h3{
        font-size: 20px;
    }

    .about-section h2{
        padding-top: 65px;
    }

    .Main-image h1{
        font-size: 33px;
        line-height: 50px;
    }

    .Main-image .Main-image-a{
        padding: 18px 50px;
        width: 52%;
    }

    .Hairdressing-products .Product a{
        padding: 10px 36px;
    }

    .contact{
        max-width: 520px;
    }

    .contact .contactus .input-group{
        width: 80%;
    }

    .about-section p{
        font-size: 19px;
        margin-top: 19px;
    }

    .about-section{
        height: 581px;
    }

    .Categories-section .Categorie p{
        font-size: 20px;
    }

    .Hairdressing-products .Product .icon-Preferred{
        left: 0px;
    }

    .Hairdressing-products .Product .Product-img{
        width: 90px;
    }

    .Advantages .Advantages-parent{
        flex-wrap: wrap;
        gap: 30px;
    }

    .Advantages .advantage-div{
        width: 100%;
        height: 220px;
    }

    footer .footer-Links{
        display: none;
    }


       /********** shop page **********/
       .Products-section .grid-container{
        margin-right: -16px;
     }

     .Products-section .grid-container{
        grid-template-columns: 190px 190px;
     }

     .Products-section .Product .Product-img{
        width: 90px;
     }

     .Products-section .Product a{
        padding: 10px 56px;
     }
     
     .Category-section .Category ul li a.active{
        margin-right: -70px;
        padding: 15px 185px;
     }

     .Category-section .Category ul li a{
        padding: 15px 185px;
        margin-right: -70px;
     }

     .Category-section .Category ul li:first-child{
        margin-right: 70px;
     }

     .Category-section .Category ul li .active{
        padding: 15px 185px;
        margin-right: 0;
     }

     .Category-section .Category ul li{
        margin-bottom: 50px;
     }

     .Category-section .Category ul{
        margin-top: 30px;
        margin-bottom: -40px;
     }

              /********** contact page **********/
              .section-contactus{
                margin-right: 71px;
            }
    
            .section-contactus .contactus .input-group{
                width: 110%;
                margin-right: -24px;
            }
    
            .section-contactus .contactus{
                width: 85%;
                margin-bottom: 40px;
            }

            .map iframe{
                width: 410px;
            }

        /********** login-form **********/
        form.login-form.login-form2{
            margin-top: 20px;
        }

        
          /********** checkout page **********/
          .cart-item{
            width: 176px;
            margin-right: -12px;
        }

        .Main-payment-parent{
            margin-top: 0px;
        }

        .cart-item img{
            margin-right: -12px;
        }

        .checkout-container .checkout-form .input-div input{
            width: 140px;
        }

        .checkout-container .checkout-form .input-div select{
            margin-right: -36px;
        }
	
}


/* MD - Medium devices (tablets, 768px and up to 992)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
       /********** index page **********/
       .navbar .Div-Login{
        margin-right: 46px;
        margin-top: 20px;
    }

    .bg-danger{
        top: 221px;
        left: 490px;
    }

    span#cart-count{
        top: 222px;
        left: 442px;
        padding: 7px;
        height: 22px;
        line-height: 8px;
    }

    .Advantages{
        padding: 0px 100px;
        height: 575px;
    }

    .Advantages .advantage-div .Icon-V{
        margin: 0px 33px;
    }

    .Advantages .Advantages-parent h3{
        font-size: 20px;
    }

    .about-section h2{
        padding-top: 65px;
    }

    .Main-image h1{
        font-size: 32px;
    }

    .Main-image .Main-image-a{
        padding: 20px 50px;
        width: 32%;
    }

    .Hairdressing-products .Product a{
        padding: 10px 56px;
    }

    .contact{
        max-width: 700px;
    }

    .about-section p{
        font-size: 19px;
        margin-top: 19px;
    }

    .about-section{
        height: 541px;
    }

        /********** shop page **********/
        .Products-section .grid-container{
            margin-right: -16px;
         }
    
         .Products-section .grid-container{
            grid-template-columns: 190px 190px 190px;
         }

         .Products-section .Product .Product-img{
            width: 90px;
         }
    
         .Products-section .Product a{
            padding: 10px 56px;
         }
         
         .Category-section .Category ul li a.active{
            margin-right: -70px;
            padding: 15px 185px;
         }

         .Category-section .Category ul li a{
            padding: 15px 185px;
            margin-right: -70px;
         }

         .Category-section .Category ul li:first-child{
            margin-right: 70px;
         }

         .Category-section .Category ul li .active{
            padding: 15px 185px;
            margin-right: 0;
         }

         .Category-section .Category ul li{
            margin-bottom: 50px;
         }

         .Category-section .Category ul{
            margin-top: 30px;
            margin-bottom: -40px;
         }

            /********** contact page **********/
        .section-contactus{
            margin-right: 71px;
        }

        .section-contactus .contactus .input-group{
            width: 110%;
            margin-right: -24px;
        }

        .section-contactus .contactus{
            width: 85%;
            margin-bottom: 40px;
        }

        /********** login-form **********/
        form.login-form.login-form2{
            margin-top: 20px;
        }

          /********** checkout page **********/
          .cart-item{
            width: 222px;
        }

        .Main-payment-parent{
            margin-top: 0px;
        }
}


/* LG - Large devices (desktops, 992px and up to 1200)*/
@media (min-width: 992px) and (max-width: 1199.98px) { 
     /********** index page **********/
     .navbar .Div-Login{
        margin-right: 144px;
    }

    .Advantages{
        padding: 0px 100px;
        height: 480px;
    }

    .Advantages .advantage-div .Icon-V{
        margin: 0px 58px;
    }

    .Advantages .Advantages-parent h3{
        font-size: 20px;
    }

    .about-section h2{
        padding-top: 70px;
    }

    .Main-image h1{
        font-size: 40px;
    }

    .Main-image .Main-image-a{
        padding: 20px 50px;
    }

    .Hairdressing-products .Product a{
        padding: 10px 96px;
    }

    .contact{
        max-width: 930px;
    }

    .about-section p{
        font-size: 18px;
    }

     /********** shop page **********/
     .Products-section .grid-container{
        margin-right: -16px;
     }

     .Products-section .grid-container{
        grid-template-columns: 260px 260px 260px;
     }

     .Products-section .Product a{
        padding: 10px 86px;
     }

     
        /********** contact page **********/
        .section-contactus{
            margin-right: 11px;
        }

        .section-contactus .contactus .input-group{
            width: 120%;
            margin-right: -24px;
        }

        /********** checkout page **********/
        .cart-item{
            width: 323px;
        }


}


/* XL - Extra large devices (large desktops, 1200px and up to 1400)*/
@media (min-width: 1200px) and (max-width: 1399.98px) { 

    /********** index page **********/
    .navbar .Div-Login{
        margin-right: 365px;
    }

    .Advantages{
        padding: 0px 100px;
        height: 480px;
    }

    .Advantages .advantage-div .Icon-V{
        margin: 0px 88px;
    }

    .Advantages .Advantages-parent h3{
        font-size: 20px;
    }

    .about-section h2{
        padding-top: 90px;
    }

     /********** shop page **********/
     .Products-section .grid-container{
        margin-right: -16px;
     }

        /********** contact page **********/
        .section-contactus{
            margin-right: 61px;
        }

}


/* XXL - Extra Extra large devices (large desktops, 1400px and up)*/
@media (min-width: 1400px) and (max-width: 1600px) { 
    .navbar .Div-Login{
        margin-right: 603px;
    }

}