@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&family=Pacifico&family=Roboto:wght@300;400;500&display=swap);
.lang_switcher {
    position: relative;
    margin-right: 20px;  }
  
  .current_lang {
    color: #ffffff;
       font-size: 20px;
    font-weight: 500;
    cursor: pointer;
    text-transform: uppercase;
  }
 
  .current_lang svg {
    transition: 0.3s;
  }
  
  .langs {
    display: none;
    position: absolute;
    top: 30px;
    right: 0;
    border: 1px solid #d9d9d9;
    border-radius: 10px;
    box-shadow: 0px 11px 30px 0px rgba(0, 0, 0, 0.1);
    background: #ffffff;
    padding: 10px;
    z-index: 99;
    text-transform: uppercase;
    text-align: center;
  }
  
  .open_langs {
    transform: rotate(180deg);
  }
  .lang_item:nth-child(2) {
    margin-top: 10px;
  }
  .lang_item a {
    color: hsl(var(--base));
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
  }
  
  .lang_item a:hover {
    color: hsl(var(--base));
  }

  

.slick-dots li,
a,
span {
    display: inline-block
}

a,
body {
    color: hsl(var(--body-color))
}

*,
ol,
ul {
    padding: 0;
    margin: 0;
    list-style: none
}

.section-heading__title.style-two::after,
.section-heading__title.style-two::before {
    position: absolute;
    content: "";
    bottom: 0;
    transform: translateX(-50%);
    width: 15px;
    height: 3px;
    border-radius: 5px;
    background-color: hsl(var(--base))
}

.slick-arrow,
.slick-initialized.slick-slider .slick-track,
body {
    display: flex
}

.slick-arrow,
a,
button {
    transition: .2s linear
}

.close-sidebar,
.scroll-top,
button,
select {
    cursor: pointer
}

.body-overlay.show-overlay,
.product-item:hover .product-item__icon,
.scroll-top.show,
.sidebar-overlay.show {
    visibility: visible;
    opacity: 1
}

.breadcumb__wrapper,
.btn,
.client-logo,
.close-sidebar,
.contact-item__content,
.contact-list__icon,
.feature-item,
.filter,
.product-item,
.product-item__price,
.product-item__thumb,
.product-item__title,
.section-heading {
    text-align: center
}

.service-18 a,
a {
    text-decoration: none
}

:root {
    --heading-font: "Nunito", sans-serif;
    --title-font: "Pacifico", cursive;
    --body-font: "Roboto", sans-serif;
    --heading-one: clamp(1.5rem, 2.8vw + 1rem, 4.75rem);
    --heading-two: clamp(1.5rem, 1.7vw + 1rem, 2.875rem);
    --heading-three: clamp(1.375rem, .8vw + 1rem, 2.25rem);
    --heading-four: clamp(1.125rem, .5vw + 1rem, 1.5rem);
    --heading-five: clamp(1.0625rem, .3vw + 1rem, 1.125rem);
    --heading-six: 1rem;
    --white: 0 0% 100%;
    --light-h: 0;
    --light-s: 0%;
    --light-l: 78%;
    --light: var(--light-h) var(--light-s) var(--light-l);
    --black-h: 0;
    --black-s: 0%;
    --black-l: 20%;
    --black: var(--black-h) var(--black-s) var(--black-l);
    --heading-color: var(--black);
    --body-color: 0 0% 47%;
    --border-color: 0 0% 88%;
    --body-background: 214 100% 99%;
    --section-bg: 208 100% 97%;
    --section-bg-two: 0 -39% 94%;
    --heading-bg: 30 100% 97%;
    --footer-two-bg: 190 100% 94%;
    --header-box-shadow: 0px -1px 15px 3px hsl(var(--black) /.3);
    --mobile-box-shadow: 0px -1px 5px 0px hsl(var(--black) /.92);
    --box-shadow: 0px 2px 15px hsl(var(--black) /.05);
    --red: 11 95% 49%;
    --green-two: 137 87% 42%;
    --blue-two: 241 100% 68%;
    --yellow-two: 45 100% 68%;
    --base-h: 19;
    --base-s: 86%;
    --base-l: 49%;
    --base: var(--base-h) var(--base-s) var(--base-l);
    --base-d-100: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.1);
    --base-d-200: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.2);
    --base-d-300: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.3);
    --base-d-400: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.4);
    --base-d-500: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.5);
    --base-d-600: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.6);
    --base-d-700: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.7);
    --base-d-700: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.7);
    --base-d-800: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.8);
    --base-d-800: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.8);
    --base-d-900: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.9);
    --base-l-100: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.1);
    --base-l-200: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.2);
    --base-l-300: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.3);
    --base-l-400: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.4);
    --base-l-500: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.5);
    --base-l-600: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.6);
    --base-l-700: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.7);
    --base-l-800: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.8);
    --base-l-900: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.9);
    --background-gradient: linear-gradient(45deg, hsl(var(--base)), hsl(var(--base-two)));
    --base-two-h: 180;
    --base-two-s: 58%;
    --base-two-l: 48%;
    --base-two: var(--base-two-h) var(--base-two-s) var(--base-two-l);
    --base-two-d-100: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.05);
    --base-two-d-200: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.1);
    --base-two-d-300: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.2);
    --base-two-d-400: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.3);
    --base-two-d-500: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.4);
    --base-two-d-600: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.5);
    --base-two-d-700: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.6);
    --base-two-d-800: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.7);
    --base-two-d-900: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.8);
    --base-two-l-100: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.05);
    --base-two-l-200: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.1);
    --base-two-l-300: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.2);
    --base-two-l-400: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.3);
    --base-two-l-500: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.4);
    --base-two-l-600: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.5);
    --base-two-l-700: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.6);
    --base-two-l-800: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.7);
    --base-two-l-900: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.8);
    --dark-h: 0;
    --dark-s: 0%;
    --dark-l: 20%;
    --dark: var(--dark-h) var(--dark-s) var(--dark-l);
    --dark-d-100: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.1);
    --dark-d-200: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.2);
    --dark-d-300: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.3);
    --dark-d-400: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.4);
    --dark-d-500: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.5);
    --dark-d-600: var(--dark-h) var(--dark-s) calc(var(--dark-l) - var(--dark-l) * 0.6);
    --dark-l-100: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.1);
    --dark-l-200: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.2);
    --dark-l-300: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.3);
    --dark-l-400: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.4);
    --dark-l-500: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.5);
    --dark-l-600: var(--dark-h) calc(var(--dark-s)) calc(var(--dark-l) + (100% - var(--dark-l)) * 0.6);
    --primary-h: 254;
    --primary-s: 100%;
    --primary-l: 73%;
    --primary: var(--primary-h) var(--primary-s) var(--primary-l);
    --primary-d-100: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.1);
    --primary-d-200: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.2);
    --primary-d-300: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.3);
    --primary-d-400: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.4);
    --primary-d-500: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.5);
    --primary-l-100: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.1);
    --primary-l-200: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.2);
    --primary-l-300: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.3);
    --primary-l-400: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.4);
    --primary-l-500: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.5);
    --primary-l-600: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.6);
    --secondary-h: 210;
    --secondary-s: 11%;
    --secondary-l: 71%;
    --secondary: var(--secondary-h) var(--secondary-s) var(--secondary-l);
    --secondary-d-100: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.1);
    --secondary-d-200: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.2);
    --secondary-d-300: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.3);
    --secondary-d-400: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.4);
    --secondary-d-500: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.5);
    --secondary-l-100: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.1);
    --secondary-l-200: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.2);
    --secondary-l-300: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.3);
    --secondary-l-400: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.4);
    --secondary-l-500: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.5);
    --secondary-l-600: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.6);
    --success-h: 115;
    --success-s: 100%;
    --success-l: 47%;
    --success: var(--success-h) var(--success-s) var(--success-l);
    --success-d-100: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.1);
    --success-d-200: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.2);
    --success-d-300: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.3);
    --success-d-400: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.4);
    --success-d-500: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.5);
    --success-l-100: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.1);
    --success-l-200: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.2);
    --success-l-300: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.3);
    --success-l-400: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.4);
    --success-l-500: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.5);
    --success-l-600: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.6);
    --danger-h: 0;
    --danger-s: 96%;
    --danger-l: 63%;
    --danger: var(--danger-h) var(--danger-s) var(--danger-l);
    --danger-d-100: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.1);
    --danger-d-200: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.2);
    --danger-d-300: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.3);
    --danger-d-400: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.4);
    --danger-d-500: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.5);
    --danger-l-100: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.1);
    --danger-l-200: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.2);
    --danger-l-300: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.3);
    --danger-l-400: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.4);
    --danger-l-500: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.5);
    --danger-l-600: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.6);
    --warning-h: 29;
    --warning-s: 88%;
    --warning-l: 59%;
    --warning: var(--warning-h) var(--warning-s) var(--warning-l);
    --warning-d-100: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.1);
    --warning-d-200: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.2);
    --warning-d-300: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.3);
    --warning-d-400: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.4);
    --warning-d-500: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.5);
    --warning-l-100: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.1);
    --warning-l-200: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.2);
    --warning-l-300: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.3);
    --warning-l-400: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.4);
    --warning-l-500: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.5);
    --warning-l-600: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.6);
    --info-h: 196;
    --info-s: 100%;
    --info-l: 50%;
    --info: var(--info-h) var(--info-s) var(--info-l);
    --info-d-100: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.1);
    --info-d-200: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.2);
    --info-d-300: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.3);
    --info-d-400: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.4);
    --info-d-500: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.5);
    --info-l-100: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.1);
    --info-l-200: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.2);
    --info-l-300: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.3);
    --info-l-400: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.4);
    --info-l-500: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.5);
    --info-l-600: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.6);
    --violet-h: 251;
    --violet-s: 96%;
    --violet-l: 63%;
    --violet: var(--violet-h) var(--violet-s) var(--violet-l);
    --violet-d-100: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.1);
    --violet-d-200: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.2);
    --violet-d-300: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.3);
    --violet-d-400: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.4);
    --violet-d-500: var(--violet-h) var(--violet-s) calc(var(--violet-l) - var(--violet-l) * 0.5);
    --violet-l-100: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.1);
    --violet-l-200: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.2);
    --violet-l-300: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.3);
    --violet-l-400: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.4);
    --violet-l-500: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.5);
    --violet-l-600: var(--violet-h) calc(var(--violet-s)) calc(var(--violet-l) + (100% - var(--violet-l)) * 0.6);
    --yellow-h: 50;
    --yellow-s: 100%;
    --yellow-l: 50%;
    --yellow: var(--yellow-h) var(--yellow-s) var(--yellow-l);
    --yellow-d-100: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.1);
    --yellow-d-200: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.2);
    --yellow-d-300: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.3);
    --yellow-d-400: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.4);
    --yellow-d-500: var(--yellow-h) var(--yellow-s) calc(var(--yellow-l) - var(--yellow-l) * 0.5);
    --yellow-l-100: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.1);
    --yellow-l-200: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.2);
    --yellow-l-300: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.3);
    --yellow-l-400: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.4);
    --yellow-l-500: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.5);
    --yellow-l-600: var(--yellow-h) calc(var(--yellow-s)) calc(var(--yellow-l) + (100% - var(--yellow-l)) * 0.6);
    --green-h: 91;
    --green-s: 51%;
    --green-l: 51%;
    --green: var(--green-h) var(--green-s) var(--green-l);
    --orange-h: 41;
    --orange-s: 97%;
    --orange-l: 53%;
    --orange: var(--orange-h) var(--orange-s) var(--orange-l);
    --purple-h: 230;
    --purple-s: 48%;
    --purple-l: 41%;
    --purple: var(--purple-h) var(--purple-s) var(--purple-l);
    --blue-h: 189;
    --blue-s: 100%;
    --blue-l: 85%;
    --blue: var(--blue-h) var(--blue-s) var(--blue-l);
    --pink-h: 348;
    --pink-s: 98%;
    --pink-l: 68%;
    --pink: var(--pink-h) var(--pink-s) var(--pink-l)
}

