// main: style.scss
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
	clear: both;
	display: block;
	ul {
		display: none;
	}
	@include media-breakpoint-up(lg) {
		ul {
			display: none;
			list-style: none;
			margin: 0;
			padding-left: 0;

			ul {
				float: left;
				position: absolute;
				top: 100%;
				left: -999em;
				z-index: 99999;
				//@include border-radius(3px);
				background: #000000;
				padding: 8px 0px;
				&:after {
					-moz-border-bottom-colors: none;
				    -moz-border-left-colors: none;
				    -moz-border-right-colors: none;
				    -moz-border-top-colors: none;
				    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #000;
				    border-image: none;
				    border-style: solid;
				    border-width: 6px;
				    bottom: 100%;
				    content: " ";
				    height: 0;
				    pointer-events: none;
				    position: absolute;
				    width: 0;
					display: block;
					left: 15px;
				}
				ul {
					left: -999em;
					top: -8px;
					&:after {
						content: none;
					}
				}

				li {
					margin-right: 0px;
					&:hover > ul,
					&.focus > ul {
						left: 100%;
					}

				}

				a {
					width: 200px;
					color: rgba(255,255,255,0.9);
					line-height: inherit;
					padding: 5px 20px;
					&:hover {
						background: rgba(255, 255, 255, 0.3);
						color: rgba(255,255,255,0.9);
					}
				}

				:hover > a,
				.focus > a {
				}

				a:hover,
				a.focus {
				}
			}

			li:hover > ul,
			li.focus > ul {
				left: -15px;
			}
		}

		li {
			float: left;
			position: relative;
			margin-right: 30px;
			&:hover > a,
			&.focus > a {
			}
		}

		a {
			display: block;
			text-decoration: none;
			color: #000000;
			@include rem('font-size', 11px);
			text-transform: uppercase;
			letter-spacing: 1.2px;
			line-height: 52px;
			position: relative;
			&:hover {
				color: #888888;
			}
		}

		.current_page_item > a,
		.current-menu-item > a,
		.current_page_ancestor > a,
		.current-menu-ancestor > a {
			color: $color__primary;
		}
	}

	@include media-breakpoint-down(md) {
		width: 100%;
		position: relative;
		ul {
			list-style: none;
			padding: 0;
			ul {
				margin: 0px;
				a {
					padding-left: 15px;
					position: relative;
					&:after {
                        content: "";
                        width: 6px;
                        height: 6px;
                        border-left: 1px solid #e5e5e5;
                        border-bottom: 1px solid #e5e5e5;
                        display: block;
                        position: absolute;
                        left: 0px;
                        top: 12px;
                    }
				}
				ul {
					a {
						padding-left: 30px;
						&:after {
							left: 15px;
						}
					}
				}
			}
			a {
				display: block;
				padding: 5px 0px 6px;
				border-bottom: 1px solid #f1f1f1;
				font-size: 13px;
			}
		}
	}
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}
.menu-toggle {
	line-height: 52px;
	padding: 0px;
	background: none;
	color: #000000;
	border: none;
	&:hover {
		background: none;
		color: #000000;
	}
	&:before {
		content: '\f419';
		-moz-osx-font-smoothing: grayscale;
	    font-family: "Genericons";
	    font-style: normal;
	    font-variant: normal;
	    font-weight: normal;
	    text-decoration: inherit;
	    text-transform: none;
		position: relative;
		margin-right: 5px;
		bottom: -1px;
	}
}
.main-navigation.toggled {
	.menu-toggle:before {
		content: '\f406';
		bottom: -2px;
	}
}

//@media screen and (min-width: 37.5em) {
@include media-breakpoint-up(lg) {
	.menu-toggle {
		display: none;
	}
	.main-navigation ul {
		display: block;
	}
}

.comment-navigation,
.posts-navigation,
.post-navigation {

	.site-main & {
		margin: 0 0 1.5em;
		overflow: hidden;
	}

	.nav-previous {
		float: left;
		width: 50%;
	}

	.nav-next {
		float: right;
		text-align: right;
		width: 50%;
	}
}

.posts-navigation {
	a {
		letter-spacing: 1.3px;
		font-size: 11px;
		text-transform: uppercase;
		@include border-radius(2px);
		background: #000000;
		color: #fff;
		@include rem('padding', 8px 24px);
		display: inline-block;
		&:hover {
			background: #444444;
			text-decoration: none;
		}
	}
	.nav-previous a:before, .nav-next a:after {
		bottom: -1px;
	    content: '\f430';
	    font-family: "Genericons";
	    font-style: normal;
	    font-variant: normal;
	    font-weight: normal;
	    margin-right: 3px;
	    position: relative;
	    text-decoration: inherit;
	    text-transform: none;
	}
	.nav-next a:after {
		content: '\f429';
		margin-right: 0;
		margin-left: 3px;
		right: 0;
	}
}