ul.gva-nav-menu{
  	margin-bottom: 0;
  	padding: 0;
  	> li{
	 	margin: 0;
	 	padding: 0;
	 	position: relative;
	 	list-style: none;
	 	float: left;
	 	display: inline-block;
	 	padding: 0 10px;
	 	@include media-breakpoint-down(xxl){
	 		padding: 0;
	 	}
	 	> a {
			font-size: 18px; 
			font-weight: 500;
			height: auto;
			position: relative;
			display: inline-block;
			color: $headings-color;
			padding: 35px 10px;
			&:after{
		 		content: '';
			 	width: 3px;
			 	height: 0px;
			 	background: $theme-color;
			 	position: absolute;
			 	left: 0;
			 	top: 50%;
			 	z-index: 11;
			 	@include transform(translateY(-50%));
			 	@include opacity(0);
			 	@include transition(all 0.35s);
	  		}
			.caret{
			  	margin-left: 3px;
			  	top: 2px;
			  	position: relative;
			  	height: 8px;
			  	width: 10px;
			  	display: inline-block;
			  	font-size: 14px;
			  	&:after{
				 	content: '\f107';
				 	position: absolute;
				 	left: 0;
				 	top: 50%;
				 	margin-top: -7px;
				 	z-index: 1;
				 	font-family: $font-icon-awesome;
				 	line-height: 1;
				 	font-size: 12px;
				 	font-weight: 700;
				 	@include opacity(0.8);
			  	}
			}
	 	}
	 	&:hover, &:active, &:focus, &.current_page_parent{
			> a{
		  		color: $theme-color;
		  		&:after{
				 		height: 13px;
				 		@include opacity(1);
		  		}
			}   
	 	}
	 	> .submenu-inner{
			&:after{
			  	content: '';
			  	position: absolute;
			  	bottom: 100%;
			  	left: 0;
			  	width: 100%;
			  	height: 20px;
			  	display: block;
			  	background: transparent;
			  	@media(max-width: 1024px){
			  		display: none;
			  	}
			}
	 	}
	 	.submenu-inner, ul.submenu-inner{
			@include opacity(0);
			visibility: hidden;
			position: absolute;
			@include transition(all 0.35s);
			top: 100%;
			z-index: 99;
			margin-top: 1px;
			@include box-shadow(0 0 20px 0 rgba(62, 28, 131, 0.1));
			transition-delay: 0.1s;
			border-radius: 0px; 
			min-width: 250px;
			padding: 10px 20px 10px;
			background: $white;
			list-style-type: none;
			transform: rotateX(-90deg);
			transform-origin: 0 0;
			li{
			  	background: $nocolor;
			  	position: relative;
			  	text-align: left;
			  	border-bottom: 1px solid $border-color;
			  	padding: 5px 0;
		  		@include media-breakpoint-down(md){ 
			 		border-bottom: 0;
		  		}
		  		&:last-child{
			 		border-bottom: none;
		  		}
		  		a{
			 		display: block;
				 	line-height: 1.4;
				 	padding: 8px 0;
				 	font-size: 16px;
				 	text-transform: capitalize;
				 	position: relative;
				 	color: $body-color;
				 	font-family: $headings-font-family;
			 		.caret{
						top: 18px;
						position: absolute;
						right: 0;
						height: 8px;
						width: 10px;
						display: inline-block;
						&:after{
						  	content: '\f054';
						  	position: absolute;
						  	left: 0;
						  	top: 50%;
						  	margin-top: -8px;
						  	z-index: 1;
						  	font-family: $font-icon-awesome;
						  	line-height: 1;
						  	font-size: 12px;
						  	font-weight: 700;
						}
			 		}
			 		&:hover, &:focus, &:active{
						color: $theme-color;
					}
		  		}
		  		ul.submenu-inner{
			 		position: absolute;
			 		left: 90%;
			 		top: 0;
		  		}
		  		&:hover{
			 		> ul.submenu-inner {
						display: block;
						@include opacity(1);
						visibility: visible;
						-webkit-transform: rotateX(0);
						-moz-transform: rotateX(0);
						-ms-transform: rotateX(0);
						-o-transform: rotateX(0);
						transform: rotateX(0);
			 		}
		 	 	}
			} 
	 	}
	 &:hover{
		>.submenu-inner{
		  top: 100%;
		  @include opacity(1);
		  visibility: visible;
		  height: auto;
		  @include opacity(1);
		  display: block;
		  -webkit-transform: rotateX(0);
		  -moz-transform: rotateX(0);
		  -ms-transform: rotateX(0);
		  -o-transform: rotateX(0);
		  transform: rotateX(0);
		}
	 }
	 @media(max-width: 1600px){
		&:last-child, &:nth-last-child(2){
		  ul.submenu-inner li ul.submenu-inner{
			 right: 100%;
			 left: auto;
		  }
		}
	 }
	 &.megamenu-main{
		.megamenu-wrap-inner{
		  max-width: 1170px!important;
		  background: $white;
		  left: 0;
		  -webkit-transform: rotateX(-90deg);
		  -moz-transform: rotateX(-90deg);
		  -ms-transform: rotateX(-90deg);
		  -o-transform: rotateX(-90deg);
		  transform: rotateX(-90deg);
		  -webkit-transform-origin: 0 0;
		  -moz-transform-origin: 0 0;
		  -ms-transform-origin: 0 0;
		  -o-transform-origin: 0 0;
		  transform-origin: 0 0;
		  ul.megamenu-sub{
			 padding: 0;
			 list-style-type: none;
			 &.megamenu-columns-6 > li{
				width: (100% / 6);
			 }
			 &.megamenu-columns-5 > li{
				  width: (100% / 5);
			 }
			 &.megamenu-columns-4 > li{
				  width: (100% / 4);
			 }
			 &.megamenu-columns-3 > li{
				width: (100% / 3);
			 }
			 &.megamenu-columns-2 > li{
				width: (100% / 2);
			 }
			 &.megamenu-columns-1 > li{
				width: 100%;
			 }
			 > li{
				border: none;
				list-style: none;
				float: left;
				padding-left: 10px;
				padding-right: 10px;
				> a{
				  border-bottom: 1px solid $border-color;
				  padding: 0 0 10px;
				  margin: 0 0 5px;
				  display: block;
				  color: $black!important;
				  font-weight: 500;
				  .caret{
					 display: none;
				  }
				  @include media-breakpoint-down(md){
					 margin-top: 6px;
				  }
				}
				.submenu-inner{
				  background: $nocolor!important;
				  @include box-shadow(none);
				  display: block;
				  position: static;
				  padding: 0;
				  min-width: 100%;
				  @include opacity(1);
				  @include scale(1);
				  visibility: visible;
				  max-width: 100%!important;
				  min-width: 10px!important;
				  li{ 
					 list-style: none;
					 border: none;
					 padding: 0;
					 &:last-child{
						border: none;
					 }
					 &.menu-item-has-children > a{
						font-weight: 600;
					 }
					 .submenu-inner{
						padding-left: 20px!important;
						display: block;
					 } 
				  }
				}
			 }
		  }
		  &.megamenu-align-left{
			 left: 0;
			 right: auto;
		  }
		  &.megamenu-align-right{
			 right: 0;
			 left: auto;
		  }
		  &.megamenu-align-center{
			 left: 50%;
			 transform: rotateX(-90deg) translateX(-50%)!important;
			 &:after{
				bottom: 100%;
				left: 50%;
				margin-left: -6px;
			 }
		  }
		}
		&:hover{
		  .megamenu-wrap-inner{
			 transform: rotateX(0) translateX(-50%)!important;
		  }
		}
	 } 
  } 
}

