.site-header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	transition: all 0.3s ease-in-out;

	.site-logo {
		.site-title {
			font-size: 34px;
			font-weight: 500;
			padding: 8px 0;
			margin: 0;
		}

		a {
			font-size: 30px;
			font-weight: 700;
			padding: 24px 0;
			display: block;
			color: #fff;

			@media(max-width: 991px) {
				padding: 13px 0;
			}

			h3 {
				margin: 0;
				font-size: 30px;
				font-weight: 700;
				color: #fff;
			}
		}

		.logo-sticky {
			display: none;
		}
	}

	.add-menu {
		margin: 0;
		padding: 31px 0;
		list-style: none;
		font-weight: 500;

		li {
			a {
				color: #fff;
			}
		}
	}

	.tt-hamburger {
		width: 24px;
		cursor: pointer;

		&.active {
			opacity: 0;
			visibility: hidden;
		}

		@media(min-width: 992px) {
			display: none;
		}

		&:focus {
			outline: 0;
		}

		.bar {
			background: #fff;
			height: 2px;
			display: block;

			&:not(:last-child) {
				margin-bottom: 5px;
			}
		}
	}

	&.header-fixed.showed, &.mobile-header.showed {
		.header-position & {
			top: 32px;

			@media(max-width: 782px) {
				top: 46px;
			}
		}

		.site-logo {
			.main-logo {
				display: none;
			}

			a {
				color: $color__heading;
			}

			h3 {
				color: $color__heading;
			}
		}

		.add-menu {
			li {
				a {
					color: $color__heading;
				}
			}
		}

		.tt-hamburger {
			.bar {
				background: $color__heading;
			}
		}
	}

	.container {
		@media(min-width: 992px) {
			position: relative;
		}
	}

	&.header_dark {
		.tt-hamburger {
			.bar {
				background: $color__heading;
			}
		}
	}

	.site-main-menu {
		li {
			a {
				font-family: $font__heading;
				text-decoration: none;
			}
		}
	}

	&:not(.mobile-header) {

		.nav-right {
			display: flex;
			justify-content: flex-end;
		}

		.menu-wrapper {
			justify-content: center;
			display: flex;
			align-items: center;
		}

		.submenu-align-right & {
			width: auto;
		}

		.site-main-menu {
			margin: 0;
			padding: 0;
			list-style: none;

			> li {
				padding: 35px 0;
				position: relative;

				> a {
					font-weight: 500;
					font-size: 15px;
					font-family: $font__heading;

					&:hover {
						color: $color__theme;
					}
				}

				&:not(.menu_half_width):nth-last-child(-n+3).menu-item-has-children {
					.sub-menu {
						left: auto;
						right: 0;

						li {
							ul {
								right: 100%;
							}
						}
					}
				}

				&.menu_full_width {
					position: static;

					.elementor-widget {
						margin-bottom: 0 !important;
					}

					.tt-list, .elementor-icon-list-items {
						li {
							display: flex !important;

							p {
								margin: 0;
							}
						}
					}

					> .sub-menu {
						width: 100%;
						padding: 0 !important;
					}
				}

				&.menu_half_width {
					.elementor-widget {
						margin-bottom: 0 !important;
					}

					> .sub-menu {
						width: 600px;
						left: 50%;
						transform: translateX(-50%);
						padding: 0 !important;
					}
				}

				&.single_width {
					.elementor-widget {
						margin-bottom: 0 !important;
					}

					> .sub-menu {
						width: 350px;
					}

					li {
						a {
							padding: 0 !important;
						}
					}
				}

				&:not(.mega-menu) {
					position: relative
				}
			}

			li {
				display: inline-block;

				&:not(:last-child) {
					margin-right: 40px;
				}

				&.menu-item-has-children {

					//.fa-chevron-down {
					//	display: none;
					//}

					> a {
						position: relative;

						 &:after {
							 content: "";
							 position: absolute;
							 font-family: "Font Awesome 5 Free";
							 font-weight: 900;
							 right: -16px;
							 font-size: 13px;
							 top: 0;
						 }
					}

					.sub-menu {
						margin: 0;
						padding: 15px 0;
						position: absolute;
						top: 115%;
						left: 0;
						opacity: 0;
						visibility: hidden;
						background: #fff;
						transition: all 0.3s ease-in-out;
						border-radius: .25rem;
						min-width: 220px;
						box-shadow: 0 5px 10px #14303a15;
						z-index: 2222;
						display: block !important;
						border-radius: 10px;

						&.sub-menu-wide {
							width: 100%;
							display: flex;
							justify-content: space-between;
							padding: 40px 80px 25px;


							> .mega-menu-item > a.menu-link {
								font-size: 16px;
								text-transform: uppercase;
								font-weight: 500;
								display: inline-block;
								color: $color__heading;
							}

							.sub-menu {
								position: unset;
								box-shadow: unset;
								visibility: unset;
								opacity: unset;
							}

						}

						li {
							display: block;
							position: relative;
							margin-right: 0;
							line-height: 36px;

							a:not(.tt-btn-link) {
								font-size: 14px;
								padding: 7px 25px;
								display: block;
								line-height: 1.5;
								color: #464A56;
								font-weight: 500;

								&:hover {
									color: $color__theme;
								}
							}

							.sub-menu {
								padding: 15px 0;
								position: absolute;
								left: 100%;
								top: 0;
								background: #fff;
								min-width: 220px;
								transition: all 0.3s ease-in-out;
								opacity: 0;
								visibility: hidden;
								box-shadow: 0 5px 10px #14303a15;
							}

							&.menu-item-has-children {
								&:hover {
									ul {
										opacity: 1;
										visibility: visible;
										top: -15px;
									}
								}
							}
						}
					}

					&:hover {
						ul {
							opacity: 1;
							visibility: visible;
							top: 100%;
						}
					}
				}

			}
		}


		&.submenu-align-right {
			.menu-wrapper {
				width: auto;
			}

			.site-main-menu {
				> li {
					&:nth-last-child(-n+3) {
						&.menu-item-has-children {
							.sub-menu {
								left: auto;
								right: 0;

								li {
									ul {
										right: 100%;
									}
								}
							}
						}
					}
				}
			}


		}

		.nav-right {
			margin-left: 40px;

			.tt-btn {
				padding: 8px 26px;
				min-width: auto;
			}
		}

		&.header_light {
			.site-main-menu > li {
				> a {
					color: rgba(255, 255, 255, 0.7);

					&:hover {
						color: #fff;
					}
				}
			}
		}
	}

	&.header-fixed.showed {
		&:not(.mobile-header) .site-main-menu > li {
			padding: 27px 0;
		}
	}

	&.header-fixed.showed, &.mobile-header.showed {
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 9999;
		background: #fff;
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
		animation: stickySlideDown 0.65s cubic-bezier(0.23, 1, 0.32, 1) both;

		.header-position & {
			top: 32px;

			@media(max-width: 782px) {
				top: 46px;
			}

			.fullscreen-menu {
				top: 0;
			}
		}

		.site-logo {
			.main-logo {
				display: none;
			}

			.logo-sticky {
				display: block;
			}
		}

		.menu-trigger .dot_icon .dot {
			background: $color__heading;
		}

		.site-main-menu {
			li {
				a {
					color: $color__heading;

					&:hover {
						color: $color__theme;
					}
				}
			}
		}
	}

	.elementor-widget .elementor-icon-list-icon {
		display: inline-flex;
	}

	.tt-btn {
		display: inline-block !important;
		padding: 5px 35px;
		font-family: $font__heading;
		text-decoration: none;
	}

	.tt__list {
		li {
			margin-bottom: 0;

			a {
				padding-left: 0 !important;
				padding-right: 0 !important;

				@media(max-width: 991px) {
					padding: 5px 25px;
				}
			}
		}
	}

	.single-product & {
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);

		.logo-sticky {
			display: block;
		}

		.main-logo {
			display: none;
		}
	}
}

