@charset "utf-8";

* {
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	margin: 0px; padding: 0px; border-spacing: 0px;
	border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;
	background-repeat: no-repeat;
	list-style-type: none;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing:border-box;
}
html {
	min-height: 100%; position: relative;
}
body {
	font-size: 24px;
	color: rgb(64,55,45);
	background-color: rgb(255,255,255);
	min-height: 100%;
}
.total-bg {
	background-color: rgb(102,204,204);
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
}
.total-bg img {
	display:block;
}




.o---plugin---to--top---------------{}
#toTop {
    /*display: none;*/
	visibility: hidden;
	z-index: 1;
    position: fixed;
	top: 50%;
	margin-top: -32px;
    /*bottom: 5px;*/
    right: 5px;
    width: 64px;
    height: 64px;
    background-image: url(../img/vverh.png);
    background-repeat: no-repeat;
    opacity: 0;
    filter: alpha(opacity=40); /* For IE8 and earlier */
	cursor:pointer; cursor: hand; border-radius: 4px;
	background-color: rgb(51,51,51);
	background-position: center;
	-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear; -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
#toTop:hover.actv {
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}
#toTop.actv {
	visibility: visible;
	opacity: 0.4;
}
.o---plugin---to--top---------------{}


.o--------KNOPKA-VVERH---------------------------{}
#zztop { height:0px; margin-top:-100px; position:absolute; overflow:hidden;}
.vverh {
	position: fixed; z-index: 10000; display: block;
	right: 20px; bottom: 50%; margin-bottom: -30px;
	cursor:pointer; cursor: hand; border-radius: 4px;
	background-color: rgb(51,51,51);
	-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear; -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.vverh:after { 
	content: ''; display: block; 
	width: 25px; height: 12px; margin: 25px;
	background: url(../img/vverh.png) left bottom no-repeat;
}
.actv .vverh:hover { opacity:.75; }
.pass .vverh { opacity:0; visibility: hidden;}
.actv .vverh  { opacity:.25; }
.o--------END---KNOPKA-VVERH---------------------------{}


.o--------TRANS---and---RADIUS-------------------------{}
.radius-50, .utp-main-list li:before, .main-pict-back, .main-pict-back img, .main-pict-over img { 
	-webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; 
	border-radius: 50%; }
.radius-xs {
	-webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px;
	border-radius: 2px; }
.radius-s {
	-webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px;
	border-radius: 4px; }
.radius-m {
	-webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px;
	border-radius: 6px; }
.radius-l {
	-webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px;
	border-radius: 8px; }
.radius-xl {
	-webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px;
	border-radius: 10px; }
.radius-xxl {
	-webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px;
	border-radius: 15px; }
.radius-xxxl {
	-webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px;
	border-radius: 20px; }
	
.move {
	-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear; -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.slow {
	-webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear; -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}
.sloow {
	-webkit-transition: all 1.5s linear; -moz-transition: all 1.5s linear;
	-ms-transition: all 1.5s linear; -o-transition: all 1.5s linear;
    transition: all 1.5s linear;
}
.scale {
    -webkit-transform: scale(1.1,1.1); -moz-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1); -o-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
}


.o------------POSITION-------------------------{}
.abs { position:absolute; }
.rel { position: relative; }
.fix { position: fixed; }

.left { left: 0; }
.right { right: 0; }
.top { top: 0; }
.bottom { bottom: 0; }

.pos-all { top:0; left:0; width:100%; height:100%; }
.pos-l { top:0; left:0; right:auto; bottom:0; }
.pos-r { top:0; left:auto; right:0; bottom:0; }
.pos-t { top:0; left:0; right:0; bottom:auto; }
.pos-b { top:auto; left:0; right:0; bottom:0; }

.fix-all { position: fixed; overflow:hidden; top:0; left:0; right:0; bottom:0; }

.over-hidd { overflow: hidden; }
.over-scroll { overflow: scroll; }
.vis-hidd { visibility: hidden; }
.vis-vis { visibility: visible; }

.sbros { clear: both; float: none; height: 0px; display: block; }

.line-razdelitel {
	background-color: rgb(204,204,204);
	display: block; clear: both; width: 100%; height: 1px;
}
.pict-raspor { width: 100%; height: auto; display: block; }

.display-desk { display: block !important; }
.display-mob { display: none !important; }
.display-desk-min { display: block; }
.display-mob-min { display: none; }



.o------ROW---and---COL-----------------------------------{}
.row-wrapper { margin:0; padding:0; position: relative; }
.wid-limit { min-width:960px; max-width:1280px; margin:0 auto; position: relative; }
.wid-limit:after, .clear:after { content:''; clear: both; display: block; }
.row-vert-padd { padding-top: 6%; padding-bottom: 6%; }
.wid-100-max-auto { max-width: 100%; width: auto; }
.wid-100 { width: 100%; }

.border-1-grey { border: 1px solid rgb(193, 192, 191); }

.col-1-4, .col-2-4, .col-3-4, .col-1-3, .col-2-3, .col-1-2 { float: left; position: relative; }
.col-1-4 { width: 25%; }
.col-2-4, .col-1-2 { width: 50%; }
.col-3-4 { width: 75%; }	
.col-1-3 { width: 33.33%; }
.col-2-3 { width: 66.66%; }
.col-1-6 { width: 16.66% }
.col-1-12 { width: 8.33% }
.col-5-12 { width: 41.66% }
.col-7-12 { width: 58.33% }

.marg-l { margin-left: 10px !important; }
.marg-r { margin-right: 10px !important; }
.marg-t { margin-top: 10px; }
.marg-b { margin-bottom: 10px; }

.marg-l- { margin-left: -10px !important; }
.marg-r- { margin-right: -10px !important; }
.marg-t- { margin-top: -10px !important; }
.marg-b- { margin-bottom: -10px !important; }

.align-l { text-align: left; }
.align-r { text-align: right; }
.align-c { text-align: center; }

.align-t { vertical-align: top; }
.align-m { vertical-align: middle; }
.align-b { vertical-align: bottom; }

.padd-t-1 { padding-top: 10px; }
.padd-t-2 { padding-top: 20px; }
.padd-t-3 { padding-top: 30px; }
.padd-t-4 { padding-top: 40px; }
.padd-t-5 { padding-top: 50px; }
.padd-b-3 { padding-bottom:1.3em }

.padd-vert-2 { padding-top: 1.2em; padding-bottom:1.2em; }
.padd-vert-3 { padding-top: 1.3em; padding-bottom:1.3em; }

.padd-all-2 { padding: 20px; }
.padd-all-4 { padding: 40px; }

.marg-vert-2 { margin-top: 1.2em; margin-bottom:1.2em; }
.marg-vert-3 { margin-top: 1.3em; margin-bottom:1.3em; }

.marg-t-3 { margin-top: 1.3em; }

.vert-padd-h-1 { padding-top: .5em; padding-bottom: 1.25em; }

.td-min-wid { width: 1%; white-space: nowrap; padding: 0 20px; }
.hei-25 { height: 25% !important; }
.hei-50 { height: 50% !important; }
.hei-75 { height: 75% !important; }
.hei-100 { height: 100% !important; }

.line { width:100%; height:1px; background-color: rgb(204,204,204); }

.overlay {
	height: 100%; width: 100%;
	position: absolute; visibility: hidden;
	left: 0px; top: 0px; right: 0px; bottom: 0px;
}
.overlay.actv { visibility: visible; }



.o------ZAGOLOVKI-i-TEXT-----------------------------------{}
.h-1 { font-size: 300%; margin-top: 30px; margin-bottom: 20px; }
.h-2 { font-size: 210%; margin-top: 20px; margin-bottom: 15px; }
.h-3 { font-size: 175%; margin-top: 20px; margin-bottom: 15px; }
.h-4 { font-size: 150%; margin-top: 20px; margin-bottom: 15px; }
.h-5 { font-size: 125%; margin-top: 20px; margin-bottom: 15px; }
.h-6 { font-size: 110%; margin-top: 20px; margin-bottom: 15px; }

.h-1, .h-2, .h-3, .h-4, .h-5, .h-6 { line-height: 120%; letter-spacing: .025em; }
.h-1 { line-height: 100%; }

.font-size-plus-25 { font-size: 125%; }
.font-size-plus-50 { font-size: 150%; }
.font-size-minus-10  { font-size: 90%; }
.font-size-minus-25  { font-size: 75%; }

table tr td { vertical-align: top; border-spacing:0px; }
p, h1, h2, h3, h4, h5, h6 { cursor: default; }

.light { font-weight:100;}
.regular { font-weight:300;}
.semi-bold { font-weight:500;}
.bold { font-weight:700;}
.super-bold { font-weight:900;}

.uppercase { text-transform: uppercase; }
.p-link { cursor: pointer; font-style: normal; }
.underline { text-decoration: underline; }

.clr-white { color: rgb(255,255,255) !important; }
.bg-clr-white { background-color: rgb(255,255,255) !important; }
.clr-blue { color: rgb(20, 90, 160) !important; }
.bg-clr-blue { 
	background-color: rgb(20, 90, 160) !important;
	/*background-image: url(../img/bg-color-low20.jpg);*/
	background-image:none;
	background-position: top;
	background-attachment: fixed;
	background-size: 100% auto;
 }
.clr-red { color: rgb(182,22,21) !important; }
.bg-clr-red { background-color: rgb(182,22,21) !important; }
.clr-yellow { color: rgb(255,255,0); }
.clr-lazur { color: rgb(128,255,255); }
.clr-moreno { color: rgb(28, 137, 170) !important }



.clr-brown { color: rgb(64,55,45) !important; }
.bg-clr-brown { background-color: rgb(64,55,45) !important; }
.clr-fiolet { color: rgb(153,102,153) !important; }
.bg-clr-fiolet { background-color: rgb(153,102,153) !important; }
.bg-clr-fiolet-opac { background-color: rgba(153,102,153,.8) !important; }
.clr-bezh { color: rgb(203,191,161) !important; }
.bg-clr-bezh { background-color: rgb(203,191,161) !important; }





.oooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo{}


.total-wrap {
}
.screen { 
	background-repeat: no-repeat;
	overflow: hidden;
}
.screen-main {
	background-image: /*url(../img/bg-color-low20.jpg)*/;
	background-size: 100%;
	background-position: left top;
	background-attachment: fixed;
	background-color: rgb(20, 90, 152);
}
.screen-main.actv {
	top:-100%;
}
.main-padds {
	margin-left: 6.77%;
}

.screen-main-3 {
	background-color: rgb(126,192,190);
}
.top-pict-raspor {
	padding-top:2em;
}

.slogan-1 span {
	position:relative;
	display:block;
	padding-left: 3em;
	font-size: 1.35em;
	color: rgb(204,255,255);
}
.slogan-1 span:after {
	content:'';
	display:block;
	position:absolute;
	left:0;
	bottom: .35em;
	background-color: rgb(255,255,0);
	width: 2.25em;
	height: .5em;
}
.top-slogan {
	line-height:1em;
}
.bear-pos {
	position:absolute;
}
.bear-pos img {
	display:inline;
}

.utp-main-list {
}
.utp-main-list li {
	padding-left:3em;
	position:relative;
	color: rgb(204,255,255);
	color: rgb(255,255,255);
	font-size:1.35em;
	font-weight: 500;
	line-height: 1.25em;
	margin-bottom: .5em;
}
.utp-main-list li:before {
	content:'';
	display:block;
	position:absolute;
	width:1em;
	height:1em;
	left:1em; top:.1em;
	background-color:rgb(255,255,0);
}
.pict-prav-skos {
	border-right: solid 2em rgb(255,255,255);
}
.main-pict-box {
	position: absolute;
	left: 94%;
}
.main-picts-wrap {
	position: relative;
	max-width:720px;
	float: right;
	width: 100%;
}
.main-pict-box-base {
	display:block;
	width:100%;
	position:relative;
}
.main-pict-back {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 75%;
}
.circle-line {
	display:block;
	width: 100%;
}
.circle-line img {
	display:block;
	width: 100%;
}
.circle-pict-in {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	padding:1em;
}
.circle-pict-in img {
	display:block;
	width: 100%;
	background-color: rgb(65,191,186);
	background: -moz-linear-gradient( to right bottom, rgb(74,206,190) 30%, rgb(65,191,186) 70%);
}
}
.circle-pict-in img+img {
	position:absolute;
}
.main-pict-over {
	position: absolute;
	top: 0;
	left: 0;
}
.main-pict-over img {
	display:block;
	width: 55%;
	margin-left:45%;
}



