/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* sampled usage */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/stats/Roboto/normal/500);
  unicode-range: U+20;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@import "https://fonts.googleapis.com/css?family=Roboto:400,500,700";
*{
  margin:0;
  padding:0;
  -webkit-box-sizing:border-box;
  box-sizing:border-box}
:focus{
  outline:0}
img{
  border:none;
  display:inline-block;
  max-width:100%}
ol,ul{
  list-style:none}
a{
  text-decoration:none;
  cursor:pointer !important}
iframe{
  position:absolute !important;
  border:none !important;
  width:0 !important;
  height:0 !important}
html{
  font-size:62.5%;
  -webkit-text-size-adjust:100%;
  position:relative;
  height:100%}
body{
  font-family:Roboto, Arial, sans-serif;
  color:#000;
  line-height:1.4;
  font-size:1.6rem;
  background: #0000006b;
  min-width:320px;
  height:100%;
  background: linear-gradient(to bottom, #626262 15%, transparent);
}
.header{
  font-size:3rem;
  text-align:center;
  padding:1.5rem;
  color:#fff;
  font-weight:700;
  background-color:#e65100}
.container-section{
  padding:3rem 0 0}
.popup-block{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  right:0;
  background-color:rgba(0, 0, 0, 0.8);
  z-index:200;
  display:none;
  justify-content:center;
  align-items:center}
.popup-block.visible{
  display:flex}
.popup-content{
  text-align:center;
  background-color:#ffffffa8;
  border-radius:1rem;
  padding:2rem;
  color:#1a1d1e;
  font-size:2rem;
  width:90%;
  max-width:360px;
  line-height:1.4;
  background: linear-gradient(to bottom, #ffffffbd, #fff);
}
.popup-slogan{
  color:#000;
  font-size:3.6rem;
  font-weight:700;
}
.popup-img{
  border-radius:0.5rem;
  margin:1rem 0 2rem;
  max-width:230px}
.popup-buttons-block{
  text-align:center;
  left:0;
  top:100%;
  width:100%;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between}
.popup-btn{
  width:47%;
  cursor:pointer;
  transition:all 0.3s linear;
  font-size:2rem;
  color:#000;
  padding:1.2rem 1rem;
  text-transform:uppercase;
  border-radius:0.5rem;
  font-weight:700;
  border: 1px solid #000000c2;
}
.popup-btn:hover{
  background-color:#ff4141}
.popup-btn:active{
  background-color:#274f17}
.popup-no-btn{
  background-color:#dddddd;
  color:#1a1d1e}
.popup-no-btn:hover,.popup-no-btn:active{
  background-color:#c1c1c1}
.step-block{
  width:90%;
  max-width:350px;
  margin:0 auto 0;
  position:relative}
.step-item{
  display:none;
  position:relative;
  text-align:center;
  background-color:#fff;
  -webkit-box-shadow:0 0 40px 10px rgba(0, 0, 0, 0.2);
  box-shadow:0 0 40px 10px rgba(0, 0, 0, 0.2);
  border-radius:1rem;
  padding:3rem;
  z-index:100;
  min-height:660px}
.step-block:before{
  content:'';
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  -webkit-transform:scale(1.15, 0.85);
  -ms-transform:scale(1.15, 0.85);
  transform:scale(1.15, 0.85);
  background-color:#fff;
  border-radius:1rem;
  -webkit-box-shadow:0 0 40px 10px rgba(0, 0, 0, 0.2);
  box-shadow:0 0 40px 10px rgba(0, 0, 0, 0.2);
  z-index:10}
.highlight{
  color:#000}
.step-item.visible{
  display:block}
.step-img{
  border-radius:0.5rem}
.step-title{
  font-size:2.4rem;
  line-height:1.1;
  color:#c41e1e;
  text-transform:uppercase;
  margin:3rem 0 0;
  font-weight:500}
.buttons-block{
  text-align:center;
  padding:3rem 0;
  font-size:0;
  position:absolute;
  left:0;
  top:100%;
  width:100%;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between}
.step-btn{
  background:#df2727;
  width:47%;
  cursor:pointer;
  transition:all 0.3s linear;
  font-size:2rem;
  color:#fff;
  padding:1rem 1rem;
  text-transform:uppercase;
  border-radius:0.5rem;
  font-weight:700}
.step-btn:hover{
  background-color:#ff4141}
.step-btn:active{
  background-color:#274f17}
.no-btn{
  background-color:#dddddd;
  color:#1a1d1e;
  border: 1px solid black;
}
.no-btn:hover,.no-btn:active{
  background-color:#8b8686}
.final-step{
  color:#9a9a9a;
  font-size:1.8rem;
  line-height:1.4;
  font-weight:500}
.final-step .step-title{
  text-transform:uppercase;
  font-size:4rem}
.final-step .buttons-block{
  position:static}
.final-step p{
  margin-bottom:1rem}
.submit-btn{
  width:100%;
  max-width:230px;
  margin:0 auto}
.loader{
  border:1px solid #a3a3a3;
  background:#e1e1e1;
  margin:1rem auto;
  border-radius:10px;
  padding:0.3rem;
  position:relative;
  overflow:hidden;
  max-width:280px}
.loader-line{
  border-radius:5px;
  height:10px;
  width:0;
  background:#df2727;
  -webkit-box-shadow:inset 0 1px 3px rgba(255, 255, 255, 0.6);
  box-shadow:inset 0 1px 3px rgba(255, 255, 255, 0.6);
  transition:width 0.8s linear}
.load-img,.load-item{
  display:none;
  font-weight:700}
.load-img.visible,.load-item.visible{
  display:inline-block}
.load-item{
  margin:1rem 0}
.footer{
  background-color:#fff;
  position:fixed;
  z-index:1;
  left:0;
  bottom:0;
  width:100%;
  height:36%}
.icon-ok{
  width:8.5rem;
  height:8.5rem;
  margin:6rem auto 3rem;
  border-radius:50%;
  border:4px solid #e65100;
  position:relative}
.icon-ok:before{
  content:'';
  display:block;
  width:3rem;
  height:1.8rem;
  border:solid #e65100;
  border-width:0 0 4px 4px;
  position:absolute;
  left:50%;
  top:50%;
  transform:rotate(-45deg) translate(0%,-90%)}
@media (max-width:600px),(max-height:600px){
  html{
    font-size:50%}
  .step-block.active{
    max-width:initial}
  .popup-img{
    max-width:160px}
  .step-item{
    min-height:500px}
}
@media (max-width:400px),(max-height:400px){
  html{
    font-size:50%}
  .step-block{
    max-width:250px}
  .step-title{
    font-size:2rem;
    margin:1rem 0}
  .step-item{
    padding:2rem}
  .popup-img{
    max-width:90px}
}