.main-navigation {
	display: block;
	width: 100%;
	padding: 0.5rem 0;

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

		ul {
			box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
			float: left;
			position: absolute;
			top: 100%;
			z-index: 99999;

			ul {
				left: -999em;
				top: 0;
			}

			li {
				&:hover {
					cursor: pointer;
				}

				&:hover > ul,
				&.focus > ul {
					display: block;
					left: auto;
				}
			}
		}

		li:hover > ul,
		li.focus > ul {
			left: auto;
		}
	}

	li {
		position: relative;
		padding: 0 0.6rem;
	}

	a {
		display: block;
		text-decoration: none;
	}
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

.menu-toggle {
	display: none;
}

.main-navigation ul {
	display: flex;
}

@media only screen and ( max-width: 37.5em ) {
	.billow {
		&.siteScrolled.admin-bar {
			header.float-header {
				&.fixed {
					top: 0 !important;
				}
			}
		}
	}
}

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

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

	.nav-links {
		display: flex;
	}

	.nav-previous {
		flex: 1 0 50%;
	}

	.nav-next {
		text-align: end;
		flex: 1 0 50%;
	}
}

/* Post navigation */
nav.navigation {
	.nav-links {
		width: 100%;

		.nav-previous {
			a {
				&:hover {
					span {
						i {
							@include animation;
							@include transition;
						}
					}
				}
			}

			.nav-icon {
				margin-right: 0.5rem;
				color: $color_link;

				i {
					@include transition;
				}
			}
		}

		.nav-next {
			a {
				&:hover {
					span {
						i {
							@include animation;
							@include transition;
						}
					}
				}
			}

			.nav-icon {
				margin-left: 0.5rem;
				color: $color_link;

				i {
					@include transition;
				}
			}
		}
	}
}

@media only screen and ( max-width: 48em ) {
	.billow {
		.site-main {
			.post-navigation {
				.nav-links {
					position: relative;

					.nav-previous {
						padding-right: 0.5rem;
					}

					.nav-next {
						padding-left: 0.5rem;
					}

					a {
						font-size: 1rem;
					}

					&::after {
						position: absolute;
						content: '';
						top: 25%;
						left: 50%;
						width: 1px;
						height: 50%;
						background: $color_border_input;
					}
				}
			}
		}
	}
}

@media only screen and ( max-width: 35em ) {
	.billow {
		.site-main {
			.post-navigation {
				.nav-links {
					display: flex;
					flex-direction: column;

					.nav-previous {
						padding-right: 0;
						padding-bottom: 1rem;
					}

					.nav-next {
						padding-left: 0;

						a {
							justify-content: flex-end;
						}
					}

					a {
						display: flex;
						align-items: baseline;
					}

					&::after {
						content: none;
					}
				}
			}
		}
	}
}

