

/* responsive start here  */

@media(min-width: 1401px) {

    .container {
        max-width: 1670px;
        padding-left: 15px;
        padding-right: 15px;
    }

}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}




@media(max-width: 1699px) {
    html {
        font-size: 60.5%;
    }

    .banner-inner-sec-all {
        padding-top: 148px;
        padding-bottom: 157px;
    }

    .counter-add-try {
        display: flex;
        align-items: center;
        gap: 2.3rem;
        margin-top: 5.4rem;
        flex-wrap: wrap;
        justify-content:flex-start;
    }
    .counter-add-try .quantity,
    .counter-add-try #add-to-cart-form,
    .counter-add-try .comn-btn-logout {
        flex-grow:unset;
    }
    .comm_modal .head {
        font-size: 4rem;
        line-height: 5rem;
    }
    
    #custmAwareness .modal-content {
        padding:8rem 4rem 4rem!important;
    }
    #custmAwareness .discrp{
        font-family: "Yantramanav", sans-serif !important;
        font-size: 2.4rem;
        line-height: 3.4rem; 
    }
    .newsletter_form input,
    .newsletter_form button.bt {
        font-size: 3rem;
        line-height: 4rem;     
    }
    .newsletter_form input::-webkit-input-placeholder {
        font-size: 3rem;   
        line-height: 4rem;
      }
      .newsletter_form input::placeholder {
        font-size: 3rem;   
        line-height: 4rem;
      }
      .newsletter_form input::-moz-placeholder  {
        font-size: 3rem;   
        line-height: 4rem;
      }
      .custom-checkbox.newsletter_checkbox label span {
        font-size: 2.4rem;
        line-height: 2rem;
    }

}


@media(max-width: 1499px) {
    html {
        font-size: 57.5%;
    }

    .inner-women-black {
        background-color: #00000080;
        padding: 17.5rem 0;
    }

    .inner-bac-black {
        background: #0000001A;
        padding: 15.8rem 0;
    }

    .banner-inner-sec-all {
        padding-top: 148px;
        padding-bottom: 157px;
    }

    .my-profile-name {
        align-items: center;
        padding: 1.5rem 1.0rem 1.5rem 2.0rem;
    }

    .inner-login-wrapper p {
        font-size: 1.8rem;
        line-height: 2.334rem;
        padding-bottom: 5rem;
    }

    .head-sec {
        font-size: 3.9rem;
        line-height: 5.1rem;
        margin-bottom: 4.0rem;
    }

    .cards-main-inner {
        gap: 64px;
    }
    .icoms-prof {
        column-gap: 3rem;   
        row-gap: 1.5rem;
    }
    .main-img-slider-nav figure {
        padding-bottom: 137%;
    }
    .counter-add-try {
        margin-top: 4rem;
    }
}

@media(max-width: 1299px) {
    html {
        font-size: 54.5%;
    }

    .inner-wid-banner {
        max-width: 79.3rem;
        width: 100%;
        margin: auto;
    }

    .inner-wid-banner h1 {
        font-size: 8rem;
        line-height: 8.1rem;
        margin-top: 3.0rem;
        padding-bottom: 5.0rem;
    }

    .inner-bac-black {
        background: #0000001A;
        padding: 12.8rem 0;
    }

    .banner-inner-sec-all {
        padding-top: 105px;
        padding-bottom: 124px;
    }

    .banner-inner-sec-all h2 {
        font-size: 6rem;
        line-height: 8.1rem;
        margin-bottom: 1.0rem;
    }


}