@keyframes stickySlideDown {
	from {
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%)
	}
	to {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

.menu-trigger {
	overflow: hidden;
	display: flex;
	align-items: center;
	cursor: pointer;
	background-color: transparent;
	border: 0px solid transparent;
	@media #{$tab} {
		justify-content: center;
		display: block !important;
	}

	.dot_icon {
		display: flex;
		flex-wrap: wrap;
		width: 24px;
		height: 24px;
		margin: -2px;
		overflow: hidden;

		.dot {
			width: 4px;
			height: 4px;
			background: $color__heading;
			margin: 2px;
			transition: all 0.3s linear;

			.menu-light & {
				background: #fff;
			}
		}
	}

	&:hover {
		.dot_icon {
			.dot {
				&:nth-child(odd) {
					transform: translate(8px, 8px);
				}

				&:nth-child(5) {
					opacity: 0;
				}
			}
		}
	}
}

#site-navigation {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

@media(min-width: 992px) {
	.close-menu {
		display: none;
	}
}

.mobile-menu-header {
	display: none;
	align-items: center;
	justify-content: space-between;
	padding: 30px 25px;
	border-bottom: 1px solid #eee;

	h3 {
		margin-bottom: 0;
	}
}

.close-menu {
	height: 40px;
	width: 40px;
	background: rgba(136, 136, 136, 0.1);
	border-radius: 50%;
	text-align: center;
	line-height: 42px;
	color: #051441;
	font-size: 14px;
}

