#header {
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 999999;
    opacity: 1;
    transition: all .3s;
}

#header .afg-logo-link,
#header .afg-logo-link svg {
	width: 150px;
    transition: all .3s;
}

#header .afg-logo-link:hover svg {
    fill: var(--main-color);
}

@media (max-width:1240px) {
    #header .afg-logo-link,
    #header .afg-logo-link svg {
        width: 120px;
    }

    #header #pre-header .afg-logo-link,
    #header #pre-header .afg-logo-link svg {
        fill:#ffffff;
    }
}

#main-header ul.main-menu {
	display: flex;
	flex: 1;
	align-items: center;
    justify-content: space-evenly;
	padding: 0;
    gap: 15px;
}

#main-header ul.main-menu > li {
	display: flex;
	align-items: center;
	height: 100%;
}

#main-header ul.main-menu > li > a {
	display: block;
	padding: 5px 10px;
	border-radius: 50px;
	transition: all .3s;
    font-weight: 600;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    transition: all .3s;
}

#main-header ul.main-menu a:hover {
    color: var(--main-color);
}

@media (min-width: 980px) and (max-width: 1240px) {

    #main-header ul.main-menu > li {
        max-width: 200px;
    }
    #main-header ul.main-menu > li > a {
        padding: 5px;
    }
}

#main-header ul.main-menu .sub-menu {
	position: absolute;
	top: 100px;
	z-index: 2;
	padding: 15px 10px;
	opacity: 0;
	pointer-events: none;
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid var(--main-color);
	font-size: 16px;
    font-weight: 600;
	text-transform: none;
	transition: all .3s;
    border-radius: 10px;
}

#main-header ul.main-menu li.menu-item-has-children > a {
    position: relative;
    padding-right: 25px;
}

#main-header ul.main-menu li.menu-item-has-children > a:after {
    content:'';
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 12px;
    width: 12px;
    background-image: url('../img/arrow-down-blk.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: all .3s;
}

#main-header ul.main-menu li.menu-item-has-children:hover > a:after {
    transform: translateY(-50%) scaleY(-1);
    background-image: url('../img/arrow-down-pink.svg');
}

#main-header ul.main-menu li.menu-item-has-children:hover .sub-menu {
	opacity: 1;
	pointer-events: all;
}

.afg-scroll-down #header {
	opacity: 0;
    top:-100px;
	pointer-events: none;
}

.afg-scroll-up #header {
	opacity: 1;
    top:0;
    background-color: #ffffff;
    pointer-events: all;
}

.afg-scroll-top #header {
	opacity: 1;
    top:0;
	background-color: transparent;
	pointer-events: all;
}

.afg-scroll-up:not(.afg-scroll-top) #header {
    box-shadow:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
}

/**
 * Pre Header
 */
#pre-header {
	height: 42px;
	align-items: center;
    background-color: var(--main-color);
    color:var(--fourth-color);
}

@media (min-width: 980px) and (max-width: 1240px) {
    #pre-header {
        height: 55px;
    }
}

#pre-header ul,
#pre-header ul li,
#pre-header ul li::before {
	display: flex;
	align-items: center;
}

#pre-header ul {
	justify-content: flex-end;
}

#pre-header ul li,
#pre-header ul li::before {
	height: 100%;
	justify-content: center;
}

#pre-header ul li::before {
	content: '|';
	margin: 0 5px;
}

#pre-header ul li:first-child::before,
#pre-header ul.lrm-switcher li::before {
	display: none;
}

#pre-header ul.lrm-switcher li::before {
	content: '';
}

/**
 * Tunnel Header
 */
#tunnel-header {
	height: 120px;
	background-color: var(--fourth-color);
	border-bottom: 1px solid var(--main-color);
}

#tunnel-steps {
	display: flex;
	align-items: center;
	justify-content: space-around;
	width: 100%;
}

#tunnel-steps * {
	margin-bottom: 0;
}

