/* ===================================
   BOOTSTRAP GRID LITE (Elementor safe)
=================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* CONTAINERS */

.container,
.container-xxl {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 12px;
  padding-left: 12px;
}

@media (min-width: 1400px) {
  .container-xxl {
    max-width: 1320px;
  }
}

/* ROW */

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -12px;
  margin-left: -12px;
  width: 100%;
}

.row > * {
  padding-right: 12px;
  padding-left: 12px;
  width: 100%;
  max-width: 100%;
}

/* COL BASE */

.col {
  flex: 1 0 0%;
}

.col-1 { flex: 0 0 auto; width: 8.333333%; }
.col-2 { flex: 0 0 auto; width: 16.666667%; }
.col-3 { flex: 0 0 auto; width: 25%; }
.col-4 { flex: 0 0 auto; width: 33.333333%; 
.col-5 { flex: 0 0 auto; width: 41.666667%; }
.col-6 { flex: 0 0 auto; width: 50%; }
.col-7 { flex: 0 0 auto; width: 58.333333%; }
.col-8 { flex: 0 0 auto; width: 66.666667%; }
.col-9 { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.333333%; }
.col-11 { flex: 0 0 auto; width: 91.666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }

/* OFFSETS */

.offset-1 { margin-left: 8.333333%; }
.offset-2 { margin-left: 16.666667%; }
.offset-3 { margin-left: 25%; }
.offset-4 { margin-left: 33.333333%; }

/* ORDER */

.order-1 { order: 1; }
.order-2 { order: 2; }
.order-3 { order: 3; }
.order-4 { order: 4; }

/* LG BREAKPOINT */

@media (min-width: 992px) {

  .col-lg-1 { width: 8.333333%; }
  .col-lg-2 { width: 16.666667%; }
  .col-lg-3 { width: 25%; }
  .col-lg-4 { width: 33.333333%; }
  .col-lg-5 { width: 41.666667%; }
  .col-lg-6 { width: 50%; }
  .col-lg-7 { width: 58.333333%; }
  .col-lg-8 { width: 66.666667%; }
  .col-lg-9 { width: 75%; }
  .col-lg-10 { width: 83.333333%; }
  .col-lg-11 { width: 91.666667%; }
  .col-lg-12 { width: 100%; }

  .offset-lg-0 { margin-left: 0; }
  .offset-lg-1 { margin-left: 8.333333%; }
  .offset-lg-2 { margin-left: 16.666667%; }

  .order-lg-1 { order: 1; }
  .order-lg-2 { order: 2; }
  .order-lg-3 { order: 3; }
  .order-lg-4 { order: 4; }

  .d-lg-flex { display: flex !important; }
}

/* DISPLAY */

.d-none { display: none !important; }



/*
.ekit-template-content-header{
	position: fixed;
    top: 0px;
    left: 0;
    background-color: transparent;
    z-index: 40000;
	width:100%;
	transition: background-color 0.3s ease;
}



.ekit-template-content-header.is-scrolled{
  background-color:rgba(255, 255, 255, .5);
  backdrop-filter: blur(30px);
}
*/

/*------------------------------------------ NAV  ------------------------------------------ */

.nav-woo{
    position: fixed;
    top: 0px;
    left: 0;
    background-color: transparent;
    z-index: 40000;
	width:100%;
	transition: background-color 0.3s ease;
}

.nav-woo.is-scrolled{
    background-color:rgba(255, 255, 255, .5);
  backdrop-filter: blur(30px);
}

.nav-woo .col_logo{
        display: flex;
        align-items: center;
        justify-content: center;
}

.nav-woo .col_logo img{
    width: 100px;
    height: 100px;
    
}

.nav-woo .col_menu{
        display: flex;
        align-items: center;
        display: none;
}


.nav-woo .col_menu .menu__container{
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.nav-woo .col_menu .menu__container a{
    text-decoration: none;
    color: var(--primary);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
}

.nav-woo .col_user{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

 @media screen and (min-width: 576px) {
            
}
@media screen and (min-width: 1200px) {
    
}

.nav-woo .col_user .nav_account{
margin-right: .5rem;
background-color: var(--background-svg);
display: flex;
justify-content: center;
align-items: center;
border-radius: 50px;

}

.nav-woo .col_user .nav_account a img{
    height: 20px;
}







    


/*------------------------------------------ NAV BURGER------------------------------------------ */

.nav-burger {
    position: relative;
    display: flex;
    align-items: center;
}


@media screen and (min-width: 1200px) {
    .nav-burger {
        display: none;
    }
}

.nav-burger .burger {
    width: 30px;
    height: 30px;
    position: relative;
    margin: 0 auto;
    transform: rotate(0deg);
    transition: all 350ms ease-in-out;
    cursor: pointer;
}

.nav-burger .burger span {
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    background: black;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: var(--transition);
}

/
.nav-burger .burger span:nth-child(1) {
    top: 7px;
    transform-origin: left center;
}

.nav-burger .burger span:nth-child(2) {
    top: 14px;
    transform-origin: left center;
}

.nav-burger .burger span:nth-child(3) {
    top: 21px;
    transform-origin: left center;
}


.nav-burger .burger.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 0px;
    left: 4px;
}

.nav-burger .burger.active span:nth-child(2) {
    width: 0%;
    opacity: 0;
}

.nav-burger .burger.active span:nth-child(3) {
    transform: rotate(-45deg);
    top: 20px;
    left: 4px;
}



/*------------------------------------------ NAV CART ------------------------------------------ */
.nav_cart {
    cursor: pointer;
    background-color: var(--background-svg);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
   
   
}

.nav_cart .cart_icon {
    position: relative;
}

.nav_cart .cart_icon img{
    height: 20px;
}

.nav_cart .cart_icon .counter{
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(100%);
    background: var(--primary);
    color: var(--white);
    border-radius: 50%;
    width: 1rem;
    height: 1rem;
    text-align: center;
    font-size: 65%;
    font-weight: 600;
}
 



/*------------------------------------------ NAV RESPONSIVE  ------------------------------------------ */
.nav-responsive {
    position: fixed;
    top: 0px;
    /*left: -100px; */
    transform: translateX(-100%);
    width: calc(100% - 80px);
    height: 100%;
    background: var(--white);
    z-index: 9000;
    visibility: hidden;
    opacity: 0;
    transition: var(--transition);
    box-shadow: var(--box-shadow);
    display: flex;
    align-items: center;
}


@media screen and (min-width: 576px) {
    .nav-responsive {
        width: 70%;
        max-width: 360px;
    }
}


.nav-responsive.active {
    /*left: 0px;*/
    visibility: visible;
    opacity: 1;
    transform: translateX(0%);
}


.nav-responsive .content {
    padding: var(--spacer);
    height: 100vh;
    overflow-y: auto;
    width: 100%;
}


.nav-responsive .content .header__nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacer);
}