.site-main-menu {
	list-style: none;

	ul {
		list-style: none;
	}
}

/*--------------------------------------------------------------
### Main Nav Mobile
--------------------------------------------------------------*/
.site-header {
	@media(max-width: 991px) {
		height: auto;

		.mobile-menu-header {
			display: flex;
		}


		.site-logo {
			.logo-sticky {
				display: none;
			}
		}

		.tt-hamburger {
			display: block;
		}

		&.header-fixed.showed {
			.logo-sticky {
				display: block;
			}

			.main-nav-container .menu-item-depth-0 > a.active {
				color: #fff;
			}
		}

		//.site-logo a {
		//    padding: 13px 0;
		//}

		.nav-right {
			display: none;
		}

		.main-nav-container {
			position: fixed;
			top: 0;
			height: 100vh;
			background: #fff;
			max-width: 400px;
			width: 100%;
			text-align: left;
			overflow-y: auto;
			padding-bottom: 50px;
			left: -100px;
			transition-duration: .3s;
			opacity: 0;
			visibility: hidden;
			z-index: 999;

			.header-position & {
				top: 32px;

				@media(max-width: 780px) {
					top: 46px;
				}
			}

			@media(max-width: 420px) {
				max-width: 100%;
			}

			&.open {
				opacity: 1;
				left: 0;
				visibility: visible;
			}

			li {
				padding: 0 10px;
				position: relative;

				a:not(.tt-btn-link) {
					font-size: 14px;
					color: $color__heading;
					position: relative;
					z-index: 1;
					padding: 8px 15px;
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-weight: 500;
					text-transform: uppercase;
					border-radius: 6px;
					margin-bottom: 5px;

					&:hover {
						display: block;
						background-color: #f5f5f5;
					}
				}

				&.is-open {
					> a {
						background-color: #f5f5f5;
					}
				}

				.tt-btn-link {
					padding: 11px 35px;
				}

				i.fa-chevron-down {
					position: absolute;
					right: 20px;
					top: 12px;
					font-size: 12px;
					z-index: 3;
				}

				&.menu-item-has-children {
					> a {
						position: relative;

						&.active {
							&:after {
								content: "\e622";
							}
						}
					}

					li {
						a {
							font-size: 14px;
							text-transform: capitalize;
						}
					}
				}
			}

			&.current-menu-item {
				&.is-open {
					> a {
						display: block;
						background-color: #f5f5f5;
					}
				}
			}

			.menu-item-depth-0 {

				> a {
					&.active {
						color: #fff;
						background: $color__theme;

					}
				}

			}
		}

		.header-position & {
			&.showed {
				.main-nav-container {
					top: 0;
				}
			}
		}

		.main-nav {
			position: static;
			z-index: 3333;
			line-height: 1.2;

			.site-main-menu {
				padding-left: 0;
			}

			.sub-menu {
				padding-left: 15px;
				margin-left: 0;
				margin-bottom: 0;
				display: none;

				> li {
					padding: 0;
				}

				&.active {

					.main-item > .menu-link {
						background: #f8f9fa;
					}
				}

				li {
					a {
						border-top: 0;
					}

					&.is-open {
						a {
							&.is-open {
								.fa-chevron-down {
									color: $color__theme;
								}
							}
						}
					}

					&.current-menu-item {
						a {
							&.active {
								color: $color__theme;
							}
						}
					}
				}
			}

			.nav-item.active-main-item > .menu-link {
				color: $color__theme;
				background: #f8f9fa;
				border-color: $color__theme;
			}

			.sub-menu {
				padding-left: 10px;
				margin-bottom: 0;
			}
		}

		/*--------------------------------------------------------------
		### Main Nav
		--------------------------------------------------------------*/
		.main-nav {
			cursor: default;
			position: relative;
			z-index: 10;
			text-align: left;
			font-weight: 500;
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;

			@media(max-width: 991px) {
				min-height: 60px;
			}

			a:before,
			.close-bar {
				display: none;
			}

			//.site-logo {
			//    a {
			//        font-size: 40px;
			//    }
			//}

			.site-main-menu {
				margin-top: 20px;
			}

			.site-main-menu,
			.site-main-menu ul {
				list-style: none;
			}


			// Menu
			.nav-item,
			.nav-item.current-menu-item,
			.nav-item.current-menu-ancestor {
				&:before {
					background-color: $color__theme;
				}
			}

			.nav-item {
				&.active-main-item {
					> .menu-link {
						color: $color__theme;
					}
				}
			}

			&.hidden {
				display: none;
			}

			@include tablet_screen() {
				.close-menu {
					display: block;
				}
			}
		}
	}

	@media (max-width: 991px) {
		.elementor-column.elementor-col-50, .elementor-column[data-col="50"] {
			width: 100% !important;
		}
	}
}