#tunnel-steps a.afg-active .number {
	color: var(--fourth-color);
}

#tunnel-steps a.afg-low .number {
	background-color: #bbbbbb;
}

#tunnel-header .afg-shop-menu {
	justify-content: flex-end;
}

/**
 * Header - Lang Selector
 */
.afg-lang-selector {
	width: 30px;
	cursor: pointer;
}

.afg-lang-selector div {
	width: 30px;
	height: 30px;
	overflow: hidden;
	border-radius: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.afg-lang-selector a {
	display: block;
	width: 100%;
	height: 100%;
}

.afg-lang-selector .en {
	background-image: url('assets/img/british-flag.png');
}

.afg-lang-selector .fr {
	background-image: url('assets/img/french-flag.png');
}

.afg-lang-unactive {
	position: absolute;
	top: calc(50% + 22px);
	opacity: 0;
	pointer-events: none;
	transition: all .3s;
}

.afg-lang-selector:hover .afg-lang-unactive {
	opacity: 1;
	pointer-events: all;
}

/**
 * Preheader - Login Forms
 */
.lrm-login {
	position: relative;
}

.lrm-user-modal {
	background: transparent;
}

.lrm-user-modal-container {
	position: absolute;
	top: 47px;
	right: 8.33333%;
	left: auto;
	width: 334px;
	height: auto;
	margin: 0;
	padding: 0;
	background: var(--fourth-color);
	border: 1px solid var(--second-color);
}

.lrm-close-form {
	display: none;
}


@media screen and (max-width: 980px) {
    #pre-header .content-font-strong-14 {
		font-size: 12px;
	}
    
	#pre-header > div {
		flex-basis: 100%;
		max-width: 100%;
		margin-left: 0;
		justify-content: space-between;
	}

	#main-header {
		display: flex;
		justify-content: space-between;
		padding: 15px;
	}

	#main-header #afg-main-menu {
		position: fixed;
		top: 0;
		left: -350px;
		display: block;
		max-width: 350px;
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
		z-index: 1000000;
		background-color: var(--main-color);
		color: var(--fourth-color);
		transition: all .3s;
	}

	#main-header #afg-main-menu.afg-active {
		left: 0;
	}

	#main-header #afg-main-menu ul {
		display: block;
	}

	#main-header #afg-main-menu > ul {
		height: calc(100vh - 60px);
		overflow-y: scroll;
        padding: 50px 15px;
	}

	#main-header #afg-main-menu ul li {
		display: block;
		height: auto;
	}

	#main-header #afg-main-menu ul li a {
		color: var(--fourth-color);
        font-size: 15px;
        padding: 5px 0 10px;
	}

    #main-header ul.main-menu li.menu-item-has-children > a:after {
        display: none;
    }

	#main-header #afg-main-menu ul.main-menu ul.sub-menu {
		position: relative;
		top: auto;
		display: inline-block;
		padding: 10px 10px 15px;
		opacity: 1;
		pointer-events: all;
		background: transparent;
		border: 0;
	}

    #main-header #afg-main-menu ul.main-menu ul.sub-menu li a {
		position: relative;
		top: auto;
		display: inline-block;
		padding: 5px 0;
		opacity: 1;
		pointer-events: all;
		background: transparent;
		border: 0;
	}

	#afg-menu-toggle {
		display: block;
		width: 30px;
		height: 30px;
	}

	.menu-title {
		height: 62px;
		border-bottom: 1px solid;
        line-height: normal;
	}

	.menu-title .afg-close-modal {
		top: 50%;
        transform: translateY(-50%);
		right: 15px;
	}

    .menu-title .afg-close-modal svg {
		stroke: var(--fourth-color);
	}

	.afg-logo-item {
		text-align: center;
	}

	.afg-logo-link {
		display: inline-block;
		max-height: 80px;
	}

	.afg-logo-link svg {
		width: auto;
		max-width: 100%;
		max-height: 80px;
	}

	th.product-name,
	td.product-name {
		width: 100%;
	}

	td.product-quantity {
		padding: 0 15px !important;
	}

	table.variations tbody {
		padding: 0;
	}

	#tunnel-header {
		height: auto;
		padding-bottom: 10px;
	}

	#tunnel-steps .svg-after {
		display: none;
	}

	#tunnel-header .title-font-28 {
		font-size: 14px;
	}

	#tunnel-header .number {
		width: 30px;
		height: 30px;
	}

	#tunnel-header .tunnel-title {
		margin-right: 10px;
	}

	#tunnel-header .step-element:last-child .tunnel-title {
		margin-right: 0;
	}

	#tunnel-header .afg-logo-link svg {
		padding: 10px;
	}

	.afg-lang-selector div {
		width: 25px;
		height: 25px;
	}

	.afg-lang-selector .afg-lang-unactive {
		top: 0;
		left: 50px;
		z-index: 10;
		opacity: 0;
		pointer-events: none;
	}

	.afg-lang-selector.afg-active .afg-lang-unactive,
	.afg-lang-selector.afg-active:hover .afg-lang-unactive {
		opacity: 1;
		pointer-events: all;
	}
}

