#grid-button { display: none; position: fixed; top: 10px; left: 10px; border: solid 1px #777; background-color: white; z-index: 999999; padding: 10px; color: #777; cursor: pointer; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; filter: alpha(opacity=20); -moz-opacity: 0.2; -khtml-opacity: 0.2; opacity: 0.2; } #grid-button:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } #test-cnt { width: 960px; margin: 0 auto; } #test-cols { display: block; display: none; width: 960px; margin-left: auto; margin-right: auto; height: 1px; margin-top: -1px; margin-left: 0px; position: relative; z-index: 99999; } .test-cols-cnt { position: absolute; left: 0px; top: 1px; height: 100%; z-index: 99999; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3; pointer-events: none; } .col-test { width: 64px; height: 500px; background-color: #3498db; margin-left: 8px; margin-right: 8px; display: inline-block; z-index: 99999; pointer-events: none; } #grid { pointer-events: none; display: block; display: none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 9999999; } #grid .grid-center { margin: 0 auto; display: block; width: 960px; height: 100%; background-color: #ccc; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3; } #grid .col { display: inline-block; width: 64px; margin: 0 8px; height: 100%; background-color: black; } img { vertical-align: top; } a img { border: none; } * { font-synthesis: none; -moz-font-feature-settings: 'kern'; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } html *, body * { font-family: 'Rubik', Rubik, sans-serif; } html, body { width: 100%; height: 100%; margin: 0; padding: 0; position: relative; font-weight: 300; } html { } body { margin: 0; padding: 0 0 0 0; border: 0; outline: 0; -webkit-appearance: none; position: relative; font-size: 14px; min-width: 960px; } #body { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; width: 100%; min-height: 100%; display: block; position: relative; padding: 0px 0 280px 0; } .relative { position: relative; } .block { display: block; } .center { text-align: center; } .right { text-align: right; } .center-cnt { margin: 0 auto; display: block; max-width: 944px; width: 944px; padding: 0; } .center-cnt.nopadding { padding: 0; } .languages-block { display: block; position: absolute; top: 7px; left: 420px; } .languages-block.en { position: absolute; top: 7px; left: 0px; top: 7px; left: 420px; } .languages-block .ico { display: inline-block; margin: 0 12px 0 0; vertical-align: middle; } .languages-block .lang { display: inline-block; margin: 0 16px 0 0; vertical-align: middle; } .languages-block .lang .current { color: #1E3D4E; font-size: 14px; font-weight: 500; line-height: 19px; } .languages-block a.lang { color: white; font-size: 14px; font-weight: 500; line-height: 19px; text-decoration: none; } .languages-block a.lang:hover { text-decoration: underline; } #header { display: block; background-color: #5FB9E6; height: 130px; } #header .logo { display: inline-block; position: absolute; top: 43px; left: 10px; top: 32px; left: 10px; width: 253px; height: 64px; } #header .logo img { width: 253px; height: 64px; } #header .phones { display: inline-block; position: absolute; top: 63px; top: 52px; left: 380px; } #header .phones span.phone { display: inline-block; padding-left: 35px; padding-left: 45px; position: relative; } #header .phones .numbers { text-decoration: none; color: #182E3D; font-size: 14px; font-weight: 500; line-height: 19px; cursor: text; display: inline-block; vertical-align: middle; margin: 0 20px 0 0; } #header .phones .numbers .phone { display: block; } #header .phones .numbers .phone.email { font-weight: 300; cursor: pointer; } #header .phones .numbers .phone.email a { } #header .phones .numbers .phone.email a:hover { text-decoration: underline; cursor: pointer; } #header .phones span.numbers:before { content: ''; position: absolute; width: 24px; height: 24px; top: 0px; left: 0px; background-position: 0 0; background-repeat: no-repeat; background-image: url('/images/template/icons/phone.svg'); display: none; } #header .phones .button { vertical-align: middle; display: inline-block; border: solid 2px white; color: white; padding: 6px 20px 6px 20px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; font-size: 14px; font-weight: 500; line-height: 19px; background-color: #5FB9E6; cursor: pointer; margin: -3px 0 0 0; } #header .phones .button.en { margin: 3px 0 0 180px; margin: -3px 0 0 230px; } #header .phones .button:hover { background-color: #4c94b8; } #header .phones .button:active, header .phones .button:active:hover { padding: 8px 20px 4px 20px; background-color: #2f5c72; } @media only screen and (max-width: 1199px) { #header .phones { left: 265px; left: 255px; } #header .phones span.numbers:before { display: none; } #header .phones .button, #header .phones .button:active, header .phones .button:active:hover { padding-left: 15px; padding-right: 15px; } .languages-block { display: block; position: absolute; top: 9px; left: 360px; } .languages-block.en { position: absolute; top: 7px; left: 333px; } #header .phones .button.en { margin: 3px 0 0 180px; margin: -3px 0 0 180px; } } #header .emplems { display: inline-block; position: absolute; top: 44px; top: 33px; right: 14px; } #header .emplems .item { display: inline-block; width: 64px; height: 64px; position: relative; } #header .emplems .item:nth-child(1) { margin-left: 0px; } #header .emplems .item:nth-child(2) { margin-left: -5px; } #header .emplems .item:nth-child(3) { margin-left: -5px; } #header .emplems .item:nth-child(4) { margin-left: -5px; } #header .emplems .item img { width: 100%; } .top-menu { display: block; background-color: white; } .top-menu .logo { display: none; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } .top-menu .level1 { display: inline-block; text-align: left; text-align: center; white-space: nowrap; margin-left: 0px; } .top-menu .level2 { display: block; white-space: nowrap; } .top-menu .level2 .item:first-child { margin-left: 145px; } @media only screen and (max-width: 1199px) { .top-menu .level2 .item:first-child { margin-left: 0px; } } .top-menu.scrolled .logo { display: block; position: absolute; left: 12px; top: 0px; zoom: 1; display: inline-block; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; animation: logofadein 0.5s 1 ease-in; } @keyframes logofadein { from { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } to { filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } } .top-menu.scrolled { display: block; background-color: white; position: fixed; top: 0; left: 0; width: 100%; z-index: 99; background-color: white; -webkit-box-shadow:	0px 0px 15px rgba(0,0,0,0.5); -moz-box-shadow:	0px 0px 15px rgba(0,0,0,0.5); box-shadow: 0px 0px 15px rgba(0,0,0,0.5); } .top-menu .logo span.t { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; background-color: #5FB9E6; display: block; line-height: 44px; width: 54px; padding-top: 10px; } .top-menu .logo span.t:hover { background-color: #4da9df; } .top-menu.scrolled .logo img { height: 30px; } .top-menu .level1 .item { font-size: 16px; font-weight: 500; line-height: 24px; text-align: center; } .top-menu .level2 .item { font-size: 16px; font-weight: 300; line-height: 14px; text-align: center; } .top-menu .level2 .item.current { } .top-menu nav { text-align: center; } .top-menu a.item, .top-menu span.item { color: #182E3D; text-decoration: none; padding: 0 25px; display: inline-block; } .top-menu span.item { } .top-menu a.item span.t { display: inline-block; padding: 15px 0 15px 0; } .top-menu a.item:hover { background-color: #dde2e2; } .top-menu span.item.current span.t, .top-menu span.item.current:hover span.t { display: inline-block; padding: 15px 0 11px 0; border-bottom: solid 4px #ffe000; } .top-menu a.item.l2.current:hover { background-color: white; } .top-menu a.item.l2.current span.t, .top-menu a.item.l2.current:hover span.t { display: inline-block; padding: 15px 0 11px 0; border-bottom: solid 4px #ffe000; } .top-menu .level2 span.item.current span.t, .top-menu .level2 span.item.current:hover span.t { } .top-menu .level2 .dl { display: inline-block; vertical-align: bottom; background-color: #5FB9E6; line-height: 27px; color: white; text-decoration: none; padding: 2px 20px 2px 20px; margin: 0 0 6px 20px; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; font-weight: 500; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .top-menu .level2 .dl:hover { background-color: #4c94b8; } .top-menu .level2 .dl:active, .top-menu .level2 .dl:active:hover { padding: 4px 20px 0px 20px; background-color: #2f5c72; } #footer { display: block; background-color: #5FB9E6; min-height: 280px; position: absolute; bottom: 0px; left: 0px; width: auto; min-width: 100%; } #footer .line { display: block; } #footer .logo { display: inline-block; position: absolute; top: 43px; top: 20px; left: 10px; width: 253px; height: 64px; } #footer .logo img { width: 253px; height: 64px; } #footer .slogan { position: absolute; top: 55px; left: 298px; display: inline-block; color: white; border-left: solid 2px white; padding: 4px 0 4px 20px; font-size: 14px; font-weight: 500; line-height: 19px; text-transform: uppercase; } #footer .btm-menu { display: block; margin: 24px 0 0 371px; } #footer .section.l2 .btm-menu { display: block; margin: -37px 0 0 371px; } #footer .btm-menu .level1 { display: inline-block; text-align: left; white-space: nowrap; } #footer .btm-menu .level2 { display: block; white-space: nowrap; } #footer .btm-menu .logo span.t { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; display: block; line-height: 44px; width: 54px; padding-top: 10px; } #footer .btm-menu .logo span.t:hover { background-color: #4da9df; } #footer .btm-menu .level1 .item { font-size: 16px; font-weight: 500; line-height: 14px; text-align: center; } #footer .btm-menu .level2 .item { font-size: 16px; font-weight: 300; line-height: 14px; text-align: center; } #footer .btm-menu .level2 .item.current { } #footer .btm-menu nav { text-align: center; } #footer .btm-menu a.item, #footer .btm-menu span.item { color: white; text-decoration: none; padding: 0 25px; display: inline-block; } @media all and (max-width: 1370px) { #footer .btm-menu a.item, #footer .btm-menu .level1 span.item, #footer .btm-menu .level2 span.item { padding: 0 10px; } } #footer .btm-menu span.item { } #footer .btm-menu a.item span.t { display: inline-block; padding: 15px 0 15px 0; } #footer .btm-menu a.item:hover { background-color: #4c94b8; } #footer .btm-menu span.item.current span.t, #footer .btm-menu span.item.current:hover span.t { display: inline-block; padding: 15px 0 11px 0; border-bottom: solid 4px #ffe000; } #footer .btm-menu a.item.l2.current:hover { } #footer .btm-menu a.item.l2.current span.t, #footer .btm-menu a.item.l2.current:hover span.t { display: inline-block; padding: 15px 0 11px 0; border-bottom: solid 4px #ffe000; } #footer .btm2 { display: block; padding: 20px 0 0px 25px; color: #182E3D; } #footer .btm2 .address1 { display: inline-block; vertical-align: top; width: 60%; font-size: 14px; line-height: 19px; } #footer .btm2 .address2 { display: inline-block; vertical-align: top; width: 40%; padding-left: 40px; font-size: 14px; line-height: 19px; } #footer .btm2 .l1 { display: block; margin: 0 0 10px 0; } #footer .btm2 .l2 { display: block; margin: 0 0 20px 0; } #footer .btm2 .l3 { display: block; margin: 0 0 20px 0; } @media only screen and (max-width: 1199px) { #footer .btm-menu { margin: 24px 0 0 30%; } #footer .btm2 { padding-left: 10px; } } #footer .address { color: #182E3D; position: absolute; top: 58px; right: 10px; font-size: 14px; font-weight: 300; line-height: 19px; } #footer .address a { color: #182E3D; text-decoration: none; } #footer .address a:hover { color: #182E3D; text-decoration: underline; } #footer .address a.phone, #footer .address a.phone:hover { cursor: text; color: #182E3D; text-decoration: none; } table.bg { width: 100%; min-height: 100%; height: 100%; border-collapse: collapse; z-index: 888; position: fixed; top: 0; left: 0; display: none; } table.bg td { width: 100%; height: 100%; vertical-align: middle; text-align: center; background-color: rgba(30, 61, 78, 0.95); } table.bg td .close-bg { display: block; width: 100%; height: 100%; position: fixed; z-index: 1; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.9); } table.bg .popup { display: inline-block; width: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; z-index: 14; position: relative; pointer-events: auto; padding: 0; position: relative; } table.bg .popup .part1 { background-color: #5FB9E6; padding: 20px 20px 20px 20px; -moz-border-radius: 4px 4px 0px 0px; -webkit-border-radius:	4px 4px 0px 0px; -khtml-border-radius:	4px 4px 0px 0px; border-radius: 4px 4px 0px 0px; } table.bg .popup .part2 { background-color: white; padding: 20px 20px; -moz-border-radius: 0px 0px 4px 4px; -webkit-border-radius:	0px 0px 4px 4px; -khtml-border-radius:	0px 0px 4px 4px; border-radius: 0px 0px 4px 4px; } #order-sertif.popup { width: 500px; } .hidden { display: none; } table.bg .popup input[type="text"] { padding-top: 2px; padding-bottom:	2px; } table.bg .popup .close { height: 1.5vw; width: 1.5vw; position: absolute; text-align: center; vertical-align: middle; right: 1vw; top: 1vw; font-size: 2vw; line-height: 1.5vw; color: rgba(255,255,255,0.5); } table.bg .popup .close:hover { cursor: pointer; color: white; } table.bg .popup .field-block { text-align: left; } table.bg .popup .field-block.submit { padding: 0; margin: 0; } #order-call .formcnt { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; background-color: white; padding: 30px; width: 552px; -webkit-box-shadow:	0px 10px 40px rgba(0,0,0,0.5); -moz-box-shadow:	0px 10px 40px rgba(0,0,0,0.5); box-shadow: 0px 10px 40px rgba(0,0,0,0.5); } #order-call .formcnt .lc { display: inline-block; vertical-align: top; width: 122px; margin-right: 30px; } #order-call .formcnt .rc { display: inline-block; vertical-align: top; width: 320px; } #order-call .formcnt .rc .field-block { display: block; padding-right: 56px; } #order-call input { padding-top: 4px; padding-bottom: 4px; } #order-call .field-block.submit { text-align: right; } #order-call .button.blue { padding-left: 30px; padding-right: 30px; } #order-call .button.blue.finish { padding-left: 30px; padding-right: 30px; } #query .formcnt { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; background-color: white; padding: 30px; width: 552px; -webkit-box-shadow:	0px 10px 40px rgba(0,0,0,0.5); -moz-box-shadow:	0px 10px 40px rgba(0,0,0,0.5); box-shadow: 0px 10px 40px rgba(0,0,0,0.5); } #query .formcnt .lc { display: inline-block; vertical-align: top; width: 122px; margin-right: 30px; } #query .formcnt .rc { display: inline-block; vertical-align: top; width: 320px; } #query .formcnt .rc .field-block { display: block; padding-right: 56px; } #query input { padding-top: 4px; padding-bottom: 4px; } #query .field-block.submit { text-align: right; } #query .button.blue { padding-left: 30px; padding-right: 30px; } table.bg .popup h2 { color: #1E3D4E; font-size: 24px; font-weight: 500; line-height: 32px; text-align: left; } table.bg .popup h2 .line.small { color: #1E3D4E; font-size: 16px; font-weight: 300; line-height: 24px; } table.bg .standart-form .error-text .cnt, table.bg .standart-form .success-text .cnt, table.bg .standart-form .standart-text .cnt { padding: 0; margin: 0; } table.bg .popup .field-block.submit, table.bg .popup .left { text-align: left; } table.bg .popup .right { text-align: right; } table.bg .popup h2 .line { margin-bottom: 0.5em; } table.bg .popup h2 .line.small { font-size: 16px; line-height: 1.2em; margin-bottom: 0em; } table.bg .popup p { font-size: 16px; margin: 0 0 1em 0; text-align: left; }