* {
    box-sizing: border-box
}

body {
    font-family: var(--heading-font);
    word-break: break-word;
    background-color: hsl(var(--body-background));
    min-height: 100vh;
    flex-direction: column
}

h1,
h1>a,
h2,
h2>a,
h3,
h3>a,
h4,
h4>a,
h5,
h5>a,
h6,
h6>a {
    word-break: break-word;
    color: hsl(var(--heading-color))
}

p {
    font-family: var(--body-font);
    font-size: 16px;
    margin: 0;
    font-weight: 400;
    word-break: break-word
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 15px;
    font-family: var(--heading-font);
    line-height: 1.3
}

h1 {
    font-size: var(--heading-one);
    font-weight: 700
}

h2 {
    font-size: var(--heading-two);
    font-weight: 600
}

h3,
h4,
h5,
h6 {
    font-weight: 500
}

h3 {
    font-size: var(--heading-three)
}

h4 {
    font-size: var(--heading-four)
}

h5 {
    font-size: var(--heading-five)
}

h6 {
    font-size: var(--heading-six)
}

h1>a,
h2>a,
h3>a,
h4>a,
h5>a,
h6>a {
    font-weight: 600;
    transition: .2s linear;
    line-height: 1.4
}

.about-us-footer__link,
.product-item:hover .product-item__title-link,
a:hover {
    color: hsl(var(--base))
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle
}

:focus {
    outline: 0
}

.btn:focus,
.form-select:focus,
button:focus {
    outline: 0;
    box-shadow: none
}

.section-heading {
    margin-bottom: 50px
}

.section-heading__subtitle {
    font-size: 20px;
    font-weight: 400;
    font-family: var(--title-font);
    margin-bottom: 10px;
    color: hsl(var(--base))
}

.section-heading__title {
    position: relative;
    padding-bottom: 20px;
    font-weight: 900;
    margin-bottom: 0;
    color: hsl(var(--black))
}

.banner-thumb,
.contact-list.style-two,
.feature-product-section,
.input--group,
.offer-section .offer,
.section-heading__title.style-four,
.section-heading__title.style-two {
    position: relative
}

.section-heading__title.style-two::before {
    left: 48%
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-two::before {
        left: 47%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-two::before {
        left: 46.5%
    }
}

@media screen and (max-width:767px) {

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin: 0 0 15px
    }

    .section-heading__title.style-two::before {
        left: 45.5%
    }
}

.section-heading__title.style-two::after {
    right: 47%
}

