html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, big, em, font, img, small, strong, sub,  dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit;  font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
:focus { outline: 0;}
ol, ul { list-style: none;}
table { border-collapse: separate; border-spacing: 0;}
caption, th, td { text-align: left; font-weight: normal;}
strong,b{font-weight:bold}
em,i{font-style:italic}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
*, *::after, *::before {box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -webkit-box-sizing: border-box;}
/*-------------------------------------*/
html{ font-family: 'Roboto', sans-serif; font-size:16px; font-weight: 400; color: #3d3d3d; line-height: 1; background: #f5f5f5; width: 100%; }
a { color:#0089D3; text-decoration: underline;}
a:hover { color: #FE8A18; text-decoration:none;}
.clr {clear: both;}
.hidden {opacity: 0;}
.visible {opacity: 1;}
/*-------------------------------------*/
.offer {height: 100vh;}
.offer__wrapper {height: 100%; margin: auto; display: flex; flex-flow: row wrap; align-content: center; }
.offer__content {width: 50%;height: 100%; padding: 80px; display: flex; flex-flow: column nowrap; align-content: center; justify-content: center; }
.offer__title {font-weight: 700; font-size:32px; line-height:1.2; margin-bottom: 20px; color: #007cb4; text-align: center;}
.offer__subtitle {font-weight: 500;font-weight: 500; font-size:26px;line-height:1.2; margin-bottom: 30px; text-align: center;}
.offer__form {display: flex; flex-flow: column wrap; align-content: center; justify-content: center;}
.offer__input {border: 1px solid  #007cb4; height: 45px; line-height: 45px; padding: 0 40px; width:50%; display: block; margin-bottom: 20px;}
.offer__button {height:45px; width:50%; display: flex; line-height:45px; align-content: center; justify-content: center;color:#fff; font-size:15px; text-transform:uppercase; cursor: pointer; background:#007cb4; transition: .2s;}
.offer__button:hover {background:#f5821f;}
.offer__response {color: #f5821f;font-weight: 700; font-size:22px; text-align: center;}
.offer__img {width: 50%; height: 100%; background: url(bg.jpg) center center no-repeat; background-size:cover;}
.contact__form-input {width: 47%; border: 1px solid  #007cb4; height: 45px; line-height: 45px; background: url(images/phone-ico-2.png) 10px 50% no-repeat; padding: 0 40px;}
.contact__form-button { height:45px;width:47%; text-align:center;line-height:45px;color:#fff;font-size:15px; text-transform:uppercase; display:block; text-decoration:none;letter-spacing:1px; cursor: pointer;background:#007cb4;padding: 0 15px; }
.contact__form-button:hover {  background:#f5821f;color:#fff;}
.error {border:1px solid red;}

@media screen and (max-width: 1366px) {
    .offer__content {padding: 60px;}
    .offer__title {font-size:24px; }
    .offer__subtitle {font-size:22px;}
    .offer__response {font-size:20px;}
}
@media screen and (max-width: 1279px) {
    .offer__content {padding: 40px;}
    .offer__subtitle {font-size:20px;}
    .offer__input {width:100%;}
    .offer__button {width:100%;}
}
@media screen and (max-width: 1023px) {
    .offer__wrapper {position: relative;}
    .offer__img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
    .offer__content {width: 100%; position: relative; z-index: 2; margin: 50px; height: auto; padding: 40px; background: rgba(255,255,255,0.9);}
}
@media screen and (max-width: 767px) {
    .offer__content {margin: 40px; padding: 30px;}
    .offer__title {font-size:22px; }
}
@media screen and (max-width: 360px) {
    .offer__content {margin: 25px; padding: 20px;}
    .offer__title {font-size:18px; }
    .offer__subtitle {font-size:18px;}
    .offer__response {font-size:18px;}
}