.mask-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 222;
}


.tt-menu-item {
	transition: all 0.3s ease-in-out;
	border-radius: 0.375rem;

	.description {
		margin: 0;
	}

	.menu-link {
		display: block;
		padding: 0 !important;
	}

	.wrapper {
		padding: 10px;
		display: flex;
		transition: all 0.3s ease-in-out;
		border-radius: 4px;

		.icon-container {
			height: 35px;
			width: 35px;
			line-height: 35px;
			text-align: center;
			background: $color__theme;
			color: #fff;
			margin-right: 15px;
			border-radius: 6px;
			font-size: 16px;
			font-weight: 500;
		}

		.box-title {
			font-size: 16px;
			font-weight: 500;
			margin-bottom: 0;
			margin-top: 0;

			a {
				padding: 0 !important;
			}
		}

		&:hover {
			background-color: #f7f9fc;
		}
	}

	.description {
		color: #8392a5;
		font-size: 13px;
		line-height: 1.4;
		margin: 0;
	}

	&.style-one {
		display: block;
		color: #464646;
		border-radius: 0.375rem;

		.icon-container {
			font-size: 18px;

			img {
				height: 22px;
			}
		}


		&:hover {
			background-color: #fafafa;
		}
	}

	//&.style-two {
	//    .wrapper {
	//        display: flex;
	//        align-items: center;
	//
	//        .icon-container {
	//            margin-right: 0.75rem;
	//            height: 2.5rem;
	//            line-height: 2.5rem;
	//            text-align: center;
	//            flex: 0 0 2.5rem;
	//            background-color: $color__theme;
	//            color: #fff;
	//            border-radius: 50%;
	//        }
	//
	//        .description {
	//            color: #8392a5;
	//        }
	//
	//        .box-title {
	//            display: block;
	//            font-weight: 600;
	//            font-size: 0.85rem;
	//            line-height: 1.3rem;
	//            margin: 0;
	//        }
	//    }
	//
	//    &:hover {
	//        .box-title {
	//            color: $color__theme;
	//        }
	//    }
	//
	//    &:hover {
	//        background-color: #fafafa;
	//    }
	//}

	//&.style-three {
	//    .wrapper {
	//        display: flex;
	//        align-items: center;
	//
	//        .icon-container {
	//            font-size: 16px;
	//            color: $color__theme;
	//            margin-right: 10px;
	//        }
	//
	//        .description {
	//            color: #8392a5;
	//        }
	//
	//        .box-title {
	//            display: block;
	//            font-weight: 600;
	//            font-size: 0.85rem;
	//            line-height: 1.3rem;
	//            margin: 0;
	//        }
	//    }
	//
	//    .top-wrapper {
	//        display: flex;
	//    }
	//
	//    &:hover {
	//        background-color: #fafafa;
	//    }
	//}
	//
	//&.style-four {
	//    .wrapper {
	//        display: flex;
	//        align-items: center;
	//
	//        .icon-container {
	//            margin-right: 10px;
	//            max-width: 2.5rem;
	//            color: $color__theme;
	//            font-size: 20px;
	//
	//            svg {
	//                width: 30px;
	//                height: auto;
	//            }
	//
	//            i {
	//                display: inline-block;
	//            }
	//        }
	//
	//        .description {
	//            color: #8392a5;
	//        }
	//
	//        .box-title {
	//            display: block;
	//            font-weight: 600;
	//            font-size: 0.85rem;
	//            line-height: 1.3rem;
	//            margin: 0;
	//        }
	//    }
	//
	//    &:hover {
	//        .box-title {
	//            color: $color__theme;
	//        }
	//    }
	//
	//    &:hover {
	//        background-color: #fafafa;
	//    }
	//}
}

.mega-menu-wrapper {
	a {
		display: block !important;
	}

	@media(max-width: 991px) {
		.elementor-element {
			> .elementor-element-populated {
				padding: 10px !important;
			}
		}
	}
}