.section-heading__title.style-three::after,
.section-heading__title.style-three::before {
    position: absolute;
    transform: translateX(-50%);
    border-radius: 5px;
    background-color: hsl(var(--white));
    content: "";
    bottom: 0;
    width: 15px;
    height: 3px
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-two::after {
        right: 46%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-two::after {
        right: 45%
    }
}

@media screen and (max-width:767px) {
    .section-heading__title.style-two::after {
        right: 43%
    }
}

.section-heading__title.style-three::before {
    left: 48%
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-three::before {
        left: 47%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-three::before {
        left: 46.5%
    }
}

@media screen and (max-width:767px) {
    .section-heading__title.style-three::before {
        left: 45.5%
    }
}

.section-heading__title.style-three::after {
    right: 47%
}

.section-heading__bars,
.section-heading__title.style-four::after,
.section-heading__title.style-four::before {
    border-radius: 5px;
    background-color: hsl(var(--base));
    position: absolute;
    transform: translateX(-50%)
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-three::after {
        right: 46%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-three::after {
        right: 45%
    }
}

@media screen and (max-width:767px) {
    .section-heading__title.style-three::after {
        right: 43%
    }
}

.section-heading__title.style-four::before {
    content: "";
    left: 47%;
    bottom: 0;
    width: 15px;
    height: 3px
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-four::before {
        left: 46.5%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-four::before {
        left: 46%
    }
}

@media screen and (max-width:767px) {
    .section-heading__title.style-four::before {
        left: 45.5%
    }
}

.section-heading__title.style-four::after {
    content: "";
    right: 46%;
    bottom: 0;
    width: 15px;
    height: 3px
}

@media screen and (max-width:1199px) {
    .section-heading__title.style-four::after {
        right: 45%
    }
}

@media screen and (max-width:991px) {
    .section-heading__title.style-four::after {
        right: 44%
    }
}

@media screen and (max-width:767px) {
    .section-heading__title.style-four::after {
        right: 42%
    }
}

.section-heading__bars {
    width: 3px;
    height: 15px;
    bottom: -6px;
    left: 50%
}

.section-heading__bars.style-two {
    left: 26px
}

.section-heading.style-two .section-heading__title::before,
.section-heading__bars::before {
    left: 6px
}

.section-heading__bars.style-three,
.section-heading__bars.style-three::after,
.section-heading__bars.style-three::before {
    background-color: hsl(var(--white))
}

.section-heading__bars::after,
.section-heading__bars::before {
    content: "";
    width: 3px;
    height: 10px;
    background-color: hsl(var(--base));
    position: absolute;
    border-radius: 5px;
    transform: translateY(-50%);
    top: 50%
}

.section-heading__bars::after {
    right: 6px
}

.section-heading__desc {
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    color: hsl(var(--white));
    font-size: 18px;
    font-family: var(--heading-font);
    font-weight: 400
}

.contact-section,
.section-heading__btn {
    margin-top: 35px
}

.section-heading.style-two {
    text-align: left
}

.section-heading.style-two .section-heading__title::after {
    left: 47px
}

.mb-80,
.section-heading.style-three {
    margin-bottom: 40px
}

@media screen and (max-width:767px) {
    .section-heading.style-three {
        margin-bottom: 30px
    }
}

.section-heading.style-three .section-heading__title {
    padding-bottom: 0
}

.slick-initialized.slick-slider {
    margin: 0 20px
}

.slick-initialized.slick-slider .slick-slide {
    height: auto;
    padding: 0 10px
}

.deal-thumb,
.slick-initialized.slick-slider .slick-slide>div,
.testimonials-thumb-slider {
    height: 100%
}

.slick-arrow {
    position: absolute;
    z-index: 1;
    bottom: 0;
    border: 1px solid hsl(var(--base));
    color: hsl(var(--white));
    width: 45px;
    height: 45px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: transparent;
    color: hsl(var(--black)/.5);
    font-size: 20px
}

.slick-arrow:hover {
    border-color: hsl(var(--base));
       background-color: transparent;
    color: hsl(var(--base));
}

.bg-overlay-one::before,
.bg-overlay::before {
    background-color: hsl(var(--black));
    position: absolute;
    height: 100%;
    content: "";
    top: 0;
    z-index: -1
}

.slick-next {
    left: 60px;
      bottom: -50px;
    background-color: hsl(var(--base));
      color: hsl(var(--white));
}

.slick-prev {
   left: 0px;
      bottom: -50px;
    background-color: hsl(var(--base));
      color:hsl(var(--white));
}

@media screen and (max-width:991px) {
    .slick-arrow {
        width: 40px;
        height: 40px;
        font-size: 16px
    }

    .slick-next {
        left: 0;
        bottom: -70px
    }

    .slick-prev {
        left: 60px;
        bottom: -70px
    }

    .navbar-brand.logo {
        order: -1
    }
}

@media screen and (min-width:425px) and (max-width:575px) {
    .col-xsm-6 {
        width: 50%
    }
}

@media screen and (min-width:375px) and (max-width:575px) {
    .col-xxsm-6 {
        width: 50%
    }
}

.custom--container {
    max-width: 1680px;
    margin: 0 auto;
    padding: 0 15px
}

.section-bg-two {
    background-color: #fff7f0
}

.full-display {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

.bg-img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 100%
}

.bg-img-two {
    height: 70%
}

.bg-overlay,
.bg-overlay-one,
.bg-overlay-two {
    position: relative;
    isolation: isolate
}

.bg-overlay::before {
    left: 0;
    opacity: .4;
    width: 100%
}

.bg-overlay-one::before {
    left: 0;
    opacity: 1;
    width: 100%
}

.bg-overlay-two::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background-color: hsl(var(--base));
    opacity: .8;
    width: 100%;
    height: 100%;
    z-index: -1
}

.btn--base.outline,
button {
    background-color: transparent
}

body.scroll-hidden {
    position: absolute;
    top: 0;
    left: 0;
    overflow-y: hidden;
    width: calc(100% - 8px)
}

body.scroll-hidden .header {
    right: 8px
}

body.scroll-hidden .header.fixed-header {
    padding-right: 8px
}

.bg--base {
    background-color: hsl(var(--base)) !important
}

.bg--primary {
    background-color: hsl(var(--primary)) !important
}

.bg--secondary {
    background-color: hsl(var(--secondary)) !important
}

.bg--success {
    background-color: hsl(var(--success)) !important
}

.bg--danger {
    background-color: hsl(var(--danger)) !important
}

.bg--warning {
    background-color: hsl(var(--warning)) !important
}

.bg--info {
    background-color: hsl(var(--info)) !important
}

.bg--violet {
    background-color: hsl(var(--violet)) !important
}

.text--base {
    color: hsl(var(--base)) !important
}

.text--base-two {
    color: hsl(var(--base-two)) !important
}

.text--primary {
    color: hsl(var(--primary)) !important
}

.text--secondary {
    color: hsl(var(--secondary)) !important
}

.text--success {
    color: hsl(var(--success)) !important
}

.text--danger {
    color: hsl(var(--danger)) !important
}

.text--warning {
    color: hsl(var(--warning)) !important
}

.text--info {
    color: hsl(var(--info)) !important
}

.text--violet {
    color: hsl(var(--violet)) !important
}

.my-120 {
    margin-top: 60px;
    margin-bottom: 60px
}

.mt-120 {
    margin-top: 60px
}

.mb-120 {
    margin-bottom: 60px
}

.my-40,
.my-60 {
    margin-top: 30px;
    margin-bottom: 30px
}

.about-us-footer,
.footer-item .social-list,
.mt-40,
.mt-60 {
    margin-top: 30px
}

.mb-40,
.mb-60 {
    margin-bottom: 30px
}

.my-80 {
    margin-top: 40px;
    margin-bottom: 40px
}

.mt-80 {
    margin-top: 40px
}

.py-120 {
    padding-top: 60px;
    padding-bottom: 60px
}

.pt-120,
.pt-md-60,
.testimonial-section {
    padding-top: 60px
}

.pb-120,
.pb-md-60 {
    padding-bottom: 60px
}

.py-60 {
    padding-top: 30px;
    padding-bottom: 30px
}

.pt-60 {
    padding-top: 30px
}

.pb-60 {
    padding-bottom: 30px
}

@media (min-width:576px) {
    .py-120 {
        padding-top: 80px;
        padding-bottom: 80px
    }

    .pt-120,
    .pt-md-60 {
        padding-top: 80px
    }

    .pb-120,
    .pb-md-60 {
        padding-bottom: 80px
    }

    .py-60 {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .pt-60 {
        padding-top: 40px
    }

    .pb-60 {
        padding-bottom: 40px
    }
}

.py-md-30 {
    padding-top: 20px
}

.border--base {
    border-color: hsl(var(--base)) !important
}

.border--primary {
    border-color: hsl(var(--primary)) !important
}

button {
    color: hsl(var(--white));
    border: none
}

.btn {
    color: hsl(var(--white));
    font-weight: 500;
    padding: 14px 20px;
    border-radius: 4px;
    position: relative;
    z-index: 1;
    border: 1px solid transparent
}

@media screen and (max-width:575px) {
    .section-heading {
        margin-bottom: 30px
    }

    .section-heading.style-three {
        margin-bottom: 20px
    }

    .slick-arrow {
        width: 35px;
        height: 35px
    }

  .slick-next {
    left: 60px;
    bottom: -70px;
    background-color: hsl(var(--base));
      color: hsl(var(--white));
}

.slick-prev {
   left: 0px;
    bottom: -70px;
    background-color: hsl(var(--base));
      color:hsl(var(--white));}

    .bg-img-two {
        height: 100%
    }

    .btn {
        padding: 10px 15px
    }
}

@media screen and (max-width:767px) {
    .btn {
        padding: 11px 22px
    }
}

@media screen and (max-width:575px) {
    .btn {
        padding: 11px 20px
    }
}

.btn:focus,
.btn:hover {
    color: hsl(var(--white));
    border-color: transparent
}

.btn--lg {
    padding: 15px 35px
}

@media screen and (max-width:767px) {
    .btn--lg {
        padding: 13px 30px
    }
}

@media screen and (max-width:575px) {
    .btn--lg {
        padding: 11px 25px
    }
}

.btn--sm {
    padding: 8px 20px;
    font-size: 16px
}

@media screen and (max-width:767px) {
    .btn--sm {
        padding: 6px 20px
    }

    .header {
        background-color: hsl(var(--base));
        z-index: 99;
        max-height: 101vh;
        /* overflow-y: auto */
    }

    .header::-webkit-scrollbar {
        width: 5px;
        height: 5px
    }

    .header::-webkit-scrollbar-thumb {
        border-radius: 0
    }
}

.btn--icon {
    width: 35px;
    height: 35px;
    line-height: 35px;
    font-size: 15px;
    padding: 0
}

.btn--base {
    background-color: hsl(var(--base))
}

.btn--base:focus,
.btn--base:hover {
    background-color: transparent;
    border: 1px solid hsl(var(--base));
    color: hsl(var(--base))
}

.btn--base.pill {
    border-radius: 35px
}

.btn--base.outline {
    border: 1px solid hsl(var(--base));
    color: hsl(var(--base))
}

.btn--base.outline:focus,
.btn--base.outline:hover {
    background-color: hsl(var(--base));
    color: hsl(var(--white))
}

.btn--simple__icon {
    font-size: 13px;
    margin-left: 5px
}

.btn--primary {
    background-color: hsl(var(--primary))
}

.btn--primary:focus,
.btn--primary:hover {
    background-color: hsl(var(--primary-d-100))
}

.btn--primary.pill {
    border-radius: 35px
}

.btn--primary.outline {
    border: 1px solid hsl(var(--primary));
    background-color: transparent;
    color: hsl(var(--primary))
}

.btn--primary.outline:focus,
.btn--primary.outline:hover {
    background-color: hsl(var(--primary));
    color: hsl(var(--white))
}

.btn--secondary {
    background-color: hsl(var(--secondary))
}

.btn--secondary:focus,
.btn--secondary:hover {
    background-color: hsl(var(--secondary-d-100))
}

.btn--secondary.pill {
    border-radius: 35px
}

.btn--secondary.outline {
    border: 1px solid hsl(var(--secondary));
    background-color: transparent;
    color: hsl(var(--secondary))
}

.btn--secondary.outline:focus,
.btn--secondary.outline:hover {
    background-color: hsl(var(--secondary));
    color: hsl(var(--white))
}

.btn--success {
    background-color: hsl(var(--success))
}

.btn--success:focus,
.btn--success:hover {
    background-color: hsl(var(--success-d-100))
}

.btn--success.pill {
    border-radius: 35px
}

.btn--success.outline {
    border: 1px solid hsl(var(--success));
    background-color: transparent;
    color: hsl(var(--success))
}

.btn--success.outline:focus,
.btn--success.outline:hover {
    background-color: hsl(var(--success));
    color: hsl(var(--white))
}

.btn--danger {
    background-color: hsl(var(--danger))
}

.btn--danger:focus,
.btn--danger:hover {
    background-color: hsl(var(--danger-d-100))
}

.btn--danger.pill {
    border-radius: 35px
}

.btn--danger.outline {
    border: 1px solid hsl(var(--danger));
    background-color: transparent;
    color: hsl(var(--danger))
}

.btn--danger.outline:focus,
.btn--danger.outline:hover {
    background-color: hsl(var(--danger));
    color: hsl(var(--white))
}

.btn--warning {
    background-color: hsl(var(--warning))
}

.btn--warning:focus,
.btn--warning:hover {
    background-color: hsl(var(--warning-d-100))
}

.btn--warning.pill {
    border-radius: 35px
}

.btn--warning.outline {
    border: 1px solid hsl(var(--warning));
    background-color: transparent;
    color: hsl(var(--warning))
}

.btn--warning.outline:focus,
.btn--warning.outline:hover {
    background-color: hsl(var(--warning));
    color: hsl(var(--white))
}

.btn--info {
    background-color: hsl(var(--info))
}

.btn--info:focus,
.btn--info:hover {
    background-color: hsl(var(--info-d-100))
}

.btn--info.pill {
    border-radius: 35px
}

.btn--info.outline {
    border: 1px solid hsl(var(--info));
    background-color: transparent;
    color: hsl(var(--info))
}

.btn--info.outline:focus,
.btn--info.outline:hover {
    background-color: hsl(var(--info));
    color: hsl(var(--white))
}

.btn--dark {
    background-color: hsl(var(--dark))
}

.btn--dark:focus,
.btn--dark:hover {
    background-color: hsl(var(--dark-d-100))
}

.btn--dark.pill {
    border-radius: 35px
}

.btn--dark.outline {
    border: 1px solid hsl(var(--dark));
    background-color: transparent;
    color: hsl(var(--dark))
}

.btn--dark.outline:focus,
.btn--dark.outline:hover {
    background-color: hsl(var(--dark));
    color: hsl(var(--white))
}

.btn--violet {
    background-color: hsl(var(--violet))
}

.btn--violet:focus,
.btn--violet:hover {
    background-color: hsl(var(--violet-d-100))
}

.btn--violet.pill {
    border-radius: 35px
}

.btn--violet.outline {
    border: 1px solid hsl(var(--violet));
    background-color: transparent;
    color: hsl(var(--violet))
}

.btn--violet.outline:focus,
.btn--violet.outline:hover {
    background-color: hsl(var(--violet));
    color: hsl(var(--white))
}

.custom--card {
    border-radius: 5px;
    box-shadow: var(--box-shadow);
    background-color: hsl(var(--white));
    border: transparent
}

.custom--card .card-header {
    padding: 13px 20px;
    background-color: transparent;
    border-bottom: 1px solid hsl(var(--dark)/.1)
}

.custom--card .card-body {
    background-color: hsl(var(--white));
    padding: 20px;
    border-radius: 5px
}

.custom--card .card-body__icon {
    font-size: 26px;
    color: hsl(var(--white))
}

.custom--card .card-footer {
    padding: 13px 20px;
    background-color: transparent;
    border-top: 1px solid hsl(var(--dark)/.1)
}

.form--label {
    margin-bottom: 6px;
    font-size: 16px;
    color: hsl(var(--black)/.9);
    font-weight: 400;
    font-family: var(--heading-font)
}

.required {
    color: hsl(var(--danger))
}

.form--control {
    border-radius: 6px;
    font-weight: 400;
    outline: 0;
    width: 100%;
    padding: 15px;
    background-color: hsl(var(--white));
    border: 1px solid hsl(var(--black)/.09);
    color: hsl(var(--black));
    line-height: 1
}

.form--control.style-two {
    border: 0
}

.form--control::placeholder {
    color: hsl(var(--body-color)/.8);
    font-size: 16px;
    font-family: var(--body-font);
    font-weight: 400
}

.form--control:focus,
.form--control[type=password]:focus,
.toggle-search-box.style-two .toggle-button {
    color: hsl(var(--black))
}

.form--control:focus {
    border-radius: 4px;
    box-shadow: none;
    border-color: hsl(var(--black)/.3) !important;
    background-color: hsl(var(--white))
}

.form--control[type=password],
textarea.form--control {
    color: hsl(var(--black)/.7)
}

.form--control:disabled,
.form--control[readonly] {
    background-color: hsl(var(--base-two-d-200));
    opacity: 1;
    border: 0
}

.header,
.input--icon {
    background-color: hsl(var(--base))
}

.header-info__cart,
.header-info__link,
.header-info__link:hover,
.input--icon {
    color: hsl(var(--white))
}

.form--control[type=file] {
    line-height: 50px;
    padding: 0;
    position: relative
}

.form--control[type=file]::file-selector-button {
    border: 1px solid hsl(var(--black)/.08);
    padding: 4px 6px;
    border-radius: .2em;
    background-color: hsl(var(--base)) !important;
    transition: .2s linear;
    line-height: 25px;
    position: relative;
    margin-left: 15px;
    color: hsl(var(--body-color)) !important
}

.form--control[type=file]::file-selector-button:hover {
    background-color: hsl(var(--base));
    border: 1px solid hsl(var(--base));
    color: hsl(var(--white))
}

textarea.form--control {
    height: 150px;
    padding: 15px;
    font-size: 16px;
    font-weight: 400
}

input:-webkit-autofill,
input:-webkit-autofill:active,
input:-webkit-autofill:focus,
input:-webkit-autofill:hover {
    -webkit-transition: background-color 5000s ease-in-out;
    transition: background-color 5000s ease-in-out
}

input:-webkit-autofill,
select:-webkit-autofill,
textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px transparent inset;
    -webkit-text-fill-color: hsl(var(--black)) !important
}

.input--icon {
    position: absolute;
    right: 10px;
    width: 30px;
    height: 30px;
    border-radius: 25px;
    top: 50%;
    transform: translateY(-50%)
}

.navbar-brand {
    padding-top: 0;
    padding-bottom: 0
}

.navbar-brand.logo img {
    height: 100%;
    max-width: 100%;
    max-height: 50px
}

.header {
    position: relative;
    z-index: 98
}

.header.fixed-header,
.main-header.fixed-header {
    background-color: hsl(var(--base));
    position: sticky;
    transition: .3s linear;
    top: 0;
    animation: .8s slide-down;
    width: 100%
}

@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-150%)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

.navbar {
    padding: 0 !important
}

@media screen and (min-width:992px) and (max-width:991px) {
    .nav-menu .nav-item .nav-link .nav-item__icon {
        margin-right: 6px
    }
}

@media (min-width:992px) {
    .my-120 {
        margin-top: 120px;
        margin-bottom: 120px
    }

    .mt-120 {
        margin-top: 120px
    }

    .mb-120 {
        margin-bottom: 120px
    }

    .my-60 {
        margin-top: 120px;
        margin-bottom: 60px
    }

    .mt-60 {
        margin-top: 60px
    }

    .mb-60 {
        margin-bottom: 60px
    }

    .my-80 {
        margin-top: 80px;
        margin-bottom: 80px
    }

    .mt-80 {
        margin-top: 80px
    }

    .mb-80 {
        margin-bottom: 80px
    }

    .my-40 {
        margin-top: 40px;
        margin-bottom: 40px
    }

    .mt-40 {
        margin-top: 40px
    }

    .mb-40 {
        margin-bottom: 40px
    }

    .py-120 {
        padding-top: 120px;
        padding-bottom: 120px
    }

    .pt-120 {
        padding-top: 120px
    }

    .pb-120 {
        padding-bottom: 120px
    }

    .py-60 {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .pt-60,
    .pt-md-60 {
        padding-top: 60px
    }

    .pb-60,
    .pb-md-60 {
        padding-bottom: 60px
    }

    .py-md-30 {
        padding-top: 30px;
        padding-bottom: 30px
    }

    .nav-menu .nav-item .nav-link,
    .nav-menu .nav-item .nav-link.active {
        color: hsl(var(--white)) !important
    }

    .nav-menu {
        padding-top: 0;
        padding-bottom: 0;
        margin: 0 -15px
    }

    .nav-menu .nav-item {
        position: relative;
        padding: 0 10px
    }

    .nav-menu .nav-item:hover .nav-link {
        color: hsl(var(--white)) !important;
        position: relative;
        transition: .3s linear
    }

    .nav-menu .nav-item .nav-link.active::before,
    .nav-menu .nav-item:hover .nav-link::before,
    .nav-menu.style-two .nav-link.active::before {
        width: 100%
    }

    .nav-menu .nav-item:hover .nav-link .nav-item__icon {
        transform: rotate(180deg);
        transition: .2s
    }

    .nav-menu .nav-item .nav-link {
                font-weight: 600;
          font-size: 15px;
        font-family: var(--heading-font);
        padding: 33px 0;
        position: relative;
        cursor: pointer;
    }

    .nav-menu .nav-item .nav-link:hover::before {
        left: 0;
        transition: .3s;
        width: 100%
    }

    .nav-menu .nav-item .nav-link::before {
        position: absolute;
        content: "";
        top: 100%;
        left: 0;
        width: 0;
        height: 2px;
        background-color: hsl(var(--white));
        transition: .3s
    }

    .nav-menu .nav-item .nav-link .nav-item__icon {
        transition: .3s;
        font-size: 13px;
        margin-left: 2px
    }

    .nav-menu.style-two .nav-item {
        margin: 0
    }

    .nav-menu.style-two .nav-item.dropdown:hover>.nav-link,
    .nav-menu.style-two .nav-item:hover .nav-link,
    .nav-menu.style-two .nav-link.active,
    .nav-menu.style-two .nav-link:hover {
        color: hsl(var(--base-two)) !important
    }

    .nav-menu.style-two .nav-link {
        font-size: 16px;
        color: hsl(var(--black)/.9) !important;
        font-weight: 400;
        font-family: var(--body-font)
    }

    .nav-menu.style-two .nav-link::before {
        background-color: hsl(var(--base-two));
        transition: .3s
    }

    .dropdown-menu.style-two .dropdown-menu__list,
    .dropdown-menu__list {
        border-bottom: 1px solid hsl(var(--black)/.08)
    }

    .dropdown-menu {
        display: block;
        visibility: hidden;
        opacity: 0;
        transition: .3s;
        top: 100%;
        left: 0;
        padding: 0 !important;
        transform: scaleY(0);
        transform-origin: top center;
        overflow: hidden;
        border-radius: 0;
        min-width: 190px
    }

    .dropdown-menu.style-two .dropdown-menu__link {
        padding: 7px 20px
    }

    .dropdown-menu.style-two .dropdown-menu__link:focus,
    .dropdown-menu.style-two .dropdown-menu__link:hover {
        color: hsl(var(--white));
        background-color: hsl(var(--base-two)) !important
    }

    .dropdown-menu.style-two .dropdown-menu__list:last-child {
        border-bottom: 3px solid hsl(var(--base-two)) !important
    }

    .dropdown-menu__list:last-child {
        border-bottom: 3px solid hsl(var(--base))
    }

    .dropdown-menu__link {
        padding: 7px 20px;
        font-weight: 400;
        font-size: 16px;
        transition: .3s
    }

    .dropdown-menu__link:focus,
    .dropdown-menu__link:hover {
        color: hsl(var(--white));
        background-color: hsl(var(--base))
    }

    .nav-menu .nav-item:hover .dropdown-menu {
        visibility: visible;
        opacity: 1;
        top: 100% !important;
        transform: scaleY(1)
    }
}

.header-info,
.main-header {
    align-items: center;
    display: flex
}

.navbar-toggler.header-button {
    color: hsl(var(--white));
    background: 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    transition: .15s ease-in-out;
    width: auto
}

.navbar-toggler.header-button:focus {
    box-shadow: none !important
}

.navbar-toggler.header-button[aria-expanded=true] i::before {
    content: "\f00d"
}

.navbar-toggler.header-button i {
    font-size: 25px
}

.navbar-toggler.header-button.style-two {
    color: hsl(var(--black)/.8)
}

.about-us-author__thumb,
.header-info__wishlist {
    margin-right: 20px
}

.header-info__link {
    font-size: 20px
}

.header-info__cart {
    margin-right: 20px;
    position: relative;
    font-size: 25px
}

@media screen and (max-width:991px) {
    .navbar-brand.logo img {
        max-width: 130px
    }

    .header {
        padding: 12px 0
    }

    .dropdown-menu li .dropdown-item,
    .dropdown-menu.style-two li .dropdown-item {
        padding: 10px 0;
        font-weight: 500;
        font-size: 16px;
        margin-left: 20px
    }

    .body-overlay.show {
        visibility: visible;
        opacity: 1
    }

    .nav-menu {
        margin-top: 20px
    }

    .nav-menu .nav-item {
        text-align: left;
        display: block;
        position: relative;
        margin: 0
    }

    .nav-menu .nav-item:hover .nav-link .nav-item__icon {
        transform: rotate(0) !important
    }

    .nav-menu .nav-item__icon {
        font-size: 14px
    }

    .nav-item:last-child>a,
    .nav-menu.style-two.nav-menu .nav-item:last-child .nav-link {
        border-bottom: 0
    }

    .nav-menu.style-two.nav-menu .nav-link {
        color: hsl(var(--black)) !important;
        border-bottom: 1px solid hsl(var(--black)/.1)
    }

    .nav-item .nav-link:hover,
    .nav-menu.style-two.nav-menu .nav-link:hover {
        color: hsl(var(--white))
    }

    .nav-item .nav-link::before,
    .nav-menu.style-two.nav-menu .nav-link::before {
        display: none
    }

    .nav-menu.style-two.nav-menu .nav-link.show[aria-expanded=true] {
        color: hsl(var(--black)) !important
    }

    .nav-item .nav-link.show[aria-expanded=true] i,
    .nav-menu.style-two.nav-menu .nav-link.show[aria-expanded=true] i {
        transform: rotate(180deg)
    }

    .dropdown-menu li:last-child,
    .dropdown-menu.style-two li:last-child,
    .nav-item:first-child,
    .nav-item:nth-last-child(2) .nav-link {
        border-bottom: none
    }

    .dropdown-menu li .dropdown-item,
    .nav-item .nav-link {
        border-bottom: 1px solid hsl(var(--white)/.2);
        color: hsl(var(--white))
    }

    .nav-item .nav-link {
        padding: 10px 10px 10px 0 !important;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 !important
    }

    .nav-item .nav-link.show[aria-expanded=true] {
        color: hsl(var(--white)) !important
    }

    .dropdown-menu {
        border-radius: 2px;
        -webkit-box-shadow: none;
        box-shadow: none;
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
        border: 0;
        background-color: inherit;
        overflow: hidden
    }

    .dropdown-menu li .dropdown-item:focus,
    .dropdown-menu li .dropdown-item:hover,
    .dropdown-menu.style-two li .dropdown-item:focus,
    .dropdown-menu.style-two li .dropdown-item:hover {
        background-color: transparent
    }

    .dropdown-menu.style-two li .dropdown-item {
        color: hsl(var(--white));
        border-bottom: 1px solid hsl(var(--black)/.2);
        color: hsl(var(--black))
    }

    .header-info {
        order: -1;
        margin-left: auto
    }

    .header-info__wishlist {
        margin-right: 20px
    }

    .header-info__cart {
        font-size: 18px;
        margin-right: 15px
    }
}

.header-info__cart-quantity {
    position: absolute;
    top: -4px;
    right: -10px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: hsl(var(--white));
    color: hsl(var(--base));
    font-size: 12px;
    font-weight: 600;
    font-family: var(--body-font);
    pointer-events: none
}

.header-info__user {
    color: hsl(var(--white));
    font-size: 22px
}

.header-info.style-two .header-info__cart-quantity {
    color: hsl(var(--white));
    background-color: hsl(var(--base-two))
}

.header-info.style-two .header-info__link {
    color: hsl(var(--black)/.8);
    font-size: 22px
}

.header-info.style-two .header-info__link:hover {
    color: hsl(var(--black)/.8)
}

.header-categories {
    order: -2
}

.header-category,
.header-category-two__item {
    font-size: 18px;
    background-color: hsl(var(--white));
    color: hsl(var(--base));
    border-radius: 5px;
    padding: 10px;
    font-weight: 400;
    font-family: var(--body-font)
}

@media screen and (max-width:767px) {
    .header-category {
        font-size: 16px;
        padding: 6px
    }
}

.header-category-two__icon,
.header-category__icon {
    font-size: 18px
}

.close-sidebar {
    color: hsl(var(--black));
    position: absolute;
    right: 10px;
    top: 10px;
    border: 1px solid hsl(var(--base)/.2);
    background-color: hsl(var(--base)/.2);
    width: 35px;
    height: 35px;
    line-height: 35px;
    border-radius: 50%;
    transition: .2s linear
}

.close-sidebar :focus,
.close-sidebar:hover {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border: 1px solid hsl(var(--base))
}

.toggle-search-box.style-two {
    order: 0;
    margin-right: 15px
}

.filter button:last-child,
.social-list.style-two .social-list__item:last-child,
.social-list__item:last-child {
    margin-right: 0
}

.main-header {
    justify-content: center;
    position: relative;
    z-index: 99;
    background-color: hsl(var(--base))
}

@media screen and (max-width:991px) {
    .header-info__cart-quantity {
        top: -5px;
        right: -8px;
        width: 18px;
        height: 18px;
        font-size: 10px
    }

    .header-info.style-two .header-info__link,
    .header-info__user {
        font-size: 18px;
        margin-right: 20px
    }

    .header-info.style-two .header-info__cart {
        margin-right: 5px
    }

    .header-info.style-two .header-info__cart-quantity {
        right: 8px
    }

    .main-header {
        padding: 12px 0
    }
}

@media screen and (max-width:767px) and (max-width:575px) {
    .main-header {
        padding: 10px 0
    }
}

.header-category-two {
    order: -2;
    margin-right: 40px;
    position: relative;
    z-index: 9999
}

@media screen and (max-width:767px) {

    .header-category-two__icon,
    .header-category__icon {
        font-size: 17px
    }

    .main-header {
        background-color: hsl(var(--base));
        max-height: 101vh;
        overflow-y: auto
    }

    .main-header::-webkit-scrollbar {
        width: 5px;
        height: 5px
    }

    .main-header::-webkit-scrollbar-thumb {
        border-radius: 0
    }

    .header-category-two__item {
        font-size: 16px;
        padding: 6px
    }
}

.header-top {
    background-color: hsl(var(--body-background));
    padding: 10px 0;
    position: relative;
    z-index: 99;
    background-color: hsl(var(--black))
}

.breadcumb,
.feature-section,
.footer-two-area {
    position: relative;
    z-index: 1
}

.top-contact__logo img {
    width: 132px;
    height: auto
}

.currency-box {
    display: flex;
    align-items: center;
    position: relative;
    margin-left: 20px
}

@media screen and (max-width:424px) {

    .section-heading__title.style-four::before,
    .section-heading__title.style-three::before,
    .section-heading__title.style-two::before {
        left: 44%
    }

    .section-heading__title.style-four::after,
    .section-heading__title.style-three::after,
    .section-heading__title.style-two::after {
        right: 40%
    }

    .header-info__link {
        font-size: 16px
    }

    .header-info__cart {
        margin-right: 12px
    }

    .header-category,
    .header-category-two__item {
        font-size: 15px;
        padding: 5px
    }

    .currency-box {
        margin-left: 15px
    }
}

.contact-list {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*margin-right: 80px*/
}
.hdtw{
    
    flex-direction: row-reverse;

}
.contact-list__wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
        gap: 25px;
}

.contact-list__wrapper.style-two {
    margin-left: 0;
    margin-top: 0
}

.contact-list.style-two::before {
    position: absolute;
    content: "";
    top: 50%;
    right: -40px;
    transform: translate(-50%, -50%);
    width: .1px;
    height: 20px;
    background-color: hsl(var(--white)/.3)
}

.product-item.style-two:hover .product-item__thumb-link,
.product-item:hover .product-item__thumb-link {
    transform: scale(1.1)
}

.contact-list__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    background-color: hsl(var(--white));
    border-radius: 50%;
    margin-right: 15px
}

.contact-list__icon img {
    width: 14px
}

.contact-list__text {
    font-size: 14px;
    font-family: var(--body-font);
    font-weight: 500;
    color: hsl(var(--white))
}

.contact-list__info {
    font-size: 16px;
    font-family: var(--heading-font);
    font-weight: 500;
    color: hsl(var(--white))
}

.breadcumb::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background-color: hsl(var(--black)/.78);
    width: 100%;
    height: 100%;
    z-index: -1
}

