@font-face { font-family: 'Roboto Slab'; src: url('fonts/RobotoSlab-Regular.eot'); src: url('fonts/RobotoSlab-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/RobotoSlab-Regular.woff') format('woff'), url('fonts/RobotoSlab-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Lobster'; src: url('fonts/lobster_[allfont.ru].eot'); src: local(''), url('fonts/lobster_[allfont.ru].woff') format('woff'), url('fonts/lobster_[allfont.ru].ttf') format('truetype'), url('fonts/lobster_[allfont.ru].svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto'; src: url('fonts/3966.eot'); src: local(''), url('fonts/3966.woff') format('woff'), url('fonts/3966.ttf') format('truetype'), url('fonts/3966.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto'; src: url('fonts/3955.eot'); src: local(''), url('fonts/3955.woff') format('woff'), url('fonts/3955.ttf') format('truetype'), url('fonts/3955.svg') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'Roboto'; src: url('fonts/3962.eot'); src: local(''), url('fonts/3962.woff') format('woff'), url('fonts/3962.ttf') format('truetype'), url('fonts/3962.svg') format('svg'); font-weight: 300; font-style: normal; } @font-face { font-family: 'Roboto'; src: url('fonts/Roboto-Medium.eot'); src: url('fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'), url('fonts/Roboto-Medium.woff') format('woff'), url('fonts/Roboto-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; } html { height: 100%; min-width: 320px;} body {position: relative; margin: 0; padding: 0px 0 0 0; height: auto !important; height: 100%; min-height: 100%; background: #fff; min-width: 320px; font-family: Arial, sans-serif;} html > body {padding: 0 0 54px;} img {padding: 0; margin: 0; border: 0;} .cleaner {clear: both;} a:hover {text-decoration: none;} a, button {transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease;} .all {position: relative; width: 1600px; margin: 0 auto;} form {padding: 0; margin: 0; border: 0;} form fieldset {padding: 0; margin: 0; border: 0;} .container {width: 1380px; margin: 0 auto; padding: 30px 0 0 0;} .header {position: relative; width: 100%; padding: 20px 0 35px;} .header .left {width: 325px; display: inline-block; vertical-align: top;} .header .left .logo {margin: 0 0 0 35px; display: table; padding-top: 10px;} .header .right {display: inline-block; vertical-align: middle; width: calc(100% - 340px); color: #4a4a4a; font-size: 28px; padding: 10px 0;} .header .right span.big {display: block; font-size: 58px;} .header .right span.right_text {text-align: right; display: block;} .header .right .buttons {width: 197px; display: inline-block; vertical-align: top;} .header .right .buttons a {display: block; width: 100%; text-align: center; color: #fff; text-decoration: none; height: 40px; line-height: 40px; border-radius: 0px; background: #1a85bf; font-size: 17px; margin: 0px 0 10px;} .header .right .text {text-align: left; line-height: 120%; padding: 0 30px 0 0; box-sizing: border-box; display: inline-block; width: calc(100% - 197px); margin: 0 -8px 0 0; vertical-align: top;} .header .right .text p {padding: 0 0 0px; margin: 0;} .header .right .text p.title {margin: -7px 0 20px; font-size: 45px; font-family: 'Roboto Slab'; color: #4a4a4a; text-transform: uppercase; line-height: 100%;} .middle {height: 575px; position: relative; width: 100%; background: url(img/middle_bg.jpg) top left no-repeat; background-position: 330px 0;} .middle .text {width: 295px; box-sizing: border-box; padding: 0 0px 0 30px;} .middle .text p {padding: 0; margin: 0; line-height: 140%;} .middle .text p.blue {line-height: 130%; font-size: 26px; color: #646464; text-transform: uppercase; padding: 0 0 15px; font-weight: bold;} .middle .text p.blue span {font-size: 18px; text-transform: none; display: block; line-height: 100%;} .middle .text p.pink {font-weight: 500; font-size: 20px; color: #ff0000; padding-bottom: 5px; text-transform: uppercase; line-height: 120%;} .middle .text p.pink span {display: block; line-height: 100%; font-size: 63px; font-weight: 300;float: left; margin: 0 10px 0 0;margin-top: -7px; } .middle .text p.pink img {margin-right: 10px; float: left; margin-top: -7px; } .middle .text p.gift img {line-height: 100%; float: left; margin: 0 9px 0 0;} .middle .text p.gift {font-size: 20px; color: #fa8912; font-family: 'Roboto Slab'; text-transform: uppercase; line-height: 135%;} .middle .text p.gift span {display: block; line-height: 90%; margin: 0 10px 0 0; float: left; font-size: 63px;} .middle a.btn {display: table; margin: 20px auto 35px; width: 165px; height: 37px; line-height: 37px; text-align: center; background: #fa8912; color: #fff; text-decoration: none; font-size: 20px; } .middle .text small {margin: 120px 0 0 0; max-width: 265px; text-align: left; font-size: 17px; color: #5e5e5e; display: block; line-height: 130%;} .middle .text small a {color: #88d5ff; text-decoration: none;} .middle .text small span {display: block; font-weight: bold;} .middle .text small b {color: #ee0000;} .middle .icons {position: absolute; right: 25px; bottom: 15px; white-space: nowrap;} .middle .icons img {margin-left: 20px;} .middle a.btn.grey { position: absolute; margin: 0; right: 25px; bottom: 75px; height: 45px; line-height: 45px; padding: 0 20px; width: auto; } .middle .text .good {text-shadow: 0 5px 10px rgba(0,0,0,0.5); letter-spacing: -1px; text-transform: none; font-size: 36px; color: #fff; position: absolute; left: 360px; bottom:15px; font-family: 'Lobster';} .footer {position: relative; width: 100%; padding: 10px 0; color: #000; box-sizing: border-box; height: 70px;} .footer .leftmenu {display: inline-block; margin: 0 0 0 315px; padding: 0; margin: 10px 0 0 330px; list-style-type:none;} .footer .leftmenu li {display: inline; margin: 0 30px 0 0;} .footer .leftmenu li a {font-size: 24px; color: #1a85bf; text-decoration:none;} .footer .right_contacts {display: inline-block; float: right; margin: 15px 25px 0 0; font-size: 18px; color: #5e5e5e;} .footer .right_contacts span {display: block; font-size: 24px; font-weight: bold;} @media screen and (min-width: 1300px) { .middle .icons {width: 700px; text-align: right;} } .popup {background: rgba(255,255,255,0.9); border: 2px solid #fa8912; padding: 30px; width: 300px; box-sizing: border-box; height: 280px;} .popup .title {text-align: center; font-size: 19px; color: #fa8912; padding: 0 0 15px; margin: 0; text-align: center; } .popup .exit {position: absolute; top: 10px; right: 10px; cursor: pointer;} .popup input.text {font-family: inherit; background: #fff; display: block; width: 100%; height: 42px; box-sizing: border-box; line-height: 40px; border: 2px solid #fa8912; border-radius: 4px; color: #999999; font-size: 17px; padding: 0 15px; margin: 0 0 20px;} .popup input.text.error {border-color: red;} .popup input.text:focus::-moz-placeholder {opacity: 0;} .popup input.text:focus::-webkit-input-placeholder {opacity: 0;} .popup button {line-height: 40px; font-size: 18px; border: 0; border-radius: 4px; display: block; width: 100%; text-align: center; cursor: pointer; font-family: inherit; color: #fff; height: 44px; background: #fa8912; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease;} .popup a.lk {display: table; margin: 40px auto 0; font-size: 14px; color: #999999; text-decoration: underline;} .popup a.lk:hover {text-decoration: none;} .popup p {text-align: center; padding: 70px 0; margin: 0;} .popup p.text {background: url(img/checked.png) top center no-repeat; height: 300px; padding-top: 10px; box-sizing: border-box; color: #666; text-align: center; font-size: 18px;} .popup p.thanks {color: #666; text-align: center; font-size: 25px; padding: 0 0 15px; margin: 0;} @media screen and (max-width: 1379px) { * {max-height: 99999999px; -webkit-appearance: none!important;} .container {width: 100%; position: relative;} } @media screen and (max-width: 1348px) { .middle .icons {left: 370px;} .middle .icons img {width: 80px; margin: 0;} .middle a.btn.grey {right: 20px;} } @media screen and (max-width: 1140px) { .middle .text .good {font-size: 28px;} } @media screen and (max-width: 1075px) { .middle {background-size: cover; background-position: top center; height: 640px;} .middle .text {background: rgba(255,255,255,0.8); height: inherit; padding-top: 30px;} .middle .text img {} .middle .text small a {color: #1a85bf;} .middle .text .pink {display: table; margin-left: auto; margin-right: auto; width: 280px; text-align: center;} .middle .text p.gift {display: table; margin-left: auto; margin-right: auto; text-align: left; width: 280px;} .middle a.btn.grey {left: 50%; margin-left: 50px; right: auto; bottom: 60px;} .middle .icons {left: 50%; margin-left: -30px;} .middle .text .good {position: relative; bottom: auto; left: auto; margin-bottom: 15px;} .footer .leftmenu {margin-left: 10px;} } @media screen and (max-width: 895px) { html>body {padding: 0;} .middle {height: 820px;} .middle {background-image: url(img/middle_bg_l.jpg);} .middle .text {width: 100%;text-align: center;} .middle .text a.btn {margin: 30px auto;} .middle .icons {left: 60px; text-align: center; bottom: 10px; white-space: normal;} .middle .icons img {margin: 0 5px 7px;} .header .right {font-size: 17px;} .header .right .text {width: auto; padding: 0;} .header .right .buttons {display: block; text-align: center; width: auto;} .header .right .buttons a {display: inline-block; vertical-align: middle; margin: 10px 7px 0px; max-width: 207px;} .middle .text small {max-width: 100%;} .middle a.btn.grey {position: relative; margin: 0 auto; top: auto; left: auto; bottom: 150px;} .middle .text .good {color: #333;} } @media screen and (max-width: 675px) { .footer .leftmenu {text-align: center; display: block; margin: 20px 0 0 0;} .footer .leftmenu li {margin: 0 10px;} .footer .right_contacts {text-align: center; display: block; float: none; padding-bottom: 20px; margin-right: 0;} .middle {height: 750px;} .middle .text {padding-left: 10px; padding-right: 10px;} .middle .text p.blue {font-size: 25px;} .middle .text p.pink {font-size: 21px;} .middle .icons {width: 100%; left: 0; right: 0; margin-left: 0;} .logo {height: 35px;} .header {padding-top: 10px;} .header .left {width: 140px; display: table; margin: 0 auto;} .header .left .logo {padding: 15px 0; margin: 0 auto;} .header .right {width: 100%; font-size: 15px; text-align: center; padding: 0 10px; box-sizing: border-box;} .header .right .text {box-sizing: border-box; text-align: center;} .header .right .text p.title {font-size: 25px; margin-top: 25px;} .header .right .buttons {width: 100%;} .popup {top: 20px!important;} .footer .soc_block {text-align: center; right: auto; width: 100%;} } #lean_overlay { position: fixed; z-index:100; top: 0px; left: 0px; height:100%; width:100%; background: #000; display: none; }