@font-face {
	font-family: "Ubuntu";
	src: url("../fonts/ubuntu.eot");
	src: url("../fonts/ubuntu.eot?iefix") format("eot"),
		url("../fonts/ubuntu.woff") format("woff"),
		url("../fonts/ubuntu.woff2") format("woff2"),
		url("../fonts/ubuntu.ttf") format("truetype"),
		url("../fonts/ubuntu.svg#webfont") format("svg");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "ProximaNovaRegular"; /* Гарнитура */
	src: url("../fonts/eot/ProximaNovaRegular.eot"); /* Для IE5-8 */
	src: local("ProximaNovaRegular"), url("../fonts/otf/ProximaNovaRegular.otf"); /* Для остальных браузеров */
}
@font-face {
	font-family: "ProximaNovaLight"; /* Гарнитура */
	src: url("../fonts/eot/ProximaNovaLight.eot"); /* Для IE5-8 */
	src: local("ProximaNovaLight"), url("../fonts/otf/ProximaNovaLight.otf"); /* Для остальных браузеров */
}
/* Для кириллического начертания в IE8 */
@font-face {
	font-family: "ClearSansRegular"; /* Гарнитура */
	src: url("../fonts/eot/ClearSansRegular.eot"); /* Для IE5-8 */
	src: local("ClearSansRegular"), url("../fonts/ttf/ClearSansRegular.ttf"); /* Для остальных браузеров */
}
@font-face {
	font-family: "ClearSansLight"; /* Гарнитура */
	src: url("../fonts/eot/ClearSansLight.eot"); /* Для IE5-8 */
	src: local("ClearSansLight"), url("../fonts/ttf/ClearSansLight.ttf"); /* Для остальных браузеров */
}
* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	outline: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

blockquote,
q {
	quotes: none;
}

img {
	border: 0;
	max-width: 100%;
}

*,
body {
	font-family: ProximaNovaLight, ClearSansLight, sans-serif, Arial;
	font-weight: 100;
}

header {
	text-align: right;
	background: #1e66a2;
	color: #fff;
	padding: 0px 70px;
	height: 44px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
main {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;

	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;

	max-width: 1380px;
	margin: 0 auto 10px;
	min-height: calc(100vh - 180px);
}
.logo {
	background: url("../img/sprite.png") no-repeat -18px -12px;
	width: 172px;
	height: 187px;
	margin-bottom: 20px;
}
.logo-text {
	font-size: 24px;
	font-weight: 300;
	margin-bottom: 20px;
	text-align: center;

	color: #0068a6;
	font-weight: 600;
	font-family: "Ubuntu", sans-serif;
}

main .col {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-basis: 0;
	flex-grow: 1;
	max-width: 100%;
	padding: 35px 20px;
}
main .col-top {
	-ms-flex-item-align: start;
	align-self: flex-start;
}

input.ac:checked + label,
.btn:active {
	background-color: #0073c4;
}

.btn:hover {
	background-color: #0073c4;
}
.title {
	font-size: 24px;
	font-weight: 300;
	margin-bottom: 20px;

	color: #00336f;
	font-weight: 600;
	text-align: justify;
	font-family: "Ubuntu", sans-serif;
}

.btn__list {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}

.btn__link {
	width: 100%;
	display: flex;
}

.btn__link .btn {
	margin-bottom: 5px;
}

.btn {
	font-family: "Open Sans", "Ubuntu", sans-serif;
	font-weight: 600;
	font-size: 18px;
	min-width: 300px;
	max-width: 300px;
	padding: 12px 0;
	margin-bottom: 17px;
	border-radius: 5px;
	text-decoration: none;
	color: #fff;
	background-color: #0066b7;
	position: relative;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	border: none;
	cursor: pointer;
	-webkit-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2);
}

.btn__link button:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.btn p {
	color: #ffffff;
	text-decoration: none;
	text-align: left;
	width: calc(100% - 70px);
}

.rotating-octagon {
	animation: rotate 2s linear infinite;
	transform-origin: center;
}

@keyframes rotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

.btn__logo-wrp {
	width: 70px;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.btn__logo {
	width: 20px;
	height: 20px;
	background: url(esiasprite.png) -242px -172px no-repeat;
}

.ac {
	display: none;
}
article {
	overflow: hidden;
	height: 0px;
	position: relative;
	max-width: 400px;
	-webkit-transition: height 0.3s ease-in-out;
	transition: height 0.3s ease-in-out;
}

article > a {
	display: block;
	color: #00336f;
	font-weight: 600;
	margin-top: 20px;
	text-decoration: none;
	font-size: 14px;
	text-indent: 2.5em;
	text-align: justify;
	font-family: "Ubuntu", sans-serif;
}
article > a:first-child {
	margin-top: 10px;
}

article > a:hover {
	text-decoration: underline;
}
input.ac:checked ~ article.ac-small {
	height: 140px;
}
input.ac:checked ~ article.ac-medium {
	height: 180px;
}
input.ac:checked ~ article.ac-large {
	height: 370px;
}
@-moz-document url-prefix() {
	input.ac:checked ~ article.ac-large {
		height: 405px;
	}
}

input.ac:checked ~ article {
	-webkit-transition: height 0.5s ease-in-out;
	transition: height 0.5s ease-in-out;
}

#overlay {
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.7);
}

.modal_div {
	display: none;
	min-height: 300px;
	width: 300px;
	padding: 22px 20px 12px;
	border: 0 #003764 solid;
	background: #fff;
	position: absolute;
	opacity: 1;
	/* position: fixed; */
	/* z-index: 5; */
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


.modal_div h5 {
	color: #00336f;
	font-weight: 600;
	margin-bottom: 17px;
	font-size: 14px;
	font-family: "Ubuntu", sans-serif;
	padding-right: 20px;
}
.modal_div p {
	font-size: 14px;
	margin-bottom: 8px;
}

.modal_close {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
}

.modal_close {
	width: 32px;
	height: 32px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
	background-color: #1e66a2;
	color: #fff;
	padding: 5px 5px;
	opacity: 0.5;
}

.modal_close:hover {
	opacity: 1;
}
.modal_close:before,
.modal_close:after {
	position: absolute;
	left: 15px;
	top: 8px;
	content: " ";
	height: 15px;
	width: 2px;
	background-color: #fff;
}
.modal_close:before {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.modal_close:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

footer {
	width: 85%;
	margin: 0 auto;
	height: 50px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.footer__item {
	display: flex;
	justify-content: center;
	align-items: center;
}

.link {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	cursor: pointer;
}

.link-3 {
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.link-1__img {
	height: 84px;
	width: 88px;
	background-image: url("../img/dep-obr.png");
	background-size: cover;
}

.link-2__img {
	height: 83px;
	width: 116px;
	background-image: url("../img/toipkro.jpg");
	background-size: cover;
}

.link-3__img {
	background: url("../img/irtech-logo.jpg");
	width: 60px;
	height: 64px;
	background-size: contain;
	margin-bottom: 5px;
}

.link-1__text {
	color: #000;
	font-size: 14px;
}

.text-bold {
	font-weight: 700;
}

@media (max-width: 1080px) {
	main {
		min-height: auto;
		min-height: initial;
		display: block;
	}

	footer {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}
@media (max-width: 900px) {
	.logo-text {
		width: 421px;
		text-align: center;
	}
}
@media (max-width: 437px) {
	body {
		width: 437px;
	}
}
@media (max-width: 450px) {
	.modal_div-large {
		width: 100%;
		margin-left: 0;
		left: 0;
		height: 450px;
		margin-top: -225px;
	}
}