.breadcumb__title {
    margin-bottom: 10px;
    color: hsl(var(--white));
    font-weight: 800;
    font-size: 50px
}

.choose-item__thumb,
.contact-item__thumb,
.feature-item__thumb,
.footer-item__desc,
.footer-item__logo {
    margin-bottom: 20px
}

@media screen and (max-width:991px) {
    .contact-list {
        margin-right: 30px
    }

    .contact-list.style-two::before {
        right: -20px
    }

    .contact-list__info {
        font-size: 15px
    }

    .breadcumb__title {
        font-size: 45px
    }

    .footer-item .social-list {
        margin-top: 20px
    }
}

@media screen and (max-width:767px) {
    .header-top {
        padding: 5px 0
    }

    .contact-list {
        justify-content: flex-start
    }

    .contact-list__wrapper {
        margin-left: 20px;
        margin-top: 35px
    }

    .contact-list.style-two::before {
        display: none
    }

    .contact-list__icon img {
        width: 18px
    }

    .contact-list__text {
        color: hsl(var(--body-color))
    }

    .contact-list__info {
        color: hsl(var(--heading-color))
    }

    .breadcumb__title {
        font-size: 35px
    }
}

@media screen and (max-width:575px) {
    .navbar-brand.logo img {
        max-width: 100px
    }

    .header-info__cart,
    .header-info__wishlist {
        margin-right: 10px
    }

    .header-info.style-two .header-info__link,
    .header-info__user {
        margin-right: 10px;
        font-size: 15px
    }

    .header-info.style-two .header-info__cart-quantity {
        right: 2px
    }

    .breadcumb__title {
        font-size: 30px
    }
}