@media(max-width: 1199px) {

    .back-color-sec2 {
        padding: 10px 34px 10px 30px;
    }

    .head-sec {
        font-size: 3.5rem;
        line-height: 5.1rem;
        margin-bottom: 4.0rem;
    }

    .items-sec {
        padding: 35px;
    }

    .first-item-main {
        max-width: 392px;
        gap: 20px;
        align-items: center;
        flex-direction: column;
    }

    .text-main-items {
        font-size: 2.0rem;
        text-align: center;
    }

    .inner-women-black {
        background-color: #00000080;
        padding: 11.5rem 0;
    }

    .quick-links-less {
        padding-left: 4rem;
    }

    .footer-disc img {
        width: 100%;
    }

    .quick-links {
        padding-left: 5rem;
    }

    .inner-wid-banner h1 {
        font-size: 7rem;
        line-height: 8.1rem;
        margin-top: 3.0rem;
        padding-bottom: 5.0rem;
    }

    .inner-bac-black {
        background: #0000001A;
        padding: 9.8rem 0;
    }

    .uuper-namne-tag {
        gap: 15px;
        padding: 19px 15px 16px 14px;
    }

    .comn-inpt-main {
        margin-bottom: 2.1rem;
    }

    .comn-inpt-main input {
        font-size: 1.6rem;
        line-height: 2.075rem;
        padding: 1.6rem 3.0rem;
    }

    .round-anme {
        width: 57px;
        height: 57px;
    }

    .inner-privacy-content {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }
    .cart-section .card-total {
        padding: 0 1.9rem 2.0rem 1.9rem;
        border-radius: 4px;
    }
    .cart-section {
        padding: 4rem;
    }
    .cart-section .mycart table tr th, .mycart table tr td {
        padding: 11px 14px !important;
    }
    .cst_ai_clr_pick_row {
        flex-direction: column;
    }
    .colors-container {
        padding-left: 0px!important;
    }


}

@media(max-width: 991px) {

    .back-color-sec2 {
        padding: 40px 34px 40px 30px;
    }

    .card-main-inner {
        width: 33.33%;
        padding-left: 12px;
        padding-right: 12px;
    }

    .the-look {
        padding-top: 8rem;
        padding-bottom: 8rem;
    }

    .inner-wid-banner h1 {
        font-size: 6rem;
        line-height: 6.1rem;
        margin-top: 3.0rem;
        padding-bottom: 5.0rem;
    }

    .inner-wid-banner {
        max-width: 59.3rem;
        width: 100%;
        margin: auto;
    }

    .cards-main-inner {
        gap: 20px;
    }

    .text-main-items {
        font-size: 1.6rem;
        text-align: center;
        line-height: 2.8rem;
    }

    .upper-righ-btn {
        margin-bottom: 4.3rem;
    }

    .head-sec {
        font-size: 3.1rem;
        line-height: 4.1rem;
        margin-bottom: 4.0rem;
    }

    .quick-links-less {
        padding-left: 3rem;
    }

    .footer-disc img {
        width: 100%;
        max-width: 277px;
    }

    .quick-links {
        padding-left: 0rem;
    }

    .quick-links-less {
        padding-left: 0rem;
    }

    .quick-link-two ul li a {
        color: #CCCCCC;
        margin-bottom: 2.0rem;
    }

    .navbar-nav {
        gap: 1rem;
        align-items: center;
        flex-direction: row;
    }

    .navbar-brand img {
        max-width: 200px;
    }

    .footer-disc a {
        font-size: 32px;
        line-height: 48px;
        padding-bottom: 14px;
    }

    .footer-wrapper {
        padding-top: 4.7rem;
    }

    .upper-btns-ham {
        background-color: var(--main-color);
        padding: 10px;
        border-radius: 5px;
        cursor: pointer;
        margin-right: 15px;
    }

    .uuper-namne-tag .fa-bars {
        display: block;
        color: white;
        font-size: 13px;
    }

    .mystyle .pofile-names .flex-column.nav-pills {
        height: 100%;
    }

    .flex-column.nav-pills {
        overflow: hidden;
        height: 0;
        width: 100%;
    }

    .pofile-names {
        position: absolute;
        /* background-color: #f4f4f4; */
        width: 100%;
        z-index: 9;
        width: 100%;
        /* box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; */
        background: rgb(244 244 244 / 42%);
        border-radius: 16px;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
        backdrop-filter: blur(10.9px);
        background-color: #ffffffcf;
        -webkit-backdrop-filter: blur(10.9px);
        /* border: 1px solid rgba(255, 255, 255, 1); */
        z-index:15;
    }

    .inner-left-tabs {
        position: relative;
    }

    .inner-left-tabs {
        overflow: visible;
    }

    .modal-content {

        padding: 4.5rem;
    }

    .inner-ody-logout h2 {
        font-size: 2.8rem;
        line-height: 5.269rem;
        max-width: 466px;
        padding-bottom: 3.6rem;
    }

    .logout-modal .modal-dialog {
        max-width: 691px;
    }

    .comn-btn-logout {
        max-width: 232px;
    }

    .inner-wrapper-contact h2 {
        font-size: 3.4rem;
        margin-bottom: 3.5rem;
    }
    .add_new_address_form {
        margin: 5rem 1.6rem;
        max-width: 100%;
    }
    .main-img-slider-nav figure {
        padding-bottom: 125%;
    }
    .inner-vntage-main {
        padding-left: 10px;
    }
    .counter-add-try {
        margin-top: 3rem;
    }
 
    .cst_ai_result_row .cmon-color-div {
        width: 7rem;
        height: 6rem;
    }
    .ai_clr_pick_image {
        padding-bottom: 100%;
    }
    .main-step-div {
        padding-top: 7rem;
    }
    .cst_chart_page_right {
        margin-right: auto;
    }
    .shop_cs_head .dropdown-menu {
        position: relative;
        top: 0 !important;
        left: unset !important;
    }
    .shop_cs_head .dropdown-toggle::after {
        transform: rotate(90deg);
    }
    .comm_modal .head {
        font-size: 3.6rem;
        line-height: 4.6rem;
    }
    
    #custmAwareness .modal-content {
        padding:8rem 2rem 2rem!important;
    }
    #custmAwareness .discrp{
        font-family: "Yantramanav", sans-serif !important;
        font-size: 2rem;
        line-height: 3rem; 
    }
    
    

}