.menu-skin-white{
  #mega-menu-main-menu{
	 > li{
		> a{
		  text-transform: uppercase;
		  font-style: normal!important;
		  color: $white!important;
		  &:hover, &:focus, &:active{
			 color: $black!important;
		  }
		}   
	 }
  }
}

.gavias-off-canvas-toggle{
	font-size: 24px;
	float: right;
	margin-right: -1px;
	border-left: 1px solid rgba(0, 0, 0, 0.1);
	border-right: 1px solid rgba(0, 0, 0, 0.1);
	text-align: center;
	@include size(36px, 36px);
	@include border-radius(4px);
	background: $theme-color;
	color: $white;
	line-height: 1.5;
	margin-bottom: 10px;
	&:hover, &:focus{
		background: $black;
		color: $white;
	}
}

.gavias-off-canvas-overlay{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	display: block;
}
#gavias-off-canvas{
	 @include box-shadow(0 0 5px rgba(0, 0, 0, 0.5));
	 background:#fff;
	 height: 100%;
	 left: -75%;
	 position: fixed;
	 top: 0;
	 @include transition(all 0.35s);
	 width: 70%;
	 z-index: 99998;
	 bottom: 0;
	 &.active{
		  left: 0;    
	 } 
	 .navbar-collapse{
		padding-left: 0!important;
	 }
	 ul {
		padding-left: 25px;
	 }
	 .off-canvas-top {
		height: 35px;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
		 .top-social{
			> a{
				line-height: 35px;
				@include transition(background 0.35s);
				padding: 0 15px;
				display: block;
				border-left: 1px solid rgba(0, 0, 0, 0.1);
				float: left;
				&:last-child{
					border-right: 1px solid rgba(0, 0, 0, 0.1);
				}
				&:hover{
					background: $theme-color;
					color: $white;
					border-color: $theme-color;
				}
			}
		}
		.gavias-off-canvas-close{
			float: right;
			margin-right: 35px;
			line-height: 35px;
			border-left: 1px solid rgba(0, 0, 0, 0.1);
			border-right: 1px solid rgba(0, 0, 0, 0.1);
			padding: 0 15px;
			color: $black;
			&:hover{
				cursor: pointer;
				background: $theme-color;
				color: $white;
			}
		}
	}	
  ul#menu-main-menu{
	width: 100%;
	margin: 0;
	padding: 0;
	> li{
		list-style: none;
		display: block;
		width: 100%;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
		overflow: hidden;
		padding: 10px 20px;
		>a {
			@include transition(all 0.35s);
			font-weight: 600;
			text-transform: uppercase;
			padding: 0;
			&:hover, &:focus{
				background: $nocolor;
			}
			&.active > a{
				color: $theme-color;
				background: $nocolor;
			}
		}
		.submenu-inner.dropdown-menu{
			position: relative;
			display: block;
			width: 100%;
			@include box-shadow(none);
			padding: 0;
			padding-left: 15px;
			border: none;
			li {
				a{
					@include transition(all 0.35s);
					padding: 4px 0;
					&:hover, &:focus{
						color: $theme-color;
						background: $nocolor;
					}
				}
				&.active > a{
					color: $theme-color;
					background: $nocolor;
				}
			}
		}
	}
	.caret{
		float: right;
		margin-top: 5px;
	} 
  }
}