.breadcumb__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    color: #fff
}

.breadcumb__item,
.breadcumb__link:hover {
    color: hsl(var(--white))
}

.breadcumb__item {
    padding: 0 5px;
    font-weight: 400;
    font-size: 16px
}

.breadcumb__item-text,
.breadcumb__link {
    color: hsl(var(--white));
    font-weight: 400;
    font-family: var(--body-font);
    font-size: 16px
}

.footer-area {
    margin-top: auto
}

.footer-area.bg-img {
    background-size: contain;
    background-position: top center
}

.footer-item__logo a img {
    width: 100%;
    height: 100%;
    max-width: 220px;
    max-height: 60px
}

.footer-item__title {
    color: hsl(var(--black));
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-family: var(--heading-font);
    font-size: 20px;
    font-weight: 700;
    position: relative
}

.footer-item__desc,
.footer-item__text {
    font-size: 16px;
    font-family: var(--body-font)
}

.footer-item__desc {
    color: hsl(var(--body-color));
    font-weight: 400
}

.footer-item__text {
    font-weight: 500;
    color: hsl(var(--black)/.85);
    margin-bottom: 5px
}

.footer-item__link,
.footer-item__link:hover {
    color: hsl(var(--base-two))
}

.footer-item__link {
    font-size: 24px;
    font-weight: 700;
    font-family: var(--heading-font)
}

.footer-menu {
    display: flex;
    flex-direction: column;
    margin: -5px 0
}

.footer-menu__item {
    display: block;
    padding: 5px 0
}

.footer-menu__link {
    font-size: 16px;
    font-family: var(--body-font);
    color: hsl(var(--body-color));
    font-weight: 400
}

.footer-menu__link:hover {
    color: hsl(var(--base));
    margin-left: 4px
}

.bottom-footer {
    background-color: hsl(var(--base)/.03);
    border-top: 1px solid hsl(var(--white)/.15)
}

.bottom-footer__text {
    font-size: 16px;
    text-align: center
}

.bottom-footer.style-two {
    background-color: transparent;
    border: 0
}

.footer-two-area {
    background-color: hsl(var(--footer-two-bg))
}

.footer-two-area__inner {
    padding-top: 245px
}

@media screen and (max-width:1199px) {
    .footer-two-area__inner {
        padding-top: 220px
    }
}

@media screen and (max-width:991px) {
    .footer-two-area__inner {
        padding-top: 150px
    }
}

@media screen and (max-width:767px) {
    .footer-two-area__inner {
        padding-top: 120px
    }
}

.footer-two__top-shape {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%
}

.footer-two__shape-one {
    position: absolute;
    left: 0;
    bottom: 50px;
    z-index: -1
}

.footer-two__shape-two {
    position: absolute;
    right: 0;
    bottom: 50px;
    z-index: -1
}

@media screen and (max-width:1599px) {
    .footer-two__shape-two {
        display: none
    }
}

.scroll-top {
    position: fixed;
    right: 30px;
    color: hsl(var(--white));
    background-color: hsl(var(--base));
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 3px;
    font-size: 16px;
    z-index: 5;
    transition: .5s;
    visibility: hidden;
    opacity: 0;
    bottom: -50px;
    animation: 5s linear infinite scroll_top
}

.scroll-top:hover {
    color: hsl(var(--white));
    background-color: hsl(var(--base-d-100))
}

.scroll-top.show {
    bottom: 30px
}

@keyframes scroll_top {

    0%,
    to {
        transform: translateY(0)
    }

    50% {
        transform: translateY(20px)
    }
}

.social-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

.social-list.style-four .social-list__link,
.social-list.style-three .social-list__link {
    justify-content: center;
    position: relative;
    display: flex;
    cursor: pointer;
    transition: .3s;
    overflow: hidden
}

.social-list.style-four .social-list__item,
.social-list.style-two .social-list__item {
    margin-right: 15px
}

.social-list.style-two .social-list__link {
    width: auto;
    height: auto;
    background-color: transparent;
    border: 0;
    transition: .3s;
    border-radius: 0;
    cursor: pointer;
    color: hsl(var(--white)) !important
}

.social-list.style-two .social-list__link.active {
    background-color: transparent;
    color: hsl(var(--base-two)) !important;
    border-color: none !important
}

