html { height: 100%; }
body { height: 100%; min-height: 100%; position: relative; margin: 0px; padding: 0px; 
font-family: 'Montserrat', sans-serif; font-size: 10pt; font-weight: 600; background-color: #e4d4bd; color: white; 
}

.fn { height: 0px; clear: both; background: none; margin: 0px; padding: 0px;}
.mc { min-width: 960px; width: 100%; max-width: 2560px; position: relative; z-index: 1; overflow: hidden; color: black; }
.cc { width: 80%; max-width: 1520px; min-width: 960px; margin: 0px auto; position: relative; z-index: 2; }
.cc.wrapped { height: 100%; }

h1 { font-size: 30pt; color: #1c205d; text-transform: uppercase; font-weight: 600; margin: 0px; padding: 0px 5px 20px 5px; line-height: 1em; }
h1 { font-weight: 800; font-size: 40pt; padding: 0px 0px 0px 5%; margin: 0px; color: #382135; }
.top h1, .why h1 { color: white; }

.nosel {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}


.mc.mm { position: fixed; z-index: 500; height: 65px; top: 0px; background-color: white; 
	-webkit-box-shadow: 0 3px 5px 0 rgba(0,0,0,0.25);
	box-shadow: 0 3px 5px 0 rgba(0,0,0,0.25);	
	}

.coverable {
	background-size: cover; background-position: center center;
	-ms-behavior: url(css/backgroundsize.min.htc);
}
.clickable { cursor: pointer; }

.animated, .mainmenu.shown {
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
}
.quickly {
	transition: all 0.1s;
	-webkit-transition: all 0.1s;
}

.boxed { box-sizing: border-box; border: 2px solid white; background: url(../img/shd.png) bottom right white no-repeat; position: relative; 
	-webkit-box-shadow: 0 10px 10px 0 rgba(56,33,53,0.35);
	box-shadow: 0 10px 10px 0 rgba(56,33,53,0.35);
}
.boxed.mouse-down {
	-webkit-box-shadow: 0 0px 10px 0 rgba(56,33,53,0.35);
	box-shadow: 0 0px 10px 0 rgba(56,33,53,0.35);	
}

.consulting, .callme {
	-webkit-border-radius: 10px 0 10px 0;
	border-radius: 10px 0 10px 0;
	background: #3a0808;
	background: -moz-linear-gradient(left, #3a0808 0%, #f13232 50%, #f85151 100%);
	background: -webkit-linear-gradient(left, #3a0808 0%,#f13232 50%,#f85151 100%);
	background: linear-gradient(to right, #3a0808 0%,#f13232 50%,#f85151 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a0808', endColorstr='#f85151',GradientType=1 );		
}

.boxed .topline { position: absolute; top: 0px; left: 0px; width: 100%; height: 12px; }
.topline.c1 { background-color: #5a3754; }
.topline.c2 { background-color: #896c6f; }
.topline.c3 { background-color: #bf8d71; }
.topline.c4 { background-color: #e1bc94; }
.topline.c5 { background-color: #eddcbc; }
.boxed .topline .stripes { position: absolute; top: 0px; left: 0px; width: 100%; height: 12px; background: url(../img/dvdr.png) top center repeat-x; opacity: 0.35;  }

.bg { width: 100%; height: 100vh; min-height: 800px; min-width: 960px; position: fixed; top: 0px; left: 50%; margin-left: -50%; z-index: 0; overflow: hidden; }
.containers { background-position: 0px 0px; background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0px; left: 0px; width: 3740px; height: 1620px; opacity: 0; }
.containers.loaded { background-image: url(../img/bg.jpg); opacity: 1; }

.mapped { height: 70vh; }
#map { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 1; }
.dvdr { height: 12px; background: url(../img/dvdr.png) top center repeat-x; }

.top { height: 80vh; min-height: 600px; position: relative; z-index: 5; }
.frame-holder { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.slide { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; }
.slide .cc { height: 100%; z-index: 5; }
.msg1, .msg2, .msg3 { position: absolute; left: 15%; } 
.msg1 { top: 20%; color: #e4d4bd; font-size: 16pt; }
.msg2 { top: 40%; }
.msg3 { top: 53%; font-size: 22pt; font-weight: 800; color: #382135; }
.msg2 h1 { font-size: 50pt; white-space: nowrap; padding-left: 0%; }
.msg1.hidden, .msg2.hidden, .msg3.hidden { left: -100%; }
.slide .shadowed { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; opacity: 0; z-index: 0;
	background: -moz-linear-gradient(top, rgba(56,33,53,1) 0%, rgba(56,33,53,0.75) 78%, rgba(56,33,53,0) 99%, rgba(56,33,53,0) 100%);
	background: -webkit-linear-gradient(top, rgba(56,33,53,1) 0%,rgba(56,33,53,0.75) 78%,rgba(56,33,53,0) 99%,rgba(56,33,53,0) 100%);
	background: linear-gradient(to bottom, rgba(56,33,53,1) 0%,rgba(56,33,53,0.75) 78%,rgba(56,33,53,0) 99%,rgba(56,33,53,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#382135', endColorstr='#00382135',GradientType=0 );	
}
#frm1 .consulting { display: inline-block; width: auto; font-size: 18pt; top: 72%; height: auto; bottom: auto; left: 10%; margin-left: 0px; border: none; }
#frm1 .consulting.hidden { left: -100%; }
#frm2 { left: 100%; }
#frm3, #frm4 { left: 200%; }
#frm1.hidden { left: -100%; }
#frm2.shown { left: 0; }
#frm2.hidden, #frm3.hidden { left: -100%; }
#frm3 .shadowed, #frm4 .shadowed { opacity: 1; }
#frm3 .message, #frm4 .message { position: absolute; top: 30%; left: 0px; width: 100%; text-align: center; font-size: 20pt; color: #e4d4bd; }
#frm3 .close, #frm4 .close { position: relative; margin: 0px auto; width: 30px; margin-top: 20px; top: 0px; }
#frm3.shown, #frm4.shown { left: 0; }
.slide.shown .shadowed { opacity: 1; }
#frm2 .sub-message { font-size: 20pt; color: #e4d4bd; top: 35%; position: absolute; left: 10%; }
#frm2 .large { color: white; font-weight: 800; font-size: 40pt; }
#frm2 .close .icon { width: 30px; height: 30px; }
#frm2 .callme { margin-left: -50px; }
#frm2 .callme.disabled { background: #533845; color: #808080; }

.agreement { background-color: white; }
.agreement .cc { width: 960px; padding: 100px; }
.agreement h1 { padding-left: 0px; padding-bottom: 0.5em; }
.mt200 { height: 200px; }

.form-holder { position: absolute; left: 50%; width: 450px; top: 30%;  }
.form-holder .row { position: relative; padding: 30px 0px 25px 0px; height: 20px; margin-bottom: 5px; }
.form-holder input, .form-holder textarea { width: 100%; box-sizing: border-box; color: white; background-color: transparent; padding: 10px 20px; font-family: 'Montserrat', sefif; font-size: 12pt; border: 1px solid #e4d4bd; }
.form-holder textarea { resize: none; height: 80px; }
.form-holder .fld { position: absolute; top: 30px; left: 0px; width: 100%; height: 100%; z-index: 5; }
.form-holder .lbl { position: absolute; top: 0px; left: 0px; font-size: 8pt; padding: 10px 15px; color: white; z-index: 3; text-transform: uppercase; }
/*.row.empty .lbl { color: white; font-size: 8pt; top: 0px; }*/
.row.wrong .lbl { color: #ee1c24; }
.row.wrong input { border-color: #ee1c24; }
.close { position: absolute; top: -30px; right: 0px; margin-right: -60px; }
.close .icon { width: 30px; height: 30px; }
.close .icon.hov { cursor: pointer; }
.mt50 { margin-top: 60px; }
.row .checkbox { width: 25px; height: 25px; border: 1px solid #e4d4bd; position: absolute; top: 0px; cursor: pointer; padding: 3px; box-sizing: border-box; }
.row .checklbl { position: absolute; left: 40px; top: 7px; color: white; text-transform: uppercase; cursor: pointer; font-size: 8pt; }
.lnk a { color: #c0c0c0; text-transform: none; }
.lnk a:hover { color: white; }

.enabled-checkbox path, .enabled-checkbox polyline {
  animation: draw 0.3s cubic-bezier(0.42,0,0.58,1);
  animation: draw 0.3s cubic-bezier(0.42,0,0.58,1);
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
}
.checkbox polyline { stroke: transparent; fill: none; }
.checkbox.enabled-checkbox polyline { stroke: white; }

@keyframes draw {
  to {
    stroke-dashoffset: 0px;
	fill-opacity: 1;
  }
}

.mainmenu { position: absolute; top: 0px; left: 0px; width: 100%; z-index: 20; }
.mainmenu .logo { padding: 30px 0px 0px 5%; float: left; box-sizing: border-box; }
.mainmenu .items { position: absolute; box-sizing: border-box; width: 50%; left: 35%; }
.mainmenu .phone { float: right; font-size: 18pt; color: white; box-sizing: border-box; padding-top: 45px; padding-right: 5%; }
.mainmenu.prepared { position: fixed; top: -125px;  /*height: 100px;*/ }
.mainmenu.shown { top: 0px; background-color: rgba(56,33,53,0.9); }
.mi { float: left; color: #e4d4bd; font-size: 12pt; box-sizing: border-box; text-transform: uppercase; padding: 53px 5% 40px 5%; cursor: pointer; position: relative; }
.mi .line { width: 100%; height: 0px; background-color: #e4d4bd; position: absolute; top: 0px; left: 0px; }
.mi.hov, .mi.sel { color: white; }
.mi.sel { cursor: default; }
.mi.hov .line, .mi.sel .line { height: 5px; }
.mi.sel .line { background-color: white; }
.prepared .logo { padding-top: 20px; padding-bottom: 20px; }
.prepared .mi { padding-top: 40px; padding-bottom: 20px; }
.prepared .phone { padding-top: 32px; }


.cols { position: relative; box-sizing: border-box; }
.col50 { width: 50%; float: left; box-sizing: border-box; }
.col33 { width: 33%; float: left; box-sizing: border-box; }
.col33:first-child { width: 34%; }

.address-box { width: 570px; height: 300px; position: absolute; top: 50%; margin-top: -150px; left: 13%; z-index: 5; }
.address-box .cntr { padding: 40px; font-size: 11pt; line-height: 1.5em; }
.address-box .phone { font-size: 18pt; line-height: 1.3em; }
.address-box a { color: #c58e5f; }
.address-box a:hover { color: #e7ac79; }
.address-box .col50 { padding-left: 20px; }
.address-box .col50:first-child { padding-left: 0px; }
.address-box .logo { padding-bottom: 30px; }
.address-box .logo img { display: block; }
.consulting, .callme { border: none; color: #e4d4bd; padding: 20px 50px; text-transform: uppercase; font-size: 12pt; white-space: nowrap;
	position: absolute; bottom: 0px; margin-bottom: -20px; left: 50%; text-align: center; width: 400px; margin-left: -200px; background-size: 200% 200%;}
.consulting.hov, .callme.hov { color: white; background-position: 100% 50%; }
.callme { width: auto; display: inline-block; }
#frm2 .callme { bottom: auto; margin-bottom: auto; position: relative; top: 0px; left: 0px; }
.address-box.hooded { left: -600px; }
.close { padding: 10px; z-index: 100; }
.close.hov { background-color: red; cursor: pointer; }


#frm3 h1 { margin-left: 0px; padding-left: 0px; }

.section { padding: 100px 0px; }
.partners .boxes { width: 100%; height: 300px; position: relative; padding-top: 50px; }
.partners .box3 { width: 25%; min-width: 250px; max-width: 400px; height: 280px; position: absolute; right: 0px; line-height: 1.5em; }
.partners .boxed .cntr { padding: 40px; font-size: 12pt; text-transform: uppercase; }
.partners a { color: black; text-decoration: none; }
.partners a:hover { color: #e7ac79; text-decoration: underline; }
.partners .logo img { display: block; }
.partners .logo { margin-bottom: 10px; }
.partners .mtpp { margin-right: 61%; }
.partners .ank { margin-right: 33%; }
.partners .ltpp { margin-right: 5%; }
.partners .mtpp.hooded { right: 150%; }
.mtpp .logo { margin-left: -15px; }
.ank .logo { margin-left: -20px; }
.ltpp .logo { margin-left: -20px; }
.partners .ank.hooded { right: 150%; }
.partners .ltpp.hooded { right: 150%; }

.points .boxes { width: 100%; height: 260px; position: relative; padding-top: 50px; }
.points .box3 { width: 25%; min-width: 250px; max-width: 400px; height: 240px; position: absolute; left: 0px; line-height: 1.5em; }
.points .boxed .cntr { text-transform: none; font-size: 11pt; padding: 50px 40px 40px 40px; }
.points #pnt1 { margin-left: 5%; }
.points #pnt2 { margin-left: 33%; }
.points #pnt3 { margin-left: 61%; }
.points #pnt1.hooded, .points #pnt2.hooded, .points #pnt3.hooded { left: 150%; }
.points h1 { color: white; text-align: right; font-size: 26pt; margin-right: 5%; }


.services, .aboutus { background-color: white; }

.aboutus { font-size: 11pt; line-height: 1.5em; }
.aboutus .cols { padding: 40px 0px 0px 0px; }
.aboutus .col50 { padding: 0px 60px; }
.aboutus .cols .col50:first-child { padding-left: 8%; }
.aboutus .crane { position: absolute; width: 87px; height: 168px; background: url(../img/crane.png) 0px 0px no-repeat; top: 0px; left: 50%; margin-left: 150px; z-index: 5; }
.crane.hooded { left: 100%; }

.howwework h1, .wwhywork h1 { color: white; }

.whywork .boxes, .howwework .boxes { height: 500px; margin-left: 5%; position: relative; }
.howwework .boxes { margin-left: 0; margin-right: 5%; margin-top: -150px; }
.whywork .box3, .howwework .box3 { width: 240px; height: 240px; font-size: 13pt; line-height: 1.4em; position: absolute; }
.whywork .box3 .cntr, .howwework .box3 .cntr { padding: 55px 50px 50px 50px; }
.whywork h1 { text-align: right; width: 50%; padding-left: 45%; margin-top: 40px; }
.whywork .boxes { margin-top: -150px; }
#professional { position: absolute; left: 15%; font-size: 20pt; top: 325px; font-weight: 800; }
#professional.hooded { left: 150%; }
#why1 { left: 0px; top: 0px; }
#why2 { left: 260px; top: 0px; }
#why3 { left: 0px; top: 260px; }
#why4 { left: 260px; top: 260px; }
#why5 { left: 520px; top: 260px; }
#how1 { right: 520px; top: 0px; }
#how2 { right: 260px; top: 0px; }
#how3 { right: 0px; top: 0px; }
#how4 { right: 260px; top: 260px; }
#how5 { right: 0px; top: 260px; text-transform: uppercase; text-align: right; }
#how5 .cntr { position: absolute; bottom: 0px; right: 0px; }
#why1.hooded, #why2.hooded, #why3.hooded, #why4.hooded, #why5.hooded  { left: 150%; }
#how1.hooded, #how2.hooded, #how3.hooded, #how4.hooded, #how5.hooded  { right: 150%; }
#why1.hov, #how1.hov { background-color: #5a3754; color: white; }
#why2.hov, #how2.hov { background-color: #896c6f; color: white; }
#why3.hov, #how3.hov { background-color: #bf8d71; color: white; }
#why4.hov, #how4.hov { background-color: #e1bc94; }
#why5.hov, #how5.hov { background-color: #f2e0bc; }

@media only screen and (max-width: 1720px) {
.points .boxes { height: 280px; }
.points .box3 { height: 260px; }
.mainmenu .cc { width: 95%; }
}

@media only screen and (max-width: 1600px) {
.points .boxes { height: 300px; }
.points .box3 { height: 280px; }

.howwework h1, .whywork h1 { font-size: 34pt; }
.howwework .boxes, .whywork .boxes { margin-top: -125px; }
}

@media only screen and (max-width: 1500px) {
.points .boxed .cntr { font-size: 10pt; }

.howwework .box3, .whywork .box3 { width: 220px; height: 220px; font-size: 12pt; }
.howwework .box3 .cntr, .whywork .box3 .cntr { padding: 55px 40px 40px 40px; }
#how1 { right: 480px; top: 0px; }
#how2 { right: 240px; top: 0px; }
#how3 { right: 0px; top: 0px; }
#how4 { right: 240px; top: 240px; }
#how5 { right: 0px; top: 240px; }
#why1 { left: 0px; top: 0px; }
#why2 { left: 240px; top: 0px; }
#why3 { left: 0px; top: 240px; }
#why4 { left: 240px; top: 240px; }
#why5 { left: 480px; top: 240px; }
.howwework h1, .whywork h1 { font-size: 32pt; }
.howwework .boxes, .whywork .boxes { margin-top: -105px; }
.howwework .boxes, .whywork .boxes { height: 460px; }
#professional { font-size: 18pt; top: 320px; }
.mainmenu .cc { width: 100%; }
}

@media only screen and (max-width: 1400px) {
.points .boxed .cntr { font-size: 10pt; }

.howwework .box3, .whywork .box3 { width: 200px; height: 200px; font-size: 12pt; }
.howwework .box3 .cntr, .whywork .box3 .cntr { padding: 45px 30px 30px 30px; }
#how1 { right: 440px; top: 0px; }
#how2 { right: 220px; top: 0px; }
#how3 { right: 0px; top: 0px; }
#how4 { right: 220px; top: 220px; }
#how5 { right: 0px; top: 220px; }
#why1 { left: 0px; top: 0px; }
#why2 { left: 220px; top: 0px; }
#why3 { left: 0px; top: 220px; }
#why4 { left: 220px; top: 220px; }
#why5 { left: 440px; top: 220px; }
.howwework h1, .whywork h1 { font-size: 28pt; }
.howwework .boxes, .whywork .boxes { margin-top: -105px; }
.howwework .boxes, .whywork .boxes { height: 420px; }
#professional { font-size: 16pt; top: 280px; }
.mi { padding-left: 3.5%; padding-right: 3.5%; }
}

@media only screen and (max-width: 1260px) {
.howwework .box3, .whywork .box3 { width: 180px; height: 180px; font-size: 11pt; }
.howwework .box3 .cntr, .whywork .box3 .cntr { padding: 45px 30px 30px 30px; }
#how1 { right: 380px; top: 0px; }
#how2 { right: 190px; top: 0px; }
#how3 { right: 0px; top: 0px; }
#how4 { right: 190px; top: 190px; }
#how5 { right: 0px; top: 190px; }
#why1 { left: 0px; top: 0px; }
#why2 { left: 190px; top: 0px; }
#why3 { left: 0px; top: 190px; }
#why4 { left: 190px; top: 190px; }
#why5 { left: 380px; top: 190px; }
.howwework h1, .whywork h1 { font-size: 26pt; }
/*.howwework .boxes, .whywork .boxes { margin-top: -105px; }*/
.howwework .boxes, .whywork .boxes { height: 370px; }
#professional { font-size: 16pt; top: 250px; }
.containers { width: 3100px; }

.mainmenu .cc { width: 100%; }
.mi { padding-left: 4%; padding-right: 4%; font-size: 11pt; }
.mainmenu .phone { font-size: 15pt; padding-top: 48px; }
.prepared .phone { padding-top: 35px; }
}

@media only screen and (max-width: 1160px) {
.mainmenu .phone { padding-right: 3%; }
.mainmenu .logo { padding-left: 3%; }
}

@media only screen and (max-width: 1060px) {
.mi { padding-left: 15px; padding-right: 15px; }
.mainmenu .phone { font-size: 14pt; }
.form-holder .close { margin-right: 0px; top: -30px; }
}

.services ul { padding: 0px; margin: 0px; list-style-type: none; position: relative; }
.services li { position: relative; line-height: 1.3em; padding: 0.5em 50px 1em 50px; font-size: 15pt; }
.services li .icon { display: block; position: absolute; left: 0px; top: 0.4em; width: 25px; height: 25px; }
.services li .icon svg { fill: #e99a60; width: 25px; height: 25px; }
.services li.hov .icon svg { fill: #5a3754; }
.services .cols { padding: 40px 0px 80px 5%; }
.services .consulting { margin-bottom: -20px; font-size: 16pt; }


.spinner { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 300; display: block; background-color: red; 
	-webkit-border-radius: 10px 0 10px 0;
	border-radius: 10px 0 10px 0;
}
.spinner .icon { width: 24px; height: 24px; position: absolute; top: 50%; left: 50%; margin-left: -12px; margin-top: -12px; }
.spinner .icon svg { width: 100%; height: 100%; }
.spinner .icon svg { fill: #e4d4bd; }
.spinner.visible .icon {
	-webkit-animation: load8 1.1s infinite linear;
	animation: load8 1.1s infinite linear;		
}

@-webkit-keyframes load8 {
  0% {
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-moz-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
	-moz-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
  }
  100% {
	-moz-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
  }

}