#mega-menu-wrap-primary{
  position: static!important;
  .mega-menu-horizontal{
	 position: static!important;
  }
}
 
// Menu mobile =================
.gva-offcanvas-content{
  	position: fixed;
  	left: -350px;
  	width: 350px;     
  	max-width: 100%;
  	top: 0;
  	bottom: 0;
  	z-index: 9999;
  	visibility: hidden;
  	background: $white;
  	@include box-shadow(0 0 5px rgba(0, 0, 0, 0.3));
  	@include opacity(0);
  	@include transition(all 0.35s);
  	a{
	 	color: $black;
	 	&:hover{
			color: $theme-color;
	 	}
  	}
  	.top-canvas{
	 	background: $bg-gray;
	 	width: 100%;
	 	z-index: 9;
	 	font-size: 18px;
	 	line-height: 45px;
	 	@include clearfix();
	 	.logo-mm{
	 		float: left;
	 		padding: 10px 10px 0 25px;
	 		display: inline-block;
	 		line-height: 1;
	 		img{
	 			max-height: 22px;
	 			max-width: auto;
	 		}
	 	}
	 	.control-close-mm{
	 		background: $theme-color;
			display: inline-block;
			@include size(45px, 45px);
			text-align: center;
			color: $white;
			float: right;
			&:hover{
		  		cursor: pointer;
			}
	 	}
  	}
	.wp-sidebar .widget{
	 	padding-top: 20px;
	 	margin-bottom: 10px;
	 	&:last-child{
			border-bottom: 0;
	 	}
	 	.widget-title{
			color: $white;
			text-align: center;
			span{
		  		font-size: 18px;
		  		color: $black;
			}
			&:before{
			  left: 50%;
			  margin-left: -40px;
			}
			&:after{
			  left: 50%;
			  margin-left: -25px;
			}
	 	}
  	}

  	.wp-sidebar{
	 	overflow-x: hidden;
	 	height: 100%;
	 	padding: 10px 25px 60px;
  	}
  	#gva-mobile-menu{
	 	padding: 0;
	 	ul.gva-mobile-menu{
			width: 100%;
			margin: 0;
			padding: 0;
			overflow: hidden;
			> li{
			  position: relative!important;
			  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
			  display: block;
			  width: 100%;
			  padding: 10px 0;
			  &:after{
			 		display: none!important;
		  		}
		  		> .submenu-inner{
			 		@include transition(0s);
			 		li{
			 			border: none;
			 			padding: 0!important;
			 		}
		  		}
			  	a{
				 	padding: 5px 0;
				 	font-size: 18px;
				 	color: $theme-color-black;
				 	font-weight: 500;
				 	position: relative;
				 	z-index: 11;
				 	.caret{
						display: none;
				 	}
				 	&:after{
						display: none;
				 	}
				 	&:hover{
						color: $theme-color;
				 	}
			  	}
			  	&.menu-item-has-children{
				 	.caret{
						border: none;
						position: absolute;
						top: 20px;
						margin-top: -10px;
						right: 0;
						@include size(150px, 35px);
						z-index: 9;
						color: $theme-color-black;
						&:after{
						  display: none;
						}
						background: url('#{$image-theme-path-base}plus.png') no-repeat center right $nocolor;
						&:hover{
						  cursor: pointer;
						  color: $theme-color;
						}
				 	}
				 	&.menu-active{
						.caret{
					  		background: url('#{$image-theme-path-base}minium.png') no-repeat center right $nocolor;
						}
				 	}
			  	}
			  	> a{
				 	display: inline-block;
			  	}
			  	> ul{ 
				 	display: none;
			  	}
			  	ul.submenu-inner, div.submenu-inner{
				 	@include clearfix();
				 	position: relative;
				 	@include scale(1);
				 	@include opacity(1);
				 	visibility: visible!important;
				 	background: none;
				 	left: auto;
				 	top: auto;
				 	padding: 0;
				 	border: none!important;
				 	@include box-shadow(none);
				 	display: none;
				 	max-width: 100%!important;
				 	@include clearfix();
				 	transform: rotateX(0)!important;
				 	.caret{
						display: none;
				 	}
				 	li{
						a{
						  	padding: 8px 0;
						  	font-weight: 400;
						  	text-transform: none;
						  	font-size: 16px;
						  	color: $body-color;
						  	&:hover{
							 	color: $theme-color;
						  	}
						}
					}
					ul{
						width: 100%;
						padding-left: 15px;
						display: block!important;
						> li{
						  padding: 3px 0;
						  display: block;
						  width: 100%;
						}
					}
				}
			  	ul.submenu-inner{
				 	padding-left: 20px;
			  	}
			}
		}
		.megamenu-sub{
			> li{
				> a{
					font-weight: 700!important;
					font-size: 15px!important;
					opacity: 0.8;
				}
				.submenu-inner{
					padding: 8px 20px 5px!important;
					> li{
						padding: 0!important;
					}
				}
				&:last-child{
					.submenu-inner{
						padding-bottom: 10px!important;
						li{
							margin-bottom: 3px;
						}
					}
				}
			}
		}
  	}
  	&.open{
	 	left: 0;
	 	@include opacity(1);
	 	visibility: visible;
  	}
}

.megamenu-main{
  .megamenu-wrap-inner{
	 width: 100%;
	 left: 0;
	 right: 0;
	 margin: auto;
  }
  .widget{
	  text-align: left;
	  color: $link-color;
	 .widget-title,
	 .widgettitle{
		font-size: 16px;
		text-align: left;
		text-transform: uppercase;
		font-weight: 600;
		line-height: 20px;
		padding: 0;
		border: none;
	 }
	 ul{
		list-style: none;
		padding: 0;

	 }
	 &.widget-html{
		ul{
		  li{
			 line-height: 32px;
			 padding: 5px 0;
			 strong{
				color: $theme-color;
				font-weight: 600;
			 }
		  }
		}
	 }
	 .product-block {
		  margin-bottom: 10px;
	 }
  }
}

ul.gva-user-menu{
  li{
	 a{
		font-size: 15px;
	 }
  }
}

body.admin-bar{
	.gva-offcanvas-content.mobile{
		padding-top: 32px;
		@media(max-width: 782px){
			padding-top: 46px;
		}
	}
}