.social-list.style-two .social-list__link:focus,
.social-list.style-two .social-list__link:hover {
    color: hsl(var(--base-two)) !important;
    background-color: transparent;
    color: hsl(var(--base-two));
    border-color: none
}

.social-list.style-three .social-list__link {
    width: 44px;
    height: 44px;
    align-items: center;
    border-radius: 50%;
    background-color: hsl(var(--base)/.15);
    border: 0;
    color: hsl(var(--base))
}

.social-list.style-three .social-list__link:focus,
.social-list.style-three .social-list__link:hover {
    background-color: hsl(var(--base));
    border-color: none;
    color: hsl(var(--white))
}

.social-list.style-four .social-list__link {
    width: auto;
    height: auto;
    align-items: center;
    border-radius: 0;
    background-color: transparent;
    border: transparent;
    color: hsl(var(--black)/.6)
}

.social-list.style-four .social-list__link.active {
    background-color: transparent;
    color: hsl(var(--base)) !important;
    border-color: none !important
}

.social-list.style-four .social-list__link:focus,
.social-list.style-four .social-list__link:hover {
    border-color: none;
    color: hsl(var(--base))
}

.social-list__item {
    margin-right: 10px
}

.social-list__link {
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
    background-color: hsl(var(--base)/.2);
    transition: .3s;
    cursor: pointer;
    color: hsl(var(--base))
}

.social-list__link.active {
    background-color: hsl(var(--base));
    color: hsl(var(--white)) !important;
    border-color: hsl(var(--base)) !important
}

.body-overlay,
.sidebar-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    visibility: hidden;
    opacity: 0;
    transition: .2s linear;
    left: 0;
    content: ""
}

.social-list__link:focus,
.social-list__link:hover {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base))
}

.body-overlay {
    background-color: hsl(var(--black)/.6);
    z-index: 8
}

.sidebar-overlay {
    background-color: hsl(var(--black)/.8);
    z-index: 9
}

.sidebar-overlay.show {
    z-index: 991
}

.overlay-search-box {
    z-index: 9999
}

::selection {
    color: hsl(var(--white));
    background: hsl(var(--base-d-100))
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px
}

::-webkit-scrollbar-button {
    width: 0;
    height: 0
}

::-webkit-scrollbar-thumb {
    background-color: hsl(var(--base-d-100));
    border: 0 solid transparent;
    border-radius: 2px
}

.banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*background-color: hsl(var(--section-bg-two));*/
    padding: 85px 70px;
    border-radius: 6px;
    height: 100%
}

.client-logo,
.product-item__content,
.product-item__thumb {
    background-color: hsl(var(--white))
}

@media screen and (max-width:1199px) {
    .banner {
        padding: 70px 45px
    }
}

@media screen and (max-width:991px) {
    .banner {
        flex-wrap: wrap;
        justify-content: center;
        padding: 40px 20px
    }

    .banner-content {
        margin-bottom: 50px;
        text-align: center
    }
}

@media screen and (max-width:767px) {
    .scroll-top {
        right: 20px;
        width: 35px;
        height: 35px;
        font-size: 15px
    }

    .social-list.style-four .social-list__link,
    .social-list.style-two .social-list__link {
        font-size: 14px
    }

    .social-list.style-three .social-list__link {
        font-size: 14px;
        width: 40px;
        height: 40px
    }

    .social-list__link {
        width: 35px;
        height: 35px;
        font-size: 14px
    }

    .banner {
        padding: 30px 20px
    }
}

.banner-content__subtitle {
    font-size: 20px;
    color: hsl(var(--black));
    font-weight: 400;
    font-family: var(--title-font)
}

.product-item.style-two:hover .product-item__icon-style,
.product-item__icon-style {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px hsl(var(--body-color));
    font-size: 20px;
    line-height: 0
}
.banner-section{
         height: 80vh;
    background-position: center;
}

/*//phil//*/
.choose-items-wrap{
        display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.philosophy .choose-item {
    padding: 30px;
    box-shadow: 2px 4px 8px rgba(51, 51, 51, .25);
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.philosophy .choose-item__title{
    font-size:16px;
}


.philosophy  .why-choose::before {
 content: "";
    background-color: hsl(var(--base) / .8);
    z-index: -1;
    height: 100%;
}

.text-phil{
    font-size: 18px;
}

.banner-section .banner-content__title {
    font-family: var(--heading-font);
    font-weight: 900;
    color: hsl(var(--white))
}
.banner-content__title {
    font-family: var(--heading-font);
    font-weight: 900;
    color: hsl(var(--black))
}
.banner-section .banner-content__desc {
    max-width: 500px;
    color: hsl(var(--white))
}
.banner-content__desc {
    max-width: 500px;
    color: hsl(var(--body-color))
}
.product-item__price,
.product-item__title-link {
    color: hsl(var(--black));
    font-family: var(--body-font)
}

.banner-content__buttons {
    padding-top: 35px;
    margin: -3px -10px;
    position: relative;
    display: inline-block
}

.banner-content__buttons a {
    margin: 3px 10px
}

.banner-content__buttons .button-shape {
    position: absolute;
    right: -50px;
    bottom: -33px
}

.banner-content__buttons .button-shape img {
    width: 100%;
    max-width: 100px
}

.banner-thumb img {
    width: 100%;
    max-width: 500px;
    height: 100%
}

@media screen and (max-width:991px) {
    .banner-thumb img {
        max-width: 400px
    }

    .testimonial-slider {
        margin-top: 20px
    }
}

.banner-thumb__shape {
    position: absolute;
    top: -40px;
    left: 20px;
    z-index: 1
}

.banner-thumb__shape img {
    width: 100%;
    max-width: 90px;
    height: 100%;
    max-height: 110px
}

.offer {
    height: 100%;
    width: 100%
}

.about-thumb img,
.contact-map,
.deal-thumb img,
.new-offer-content,
.new-offer-content img,
.offer img {
    width: 100%;
    height: 100%
}

.product-item {
    transition: .2s;
    border-radius: 10px;
    border: 1px solid hsl(var(--black)/.09);
    box-shadow: -20px 10px rgba(0, 69, 172, .01)
}

.product-item:hover {
    border: 1px solid hsl(var(--black)/.2)
}

.product-item:hover .product-item__icon-style {
    transform: scale(1.3)
}

.product-item__content {
    padding: 15px 10px 30px;
    border-radius: 0 0 10px 10px
}

@media screen and (max-width:575px) {
    .breadcumb__item {
        font-size: 15px
    }

    .footer-item .social-list {
        margin-top: 15px
    }

    .banner {
        padding: 30px 10px
    }

    .banner-content {
        margin-bottom: 60px
    }

    .banner-content__buttons {
        margin: -3px -5px;
        padding-top: 25px
    }

    .banner-content__buttons a {
        margin: 3px 5px
    }

    .banner-content__buttons .button-shape {
        right: -35px;
        bottom: -25px
    }

    .banner-content__buttons .button-shape img {
        max-width: 50px
    }

    .banner-thumb__shape img {
        max-width: 70px;
        max-height: 90px
    }

    .product-item__content {
        padding: 20px 10px 30px
    }
}

.product-item__thumb {
    padding-top: 40px;
    border-radius: 10px 10px 0 0;
    position: relative;
    cursor: pointer
}

@media screen and (max-width:1199px) {
    .product-item__thumb {
        padding-top: 30px
    }
}

@media screen and (max-width:767px) {
    .banner-content__subtitle {
        font-size: 16px
    }

    .banner-thumb img {
        max-width: 300px
    }

    .product-item__thumb {
        padding-top: 25px
    }
}

@media screen and (max-width:575px) {
    .product-item__thumb {
        padding-top: 15px
    }
}

.product-item__thumb-link img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    transition: .3s linear
}

@media screen and (max-width:1399px) {
    .product-item__thumb-link img {
        height: 230px
    }
}

@media screen and (max-width:1199px) {
    .product-item__thumb-link img {
        height: 150px
    }

    .deal-thumb {
        display: none
    }
}

@media screen and (max-width:575px) {
    .product-item__thumb-link img {
        height: 140px
    }
}

.product-item__icon {
    position: absolute;
    bottom: 30px;
    right: 20px;
    z-index: 1;
    visibility: hidden;
    opacity: 0
}

@media screen and (max-width:575px) {
    .product-item__icon {
        right: 20px;
        bottom: 20px
    }
}

@media screen and (max-width:424px) {
    .breadcumb__title {
        font-size: 25px
    }

    .breadcumb__item-text,
    .breadcumb__link {
        font-size: 15px
    }

    .footer-item__logo a img {
        max-width: 180px
    }

    .footer-two-area__inner {
        padding-top: 100px
    }

    .social-list.style-two .social-list__item {
        margin-right: 10px
    }

    .banner-content__title {
        margin-bottom: 10px
    }

    .product-item__content {
        padding: 15px 10px 30px
    }

    .product-item__thumb {
        padding-top: 20px
    }

    .product-item__thumb-link img {
        height: 250px;    }

    .product-item__icon {
        right: 15px
    }
}

.product-item__icon-style {
    transition: .3s linear
}

.product-item__icon-style.wishlisted {
    -webkit-text-fill-color: hsl(var(--base));
    -webkit-text-stroke: 1px solid hsl(var(--base))
}

.product-item__badge {
    position: absolute;
    top: 20px;
    right: 20px
}

@media screen and (max-width:575px) {
    .product-item__badge {
        top: 10px;
        right: 10px
    }
}

.product-item__title {
    margin-bottom: 0
}

.product-item__title-link {
    font-size: 18px;
    font-weight: 400;
    transition: .2s
}

@media screen and (max-width:575px) {
    .product-item__title-link {
        font-size: 16px
    }
}

.product-item__price {
   font-size: 18px;
    font-weight: 600;
    margin-top: 7px;
    color: #8a400f;
}

@media screen and (max-width:575px) {
    .product-item__price {
        font-size: 14px
    }
}

.product-item__price-new {
    color: hsl(var(--body-color));
    position: relative;
    font-weight: 400
}

.product-item__price-new::before {
    position: absolute;
    content: "";
    top: 9px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: hsl(var(--body-color))
}

.product-item.style-two .product-item__price,
.product-item.style-two:hover .product-item__title-link {
    color: hsl(var(--base-two))
}

.product-item.style-two:hover .product-item__icon-style {
    transition: .3s linear
}

.product-item.style-two:hover .product-item__icon-style.wishlisted {
    -webkit-text-fill-color: hsl(var(--base-two));
    -webkit-text-stroke: 1px solid hsl(var(--base-two))
}

.best-deal-section {
    padding-left: 0 !important
}

.deal-counter {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%
}

.deal-counter__footer {
    margin: 30px 0
}

.deal-counter__title {
    font-size: 18px;
    font-weight: 400;
    color: hsl(var(--black));
    font-family: var(--body-font)
}

.deal-counter__price,
.deal-counter__price-new {
    font-size: 20px;
    font-family: var(--heading-font);
    font-weight: 700
}

.deal-counter__price {
    color: hsl(var(--base))
}

.deal-counter__price-new {
    color: hsl(var(--black));
    position: relative
}

.deal-counter__price-new::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 12px;
    width: 100%;
    height: 1px;
    background-color: hsl(var(--black))
}