@media(max-width: 767px) {
    .inner-login-wrapper h2 {
        font-size: 4.4rem;
        font-weight: 500;
        line-height: 4.8rem;
        text-align: center;
        margin-bottom: 1.8rem;
    }

    .first-item-main figure {
        width: 68px;
        height: 68px;
    }

    .items-sec {
        padding: 14px;
    }

    .text-main-items {
        font-size: 1.6rem;
        text-align: center;
        line-height: 2.0rem;
    }

    .comn-btn-blue {
        font-size: 1.5rem;
        padding: 1.7rem 3.6rem;
        letter-spacing: 0.5rem;
    }

    .inner-women-black {
        background-color: #00000080;
        padding: 4.5rem 0;
    }

    .comn-btn {
        font-size: 1.3rem;
        padding: 1.7rem 2.6rem;
    }

    .head-sec {
        font-size: 3.1rem;
        line-height: 4.1rem;
        margin-bottom: 2rem;
    }

    .navbar-brand img {
        max-width: 155px;
    }

    .back-color-sec4 {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .the-look {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }

    .favourite-account .card-main-inner {
        width: 50%;
        padding-left: 12px;
        padding-right: 12px;
    }

    .disc-rate-main {
        padding-top: 1.7rem;
    }

    .profilecomn-btn-blue {
        font-size: 1.5rem;
        padding: 1.5rem 2.1rem;
    }

    .banner-inner-sec-all {
        padding-top: 84px;
        padding-bottom: 84px;
    }

    .banner-inner-sec-all h2 {
        font-size: 5rem;
        line-height: 8.1rem;
        margin-bottom: 1.0rem;
    }

    .inner-ody-logout h2 {
        font-size: 2.5rem;
        line-height: 4.269rem;
        max-width: 466px;
        padding-bottom: 3.6rem;
    }

    .modal-content {
        padding: 3.5rem;
    }

    .head-faq {
        font-size: 3.0rem;
        line-height: 4.0rem;
        margin-bottom: 3rem;
    }

    .comn-inpt-clas {
        margin-bottom: 1.4rem;
    }

    .comn-inpt-clas label {
        font-size: 1.8rem;
        margin-bottom: 1.1rem;
    }
    .cart-section .mycart .quantity span {
        font-size: 14px;
        padding: 14px 0 14px 11px;
    }
    .cart-section .mycart .quantity span.plus {
        padding: 14px 14px 11px 0px;
    }
    .cart-section .mycart .quantity input {
        width: 56px;
        height: 4.8rem;
    }
    .upper-cart-table{
    overflow: auto;
    }
    .upper-cart-table table{
        width: 600px;
    }
    .cart-section .mycart .table-btn a {
        border: 1px solid var(--main-color);
        padding: 1.6rem 2.0rem;
    }
    .inner-main-filter {
        margin-right: 0;
    }
    .container, .container-fluid {
        padding-right: 1.5rem!important;
        padding-left: 1.5rem!important;
    }
    .header_logo {
        width: 100%;
        order: -1;
        text-align: center;
    }
    .cards-the-look {
        justify-content: center;
    }
    .login-flex {
        height: auto;
        margin-top: 7rem;
    }
    .main-img-slider-nav figure {
        padding-bottom: 132%;
    }
    .tabs-discript .nav-tabs {
        gap: 3rem;
        row-gap: 1rem;
    }
    .tabs-discript {
        padding: 5rem 0;
    }
    .innerdesc-tabs .wrp-inner-disc{
        padding-left:0!important;
    }
    .cards-the-look.cards-the-look2{
        justify-content: flex-start;
    }
    #msform .action-button-previous {
        padding: 1.7rem 3.6rem;
    }
    .question_main_box .cmon-color-div {
        width: 11rem;
        height: 11rem;
    }
    .question_main_box .main-step-div {
        padding-top: 5rem;
    }
    .question_main_box  .head-stepform {
        margin-bottom: 3rem;
    }
    .cmon-img-eye-div {
        width: 18rem;
        height: 13rem;
    }
    #msform .comm_step_checkBox-inner .card-head-select.img-dicrp {
        font-size: 1.2rem;
        padding: 0.5rem;
    }
    .custm-chat-head {
        padding-top: 6rem;
    }
}

