@media screen and (max-width: 1220px){
	.container{width: 100%; padding: 0 16px}

	body{padding: 60px 0 0;}

	header{position: fixed; top: 0; left: 0; width: 100%; background: #f9f9f9; box-shadow: 0px 7px 15px 0px rgba(0,0,0,0.1);}
	header .top{display: none;}
	header nav{display: none;}
	header .pull{display: flex;}
	header .pull.open{background: url("../img/closepull.svg") 50% 50% no-repeat;}
	header .pull.open svg{opacity: 0}


	#about img{height: 250px}


	.grid,.grid.grid-4{grid-template-columns: repeat(2, 1fr);}


	#subscribe .title{width: 100%; max-width: 100%; margin-bottom: 32px}


	#about__description .grid{grid-template-columns: repeat(1, 1fr);}
	#about__description .grid img{width: 100%; height: 350px; object-fit: cover;}


	#contacts .items{gap: 32px}
	#contacts .items .item{width: 100%}

	.list__news__line .item__news .news__date{width: 100%; display: flex; align-items: center; justify-content: flex-start; gap: 10px}
	.list__news__line .item__news .news__date span{order: -1; margin: 0; font-size: 32px; line-height: 38px;}
	.list__news__line .item__news .news__date span:after{display: none;}
	.list__news__line .item__news .image{width: 100%; margin: 24px 0}
	.list__news__line .item__news .title{font-size: 18px; line-height: 21px}
	.list__news__line .item__news .excerpt{font-size: 17px; line-height: 21px}


	#content .details img{width: 100%; margin-bottom: 32px; height: auto;}
	#content .details .data{width: 100%; padding: 24px; font-size: 20px; line-height: 26px}
	#content.content__news img{height: auto;}


	footer .col:first-child{max-width: 100%; width: 100%; margin-bottom: 32px}

	.promo-single {
		grid-template-columns: 1fr;
		gap: 40px;
		padding: 0px;
	}
	.first-b {
		padding-top: 40px;
	}
	.first-b p {
		padding: 0 20px;
	}
	.item-s .text {
		padding-right: 20px;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	.items-s {
		display: block;
		margin-bottom: 20px;
	}
	.item-s {
		width: 90%!important;
		border-radius: 30px;
		margin: 10px auto;
		gap: 10px;
	}
}


@media screen and (max-width: 767px){

	.bt{margin-bottom: 40px; padding-bottom: 16px; font-size: 32px; line-height: 38px}
	.bt span{font-size: 24px}

	.btn-orange{padding: 8px 20px; font-size: 20px; line-height: 26px}

	.grid{grid-template-columns: repeat(1, 1fr)!important; gap: 24px}

	section{padding: 80px 0 0}


	header{padding: 15px 0}
	header .bottom{padding: 0}
	header .logo{max-width: 175px}


	#promo{padding: 32px 0}
	#promo .tags{font-size: 40px; line-height: 48px}
	#promo .tags span{display: block;}
	#promo .title{font-size: 32px; line-height: 38px}
	#promo .swiper{padding: 0}
	#promo .swiper-slide{min-height: 500px;
	background-position: center;}


	#about img{height: 340px}
	#about .note{padding: 24px 0 0}
	#about .text{max-width: 100%; width: 100%; margin-bottom: 24px; font-size: 20px; line-height: 26px}


	#workline .item a{height: auto}
	#workline .item .title{font-size: 18px; line-height: 21px; position: relative; bottom: 0; left: 0; padding: 0 30px 0 0;}
	#workline .item .icon{margin-bottom: 40px}
	#workline .item .title svg{right: 0}
	#workline .swiper-slide{width: 100%}
	#workline .slider-sw .swiper-pagination{bottom: -20px!important}
	#workline .slider-sw .swiper-pagination-bullet{margin: 0 10px!important;}
	#workline .slider-sw .swiper-pagination-bullet:after{width: 10px; left: 22px}


	#achievements .items a{padding: 8px 12px; font-size: 16px; line-height: 19px}
	#achievements .video img{height: 345px}
	#achievements .video a{font-size: 0; padding: 0; width: 64px; height: 40px; display: flex; align-items: center; justify-content: center; gap: 0; bottom: calc(50% - 20px); left: calc(50% - 32px)}


	.site__filters.grid{gap: 15px!important}
	.site__filters select{height: 34px; font-size: 17px;}


	.item__news img{height: 200px}
	.item__news .title{font-size: 16px}
	.item__news .category{margin-bottom: 10px; font-size: 10px;}
	.item__news .category a{font-size: 10px; padding: 3px 6px}


	#news .bottom__news{text-align: center;}
	#news .pagination{margin-bottom: 24px; gap: 10px}
	#news .all__news{position: relative;}
	.pagination{gap: 10px!important}


	#institutions .slider-sw .swiper-pagination-bullet{margin: 0 10px!important}
	#institutions .slider-sw .swiper-pagination-bullet:after{width: 10px; left: 22px}


	#team .item .image{height: 220px}
	#team .item .image img{height: 220px;}


	#subscribe .inn{background-position: 100% 100%!important;}
	#subscribe .inn{padding: 40px 16px}
	#subscribe .title{font-size: 32px; line-height: 38px; margin: 0 0 40px}
	#subscribe input{width: 100%; height: 42px; max-width: 100%; margin-bottom: 16px}
	#subscribe .btn{width: 100%}


	#about__page{padding: 50px 0 0}


	.page__title{font-size: 40px; line-height: 48px}
	.page__title strong{font-size: 24px; line-height: 28px}


	#about__description .text{padding: 24px; font-size: 20px; line-height: 26px}


	#breadbcrumbs{padding: 24px 0; font-size: 12px;}


	#teams .item{margin-bottom: 50px}
	#teams .item .image{width: 100%; margin-bottom: 24px}
	#teams .item .image img{height: 250px}
	#teams .item .data{width: 100%;}
	#teams .item .title{margin-bottom: 12px; font-size: 32px; line-height: 38px}
	#teams .item .category{margin-bottom: 12px}
	#teams .item .category a{font-size: 10px; line-height: 13px}
	#teams .item .description{font-size: 17px; margin-bottom: 24px}



	#team__one .item{width: 100%; margin-bottom: 32px; padding-bottom: 0; border-bottom: none;}
	#team__one .item:last-child{margin-bottom: 0; padding-bottom: 0}
	#team__one .item .name{font-size: 18px; line-height: 20px}
	#team__one .item p{padding: 0; font-size: 17px}


	#quote blockquote{padding: 65px 0 0; background-position: 50% 0; background-size: 42px!important; text-align: center;}
	#quote blockquote img{position: relative; top: 0; margin: 0 auto; width: 128px; height: 128px}
	#quote blockquote p{font-size: 24px; margin-bottom: 16px;}
	#quote blockquote .name{margin-bottom: 30px; font-size: 18px; line-height: 21px}
	#quote blockquote .name span{font-size: 17px; line-height: 22px}


	#contacts .items{margin-bottom: 24px;}
	#contacts .items .item{font-size: 20px; line-height: 26px}
	#contacts .items .item p{padding-left: 32px; background-size: 24px!important; min-height: 0; height: auto; background-position: 0 1px}
	#contacts .data img{width: 100%; height: 345px; margin-bottom: 24px}
	#contacts .data .form{width: 100%;}


	#publications .item{margin-bottom: 24px; padding-bottom: 24px}
	#publications img{width: 100%; height: 220px; margin-bottom: 16px}
	#publications .data{width: 100%; margin-bottom: 32px; font-size: 18px; line-height: 24px}


	#links a{min-height: 44px; font-size: 14px; text-align: left; justify-content: flex-start;}


	#components img{height: 345px}
	#components .item{padding: 24px}
	#components .item .title{font-size: 24px; line-height: 28px; margin-bottom: 15px}
	#components .item p{font-size: 20px; line-height: 26px}


	#faq .item{padding-bottom: 24px; margin-bottom: 24px}
	#faq .title{padding: 0 42px 0 0; font-size: 18px; line-height: 21px}
	#faq .title span{display: block; position: relative; margin-bottom: 12px}
	#faq .answer{font-size: 20px; line-height: 26px; padding: 16px 42px 0 0}


	#projects .flex{margin-bottom: 24px}
	#projects .item{margin-bottom: 56px}
	#projects .title{font-size: 32px; line-height: 38px; width: 100%; margin-bottom: 16px}
	#projects .description{font-size: 20px; line-height: 26px}



	#content img{height: 345px; margin-bottom: 32px}
	.content{font-size: 17px; line-height: 21px}
	.content h1{font-size: 24px; line-height: 28px}
	.content h2, .content h3{font-size: 20px; line-height: 26px}
	.content .gallery .item{width: 100%!important;}
	.content .gallery .item img{margin-bottom: 24px; height: 345px}



	#search__result{padding: 50px 0 0;}
	#search__result .item{margin-bottom: 56px}
	#search__result .result__title{font-size: 32px; line-height: 38px; margin-bottom: 40px}
	#search__result .item .title{font-size: 24px; line-height: 28px; margin-bottom: 16px}
	#search__result .item .excerpt{font-size: 17px; line-height: 22px; margin-bottom: 24px}







	.box__modal{padding: 65px 24px 24px}
	.fancybox-close-small{top: 24px; right: 24px}
	.form__title{font-size: 24px; margin-bottom: 24px; line-height: normal;}

	.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form input[type="password"], .form textarea, .form select{margin-bottom: 16px; padding: 0 20px; font-size: 16px; line-height: 42px}
	.form textarea{height: 60px; padding-top: 0px}

	label.userfile{font-size: 17px; padding: 0 20px}
	label.userfile span{gap: 5px}
	label.checkbox span{font-size: 10px}
	label.checkbox:after,label.checkbox span:after{top: 0}


	#map iframe{height: 345px}


	footer{margin-top: 80px}
	footer .logo{max-width: 225px}
	footer .col:nth-child(2),footer .col:nth-child(3){display: none;}
	footer .address{font-size: 15px; line-height: 20px}
	footer .bottom{margin-top: 0; font-size: 12px}
	footer .bottom .lang{display: none;}
	footer .bottom .container.flex{align-items: center;}

	.gallery-columns-2 .gallery-item {
		width: calc(50% - 8px);
		/* 2 колонки на планшетах */
}

.gallery-columns-3 .gallery-item {
		width: calc(33.333% - 10px);
		/* 3 колонки на планшетах */
}

.gallery-columns-4 .gallery-item {
		width: calc(50% - 10px);
		/* 3 колонки на планшетах */
}

.gallery-columns-5 .gallery-item {
		width: calc(50% - 10px);
		/* 2 колонки на маленьких экранах */
}

.gallery {
		row-gap: 0px;
}

.alignleft {
		width: 100%;
}

.alignright {
		width: 100%;
}

.aligncenter {
		width: 100%;
}

.gallery-icon {
		height: auto;
		margin-bottom: 8px;
}
.custom-gallery.gall-2, .custom-gallery.gall-3{
	grid-template-columns: 1fr;
}
.custom-gallery.gall-2 img, .custom-gallery.gall-3 img {
	width: 100%;
	height: auto;
	margin-bottom: 0!important;
}
.grid-2 {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
}

#search__result .item .title a {
	font-size: 16px;
	line-height: 1.4;
}
.circle-wrapper {
	width: 350px;
	height: 350px;
}
.error-page {
	padding: 2rem 1rem;
}

.error-page__content {
	padding: 2.5rem 1.5rem;
}

.error-page__title {
	font-size: 5rem;
}

.error-page__subtitle {
	font-size: 1.5rem;
}

.error-page__description {
	font-size: 1rem;
}

.error-page__links lis {
	flex-direction: column;
	gap: 0.5rem;
}
#comp .items {
	grid-template-columns: 1fr 1fr;
}
}

@media (max-width: 480px) {
	#comp .items {
		grid-template-columns: 1fr;
	}
	/* 1 колонка на мобильных */
	.gallery-columns-2 .gallery-item,
	.gallery-columns-3 .gallery-item,
	.gallery-columns-5 .gallery-item {
			width: 100%;
	}
}