body.logged-in #header #pre-header li.lrm-hide-if-logged-in {
    display: none;
}


@media (max-width: 450px) {
	#main-header #afg-main-menu {
		left: -100%;
		max-width: 100%;
	}
}

@media (max-width: 330px) {
	#pre-header .content-font-strong-14 {
		font-size: 9px;
	}
}

/**
*
* To move
*
**/

footer .widget.widget_media_image {
    max-width: 250px;
}

/** My Account: add payment method **/
input[type="radio"] + label:first-of-type {
    padding-left: 50px;
}

button[type="submit"] {
    width: auto;
}

.woocommerce-form.woocommerce-form-login [type="submit"].login {
	 width: auto;
	 background: var(--main-color)!important;
    color:#ffffff!important;
}

.woocommerce-Payment button[type="submit"] {
    margin:30px auto;
}

.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link:not(.woocommerce-MyAccount-navigation-link--customer-logout) a {
    color:#000000!important;
    transition:all .3s;
}

.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link.is-active:not(.woocommerce-MyAccount-navigation-link--customer-logout) a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link:not(.woocommerce-MyAccount-navigation-link--customer-logout) a:hover {
    background: var(--main-color)!important;
    color:#ffffff!important;
}

/** modal cart **/
.xoo-wsc-footer {
    box-shadow:unset;
}

.xoo-wsc-opac,
.afg-modal-overlay {
    transition: all .3s;
}

.xoo-wsc-basket[style*='block'] {
    display: none!important;
}

.xoo-wsc-modal .xoo-wsc-container {
    overflow-y: auto!important;
}

@media (max-width:450px) {
    .xoo-wsc-modal .xoo-wsc-container {
        width:100%;
        top:0!important;
        height: 100vh;
        max-height: 100vh!important;
    }

    .xoo-wsc-body {
        max-height: calc(100vh - 200px);
    }
}

/** main menu overlay **/
.afg-modal-overlay.afg-active {
    background-color: rgba(0,0,0,0.3);
}

@media (max-width:1280px) {
    .font-choco {
        font-size: 16px;
    }
}

@media (max-width:980px) {

    #afg-pre-footer li:first-child > div {
        display: block;
        text-align: center;
        padding-bottom: 20px;
    }

    #afg-pre-footer li:first-child > div p {
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }

    #afg-pre-footer a[href*="instagram.com"] {
        font-size: 18px;
    }

    .home .wp-block-group * {
        text-align: center;
    }

    .home .wp-block-spacer + .wp-block-spacer {
        display: none;
    }

    footer .widget.widget_media_image {
        max-width: 150px;
        margin:0 auto;
    }

    footer div.afg-copyright-text {
        font-size: 8px;
    }

    .woocommerce-MyAccount-content {
        margin:30px 0;
    }

}