.text-box-vert-padd { padding-top: 40px; padding-bottom: 40px; }
.logo-red-top {
	width: 60%;
	max-width: 309px;
}

.yarl-vniz {
	background-image: url(../img/yarl-vniz.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	display: inline-block;
	height: 100px;
	width: 145px;
}


/*.v-vniz {
	padding-top: 0px;
	padding-bottom: 30px;
}
.v-vniz.actv {
	padding-top: 10px;
	padding-bottom: 20px;
}*/




.v-vniz {
	-webkit-animation: shake 1s linear alternate infinite;
	animation: shake 1s linear alternate infinite;
	display: inline-block;
	margin-top: 35px;
}

.main-btn {
    background-color: rgb(255,255,255);
    padding: 20px 25px;
}
.item-point {
	padding-left: 30px;
}
.item-point li {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}
.item-point li:before {
	content:'';
	width:10px; height: 10px;
	display: block;
	background-color: rgb(20, 90, 160);
	display: inline-block;
	left: -30px;
	position: absolute;
	top: 10px;
}
.tab-line {
	border-top: solid 1px #6699CC;
	border-bottom: solid 1px #6699CC;
	padding-top: 20px;
	padding-bottom: 20px;	
}
.tab-line + .tab-line {
	border-top: none;
	border-bottom: solid 1px #6699CC;
}
.tab-line-link {
	font-size:175%;	
	cursor: pointer;
}
.tab-content {
	display: none;
}
.tab-line-link:before {
	content: '';
	display: block;
	width: 16px;
	height: 33px;
	position: absolute;
	top: 10px;
	left: -30px;
	background-image: url(../img/item.png);
	transform-origin: 50%;
	transition: all 0.2s ease-in-out;
}
.tab-line-link.actv:before {
	content: '';
	top: 10px;
	left: -30px;
	transform: rotate(90deg);
}

.td-marg {
	padding-right: 30px;
}
.karta {
	height:500px;
}
.phone-mob-btn {
	display: block;
	width: 100px;
	height: 100px;
	background-size: auto;
	background-image: url(../img/phone.png);
	opacity: .8;
	z-index: 1;
}
.phone-mob-btn:hover {
	opacity: 1;
}
.start-move {
	opacity:0;
	margin-top:-5%;
}
.start-move.actv {
	opacity:1;
	margin-top:0;
}


@-webkit-keyframes shake {
/*  100% {
    -webkit-transform: translateY(-30px);    
  }*/
  0% {
	  padding-top: 0px;
	  padding-bottom: 30px;
	  opacity:0.5;
  }
  100% {
	  padding-top: 10px;
	  padding-bottom: 20px;
	  opacity:1;
  }
}
@keyframes shake {
  /*100% {
    transform: translateY(-30px);    
  }*/
  
  0% {
	  padding-top: 0px;
	  padding-bottom: 30px;
	  opacity:0.5;
  }
  100% {
	  padding-top: 10px;
	  padding-bottom: 20px;
	  opacity:1;
  }
}









.MEDIA-SCREEN-------------------------------------------{}


@media only screen and (max-width: 1400px) {
body { font-size: 22px; }
.main-padds { margin-left: 0; }
.main-picts-wrap { max-width:640px;}
.pict-prav-skos { border-right-width: 1em; }
.main-pict-box { left: 100%; }
}

@media only screen and (max-width: 1280px) {
body { font-size: 20px; }
.screen-main { /*background-image: url(../img/bg-color-low20-1280.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-1280.jpg);*/ background-image:none !important; }
.vverh { margin-right: -10px; }
.tab-line-link:before { width: 16px; height: 33px; top: 9px; left: -30px; }
.logo-footer { max-width:200px; }
.pict-prav-skos { border-right-width: 0; }
}

@media only screen and (max-width: 1100px) {
body { font-size: 18px; }
.text-box-vert-padd { padding-top: 35px; padding-bottom: 35px; }
.vert-padd-h-1 { padding-top: 17px; padding-bottom: 17px; }
.padd-t-1 { padding-top: 8px; }
.padd-t-2 { padding-top: 15px; }
.padd-t-3 { padding-top: 22px; }
.padd-t-4 { padding-top: 30px; }
.padd-t-5 { padding-top: 37px; }

.tab-line-link:before {
	width: 12px; height: 25px; left: -25px;
	background-image: url(../img/item-sm.png);
}
}

@media only screen and (max-width: 991px) {
body { font-size: 16px; }
.screen-main { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
.text-box-vert-padd { padding-top: 30px; padding-bottom: 30px; }
.vert-padd-h-1 { padding-top: 15px; padding-bottom: 15px; }
.padd-t-1 { padding-top: 5px; }
.padd-t-2 { padding-top: 10px; }
.padd-t-3 { padding-top: 15px; }
.padd-t-4 { padding-top: 20px; }
.padd-t-5 { padding-top: 25px; }
.tab-line-link:before {
	width: 12px;
	height: 25px;
	top: 9px;
	left: -25px;
}
.display-desk { display: none !important; }
.display-mob { display: block !important; }

.main-pict-box { position: relative; left: 0; }
.main-picts-wrap { max-width:420px;}
.pict-prav-skos { display:none; }
.bear-padd-l-mob { padding-left:1em;}

}

@media only screen and (max-height: 900px) {
.main-picts-wrap { max-width:640px;}
}
@media only screen and (max-height: 700px) {
.btn-vniz-box { display: none; }
.main-picts-wrap { max-width:580px;}
.text-box-vert-padd { padding-top: 0px; }
}

@media only screen and (max-width: 767px) {
.btn-vniz-box { display: none; }
.screen-main { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
.display-desk-min { display: none !important; }
.display-mob-min { display: block !important; }
.item-point li::before { width: 9px; height: 9px; top: 7px; }
.logo-red-top { width:50%; max-width: 250px; min-width: 200px; }
.bear-pos { position: relative; }
.bear-padd-l-mob { padding-left:0; max-width:240px;}
.top-pic-sdvig-l { left:-20%; }
.text-center-mob-min { text-align: center; }
}
@media only screen and (max-width: 480px) {
body { font-size: 15px; }
.h-1 { font-size: 175%; margin-top: 20px; margin-bottom: 10px; }
.h-2 { font-size: 160%; margin-top: 12px; margin-bottom: 8px; }
.h-3 { font-size: 145%; margin-top: 12px; margin-bottom: 8px; }
.h-4 { font-size: 130%; margin-top: 12px; margin-bottom: 8px; }
.h-5 { font-size: 120%; margin-top: 10px; margin-bottom: 7px; }
.h-6 { font-size: 110%; margin-top: 10px; margin-bottom: 6px; }
.screen-main { /*background-image: url(../img/bg-color-low20-700.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-700.jpg);*/ }
.item-point li::before { width: 8px; height: 8px; top: 7px; }
.tab-line-link:before { top: 7px; left: -12px; }
.tab-line-link.actv:before { top: 7px; left: -12px; }
.phone-mob-btn { width: 75px; height: 75px; background-image: url(../img/phone-sm.png); } 
.vverh:after { margin: 15px; }
.td-marg { padding-right: 20px; }
#toTop { margin-top: -24px; width: 48px; height: 48px; }
.item-point li:before { left: -20px; }
.item-point { padding-left: 20px; }
}
@media only screen and (max-device-width: 480px) {
.screen-main { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-960.jpg);*/ }
}
@media only screen and (max-width: 360px) {
.screen-main { /*background-image: url(../img/bg-color-low20-400.jpg);*/ }
.bg-clr-blue { /*background-image: url(../img/bg-color-low20-400.jpg);*/ }
.main-scr-btn { display: none; }
.td-marg { padding-right: 10px; }
}
@media only screen and (max-height: 420px) {
body { font-size: 15px; }
.h-1 { font-size: 175%; margin-top: 20px; margin-bottom: 10px; }
.h-2 { font-size: 160%; margin-top: 12px; margin-bottom: 8px; }
.h-3 { font-size: 145%; margin-top: 12px; margin-bottom: 8px; }
.h-4 { font-size: 130%; margin-top: 12px; margin-bottom: 8px; }
.h-5 { font-size: 120%; margin-top: 10px; margin-bottom: 7px; }
.h-6 { font-size: 110%; margin-top: 10px; margin-bottom: 6px; }
.main-picts-wrap { max-width:400px; }
.main-scr-btn { display: none; }
.text-box-vert-padd { padding-top: 20px; padding-bottom: 20px; }
.vert-padd-h-1 { padding-top: 10px; padding-bottom: 10px; }
.padd-t-1 { padding-top: 3px; }
.padd-t-2 { padding-top: 7px; }
.padd-t-3 { padding-top: 10px; }
.padd-t-4 { padding-top: 14px; }
.padd-t-5 { padding-top: 20px; }
.logo-footer { max-width:17px; }
.logo-red-top { width:50%; max-width: 200px; }
}