.filter {
    margin-bottom: 40px
}

.filter button,
.filter button.style-two {
    margin-right: 10px;
    padding: 10px 25px;
    border: 1px solid hsl(var(--black)/.1);
    border-radius: 30px;
    text-transform: capitalize;
    font-size: 18px;
    color: hsl(var(--black));
    cursor: pointer;
    display: inline-block
}

@media screen and (max-width:575px) {
    .deal-counter__footer {
        margin: 10px 0
    }

    .filter button,
    .filter button.style-two {
        padding: 7px 20px;
        margin: 5px
    }
}

.mixitup-control-active {
    background-color: hsl(var(--base));
    color: hsl(var(--white)) !important
}

.mixitup-control-active.style-two {
    background-color: hsl(var(--base-two));
    color: hsl(var(--white)) !important
}

.testimonial-thumb {
    border-radius: 3px;
    overflow: hidden;
    height: 100%
}

.testimonial-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media screen and (max-width:1199px) {
    .testimonial-slider {
        margin-top: 20px
    }
}

.testimonial-slider__icon {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    padding: 10px;
    width: 70px;
    height: 70px;
    margin-bottom: 20px;
    border-radius: 50%;
    display: flex;
    line-height: 1;
    justify-content: center;
    align-items: center
}

@media screen and (max-width:767px) {
    .testimonial-slider__icon {
        width: 50px;
        height: 50px
    }
}

.testimonial-slider__icon img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.testimonial-slider__desc {
    font-size: 24px;
    font-style: italic;
    color: hsl(var(--black));
    font-family: var(--body-font);
    font-weight: 400;
    max-width: 550px;
    margin-bottom: 35px
}

@media screen and (max-width:767px) {
    .testimonial-slider__desc {
        margin-bottom: 20px;
        font-size: 20px
    }
}

.testimonial-slider__name {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--heading-font);
    color: hsl(var(--black));
    margin-bottom: 5px
}

.testimonial-slider__designation {
    font-size: 16px;
    font-family: var(--body-font);
    font-weight: 400;
    color: hsl(var(--black))
}

.feature-item__payment,
.feature-item__title {
    font-family: var(--heading-font);
    color: hsl(var(--white)/.9)
}

.testimonial-slick-slider .slick-dots {
    text-align: left;
    margin-left: 5px;
    margin-top: 30px
}

.slick-dots li button {
    background-color: hsl(var(--base)/.2);
    width: 20px;
    height: 10px;
    border-radius: 40px;
    margin: 0 3px;
    text-indent: -9999px;
    transition: .3s linear
}

.slick-dots li.slick-active button {
    width: 20px;
    height: 10px;
    background-color: hsl(var(--base))
}

.testimonial-three-slick-slider .slick-arrow {
    color: hsl(var(--black)/.6);
    background-color: transparent;
    border: none;
    width: 50px;
    height: 50px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    transition: .2s linear;
    position: absolute
}

.testimonial-three-slick-slider .slick-arrow:hover {
    background-color: hsl(var(--base-two));
    color: hsl(var(--white))
}

.testimonial-three-slick-slider .slick-next {
    top: 50% !important;
    right: 0 !important;
    transform: translate(-50%, -50%)
}

.testimonial-three-slick-slider .slick-prev {
    left: 0;
    top: 50%;
    transform: translate(-50%, -50%)
}

.client-logos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px
}

.client-logos:last-of-type {
    margin-bottom: 0
}

.client-logos img {
    width: 160px !important
}

.client-logos .slick-slide {
    margin: 0 10px
}

.client-logo {
    padding: 40px 20px;
    box-shadow: var(--box-shadow);
    border-radius: 5px;
    border: 1px solid hsl(var(--black)/.08);
    transition: .3s linear
}

.choose-item,
.contact-item {
    border-radius: 5px;
    background-color: hsl(var(--white));
    text-align: center
}

.client-logo:hover {
    background-color: hsl(var(--base-two))
}

.feature-section::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: hsl(var(--base)/.9);
    z-index: -1
}

.feature-item__title {
    font-weight: 600;
    text-align: center;
    margin-bottom: 2px;
    font-size: 18px
}

@media screen and (max-width:991px) {
    .testimonial-three-slick-slider .slick-arrow {
        width: 35px;
        height: 35px
    }

    .blog-slider .slick-arrow i {
        font-size: 12px
    }

    .feature-item__title {
        font-size: 15px
    }
}

.feature-item__payment {
    font-size: 14px;
    font-weight: 400;
    text-align: center
}

@media screen and (max-width:374px) {
    .currency-box {
        margin-left: 10px
    }

    .product-item__icon {
        bottom: 20px;
        right: 25px
    }

    .feature-item__payment,
    .feature-item__title {
        font-size: 13px
    }
}

.feature-item.style-two .feature-item__title {
    color: hsl(var(--black))
}

.about-us__desc,
.feature-item.style-two .feature-item__payment {
    color: hsl(var(--body-color))
}

.about-section {
    overflow: hidden
}

.about-thumb {
    padding-left: 30px;
    padding-right: 30px
}

.about-us__desc {
    font-size: 16px;
    margin-bottom: 30px
}

.about-us-footer__text {
    color: hsl(var(--black));
    font-weight: 400;
    font-family: var(--body-font);
    font-size: 18px
}

.about-us-author {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    max-width: 500px;
    position: relative;
    border-bottom: 1px solid hsl(var(--black)/.1);
    padding-bottom: 30px
}

.about-us-author::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    width: .1px;
    height: 50px;
    background-color: hsl(var(--black)/.3);
    transform: translate(-50%, -50%)
}

.about-us-author__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.about-us-author__name {
    font-size: 18px;
    color: hsl(var(--black));
    font-weight: 700;
    margin-bottom: 0
}

.about-us-author__customer {
    font-size: 16px;
    color: hsl(var(--black)/.7);
    font-weight: 400;
    font-family: var(--body-font)
}

.about-us-author__text {
    font-size: 18px;
    color: hsl(var(--black));
    font-family: var(--body-font);
    font-weight: 400;
    max-width: 185px;
    margin-bottom: 0
}

.about-us-author__text-style {
    color: hsl(var(--base))
}

.why-choose {
    position: relative;
    z-index: 1;
    padding-bottom: 60px
}

.why-choose::before,
.why-choose__bg {
    position: absolute;
    height: 70%;
    left: 0;
    width: 100%;
    top: 0
}

.why-choose__bg {
    z-index: -2
}

.why-choose__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.why-choose::before {
    content: "";
    background-color: hsl(var(--base)/.9);
    z-index: -1
}

.choose-item {
    padding: 30px;
    box-shadow: 2px 4px 8px rgba(51, 51, 51, .25)
}

@media screen and (max-width:991px) {
    .choose-item {
        padding: 40px
    }
}

@media screen and (max-width:767px) {
    .choose-item {
        padding: 30px
    }

    .feature-product-one {
        display: none
    }
}

@media screen and (max-width:575px) {
    .testimonial-slider__desc {
        font-size: 18px
    }

    .about-us-footer {
        margin-top: 10px
    }

    .about-us-author__name,
    .about-us-author__text,
    .about-us-footer__text {
        font-size: 16px
    }

    .about-us-author {
        padding-bottom: 10px
    }

    .about-us-author::before {
        display: none
    }

    .about-us-author__thumb {
        margin-right: 10px
    }

    .why-choose::before,
    .why-choose__bg {
        height: 100%
    }

    .choose-item {
        padding: 20px
    }

    .choose-item__thumb {
        margin-bottom: 15px
    }
}

.choose-item__thumb img {
    width: 100%;
    height: 100%;
    max-width: 65px;
    max-height: 65px
}

@media screen and (max-width:575px) {
    .choose-item__thumb img {
        max-width: 50px
    }
}

.choose-item__title {
    color: hsl(var(--black));
    font-weight: 700;
    margin-bottom: 5px
}

@media screen and (max-width:424px) {
    .product-item__badge {
        top: 20px;
        right: 20px
    }

    .product-item__title-link {
        font-size: 18px
    }

    .product-item__price {
        font-size: 16px
    }

    .filter button {
        font-size: 16px;
        padding: 5px 15px;
        margin: 0
    }

    .filter button.style-two {
        font-size: 14px;
        padding: 5px 15px;
        margin: 0
    }

    .testimonial-slider__icon {
        width: 40px;
        height: 40px
    }

    .about-us-author__info,
    .feature-item__thumb {
        margin-bottom: 10px
    }

    .feature-item__thumb img {
        width: 40px
    }

    .choose-item__thumb {
        margin-bottom: 7px
    }

    .choose-item__thumb img {
        max-width: 40px
    }

    .choose-item__desc {
        font-size: 14px
    }
}

.contact__title {
    margin-bottom: 40px;
    position: relative
}

.contact__title::before {
    position: absolute;
    content: "";
    bottom: -15px;
    left: 0;
    width: 40px;
    height: 2px;
    border-radius: 10px;
    background-color: hsl(var(--base))
}

.feature-product-one {
    position: absolute;
    left: 0;
    bottom: 200px
}

.feature-product-two {
    position: absolute;
    right: 0;
    bottom: 200px
}

.product {
    z-index: 1
}

.contact-item {
    box-shadow: var(--box-shadow);
    overflow: hidden;
    height: 100%;
    padding: 35px 10px
}

.contact-item__title {
    margin-bottom: 7px;
    color: hsl(var(--black));
    font-weight: 700
}

.contact-item__desc {
    color: hsl(var(--body-color));
    font-weight: 400;
    font-family: var(--body-font);
    font-size: 16px
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    min-height: 600px;
    margin-bottom: -10px;
    filter: grayscale(1)
}

.contact-bottom .bg-img {
    border-radius: 12px
}

.contactus-form {
    background-color: hsl(var(--white));
    padding: 80px 65px;
    border-radius: 20px;
    position: relative;
        box-shadow: 2px 4px 8px rgba(51, 51, 51, .25);
    margin-bottom: -150px
}

@media screen and (max-width:991px) {
    .contact-map iframe {
        min-height: 400px
    }

    .contactus-form {
        margin-bottom: -100px
    }
}

@media screen and (max-width:767px) {
    .feature-product-two {
        display: none
    }

    .contactus-form {
        padding: 50px 20px;
        margin-bottom: -50px
    }
}

.navbar-nav,
.top-contact {
    margin: 0 auto
}
.footer-item a {
    color: hsl(var(--body-color)) !important;
}
@media screen and (max-width:575px) {
    .contactus-form {
        padding: 40px 15px
    }
    
}

