.navbar-nav.megamenu{
	float: none;
	padding: 0;
	text-align: center;
	> li{
		display: inline-block;
		padding: 0;
		margin: 0;
		float: none;
		position: static;
		> a{
			font-size: 14px;
    		font-weight: 700;
		    line-height: 1.2;
		    padding: 15px 13px 16px;
		    background: transparent;
		    font-family: $font-family-second;
		    position: relative;
		    border-radius: 8px 8px 0 0;
		    text-decoration: none !important;
		    .fa,img{
		    	max-width: 50px;
		    	margin-right: 8px;
		    }
		    &:hover,
		    &:active{
		    	background: #00f2bc;
		    	color: #fff;
		    }
		}
		&:hover {
			>a {
				background: #00f2bc;
		    	color: #fff;
			}
		}
		&.active{
			> a{
		    	background: #00f2bc;
		    	color: #fff;
			}
		}
		> .dropdown-menu{
			top: 100%;
			left: 0;
		}
		&.aligned-left{
			position: relative;
		}
		&.aligned-right{
			position: relative;
			> .dropdown-menu{
				left: auto;
				right: 0;
			}
		}
	}
	.dropdown {
		position: relative;
	}
	.dropdown-menu{
		display: block;
		visibility:hidden;
		@include opacity(0);
		@include transform-origin(0,0);
		@include transition(all 0.2s ease-in-out 0s);
		@include rotateX(-90deg);
		border:none;
		position: absolute;
		left: 100%;
		top:0;
		padding: 15px 0;
		> li{
			> a{
				background: transparent;
				padding: 5px 20px;
				&:hover,
				&:active{
					background:transparent;
					text-decoration: underline;
					color: $theme-color;
				}
			}
			&.active{
				> a{
					text-decoration: underline;
				}
			}
		}
		.dropdown-menu-inner{
			padding: 30px 20px;
			@include box-shadow(0 2px 16px rgba(0, 0, 0, 0.06));
			background: #fff;
		}
		.widgettitle{
			font-weight: 700;
			margin: 0 0 10px; 
			&:before{
	            @include size(0, 0);
	        }
		}
		.widget{
			ul li{
				border: none;
				padding-top: 2px;
				padding-bottom: 2px;
			}
		}

	}
	.container{
		padding-right:$theme-margin / 2;
		padding-left:$theme-margin / 2;
		width: 100%;
	}
	li:hover{
		> .dropdown-menu{
		    visibility:visible;
	        @include opacity(1);
	        @include rotateX(0deg);
		}
	}
	li.aligned-fullwidth{
		position: static;
		> .dropdown-menu{
			width: 100%;
			@include box-shadow(none);
			background: transparent;
			padding: 0 15px;
			.widget .widget-title, .widget .widgettitle, .widget .widget-heading {
				font-size: 14px;
			}
		}
	}
	li.aligned-left:not(.dropdown) {
		> .dropdown-menu{
			padding: 0;
			.widget .widget-title, .widget .widgettitle, .widget .widget-heading {
				font-size: 14px;
			}
		}
	}
	.text-label{
		font-size: 14px;
		padding: 2px 5px;
		background: $brand-primary;
		color: #fff;
		position:absolute;
		right: 0;
		left: auto;
		top:-15px;
		text-transform: capitalize;
		&.label-hot{
			background: $brand-danger;
		}
	}
}
.tbay-megamenu-darken{
	background-color: #111;
	.megamenu{
		text-align: left;
		 > li > a{
		 	color: #fff;
		 }
	}
	.widget_tbay_socials_widget {
		margin-top: 10px;
		margin-right: 15px;
		margin-left: 15px;
		.social li a{
			background-color: #3e3e3e;
			&:hover{
				color: #111;
				background-color: #fff;
			}
		}
	}
}
// ofcanvas menu
.navbar-offcanvas{
	.navbar-nav{
		width: 100%;
		float: none;
		.caret {
			display: none;
		}
		li {
			background: transparent;
			padding: 0;
			.hitarea {
				line-height: 44px;
				height: 44px;
				width: 50px;
				text-align: center;
				padding-right: 15px;
			}
			li {
				background: transparent !important;
				padding-right: 0;
				a {
					display: block;
					padding: 5px 20px;
					background: transparent !important;
					font-size: 15px;
				}
				.hitarea {
					line-height: 36px;
					height: 36px;
				}
				li {
					margin-left: 0px;
				}
			}
		}
		> li{
			width: 100%;
			float: left;
			> a{
				background: transparent !important;
				font-size: 16px;
				text-transform: uppercase;
				display: inline-block;
				i {
					margin-right: 10px;
					min-width: 15px;
				}
			}
		}
		.open,
		.active{
			> a:hover,
			> a:focous,
			> a{
				color: $theme-color-second;
				background: transparent;
			}
		}
	}
	.dropdown-menu {
		margin: 0 0 0 10px;
		position: relative;
		top: auto;
		left: auto;
		border: 0;
		float: none;
		@include box-shadow(none);
		> li {
			a{
				background: transparent !important;
			}
			&.active > a,
			> a:hover,
			> a:focus{
				color: $link-color;
				text-decoration: underline;
			}
		}
		[class *="col-sm"]{
			width: 100%;
		}
		.dropdown-menu-inner{
			padding: 0 $theme-padding;
		}
		.widgettitle{
			font-weight: 500;
			margin: 0 0 10px;
		}
		.dropdown-menu{
			left: 100%;
			top:0;
		}
	}
	.aligned-fullwidth{
		> .dropdown-menu{
			width: 100%;
		}
	}
}

.tbay-offcanvas-body {
	.navbar-collapse {
		padding: 0;
		ul.treeview {
			>li {
				padding: 0;
				border-bottom: 1px solid #eee;
				li {
					border-bottom: 1px solid #eee;
					&:last-child {
						border-bottom: 0;
					}
				}
				&.open > .dropdown-menu {
				    display: none;
				}
			}
		}
	}
}

.wrapper-container{
	&:after {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		content: "";
		background: rgba(0, 0, 0, 0.66);
		z-index: 1000;
		pointer-events: none;
		@include transition(all 0.5s);
		@include opacity(0);
	}
	&.active {
		height: 100vh;
		&:after {
			@include opacity(1);
		}
	}
	&.show-demo {
		height: 100vh;
		&:after {
			@include opacity(1);
		}
	}
}