@media(max-width: 575px) {
    .main-img-slider-for.slick-slide {
        margin: 0;
    }    
    .main-img-slider-nav {
        margin: 0px 0px 7px 0;
    }   
    .main-img-slider-nav figure {
        padding-bottom: 122%;
    }
    .counter-add-try .quantity input {
        width: 60px !important;
    }
    .login-head {
        display: flex;        
        flex-wrap: wrap;
        gap:2rem;
    }
    .login-head figure {
        max-width: 200px;
    }
    .login-head figure img {
        width: 100%;
        height: 100%;
    }
    .cmon-img-eye-div {
        width: 16rem;
        height: 10rem;
    }
    .color-skin-step3 .color-skin-three .cmon-img-eye-div {
        width: 11rem;
        height: 9rem;
    }
    .cmon-img-eye-div figure {
        padding-bottom: unset;
    }
    .newsletter_form_inner{
        flex-wrap:wrap;
    }
    .inner-nav-all a {
        max-width: 20rem;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

  

}

@media(max-width: 552px) {
    html {
        font-size: 53.5%;
    }

    .inner-login-wrapper h2 {
        font-size: 3.6rem;
        font-weight: 500;
        line-height: 4.8rem;
        text-align: center;
        margin-bottom: 1.8rem;
    }

    .remember-main-marg {
        margin-bottom: 4rem;
    }

    .main-inp-div {
        margin-bottom: 20px;
    }

    .inner-login-wrapper p {
        font-size: 1.8rem;
        line-height: 2.334rem;
        padding-bottom: 4rem;
    }

    .login-amin {
        padding-left: 10px;
        padding-right: 10px;
    }

    .custom-checkbox label::after {
        left: 7px;
        top: 1px;
        width: 7px;
    }

    .comn-btn-blue {
        font-size: 1.4rem;
        padding: 1.7rem 2.6rem;
        letter-spacing: 0.4rem;
    }

    .card-main-inner {
        width: 50%;
        padding-left: 7.5px;
        padding-right: 7.5px;
    }

    .head-sec {
        font-size: 2.6rem;
        line-height: 4.1rem;
        margin-bottom: 1.6rem;
    }

    .back-color-sec2 {
        padding: 31px 20px 31px 20px;
    }

    .inner-wid-banner h1 {
        font-size: 5rem;
        line-height: 5.1rem;
        margin-top: 2rem;
        padding-bottom: 3rem;
    }

    .new-btn {
        line-height: 15.56px;
        padding: 0.6rem 1.5rem;
        top: 8px;
        left: 8px;
    }

    .inner-bac-black {
        background: #0000001A;
        padding: 4.8rem 0;
    }

    .add-to-card {
        padding: 1.3rem 1.0rem;
        font-size: 1.5rem;
    }

    .disc-rate-main {
        padding-top: 1.7rem;
    }

    .navbar-brand {
        width: 100%;
        text-align: center;
        order: 1;
    }

    .navbar-nav {
        order: 2;
        margin-top: 4px;
    }
    input.form-control.search-country {
        padding: 10px;
    }

    .gap-amin-upper-language {
        order: 3;
    }

    .navbar-brand img {
        max-width: 165px;
    }

    .navigation__checkbox:checked+.navigation__button .navigation__icon {
        width: 5rem;
        height: 5rem;
    }

    .navigation__link:link,
    .navigation__link:visited {
        padding: 0.6rem 2rem;
        font-size: 2.5rem;
    }

    .search-ofcanvas h3 {
        font-size: 3.2rem;
        line-height: 5.1rem;
        margin-bottom: 2rem;
        margin-top: 1.5rem;
    }

    .navbar>.container {
        padding-top: 15px;
        padding-bottom: 15px;
        gap:15px;
        align-items: flex-start;
    }

    .cards-main-inner {
        gap: 22px;
        flex-wrap: wrap;
    }

    .table-main-listng {
        overflow: auto;
    }

    .table-main-listng table {
        width: 500px;
    }

    .profile-img {
        width: 11.4rem;
        height: 11.4rem;
    }

    .gap-main {
        gap: 23px;
        margin-bottom: 4.6rem;
    }

    .inner-ody-logout h2 {
        font-size: 2.1rem;
        line-height: 3.269rem;
        max-width: 466px;
        padding-bottom: 2.6rem;
    }

    .comn-btn-logout {
        font-size: 1.3rem;
        padding: 1.7rem 1.0rem;
        letter-spacing: 0.3rem;
        max-width: 145px;
    }

    .favourite-account .card-main-inner {
        width: 50%;
        padding-left: 8px;
        padding-right: 8px;
    }

    .contact-us-inner {
        padding-top: 7rem;
        padding-bottom: 7rem;
    }

    .banner-inner-sec-all h2 {
        font-size: 3.7rem;
        line-height: 6.1rem;
        margin-bottom: 1.0rem;
    }

    .banner-inner-sec-all {
        padding-top: 64px;
        padding-bottom: 64px;
    }
    .cart-section .mycart .table-btn a {
        padding: 1.6rem 1rem;
        letter-spacing: 0.3rem;
    }
    .cart-section {
        padding: 3rem 2rem;
    }
    .cart-section .mycart .table-btn a {
        padding: 1.5rem 0.7rem;
        letter-spacing: 0.3rem;
        font-size: 1.3rem;
    }
    .cst_translate_row {
        order: 3;  
    }
    .upper-head-main-recent{
        margin-bottom:3rem;
    }
    .cards-the-look {
        margin: 0 -7.5px;
        justify-content: center;
    }
    .cards-the-look #product-list {
        padding: 0;
    }
    .best_ses_btn_row{
        flex-wrap:wrap;
        gap:1.2rem;
    }
    .comn-inpt-main input {
        padding: 1.6rem;
    }
    .card-main-text-inner {
        padding: 24px;
    }
    .comn-inpt-main select {
        background-size: 18px !important;
    }  
        #msform .action-button-previous {
        padding: 1.7rem 2.6rem;
    }
    .question_main_box .cmon-color-div {
        width: 100%;
        height: 8rem;
        min-width: 6rem;
    }
    .cmon-img-eye-div {
        width: 100%;
        height: 8rem;
    }
    .shop_cs_head .dropdown-toggle::after {
        font-size: 2.5rem;
    }
    .custm-aware p.discrp {
        font-size: 1.6rem;
        line-height: 3.039rem;
    }
    .custm-aware h6.head {
        font-size: 3rem;
        line-height: 3.269rem;
        margin-bottom: 2rem;
    }
    .modal-aware-ness .btn-close {
        right: 14px;
        font-size: 15px;
    }

}