.contactus-form__thumb-one {
    position: absolute;
    top: -150px;
    left: 40px;
    z-index: 1
}

.contactus-form__thumb-two {
    position: absolute;
    top: -160px;
    right: 50px;
    z-index: 1
}

.contactus-form .btn {
    margin-top: 10px
}

.contact-bottom__inner {
    padding-top: 200px
}

@media screen and (max-width:767px) {
    .contactus-form__thumb-one {
        top: -110px;
        left: 0
    }

    .contactus-form__thumb-one img {
        max-width: 200px
    }

    .contactus-form__thumb-two {
        top: -120px;
        right: 0
    }

    .contactus-form__thumb-two img {
        max-width: 120px
    }

    .contact-bottom__inner {
        padding-top: 150px
    }
}

.top-contact {
    order: -1;
    /*background-color: #fff;*/
    border-radius: 50%;
        /*box-shadow: 2px 4px 8px rgba(51, 51, 51, .25);*/
}

.offer-section .offer span {
    transition: .3s;
    position: absolute;
    top: 10%;
    right: 21px;
    background-color: #fafcff;
    padding: 10px 15px;
    border: 4px solid hsl(var(--base));
    font-size: 25px
}

.offer-section .offer:hover span {
    top: 8%
}

.breadcumb__list .current-item,
.breadcumb__list a,
.itemListElement {
    color: #fff
}



.service-18 .linking,
.service-18 h1,
.service-18 h2,
.service-18 h3,
.service-18 h4,
.service-18 h5,
.service-18 h6 {
    color: #3e4555
}

.service-18 h6 {
    line-height: 26px;
    font-size: 21px
}

.service-18 .font-weight-medium {
      font-weight: 700;
    font-family: var(--heading-font);
    border-bottom: 2px solid hsl(var(--base));
    width: fit-content;
}

.service-18 .bg-light {
    background-color: #f4f8fa !important
}

.service-18 .wrap-service-18 .icon-position {
   position: absolute;
    left: 0px;
    /* background-size: cover; */
    /* background-position: center center; */
    /* min-height: 340px; */
    top: -30px;
}

.service-18 .wrap-service-18 .icon-position .icon-round {
    /*position: absolute;*/
    /*right: -38px;*/
    /*top: 20px*/
}

.service-18 .icon-round {
       width: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 100%;
    display: inline-block
}

.service-18 .bg-success-gradiant {
    background: hsl(var(--base))
}

.service-18 .display-5 {
       font-size: 2rem;
    font-weight: 500;
}

.service-18 .linking:hover {
    color: #316ce8
}

.service-18 .card-body {
    padding: 25px;
        box-shadow: var(--box-shadow);
        min-height: 240px;
}
.card-wraper{
    
}
@media (max-width:767px) {
    .service-18 .wrap-service-18 .icon-position .icon-round {
        top: 157px;
        right: 30px
    }
}

.service-18 .btn-success-gradiant {
    background: #2cdd9b;
    background: -webkit-linear-gradient(legacy-direction(to right), #2cdd9b 0, #1dc8cc 100%);
    background: -webkit-gradient(linear, left top, right top, from(#2cdd9b), to(#1dc8cc));
    background: -webkit-linear-gradient(left, #2cdd9b 0, #1dc8cc 100%);
    background: -o-linear-gradient(left, #2cdd9b 0, #1dc8cc 100%);
    background: linear-gradient(to right, #2cdd9b 0, #1dc8cc 100%)
}

.service-18 .btn-success-gradiant:hover {
    background: #1dc8cc;
    background: -webkit-linear-gradient(legacy-direction(to right), #1dc8cc 0, #2cdd9b 100%);
    background: -webkit-gradient(linear, left top, right top, from(#1dc8cc), to(#2cdd9b));
    background: -webkit-linear-gradient(left, #1dc8cc 0, #2cdd9b 100%);
    background: -o-linear-gradient(left, #1dc8cc 0, #2cdd9b 100%);
    background: linear-gradient(to right, #1dc8cc 0, #2cdd9b 100%)
}

.service-18 .btn-md {
    padding: 15px 45px;
    font-size: 16px
}

.subscribe-area {
    padding-bottom: 100px
}

.subscribe-area .subscribe-wrapper {
    padding-top: 310px;
    background: url(../images/bkg_newsletter.webp) top center no-repeat
}

.subscribe-title {
    color: #fff;
    font-size: 45px;
    line-height: 1;
    margin-bottom: 20px;
    text-transform: none;
    font-weight: 700
}

.subscribe-area .subscribe-wrapper .subscribe-inner {
    background: 0 0/cover #4a9e86;
    padding: 100px 180px;
    text-align: center;
    position: relative
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
    color: #fff;
    font-size: 60px;
    line-height: 1;
    margin-bottom: 20px;
    text-transform: none;
    font-weight: 700
}

@media only screen and (min-width:1200px) and (max-width:1499px) {
    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
        font-size: 52px
    }
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title p {
    color: #fff;
    font-size: 28px;
    line-height: 1;
    margin-bottom: 35px
}

@media only screen and (min-width:992px) and (max-width:1199px) {
    .subscribe-area {
        padding-bottom: 75px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner {
        padding: 100px 90px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
        font-size: 40px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title p {
        font-size: 22px
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .subscribe-area {
        padding-bottom: 60px
    }

    .subscribe-area .subscribe-wrapper {
        background-size: contain;
        padding-top: 20.2127659574vw
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner {
        padding: 100px 60px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
        font-size: 36px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title p {
        font-size: 20px
    }
}

@media only screen and (max-width:767px) {
    .subscribe-area {
        padding-bottom: 50px
    }

    .subscribe-area .subscribe-wrapper {
        background-size: contain;
        padding-top: 20.2127659574vw
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner {
        padding: 100px 30px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
        font-size: 28px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title p {
        font-size: 16px
    }
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form {
    margin: 0
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form {
    position: relative;
    overflow: hidden;
    max-width: 690px;
    margin: auto
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form::before {
    content: "";
    font-family: "Line Awesome Free";
    font-weight: 900;
    font-size: 24px;
    color: #999;
    position: absolute;
    top: 19px;
    left: 25px
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form input {
    height: 64px;
    background: #fff;
    color: #666;
    padding: 20px 220px 20px 65px;
    line-height: 24px;
    display: inline-block;
    width: 100%;
    font-size: 16px;
    border: none;
    border-radius: 30px
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form .mc-news {
    position: absolute;
    left: -55555px
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form .clear button.button {
    position: absolute;
    top: 0;
    right: 0;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 700;
    border: 0;
    border-radius: 0 30px 30px 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0 5px;
    line-height: 64px;
    height: 64px;
    min-width: 210px;
    display: inline-block;
    text-align: center;
    color: #fff;
    -webkit-transition: .3s linear;
    transition: .3s linear;
    background: #f2ab00
}

@media only screen and (max-width:575px) {
    .subscribe-area .subscribe-wrapper {
        padding-top: 19.2127659574vw
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner {
        padding: 80px 20px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title h2 {
        font-size: 20px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-title p {
        line-height: 24px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form .clear button.button {
        min-width: 150px;
        font-size: 16px
    }
}

@media only screen and (max-width:479px) {
    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form input {
        padding: 20px 10px 20px 55px
    }

    .subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form .clear button.button {
        position: static;
        margin: 20px 0 0;
        min-width: 100%;
        border-radius: 30px
    }
}

.subscribe-area .subscribe-wrapper .subscribe-inner .subscribe-form form .mc-form .clear button.button:hover {
    background: #403148
}
.__cf_email__,.contact-list__info{
    color:#fff !important;
}
.card{
    position:relative;
}
.card .testimonial-two-slider__review-shape{
       position: absolute;
    right: 10%;
      top: -20%;
    max-width: 66px;
}
.header-info__cart svg{
    width:40px;
}
.table-wrapper{
       position: relative;
        overflow: scroll;
    }
    
    .table-wrapper table{
            width: 800px !important;
        
    }
.filter button{
    margin-bottom:10px;
}
@media(max-width:600px){
    .product-item__title {
    margin-bottom: 0;
    font-size: 15px;
    margin-bottom: 10px;
}
    .banner-section {
       background-size: 120% 100%;
    height: auto;
    background-position-x: 10%;
}
.philosophy .choose-item {
   
    width: 80%;
}.choose-items-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-bottom: 29px;
}
    .__cf_email__,.contact-list__info{
    color:#fff !important;
    font-size: 12px;
}
    .subscribe-title {
    color: #fff;
    font-size: 22px;}
    
    .contact-list__wrapper{
        margin-top:0;
        margin-left: 10px;
    }
    .top-contact__logo img {
    width: 100px;
    height: auto;
}
    .header {
        padding: 5px 0;
    }
    
    .table-wrapper{
       position: relative;
        overflow: scroll;
    }
    
    .table-wrapper table{
            width: 800px !important;
        
    }
    .navbar-nav, .top-contact {
    margin: unset;
}
.contact-list__icon {

    width: 20px;
    height: 20px;
  
}
    .contact-list__icon img {
        width: 12px;
    }
   .service-18 .card-body {
   
    min-height: unset;
}
    .contact-list {
        margin-right: 5px;
    }
}
.first-n{
    color:#FECC00;
}
.second-n{
    color:#00A0E3;
}
 .line {
        fill: none;
        stroke: #fff;
        stroke-width: 5px;
        transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
          stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
      } 
    .line1 {
        stroke-dasharray: 60 207;
        stroke-width: 5px;
      }
    .line2 {
        stroke-dasharray: 60 60;
        stroke-width: 5px;
      }
    .line3 {
        stroke-dasharray: 60 207;
        stroke-width: 5px;
      }
      .navbar-toggler[aria-expanded="true"] .line1 {
        stroke-dasharray: 90 207;
        stroke-dashoffset: -134;
        stroke-width: 5px;
        stroke: #fff;
    }
    .navbar-toggler[aria-expanded="true"] .line2 {
        stroke-dasharray: 1 60;
        stroke-dashoffset: -30;
        stroke-width: 5px;
        stroke: #fff;
    }
    .navbar-toggler[aria-expanded="true"] .line3 {
        stroke-dasharray: 90 207;
        stroke-dashoffset: -134;
        stroke-width: 5px;
        stroke: #fff;
    }
    .partner-item{
        margin: 10px 0;
    }
    
    .delivery__title{
        margin-bottom: 20px;
    font-weight: 700;
    font-size: 17px;
    }
    .text-content{
            box-shadow: var(--box-shadow);
    overflow: hidden;
    height: 100%;
    padding: 35px 10px;
    }
    
    .contact-item__thumb img{
        filter: brightness(0) saturate(100%) invert(34%) sepia(100%) saturate(1267%) hue-rotate(356deg) brightness(95%) contrast(93%);
    }
    
    .larger p{
        font-size: 18px;
    }