.nav-responsive .content .header__nav .nav-logo .logo img {
    height: 50px;
}


.nav-responsive .content .nav-responsive-woo {
    display: flex;
    align-items: center;
    gap: calc(var(--spacer) * .5);
    margin-bottom: calc(var(--spacer) * 2);
}

.nav-responsive .content .nav-responsive-woo .nav_account {
    margin-right: .5rem;
}

@media screen and (min-width: 1200px) {
    .nav-responsive .content .nav-responsive-woo .nav_account {
        margin-right: 0;
    }
}

.nav-responsive .content .nav-responsive-woo .nav_account a img {
    height: 25px;
}

@media screen and (min-width: 1200px) {
    .nav-responsive .content .nav-responsive-woo .nav_account a img {
        height: 34px;
    }
}


.nav-responsive .content ul.menu {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.nav-responsive .content ul.menu li {
    margin-bottom: calc(var(--spacer) / 2);
}

@media screen and (min-width: 576px) {
    .nav-responsive .content ul.menu li {
        font-size: 20px;
    }
}

.nav-responsive .content ul.menu li a {
    text-decoration: none;
    color: var(--primary);
}


.nav-responsive .content .nav-responsive-footer {
    margin-top: var(--spacer-xl);
    position: relative;
}

.nav-responsive .content .nav-responsive-footer::before {
    content: " ";
    position: absolute;
    top: calc(var(--spacer) * -1);
    left: 0;
    height: 2px;
    width: var(--spacer);
    background: var(--light);
}

.nav-responsive .content .nav-responsive-footer ul.menu li a {
    font-size: 80%;
    margin-bottom: calc(var(--spacer) * .25);
    margin-top: calc(var(--spacer) * .25);
    font-weight: normal;
}


.nav-responsive .content .action .rs {
    display: flex;
    justify-content: start;
    align-items: center;
}

.nav-responsive .content .action .rs div {
    margin-right: 10px;
}