/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: $primary_color;
	text-decoration: none;
	@include transition(all ease 0.35s);
}

a:hover {
	color: inherit;
	text-decoration: none;
}

a:hover, a:active {
	outline: 0;
}

a:hover {
	color: $secondary_color;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	flex: auto;
	align-items: center;

	.close {
		display: none;
	}//.close

	ul {
		margin: 0;
		padding: 0;
		list-style: none;

		li {
			display: inline-block;
			vertical-align: middle;
			font-size: 0.9444em;
			font-weight: 600;
			position: relative;

			a {
				display: inline-block;
				color: $secondary_color;
				padding: 10px 20px;
			}//a

			&:hover > a, 
			&.current-menu-item > a, 
			&.current_page_item > a, 
			&.current-menu-ancestor > a,
			&.current_page_ancestor > a {
				opacity: 0.65;
				filter: alpha(opacity=65);
			}

			.submenu-toggle {
				background: none;
				border-radius: 0;
				border: none;
				padding: 0;
				display: block;
				position: absolute;
				top: 18px;
				right: 5px;
				font-size: 0.8em;
				color: $secondary_color;
				text-align: center;
				line-height: 1;
				@include transition(all ease 0.35s);

				&.active {
					@include transform(rotate(180deg));
				}

			}//.submenu-toggle

			.sub-menu {
				position: absolute;
				top: 100%;
				left: -9999%;
				width: 250px;
				background: #fff;
				box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
				z-index: 99999;
				opacity: 0;
				@include transition(opacity 0.35s ease);

				li {
					display: block;
					font-size: 1em;

					a {
						display: block;
						border-bottom: 1px solid rgba(0,0,0,0.1);
					}//a

					.submenu-toggle {
						-webkit-transform: rotate(-90deg);
						-moz-transform: rotate(-90deg);
						transform: rotate(-90deg);
					}

				}//li

				.sub-menu {
					top: 0;
				}//.sub-menu

			}//.sub-menu

			&:hover, &.focused {

				> .sub-menu {
					left: 0;
					opacity: 1;
					filter: alpha(opacity=100);

					li:hover .sub-menu {
						left: 100%;
					}
				}

			}//&:hover

		}//li

		&.nav-menu {

			> li {

				&:nth-last-of-type(1), 
				&:nth-last-of-type(2), 
				&:nth-last-of-type(3) {

					> .sub-menu {
						left: auto;
						right: 9999%;

					}//> .sub-menu

					&:hover, &.focused {

						> .sub-menu {
							right: 0;
						}

					}

					.sub-menu li:hover .sub-menu, 
					.sub-menu li.focused .sub-menu {
						left: auto;
						right: 100%;
					}

				}//&:nth-last-of-type(2)

			}//> li

		}//&.nav-menu

	}//ul

}//.main-navigation

@media only screen and (min-width: 1025px) {
	.main-navigation ul li .sub-menu {
		display: block !important;
	}

	.site-header .main-header .nav-wrap .main-navigation ul .login-register-block {
	    display: inline-flex;
	    float: right;
	}
}

@include media(lg) {

	.main-navigation {

		ul {

			li {
				font-size: 0.8888em;
			}//li

		}//ul

	}//.main-navigation

}//media(lg)

@include media(md) {

	.main-navigation {

		ul {

			li {
				font-size: 0.7778em;

				a {
					padding-left: 12px;
					padding-right: 12px;
				}//a


			}//li

			&.nav-menu > li > .submenu-toggle {
				right: 0;
			}

		}//ul

	}//.main-navigation

}//media(md)

@include media(sm) {
	.main-navigation {
		display: block;
		padding-top: 80px;
		background: $secondary_color;
		height: 100%;
		position: relative;

		.close {
			padding: 0;
			background: none;
			border-radius: 0;
			border: none;
			display: block;
			width: 30px;
			height: 30px;
			position: absolute;
			top: 30px;
			right: 20px;
			cursor: pointer;

			&::before, &::after {
				width: 25px;
				height: 2px;
				background: #fff;
				position: absolute;
				top: 0;
				right: 0;
				content: "";
				bottom: 0;
				left: 0;
				margin: auto;
				@include transform(rotate(45deg));
				@include transition(all ease 0.35s);
			}

			&::after {
				@include transform(rotate(-45deg));
			}

			&:hover {

				&::before, &::after {
					background: $primary_color;
				}

			}

		}//.close

		ul {
			width: 100%;

			li {
				display: block;

				a {
					display: block;
					color: #fff;
					border-bottom: 1px solid rgba(255,255,255,0.15);
					box-shadow: 0 1px rgba(0,0,0,0.2);
					padding: 15px 24px;
				}//a

				&:hover, 
				&.current-menu-item, 
				&.current_page_item, 
				&.current-menu-ancestor, 
				&.current_page_ancestor {

					> a {
						opacity: 1;
						filter: alpha(opacity=100);
						visibility: visible;
						color: $primary_color;
					}

				}

				.submenu-toggle {
					width: 30px;
					height: 60px;
					line-height: 60px;
					color: #fff;
					top: 0;
					right: 0;
					font-size: 1em;
				}

				.sub-menu {
					width: 100%;
					opacity: 1;
					filter: alpha(opacity=100);
					visibility: visible;
					box-shadow: none;
					position: static;
					background: rgba(255,255,255,0.1);
					display: none;
					@include transition(none);

					li {

						a {
							border-bottom-color: rgba(255, 255, 255, 0.15);
						}//a

						.submenu-toggle {
							-webkit-transform: rotate(0);
							-moz-transform: rotate(0);
							transform: rotate(0);

							&.active {
								-webkit-transform: rotate(180deg);
								-moz-transform: rotate(180deg);
								transform: rotate(180deg);
							}
						}

					}//li

				}//.sub-menu

			}//li

		}//ul

	}//.main-navigation

}//media(sm)