@media (max-width: 1209px) {
	.container {
		width: 992px;
	}

	body > .navbar .navbar-wrapper > .block-left > ul,
	body > .navbar .navbar-wrapper > .block-right > ul {
		grid-gap: 40px;
	}

	body > footer.footer > .content > .container {
		grid-template-columns: auto 165px 88px 160px;
		grid-gap: 4px;
	}

	body > footer.footer .social {
		margin-right: 0;
	}
}

@media (max-width: 1031px) {
	.container {
		width: 768px;
	}

	body > .navbar .navbar-wrapper {
		display: none;
		grid-template-columns: 100%;
		padding-top: 86px;
	}

	body > .navbar.show .navbar-wrapper {
		display: grid;
	}

	body > .navbar .navbar-wrapper > .block-left,
	body > .navbar .navbar-wrapper > .block-right {
		text-align: center;
	}

	body > .navbar .navbar-wrapper > .block-left > ul,
	body > .navbar .navbar-wrapper > .block-right > ul {
		display: grid;
		grid-gap: 0;
		grid-template-columns: 100%;
	}

	body > .navbar .navbar-logo {
		left: 20px;
		width: 48px;
		height: 52px;
	}

	body > .navbar {
		min-height: 86px;
	}

	body > .navbar > .container {
		height: auto;
		background-color: rgba(0,0,0,0.5);
	}

	body > .navbar.show > .container {
		padding-bottom: 20px;
	}

	body > .navbar .navbar-mobile {
		display: block;
	}

	body > footer.footer > .content > .container {
		grid-gap: 8px;
		grid-template-columns: auto auto auto auto;
	}

	body > footer.footer .dragon-left,
	body > footer.footer .dragon-center {
		top: auto;
		bottom: calc(100% - 20px);
	}

}

@media (max-width: 807px) {
	.container {
		width: 100%;
	}

	body > footer.footer .dragon-left,
	body > footer.footer .dragon-center {
		top: auto;
		bottom: 100%;
	}

	body > footer.footer > .content {
		height: auto;
		padding-top: 20px;
		text-align: center;
	}

	body > footer.footer > .content > .container {
		grid-gap: 16px;
		grid-template-columns: 100%;
	}

	body > footer.footer > .content > .container > .block-right {
		text-align: center;
		padding-bottom: 16px;
	}
}

@media (max-width: 559px) {
	.modal > .modal-wrapper {
		width: calc(100% - 40px);
	}

	.balance .pay {
		width: 100%;
	}
}

@media (max-width: 399px) {
	body > footer.footer .dragon-left {
		display: none;
	}
}