/*******************************************
 *** Адаптивные стили ADAPTIVE.CSS
 *** Собственность компании WEBBERRIES
 *** https://webberries.ru (C) 2005-2025
 *** Для вопросов: webberries@yandex.ru
 *** Дата обновления: 30.01.2025
 *** Версия файла: V4.10 
 *******************************************/




/*
@media screen and (min-width: 1900px) {
	section, header, footer, nav { 
		min-width: 1880px; 
	}

	div.con { 
		width: 1840px; 
	}
}

@media screen and (min-width: 1600px) and (max-width: 1899px) {
	section, header, footer, nav { 
		min-width: 1560px; 
	}

	div.con { 
		width: 1520px; 
	}
}
*/



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

	header {
		height: unset;
		padding: 25px 15px;
		border-bottom: 5px solid #0277BD;
	}

	header .con {
		display: flex;
		flex-wrap: wrap;
	}

	header .con .logo {
		margin-top: 0px;
		margin: 0 auto 25px auto;
		height: unset;
		width: 50%;
		margin-right: 50%;
		background: url(/sys/images/main/logo-2b.png) center center / contain no-repeat;
	}

	header .con .logo:before {
		content: "";
		float: left;
		padding-top: 32%;
	}

	.break {
		display: block;
		width: 100%;
		height: 0;
	}

	header .con .info {
		width: 50%;
		height: unset;
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
	}

	header .con .info div:nth-child(1) {
		width: 32px;
		height: 32px;
		background: #0277BD;
		background: #8D6E63;
		background: #4CAF50;
		font-size: 2.0em;
		border-radius: 1000px;
		line-height: 32px;
		text-align: center;
		color: #fff;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, .20);
	}

	


	header .con .info div:nth-child(2) {
		margin-left: 10px;
		font-size: 0.8em;
	}

	header .con .info div:nth-child(2) span {
		display: block;
		font-weight: 600;
		margin-bottom: 5px;
		font-size: 1.25em;
	}

	header .con .info.worktime  {
		width: 50%;
		justify-content: flex-end;
	}

	header .con .info.worktime div:nth-child(1) {
		order:2;
		margin-left: 10px;
	}

	header .con .info.worktime div:nth-child(2) {
		order:1;
		text-align: right;
	}

	header .con .phones {
		margin-top: 25px;
		width: 100%;
		height: unset;
		display: flex;
		flex-wrap: wrap;
		align-content: center;
		align-items: center;
		justify-content: space-between;
	}

	header .con .phones div {
		font-size: 1.75em;
		width: 100%;
		font-weight: 800;
		text-align: center;
	}

	header .con .phones div:last-child {
		margin-bottom: 0;
	}


	.hamburger {
		display: block;
		width: 48px;
		height: 48px;
		border-radius: 12px;
		line-height: 48px;
		text-align: center;
		font-size: 2.5em;
		color: #fff;
		background: #0277BD;
		position: absolute;
		right: 15px;
		top: 25px;
	}

	nav {
		display: none;
	}


	nav {
		height: unset;
		background: #212121;
		position: fixed;
		right: 0;
		top: 0;
		inset: 0;
		padding: 125px 15px 25px 15px;
		z-index: 100000;
		/*background: linear-gradient(180deg, #0277BD, #01579B);*/
	}

	nav .con {
		display: block;
		flex-wrap: unset;
		justify-content: unset;
		align-items: unset;
	}

	nav .menu {
		height: unset;
		display: block;
		flex-wrap: unset;
		align-items: unset;
	}

	nav .menu div {
		margin-left: 0;
		color: #fff;
		height: unset;
		line-height: unset;
		text-align: center;
		font-weight: 600;
		margin-bottom: 15px;
		padding: 5px 0;
		text-transform: uppercase;
		font-size: 1.25em;
		overflow: hidden;
		cursor: pointer;
		position: relative;
	}

	nav .menu div:first-child {
		margin-left: 0;
	}

	nav .menu div:before,
	nav .menu div:hover:before {
		display: none;
	}

	nav .button-go {
		position: absolute;
		bottom: 25px;
		left: 15px;
		right: 15px;
		height: 50px;
		line-height: 50px;

		background: #4CAF50;
		color: #fff;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, .20);
		font-size: 1.25em;
		font-weight: 600;
		border-radius: 6px;
		border-bottom: 2px solid #2E7D32;
		border-right: 1px solid #2E7D32;
	}

	.hamburger-close {
		display: block;
		position: absolute;
		top: 25px;
		right: 15px;
		width: 48px;
		height: 48px;
		text-align: center;
		line-height: 48px;
		font-size: 2.5em;
		border: 1px solid #fff;
		color: #fff;
		border-radius: 12px;
	}


	section.main .image {
		display: none;
	}

	section.main .con .text {
		padding: 50px 15px;
		width: 100%;
	}

	section.main .con .text h1 span:first-child {
		display: block;
		font-weight: 800;
		font-size: 3.0em;
		margin-bottom: 10px;
		text-transform: uppercase;
	}

	section.main .con .text h1 span:last-child {
		display: inline-block;
		padding: 5px 15px 7px 15px;
		background: #0277BD;
		color: #fff;
		color: #212121;
		background: transparent;
		border: 3px dashed #212121;
		font-size: 2em;
		font-weight: 600;
		border-radius: 12px;
	}

	section.main .con .text p.descr {
		margin-top: 25px;
		font-size: 1.25em;
		font-weight: 500;
		padding-right: 0;
		line-height: 1.5;
	}

	section.main .con .text p.descr strong {
		display: inline-block;
		border-bottom: 2px dashed #212121;
	}

	section.main .con .text p.call {
		margin-top: 25px;
		font-size: 1.25em;
		font-weight: 500;
		line-height: 1.5;
		margin-bottom: 15px;
		text-align: center;
		width: 80%;
		margin: 25px auto 15px auto;
	}

	section.main .con .text .form-line {
		display: flex;
		flex-wrap: wrap;
		height: unset;
		width: 80%;
		margin: 0 auto;
	}

	section.main .con .text .form-line div {
		width: 100%;
		margin-bottom: 5px;
	}

	section.main .con .text .form-line div:last-child {
		width: 100%;
		height: 60px;
		line-height: 60px;
		text-align: center;
		background: #4CAF50;
		color: #fff;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, .20);
		font-size: 1.25em;
		font-weight: 600;
		border-radius: 6px;
		border-bottom: 2px solid #2E7D32;
		border-right: 1px solid #2E7D32;
		cursor: pointer;
		transition: 0.2s;
	}

	section.main .con .text .form-line div:last-child:hover {
		background: #2E7D32;
	}

	section.main .con .text p.attention {
		font-size: 0.8em;
		width: 80%;
		line-height: 1.5;
		margin: 5px auto 0 auto;
		text-align: center;
	}

	section.uslugi {
		padding: 25px 15px;
	}

	section.uslugi .attention {
		display: flex;
		flex-wrap: wrap;
	}

	section.uslugi .attention div:first-child {
		width: 100%;
		height: unset;
		position: relative;
	}

	section.uslugi .attention div:first-child:before {
		content: "";
		float: left;
		padding-top: 75%;
	}

	section.uslugi .attention div:first-child video {
		width: 100%;
		height: 100%;
	}

	section.uslugi .attention div:last-child {
		margin-left: unset;
		padding-left: unset;
		line-height: 1.5;
		font-size: 1.0em;
		border-left: 0;
		margin-top: 15px;
	}

	section.uslugi h2 {
		margin-top: 50px;
		text-align: center;
		font-size: 2em;
	}

	section.uslugi p.under-h2 {
		margin-top: 5px;
		text-align: center;
		font-size: 1.0em;
		text-align: center;
		margin-bottom: 25px;
		line-height: 1.5;
	}

	section.uslugi .items .item {
		width: calc(50% - 5px);
		padding: 10px;
		margin-bottom: 10px;
	}

	section.uslugi .items .item div.header {
		font-size: 1.25em;
		font-weight: 600;
		margin-bottom: 25px;
		color: #fff;
		margin-top: 25px;
	}

	section.uslugi .items .item div:nth-child(2) {
		font-size: 1em;
		font-weight: 500;
		margin-bottom: 25px;
		color: #fff;
		text-align: left;
	}

	section.uslugi .items .item div:last-child {
		padding: 10px 15px;
		text-align: center;
		background: #4CAF50;
		color: #fff;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, .20);
		font-size: 1.0em;
	}




	section.whywe {
		padding: 25px 15px;
	}

	section.whywe h2 {
		text-align: center;
		margin-bottom: 50px;
		font-size: 2em;
	}

	section.whywe h2 span {
		color: #0277BD;
	}

	section.whywe .info {
		display: flex;
		flex-wrap: wrap;
	}


	section.whywe .info div:first-child {
		width: 100%;
		order: 2;
		font-size: 1.0em;
		font-weight: 500;
	}

	section.whywe .info div:first-child p {
		margin-bottom: 15px;
		line-height: 1.5;
	}

	section.whywe .info div:first-child p:last-child {
		margin-bottom: 0;
	}

	section.whywe .info div:last-child {
		width: 100%;
		display: flex;
		align-items: center;
		order: 1;
		padding: 0 20%;
		margin-bottom: 25px;
	}




	section.calculator {
		border-top: 1px solid #eee;
		border-bottom: 1px solid #eee;
		padding: 25px 15px;
		background: #fafafa;
		background: url(/sys/images/main/calc-2.jpg) center center / cover;
		background-attachment: fixed;
	}

	section.calculator h2 {
		text-align: center;
		font-size: 2em;
	}

	section.calculator h2 span {
		color: #0277BD;
	}

	section.calculator p.under-h2 {
		margin-top: 5px;
		text-align: center;
		font-size: 1.0em;
		line-height: 1.5;
		text-align: center;
		margin-bottom: 50px;
	}


	section.calculator .calc .name {
		height: 50px;
		line-height: 50px;
		font-size: 1.5em;
		font-weight: 600;
		position: relative;
		bottom: 0px;
	}

	section.calculator .calc div:last-child {
		display: inline-block;
		margin-left: 25px;
		height: 50px;
	}

	section.calculator .calc div:last-child select {
		width: 100%;
		text-align: center;
		font-size: 2.5em;
		font-weight: 800;
		height: 50px;
		line-height: 50px;
		border:0;
		color: #0277BD;
		border-radius: 0;
		border: 2px solid #0277BD;
		border-radius: 12px;
		background: transparent;
		cursor: pointer;
	}

	section.calculator .result {
		text-align: center;
		font-size: 1.5em;
		margin-top: 25px;
		line-height: 2;
	}




	section.dopolnitelno {
		padding: 25px 15px;
	}

	section.dopolnitelno h2 {
		text-align: center;
		margin-bottom: 25px;
		font-size: 2em;
	}

	section.dopolnitelno .table {
		width: 100%;
		margin: 0 auto;
	}

	section.dopolnitelno .table > div div:first-child {
		border: 1px solid #ccc;
		border-right: 0;
		padding: 10px;
		border-bottom: 0;
		width: 100%;
		font-size: 1.0em;
	}

	section.dopolnitelno .table > div div:last-child {
		border: 1px solid #ccc;
		padding: 10px;
		border-bottom: 0;
		width: 180px;
		font-size: 1.0em;
		text-align: center;
		font-weight: 600;
	}

	section.dopolnitelno .table > div:first-child div:first-child {
		font-weight: 600;
		color: #fff;
		background: #0277BD;
		font-size: 1.0em;
		border: 0;
	}

	section.dopolnitelno .table > div:first-child div:last-child {
		font-weight: 600;
		color: #fff;
		background: #0277BD;
		font-size: 1.0em;
		text-align: center;
		border: 0;
		border-left: 1px solid #ccc;
	}




	section.keypay {
		padding: 25px 15px;
		background: #fafafa;
	}

	section.keypay h2 {
		text-align: center;
		margin-bottom: 120px;
		font-size: 2em;
	}

	section.keypay .items {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: stretch;
	}

	section.keypay .items .item {
		width: 100%;
		padding: 85px 25px 25px 25px;
		border-radius: 12px;
		background: #fff;
		box-shadow: 0 14px 28px rgba(0,0,0,0.11), 0 10px 10px rgba(0,0,0,0.12);
		position: relative;
		overflow: visible;
		margin-bottom: 100px;
	}

	section.keypay .items .item:last-child {
		margin-bottom: 0;
	}




	section.gallery {
		padding: 25px 15px;
		background: #fff;
	}

	section.gallery h2 {
		text-align: center;
		margin-bottom: 25px;
		font-size: 2em;
	}

	.gallery-container {
	  column-count: 3;
	  column-gap: 10px;
	}

	section.videogallery {
		padding: 25px 15px;
		background: #fff;
	}

	section.videogallery h2 {
		text-align: center;
		font-size: 2em;
	}

	section.videogallery p.under-h2 {
		margin-top: 5px;
		text-align: center;
		font-size: 1.0em;
		line-height: 1.5;
		text-align: center;
		margin-bottom: 25px;
	}

	section.videogallery .videogallery-container {
		justify-content: space-between;
	}

	section.videogallery .videogallery-container .item {
		width: calc(50% - 10px);
		margin-bottom: 15px;
	}



	section.form-callback {
		padding: 25px 15px;
		background: #fff;
	}

	section.form-callback .form-window-content {
		display: flex;
		flex-wrap: wrap;
		align-items: unset;
		justify-content: unset;
		padding: 15px;
		position: relative;
		z-index: 2;
		overflow: hidden;
	}

	section.form-callback .form-window .info {
		width: 100%;
	}

	section.form-callback .form-window .rows {
		width: 100%;
		margin-top: 25px;
	}

	section.form-callback .form-window:before {
		content: "";
		position: absolute;
		inset: 0;
		background: url(/sys/images/main/ruller.png) right bottom / cover;
		opacity: 0.15;
		z-index: 1;
		border-radius: 12px;
	}

	section.form-callback .form-window .info h2 {
		font-size: 2.0em;
		font-weight: 600;
	}

	section.form-callback .form-window .info h3 {
		font-size: 1.5em;
		font-weight: 500;
		margin-top: 25px;
		margin-bottom: 15px;
	}

	section.form-callback .form-window .info h4 {
		font-size: 1.5em;
		font-weight: 500;
		margin-top: 15px;
		margin-bottom: 25px;
	}

	section.form-callback .form-window .info .social {
		text-align: center;
	}

	section.form-callback .form-window .rows {
		padding: 10px;
		border: 2px dashed #212121;
		border-radius: 12px;
		background: #fff;
		text-align: center;
	}

	section.form-callback .form-window .rows p.attention {
		font-size: 0.8em;
		margin-top: 5px;
		text-align: center;
		line-height: 1.5;
	}

	section.form-callback .form-window .rows p.top {
		margin-bottom: 15px;
		line-height: 1.5;
	}

	section.form-callback .form-window .rows input {
		height: 40px;
		line-height: 40px;
		padding: 0 15px;
		border: 1px solid #ccc;
		border-radius: 6px;
		margin-bottom: 5px;
		text-align: center;
	}

	section.etapy {
		padding: 25px 15px;
		background: #fafafa;
	}

	section.etapy h2 {
		text-align: center;
		font-size: 2em;
	}

	section.etapy h2 span {
		color: #0277BD;
	}

	section.etapy p.under-h2 {
		margin-top: 15px;
		font-size: 1.0em;
		line-height: 1.5;
		text-align: center;
		margin-bottom: 15px;
	}

	section.etapy p.under-h2-next {
		margin-top: 0;
		margin-bottom: 50px;
	}

	section.etapy .items .item {
		width: calc(50% - 5px);
		margin-bottom: 10px;
	}


	section.etapy .items .item .number {
		width: 42px;
		height: 42px;
		line-height: 42px;
		text-align: center;
		background: #0277BD;
		position: absolute;
		top: 0;
		left: 0;
		border-bottom-right-radius: 12px;
		color: #fff;
		font-size: 2em;
		font-weight: 600;
	}

	section.etapy .items .item .image:before {
		content: "";
		float: left;
		padding-top: 80%;
	}

	section.etapy .items .item h3 {
		font-size: 1.25em;
		font-weight: 600;
		text-align: center;
		margin-bottom: 15px;
		padding: 0 10px;
	}

	section.etapy .items .item p {
		text-align: center;
		line-height: 1.5;
		padding: 0 10px;
		font-size: 1em;
	}



	section.catalog {
		padding: 25px 15px;
	}

	section.catalog h2 {
		text-align: center;
		font-size: 2em;
	}

	section.catalog h2 span {
		color: #0277BD;
	}

	section.catalog p.under-h2 {
		margin-top: 5px;
		font-size: 1.0em;
		line-height: 1.5;
		text-align: center;
		margin-bottom: 25px;
	}


	section.catalog .items .item {
		width: calc(50% - 5px);
		margin-bottom: 10px;
	}

	section.catalog .items .item .button-go {
		height: 40px;
		line-height: 40px;
		font-size: 1.0em;
		font-weight: 600;
	}

	section.mo-map {
		padding: 25px 15px;
		border-top: 1px solid #eee;
	}

	section.mo-map h2 {
		text-align: center;
		position: relative;
		z-index: 2;
		font-size: 2em;
		margin-bottom: 25px;
	}

	section.mo-map .items .item {
		padding: 0 3px 12px 3px;
		font-weight: 500;
		font-size: 1em;
		z-index: 3;
		position: relative;
	}

	section.mo-map .items {
		padding: 0px 0;
	}



	section.faq {
		padding: 25px 15px;
		background: #fafafa;
		border-top: 1px solid #eee;
	}

	section.faq h2 {
		text-align: center;
		font-size: 2em;
		margin-bottom: 25px;
	}

	section.faq .faq-container {
		width: 100%;
		margin: 0 auto;
	}

	section.faq .faq-container .que span {
		display: block;
		padding: 10px 0;
		font-size: 1.25em;
		font-weight: 600;
		cursor: pointer;
	}

	section.faq .faq-container .que .ans {
		padding: 0 15px 15px 15px;
		display: none;
		font-size: 1em;
		line-height: 1.5;
	}


	footer {
		padding: 25px 15px;
		background: #212121;
	}


	footer .con div:first-child {
		width: 100%;
		text-align: center;
		order: 3;
	}

	footer .con div:nth-child(2) {
		width: 100%;
		order: 1;
		text-align: center;
		margin-bottom: 25px;
	}

	footer .con div:last-child {
		width: 100%;
		text-align: center;
		order: 2;
		margin-bottom: 15px;
	}

	footer .con div:first-child img {
		display: block;
		width: 60%;
		margin: 0 auto;
	}


	footer .con div:nth-child(2) h2 {
		text-align: center;
		font-size: 1.5em;
	}

	footer .con div:first-child p:last-child {
		color: #aaa;
		line-height: 1.5;
		font-size: 0.8em;
	}






	section.static-page {
		padding: 25px 15px;
		background: #fff;
		border-bottom: 1px solid #efefef;
	}

	section.static-page p {
		margin-bottom: 15px;
		font-size: 1.25em;
	}

	section.static-page p:last-child {
		margin-bottom: 0;
	}




 	
}