import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i');

    html {height: 100%;}
    body {
      background: #E2E4E7;
      padding: 0;
      text-align: center;
      position: relative;
      margin: 0;
      height: 100%;
      font-family: 'Roboto', 'Arial', sans-serif;
      color: #636363;
      font-size: 14px;
    }

    a {text-decoration: none; color: #3897f0;}
    a:hover {text-decoration: underline;}
    button {outline: none; border: none; cursor: pointer;}
    button:disabled {background: #a7bcd1; cursor: default;}
    ul { list-style-image: url(img/limarker.png);}
    ul li {margin:10px 0;}
    span {font-size: 14px;}
    span.small {font-size: 12px; line-height: 1.3 !important; display: block;}
    .light {color:#999999;}
    h1 {font-size: 25px;}
    h2 {font-size: 25px; margin:40px 0;}
    h4 {font-size: 17px; margin: 0; padding-bottom: 4px;}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

    .wrapper {
    	height: auto;
    	margin: 0 auto;
    	overflow: hidden;
    }

    .main {
      width: 100%;
      margin: 0 auto;
    }

    .main .sections {
      display: block;
      overflow: hidden;
      min-height: 100%;
      height: auto;
    }

#page1 { background: #fafafa;}
#page2 { background: #ffffff;}

.content {
      height: 100vh;
      min-height: 630px;
      max-width: 1147px;
      margin: 0 auto;
      overflow: hidden;
    }
#page2 .content {min-height: 100vh; height: auto; display: flex; flex-direction: column; }
#page2 .content_inner {flex: 1 0 auto;}
.animation_container {margin:0; width: 67%; float: left; height: 90vh; background: url('img/animation1.gif') center no-repeat;}

.arrow_down {margin:0 auto; height: 20px; float: left; width: 67%; font-size: 18px;}
.arrow_down::after {content: ""; display: inline-block; height: 14px; width: 27px; background: url('img/arrow.png') center repeat-x; margin-bottom: -1px; margin-left: 3px;}

.table_align   {display: block; float: right; height: 100vh; vertical-align: middle; padding: 0;}
.table_align tbody, .table_align tr, .table_align td {height: 100vh; padding: 0;}
.table_align tbody {display: inline-block; margin-top: -3px;}

.info_container {display: inline-block; height: 570px; width: 350px; vertical-align: top;}
.white_info_container {display:block; height: 520px; width: 350px; background: white; border: 1px solid #e6e6e6; border-radius:1px;}

.likeinstalogo {margin:25px 0; width: 100%; height: 45px; background: url('img/likeinstalogo.png') center no-repeat; }
.button_blue {display: block; background: #3897f0; font-weight: bold; color: white; text-align: center; height: 36px; width: 82%; border-radius: 3px; line-height: 36px; margin-top: 15px;
    -webkit-transition: 0.3s ease-out 0.1s;
     -moz-transition: 0.3s ease-out 0.1s;
     -o-transition: 0.3s ease-out 0.1s;
     transition: 0.3s ease-out 0.1s;}
.button_blue:hover {background: #52abff; text-decoration: none;}
.button_red {display: none; background: #ff5035; font-weight: bold; color: white; text-align: center; height: 36px; width: 82%; border-radius: 3px; line-height: 36px; margin-top: 15px;
    -webkit-transition: 0.3s ease-out 0.1s;
     -moz-transition: 0.3s ease-out 0.1s;
     -o-transition: 0.3s ease-out 0.1s;
     transition: 0.3s ease-out 0.1s;}
.button_red:hover {background: #000000; text-decoration: none;}
.block_or { width: 82%; background: url('img/line_point.png') center repeat-x; margin: 20px 0 10px 0;}
.text_or {background: white; width: 80px; display: inline-block;}

.notification_container { display: table; width: 82%; height: 62px; border: 1px dashed #d0d0d0; margin: 15px 0; border-radius: 5px;}
.notification_container span {font-size: 12px; display: table-cell; vertical-align: middle;}
.notification_container.initial { display: table; color:#056e1c;}
.notification_container.during { display: none; color:#3897f0;}
.notification_container.successfull {display: none; color:#0d8f26; border: 1px dashed #0d8f26;}

.form_style {display: block; background: #fafafa; color: white; text-align: left; height: 36px; width: 72%; padding: 0 5%; border-radius: 3px; border: 1px solid #e6e6e6; color: #999999; line-height: 37px; margin: 15px;
    -webkit-transition: 0.1s ease-out 0.1s;
     -moz-transition: 0.1s ease-out 0.1s;
     -o-transition: 0.1s ease-out 0.1s;
     transition: 0.1s ease-out 0.1s;
-webkit-box-shadow: inset 0px 3px 5px 0px rgba(0,0,0,0.05);
-moz-box-shadow: inset 0px 3px 5px 0px rgba(0,0,0,0.05);
box-shadow: inset 0px 3px 5px 0px rgba(0,0,0,0.05);}

.form_style:focus {outline: none; border: 1px solid #3897f0; background: white;}

.contacts_info_block {padding-top: 30px;}
.contacts_info_block span {font-size: 12px;}
.help_email {margin-right: 26px;}
.help_email::before {content: ""; display: inline-block; height: 16px; width: 16px; background: url('img/help-icon.png') center repeat-x; margin-bottom: -3px; margin-right: 3px;}
.telegram_link::before {content: ""; display: inline-block; height: 16px; width: 16px; background: url('img/telegram.png') center repeat-x; margin-bottom: -3px; margin-right: 3px;}
.help_email b {color: #999999;}

/*Аккордион*/
.accordion > a { display: block; margin: 10px 0 0 0; padding: 20px; cursor:pointer; background-color: #fff; border: 1px solid #e6e6e6;  text-align: left;}
.question_link {color: #3897f0; font-size: 20px; font-weight: bold; margin: 0;}
.accordion { margin:0 auto; width: 99%; position: relative;}

.accordion-content {border: 1px solid #e6e6e6; border-top: none; padding: 25px; text-align: left;}
p {
color: #555;
padding: 20px 10px;
}
/*переворот стрелки*/
.span_arrow {
  display: inline-block;
  transition: transform .2s;
    width: 27px; min-height: 15px; float: right;
  background: url('img/arrow.png') center no-repeat;
    margin-top: 5px;
}
.span_arrow.active {
  transform: rotate(180deg);
    margin-top: 4px;
}
/*Аккордион конец*/

.help_else_block {margin: 30px 0; text-align: center; font-size: 20px; line-height: 25px;}


footer {height: 80px; width: 100%; border-top: 1px solid #e6e6e6; margin-bottom:0;}
footer .contacts_info_block {padding-top: 30px; float: right;}
footer .copyright {padding-top: 30px; float: left; font-size: 12px; color: #999999;}