.clearfix { clear: both;}

.wrap15 { padding: 15px;}

p.alarm { color: red;}


.addElem .bigButton:first-child {margin: 0 0 0 10px;}

.loadIco:after {content: '\e857'; font: normal 16px/16px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; margin: 0 0 0 3px; transform: rotate(90deg);}
.uploadIco:after {content: '\e857'; font: normal 14px/14px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; transform: rotate(270deg);}
.printIco:before {content: '\e80e'; font: normal 18px/18px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; margin: 0 5px 0 0;}

.openIco:before {content: '\e86f'; font: normal 14px/15px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; margin: 0 3px 0 0;}
.bigButton input, .midButton input {display: block; width: 100%; background: none; border: none; cursor: pointer; color: inherit; font: inherit;}

.whiteTitle {font: 400 28px/1.0 'Cuprum', sans-serif; color: #fff; margin: 0 0 20px 0; text-transform: uppercase;}
.blackTitle {font: 700 19px/1.2 'Cuprum', sans-serif; margin: 0 0 20px 0;}



/* Grid */




.pageSection {width: 100%; background: #e6e9ea; position: relative; overflow: hidden; padding: 40px 0 20px 0;}
.contentWidth {margin: 0 10px; max-width: 850px; position: relative;}







/* Section slider */
.sectionSlider {width: 100%; height: 650px; min-height: 100%; position: relative;}
.sectionSlider .slide {width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-position: center center; background-repeat: no-repeat; background-size: cover; padding: 100px 0 20px 0;}
.sectionSlider .slide:before {content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(95,95,95,.5);}
.sectionSlider .lister {width: 10px; position: absolute; left: 10px; top: 115px;}
.sectionSlider .lister span {display: block; width: 10px; height: 10px; border-radius: 50%; background: #fff; margin: 0 0 10px 0; cursor: pointer; transition: all .3s ease; -webkit-transition: all .3s ease;}
.sectionSlider .lister span:hover, .sectionSlider .lister span.active {transform: scale(1.5);}
.sectionSlider .slideText {max-width: 750px; position: relative; margin: 0 0 0 25px;}
.sectionSlider .slideText .note {color: #fff; font: 300 20px/1.0 'Roboto', sans-serif; margin: 0 0 20px 0;}
.sectionSlider .slideText .H1 {margin: 0 0 15px 0;}
.sectionSlider .largeTextBlock {background: #fff; padding: 10px; margin: 0 0 15px 0; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.sectionSlider .smallTextBlock {background: #fff; padding: 15px; width: 170px;}
.sectionSlider .largeTextBlock .H2 {margin: 0 0 10px 0;}
.sectionSlider .slideText .txt {color: #2c4554; text-transform: uppercase; font: 400 14px/1.4 'Cuprum', sans-serif;}
.sectionSlider .slideText .links {color: #007ac3; text-transform: uppercase; font: 400 14px/1.4 'Cuprum', sans-serif; margin: 0 0 10px 0;}
.sectionSlider .slideText .links a {text-decoration: none;}
.sectionSlider .slideText .authLink {color: #007ac3; text-transform: uppercase; font: 400 14px/1.4 'Cuprum', sans-serif;}
.sectionSlider .pic {width: auto; height: 70px;}
/*.sectionSlider .pic path, .sectionSlider .pic circle, .sectionSlider .pic line, .sectionSlider .pic polyline, .sectionSlider .pic rect, .sectionSlider .pic polygon {fill:none; stroke: #686868; stroke-width: 2.5;}

.sectionContent .pic path, .sectionContent .pic circle, .sectionContent .pic line, .sectionContent .pic polyline, .sectionContent .pic rect, .sectionContent .pic polygon {fill:none; stroke: white; stroke-width: 1.6;}*/

.pageSection .bgPic {width: 600px; height: 80%; position: absolute; top: 10%; right: 10px; background-position: right center; background-repeat: no-repeat; background-size: contain;}
.sectionContent {height: auto; padding:150px 0px; overflow:hidden; position: relative; display: flex; flex-direction: column; justify-content: space-around; font: 300 14px/1.4 'Roboto', sans-serif;}
.sectionContent a:not(.white) {color: #007ac3;}

.sectionContent .H1 {color: #007ac3; margin: 0 0 10px 0;}
.sectionContent .H4, .sectionContent p {margin: 0 0 10px 0;}
.sectionContent .boldText {font-size:16px; position: relative;}
.sectionContent .boldText b{display:block; font-weight:700; color: #037ac3;}
.sectionContent .leftBlock .leftBlockImg {display: none;}
.sectionContent .rightBlock .text {width: 75%; margin: 0 0 30px 0;}
.sectionContent .phoneBlock {text-align: center; font-size: 0;}
.sectionContent .phoneBlock .phoneImg {width: 140px; height: auto; display: inline-block; height:400px}
.sectionContent .phoneBlock .phoneImg .phoneLine {fill: none; stroke: #007ac3; stroke-width: 1;}
.sectionContent .phoneBlock .phoneImg .phoneThin {fill: none; stroke: #007ac3; stroke-width: 0.5;}

.sectionContent .phoneBlock .boldText {width: 100%; display: inline-block; vertical-align: middle; padding: 20px; text-align: left; }
.sputnikSVG path, .sputnikSVG circle, .sputnikSVG line, .sputnikSVG polyline, .sputnikSVG rect, .sputnikSVG polygon {fill: none; stroke: #007ac3; stroke-width: 6;}
.zoneSVG .map path, .zoneSVG .map circle, .zoneSVG .map rect, .zoneSVG .map polygon {fill: #fff;}
.zoneSVG .area {fill: none; stroke: #007ac3; stroke-width: 3.8;}

.sectionContent .picsList {margin: 0; margin-top:30px; list-style: none;}
.sectionContent .picsList li {margin: 0 0 15px 0; display: table; width: 100%;}
.sectionContent .picsList .pic {display: table-cell; vertical-align: middle;}
.sectionContent .picsList .boldText {display: table-cell; vertical-align: middle; padding: 0 0 0 20px;}
.sectionContent .picsList span {display: inline-block; width: 90px; height: 90px; border-radius: 50%; background: #007ac3; color: #fff; text-align: center;}
.sectionContent .picsList span:before {font: normal 52px/90px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.cashMasineIco:before {content: '\e8b3';}
.markersIco:before {content: '\e8b2';}
.rocketIco:before {content: '\e8ae';}

.sectionContent .centerBlock .text {margin: 0 0 30px 0;}
.sectionContent .prices img {display: none;}
.sectionContent .prices .priceUnit {padding: 0 0 25px 0;}
.sectionContent .prices .H2 {margin: 0;}
.sectionContent .prices .point {display: none;}

/* Personal */
.profileLink a {color: #fff;}
.profileLink .ava, .profileLink .dava {width: 46px; height: 46px; margin-right:15px; float: left; position: relative; text-align: center;}
.profileLink .ava:before {content: '\e876'; font: normal 34px/46px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.profileLink .ava img {width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 50%;}

.White .profileLink a{color: #314553;}
.profileLink .dava:before {content: '\e877'; font: normal 34px/46px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.profileLink .dava img {width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 50%;}

















.formWrap {background: #fff; padding: 25px 20px; margin: 0 0 30px 0;}
.formWrap .fieldBox, .formWrap form > .errorMess {padding: 0 10px 25px 10px;}








@media screen and (min-width: 640px){
	/* Grid */
	.pageSection {padding: 50px 0 20px 0;}
	.contentWidth {margin: 0 30px;}


	.leftColSupport {width: 80%; float: left; padding: 0 10px 0 0;}
	.rightColSupport {width: 80%; float: right; padding: 0 0 0 10px;}
	






	/* Side bar */
	.siteMenu ul {margin: 0 10px 30px 30px;}
	.authLinks {margin: 0 10px 30px 30px;}
	/* Section slider */
	.sectionSlider {height: 890px;}
	.sectionSlider .lister {left: 30px; top: 180px;}
	.sectionSlider .slide {padding: 150px 0 30px 0;}
	.sectionSlider .slideText {margin: 0 0 0 40px;}
	.sectionSlider .slideText .note {font: 300 24px/1.0 'Roboto', sans-serif;}
	.sectionSlider .largeTextBlock {width: 460px; background: #fff; padding: 10px 15px; margin: 0 0 25px 0;}
	.sectionSlider .smallTextBlock {padding: 30px 15px 20px 15px;}
	.sectionSlider .slideText .txt {font: 400 16px/1.4 'Cuprum', sans-serif;}
	.sectionSlider .slideText .links {font: 400 16px/1.4 'Cuprum', sans-serif; margin: 0 0 20px 0;}
	.sectionSlider .slideText .authLink {text-transform: uppercase; font: 400 16px/1.4 'Cuprum', sans-serif;}
	.sectionSlider .pic {height: 130px;}

	.pageSection .bgPic {right: 35px;}
	.sectionContent .leftBlock {width: 50%; float: left; padding: 0 20px 0 0; text-align: right; position: relative;}
	.sectionContent .leftBlock .leftBlockImg {display: block; margin: 0 0 20px 0;}
	.sectionContent .rightBlock {width: 50%; float: right; padding: 0 0 0 20px;}
	.sectionContent .rightBlock .text {margin: 0;}
	.sectionContent .picsList {margin: 60px 0 0 -40px; list-style: none;}

	.sectionContent .phoneBlock {width: 50%; float: left; padding: 0 20px 0 0; text-align: right;}
	.sectionContent .phoneBlock .phoneImg {width: 110px;}
	.sectionContent .phoneBlock .boldText {width: 160px;}

	.sectionContent.sputniks .leftBlock .leftBlockImg {max-width: 270px; margin: -5px 0 20px 0;}
	.sectionContent.zone .leftBlock .leftBlockImg {margin: -30px -30px -30px 0; max-width: 150%; float: right;}
	.sectionContent.usage .rightBlock {width: 480px; margin: 0 auto; float: none;}
	.sectionContent.usage .rightBlock .text {margin: 0 0 50px 0;}
	.sectionContent.work .centerBlock .text {margin: 0 0 20px 0;}

	.sectionContent .centerBlock {width: 520px; margin: 0 auto;}
	.sectionContent .prices {margin: 0 0 30px -40px;}
	.sectionContent .prices:after {content: ''; display: block; width: 100%; height: 0; clear: both;}
	.sectionContent .prices .pricesImg {display: block; width: 150px; height: auto; float: left;}
/*	.sectionContent .prices .pricesImg .picLine {fill: none; stroke: #037ac3; stroke-width: 1.3;} */
	.sectionContent .prices .pricesImg .picArea {fill: #037ac3; stroke: #037ac3;}
	.sectionContent .prices .pricesImg .picElem {fill-rule:evenodd;clip-rule:evenodd;fill:#037ac3;}
	.sectionContent .prices .priceUnit {padding: 25px 0 0 270px; position: relative;}
	.sectionContent .prices .point {display: block; width: 110px; position: absolute; top: 30px; left: 130px;}
	.sectionContent .prices .point:after {content: ''; display: block; width: 110px; height: 12px; background: url(../img/point.png) 0 0 no-repeat;}
	.sectionContent .prices .point.double {height: 70px; border-right: 1px solid #2c4554;}
	.sectionContent .prices .point.double:before {content: ''; display: block; width: 85px; height: 12px; background: url(../img/point.png) 0 0 no-repeat; top: -5px;}
	.sectionContent .prices .point.double:before, .sectionContent .prices .point.double:after {position: absolute; right: 0;}
	.sectionContent .prices .point.double:after {bottom: -6px;}





	/* Pages */

	.addElem > div {margin: 0 10px 0 0;}
	.addElem .bigButton {margin: 10px 0 0 10px;}
	
	



	
	
	.personalInfoSet .heightBg {height: unset;}

}
@media screen and (min-width: 768px){
	/* Grid */

	.pageSection {height: 100%; position: absolute; left: 0; padding: 100px 0 150px 0;}
	.pageSection.prev {top: -100%;}
	.pageSection.next {top: 100%;}
	.pageSection.current {top: 0;}

	.leftColSupport {width: 80%; float: left; padding: 0 20px 0 0;}
	.rightColSupport {width: 80%; float: right; padding: 0 0 0 20px;}

	/* Section slider */
	.sectionSlider {height: 100%;}
	.sectionSlider .lister {top: 200px;}
	.sectionSlider .slide {height: 100%; padding: 120px 0; display: flex; flex-direction: column; justify-content: space-around;}
	.sectionSlider .slideText {width: 580px;}
	.sectionSlider .blockSet {position: relative;}
	.sectionSlider .largeTextBlock {width: 380px;}
	.sectionSlider .smallTextBlock {width: 180px; position: absolute; top: 0; right: 0;}


	

	.navArrows {display: block; position: fixed; right: 30px; bottom: 140px; z-index: 1;}
	.navArrows .prevArr, .navArrows .nextArr {width: 55px; height: 55px; border-radius: 50%; text-align: center; margin: 10px 0; cursor: pointer; color: #fff;}
	.navArrows .prevArr:before, .navArrows .nextArr:before {font: normal 55px/55px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
	.navArrows .prevArr:before {content: '\e8a9';}
	.navArrows .nextArr:before {content: '\e875';}
	.navArrows .prevArr.disabled, .navArrows .nextArr.disabled {display: none;}

	.sestionLinks {display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; height: 130px; padding: 0 70px; position: fixed; z-index: 1; left: 0; bottom: 0; background: #007ac3;}
	.sestionLinks .sectionIco {display: block; width: 30%; text-align: center; text-transform: uppercase; text-decoration: none; font: 400 16px/1.0 'Cuprum', sans-serif; color: #fff;}
	.sestionLinks .sectionIco:before {font: normal 37px/75px "gascom"; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: block; width: 85px; height: 85px; margin: 0 auto 5px auto; border-radius: 50%; background: #00a2ff; transition: all .8s ease; -webkit-transition: all .8s ease; border: 7px solid #007ac3;}
	.sestionLinks .sectionIco:hover:before {border: 7px solid #48a0d4;}
	.sestionLinks .sectionIco.active:before {background: #fff; color: #00a2ff;}

	/* Personal */
	


	/* Pages */

}

@media screen and (min-width: 1024px){
	/* Grid */


	.pageSection {padding: 0;}

.no-js .block-item{max-width:800px}

.sectionContent {height: 100vh; padding:0px}

#nashi-sputniki .sectionContent {height: 690px;}
#zona-pokrytiya .sectionContent {height: 677px;}
#gde-kupit .sectionContent {height: 731px;}
#primery-primeneniya .sectionContent {height: 737px;}
#kak-eto-rabotaet .sectionContent {height: 731px;}

	.sectionContent .phoneBlock .boldText{width: 180px;text-align:right; padding:0 20px 0 0 }


	.navArrows {bottom: 30px;}
	/* Section slider */
	.sectionSlider .slide {padding: 100px 0 0 0;}

	.sestionLinks {flex-direction: column; justify-content: flex-start; width: 110px; height: 100%; position: fixed; left: 200px; padding: 50px 0;}
	.sestionLinks .sectionIco {width: auto; margin: 0 0 20px 0;}




	/*tooltip*/
	.tooltip:hover .tooltiptext{visibility: visible;}

}
@media screen and (min-width: 1050px){
	/* Grid */


	.contentWidth {margin: 0 75px; height: 100%;}

	
	.navArrows {right: 50px; bottom: 50px;}
	.sestionLinks {width: 175px;}
	/* Section slider */
	.sectionSlider .lister {left: 100px;}
	.sectionSlider .slideText {margin: 0 0 0 75px;}

	.sectionContent .leftBlock {width: 330px; position: absolute; right: 50%; top: 40%; margin: 110px -20px 0 0; float: none; padding: 0;}
	.sectionContent .leftBlock .leftBlockImg {right: 0; bottom: 100%; position: absolute;}
	.sectionContent .rightBlock {width: 330px; position: absolute; left: 50%; top: 40%; margin: -15px 0 0 105px; float: none; padding: 0;}
	.sectionContent .line {width: 12px; height: 12px; border-radius: 50%; background: #007ac3; position: absolute; right: 50%; top: 40%; margin: 0 -70px 0 0;}
	.sectionContent .line:before, .sectionContent .line:after {content: ''; display: block; width: 355px; height: 1000px; position: absolute; right: 0;}
	.sectionContent .line:before {bottom: 22px; background: url(../img/line01.png) left bottom no-repeat;}
	.sectionContent .line:after {top: 22px; background: url(../img/line02.png) left top no-repeat;}

	.sectionContent .phoneBlock {width: 400px; position: absolute; right: 50%; top: 40%; margin: -160px -20px 0 0; float: none; padding: 0;}
	.sectionContent .phoneBlock .phoneImg {float: right; width: 210px;}
	.sectionContent .phoneBlock .boldText {padding: 0; float: left; margin: 90px 0 0 0;}

	.sectionContent.sputniks .line:before {display: none;}
	.sectionContent.sputniks .leftBlock .leftBlockImg {margin: 0 0 90px 0; max-width: 115%;}
	.sectionContent.zone .leftBlock .leftBlockImg {margin: 0 0 -20px 0;}
	.sectionContent.usage .line {top: 12%; margin: -6px 275px 0 0;}
	.sectionContent.usage .line:before, .sectionContent.usage .line:after {width: 71px; height: 1000px; right: 3px;}
	.sectionContent.usage .line:before {background: url(../img/line03.png) left bottom no-repeat;}
	.sectionContent.usage .line:after {background: url(../img/line03.png) left top no-repeat;}
	.sectionContent.usage .rightBlock {left: 50%; top: 12%; margin: -15px 0 0 -235px;}
	.sectionContent.work .line {top: 12%; margin: -6px 275px 0 0;}
	.sectionContent.work .line:before {width: 71px; height: 1000px; right: 3px; background: url(../img/line03.png) left bottom no-repeat;}
	.sectionContent.work .line:after {display: none;}
	.sectionContent.work .centerBlock .text {margin: 0 0 20px 0;}
	.sectionContent .centerBlock {position: absolute; left: 50%; top: 12%; margin: -15px 0 0 -240px;}



	/* Pages */

	
}
@media screen and (min-width: 1360px){
	/* Section slider */
	.sectionSlider .slideText {width: auto;}
	.sectionSlider .slideText .note, .sectionSlider .slideText .H1 {margin: 0 180px 20px 0;}
	.sectionSlider .largeTextBlock {width: 280px; float: left; margin: 0 20px 0 0; display: block; padding: 30px 15px;}
	.sectionSlider .smallTextBlock {width: 170px; top: auto; bottom: 100%; float: none;}
	.sectionSlider .slideText .txt {margin: 0 0 30px 0;}
	.sectionSlider .pic {display: block; height: 170px; margin: 0 auto;}



	

	/* Pages */


	.formWrap .size11 {clear: both;}
	.formWrap .size12 {width: 50%; float: left;}
	.formWrap .size13 {width: 33.3333%; float: left;}
	.formWrap .size14 {width: 25%; float: left;}
	.formWrap .size23 {width: 66.6666%; float: left;}
}
.grid-container {
  display: grid;
  grid-template-columns: auto auto auto;
}