/* Header menu */
.billow {
	&.menu-indicator-type-0 {
		.site-header {
			.container {
				.main-navigation:not(.toggled) {
					ul.menu,
					ul.nav-menu {
						li {
							& > a {
								&:before {
									content: none;
								}
							}
						}
					}
				}
			}
		}
	}

	&.menu-indicator-type-1 {
		.site-header {
			.container {
				.main-navigation:not(.toggled) {
					ul.menu,
					ul.nav-menu {
						& > li {
							& > a {
								&:before {
									content: "";
									width: 4px;
									height: 4px;
									position: absolute;
									border-radius: 50%;
									top: 100%;
									left: 50%;
									transform: translateX(-50%);
									transition: all 0.2s linear;
									transform: scale(0);
								}

								&[aria-current="page"] {
									&:before {
										transform: scale(1);
									}
								}
							}

							&:hover {
								& > a {
									&:before {
										transform: scale(1);
									}
								}
							}
						}

						& > li.current-page-ancestor {
							& > a {
								&:before {
									content: "";
									width: 4px;
									height: 4px;
									position: absolute;
									border-radius: 50%;
									top: 100%;
									left: 50%;
									transform: translateX(-50%);
									transition: all 0.2s linear;
									transform: scale(1);
								}
							}
						}
					}
				}
			}
		}
	}

	&.menu-indicator-type-2 {
		.site-header {
			.container {
				.main-navigation:not(.toggled) {
					ul.menu,
					ul.nav-menu {
						& > li {
							& > a {
								&:before {
									position: absolute;
									content: '';
									top: 1.5rem;
									bottom: 0;
									left: 0;
									right: 0;
									margin: 0 auto;
									width: 0;
									height: 0.125rem;
									opacity: 0;
									transition: all 0.2s linear;
								}

								&[aria-current="page"] {
									&:before {
										opacity: 1;
										width: 100%;
									}
								}
							}

							&:hover {
								& > a {
									&:before {
										opacity: 1;
										width: 100%;
									}
								}
							}
						}

						& > li.current-page-ancestor {
							& > a {
								&:before {
									opacity: 1;
									width: 100%;
								}
							}
						}
					}
				}
			}
		}
	}

	&.menu-indicator-type-3 {
		.site-header {
			.container {
				.main-navigation:not(.toggled) {
					ul.menu,
					ul.nav-menu {
						& > li {
							& > a {
								z-index: 1;

								&:before {
									display: block;
									position: absolute;
									top: 0;
									left: 0;
									bottom: 0;
									right: 0;
									margin: auto;
									width: 100%;
									height: 1px;
									content: '.';
									color: transparent;
									visibility: hidden;
									opacity: 0;
									z-index: -1;
									transition: all 0.2s linear;
								}

								&[aria-current="page"] {
									&:before {
										opacity: 1;
										visibility: visible;
										height: 100%;
									}
								}
							}

							&:hover {
								& > a {
									&:before {
										opacity: 1;
										visibility: visible;
										height: 100%;
									}
								}
							}
						}

						& > li.current-page-ancestor {
							& > a {
								&:before {
									opacity: 1;
									visibility: visible;
									height: 100%;
								}
							}
						}
					}
				}
			}
		}
	}
}

.site-header {
	.container {
		.main-navigation:not(.toggled) {
			ul.menu,
			ul.nav-menu {
				li {
					padding: 0;

					ul {
						position: absolute;
						top: auto;
						margin-top: 1rem;
						padding: 0.9rem 0;
						min-width: 15.6rem;
						text-align: left;
						flex-direction: column;
						align-items: unset !important;
						background-color: $color_main;
						border-radius: 0.2rem;
						visibility: hidden;
						z-index: 1;
						-webkit-transform: translateY(0rem);
						-ms-transform: translateY(0rem);
						transform: translateY(0rem);
						@include transition;

						li {
							display: block;
							padding: 0;

							a {
								font-size: 0.8rem;
								font-weight: 500;
								color: #333;
								padding: 0.6rem 1.5rem;

								&::before {
									content: none;
								}
							}
						}

						li {
							ul {
								left: 100%;
								top: 0;
								-webkit-transform: translateX(-0.9rem);
								-ms-transform: translateX(-0.9rem);
								transform: translateX(-0.9rem);
							}

							&:hover,
							&:focus {
								ul {
									-webkit-transform: translateX(0rem);
									-ms-transform: translateX(0rem);
									transform: translateX(0rem);

								}
							}
						}
					}

					&:hover,
					&:focus-within,
					&:focus {
						& > ul {
							visibility: visible;
							-webkit-transform: scale(1) translateY(0.2rem);
							-ms-transform: scale(1) translateY(0.2rem);
							transform: scale(1) translateY(0.2rem);
							@include transition;
						}
					}

					& > a {
						position: relative;
					}
				}

				li {
					ul {
						li {
							&:hover {
								& > a {
									background-color: $color_dark_blue;
								}
							}
						}
					}
				}
			}

			ul {
				& > li {
					position: static;

					& > ul {
						margin-top: 0;

						ul {
							margin-top: 0;
						}
					}
				}
			}
		}

		&.header-left {
			.main-navigation {
				ul {
					li {
						ul {
							li {
								ul {
									right: 0;
									left: auto;
								}
								&:hover {
									ul {
										right: 100%;
									}
								}
							}
						}
					}
				}
			}
		}
	}
}