.menu {
	height: 60px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background-color: #699bff;
	transform: translateY(-60px);
	visibility: hidden;
	opacity: 0;
	transition: transform .25s cubic-bezier(.05, .69, .14, 1) 0s,
				visibility .25s linear .25s,
				opacity .25s cubic-bezier(.05, .69, .14, 1) 0s;
	will-change: transform, opacity;
	z-index: 2;
}
.menu.is_shown {
	transform: translateY(0);
	visibility: visible;
	opacity: .9;
	transition: transform .3s cubic-bezier(.05, .69, .14, 1) 0s,
				visibility 0s linear 0s,
				opacity .3s cubic-bezier(.05, .69, .14, 1) 0s;
}
.menu.custom {
	position: static!important;
	margin-bottom: 5.4rem;
	margin-top: 1.9rem;
	position: static;
	transform: translateY(0);
	visibility: visible;
	opacity: .9;
	transition: transform .3s cubic-bezier(.05, .69, .14, 1) 0s,
				visibility 0s linear 0s,
				opacity .3s cubic-bezier(.05, .69, .14, 1) 0s;
}
.menu.is_shown_always {
	transform: translateY(0);
	visibility: visible;
	opacity: .9;
	transition: transform .3s cubic-bezier(.05, .69, .14, 1) 0s,
				visibility 0s linear 0s,
				opacity .3s cubic-bezier(.05, .69, .14, 1) 0s;
}

.menu .menu__burger {
	position: absolute;
	left: 5.859375%;
	top: 20px;
}
.menu .menu__brand_logo {
	position: absolute;
	width: 105px;
	height: 17px;
	top: 0;
	left: 5.859375%;
	bottom: 0;
	margin: auto 0;
}

.menu .menu__logo {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 158px;
	height: 22px;
}
.menu a {
	outline-color: #fff;
}
.social {
	display: inline-block;
	vertical-align: middle;
	font-size: 0;
	color: #fff;
}
	.menu .social {
		position: absolute;
		right: 5.859375%;
		top: 14px;
	}

	.social__item {
		display: inline-block;
	}
		.social__link {
			display: inline-block;
			vertical-align: middle;
			width: 32px;
			height: 32px;
			text-align: center;
		}
		.social__link::before {
			height: 100%;
			width: 0;
			content: '';
			vertical-align: middle;
			display: inline-block;
		}

		.social__item:not(:last-child)::after {
			height: 22px;
			width: 2px;
			background-color: currentcolor;
			display: inline-block;
			vertical-align: middle;
			content: '';
			margin-left: 14px;
			margin-right: 14px;
		}
	.social__link:hover .icon {
		fill: #000;
	}