@media(max-width: 425px) {
    .main-inp-div input {
        font-size: 1.6rem;
        padding: 1.5rem 3.0rem;
    }

    .main-inp-div label {
        font-size: 1.6rem;
        font-weight: 500;
        line-height: 2.075rem;
        text-align: left;
        margin-bottom: 6px;
        color: #111111;
    }
    .payemt_mewthod_row {
        padding: 1.4rem;
    }


    .gap-amin-upper-language {
        gap: 1rem;
    }

    .inner-wid-banner h1 {
        font-size: 3rem;
        line-height: 4.1rem;
        margin-top: 2rem;
        padding-bottom: 3rem;
    }

    .comn-btn {
        font-size: 1.3rem;
        padding: 1.3rem 2.0rem;
    }

    .inner-wid-banner {
        max-width: 31.3rem;
        width: 100%;
        margin: auto;
    }

    .head-sec {
        font-size: 2.2rem;
        line-height: 3.1rem;
        margin-bottom: 1.6rem;
    }

    .disc-rate-main h5 {
        font-size: 2.0rem;
        line-height: 2.664rem;
        margin-bottom: 1px;
    }

    .cards-main-inner {
        gap: 25px;
        flex-wrap: wrap;
    }

    .comn-btn-blue {
        font-size: 1.3rem;
        padding: 1.7rem 1.6rem;
        letter-spacing: 0.4rem;
    }

    .footer-disc img {
        width: 100%;
        max-width: 229px;
    }

    .upper-main-stip img {
        max-width: 100px;
    }

    .upper-main-stip img {
        max-width: 77px;
    }

    .banner-inner-sec-all {
        padding-top: 63px;
        padding-bottom: 61px;
    }

    .banner-inner-sec-all h2 {
        font-size: 3rem;
        line-height: 4.1rem;
        margin-bottom: 1.0rem;
    }

    .navigati-banner a {
        font-size: 1.5rem;
    }

    .comn-padd {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }

    .edit-profile-main {
        padding: 2rem;
        border-radius: 1.0rem;
    }

    .cards-the-look {
        flex-wrap: wrap;
        row-gap: 2rem;
    }

    .profilecomn-btn-blue {
        font-size: 1.4rem;
        padding: 1.4rem 1.7rem;
    }

    .modal-content {
        padding: 1.5rem;
    }

    .inner-faq .accordion-button {
        font-size: 1.8rem;
        line-height: 2.4rem;
        padding: 1.5rem 1.5rem;
    }

    .inner-wrapper-contact h2 {
        font-size: 3.0rem;
        margin-bottom: 3.5rem;
    }

    .comn-inpt-clas {
        margin-bottom: 1.1rem;
    }

    .comn-inpt-clas label {
        font-size: 1.8rem;
        margin-bottom: 1.0rem;
    }
    .cart-section .Coupon-details .input-group {
        flex-direction: column;
        padding: 0 1.8rem;
    }
    .cart-section .card-total button.comn-btn.checkout-btn, .cart-section .Coupon-details button.coupon-btn {
        margin: 2.4rem 0;
        padding: 1.4rem 1.6rem;
        
    }
    .order-details-wrapper .order-actions {
        flex-direction: column;        
    }
    .order-details-wrapper .order-actions button {
        max-width: 100%;
    }
    .order-details-wrapper {
        padding: 1.5rem;
    }
    .comm_pass_input_wrapper .pass {
        top: 1rem;
    }
    .cst_translate_row {
        flex-direction: column;
        justify-content: flex-end;
        align-items: flex-end;
    }
    #msform .action-button-previous {
        padding: 1.7rem 1.6rem;
    }

}

