/**
 * Author: Akulov Ivan,
 * Company: Alpha Construction, Moscow, Russia. Since 2015
 * Author URI: http://aconst.ru/
 * Version: 1.0
 * Copyright. All rights reserved
 */

* {
    margin: 0;
    padding: 0;
}
body {
    display: block;
    margin: 0;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    color: #5f6368;
    line-height: 20px;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    background-color: #f7f7f7;
}
div {
    display: block;
}
h1 {
    font-size: 22.652px;
    margin: 0 0 1em 0;
    line-height: 25px;
}
.homepage {
    position: relative;
    color: #1e1e1e;
    margin-left: auto;
    margin-right: auto;
    padding-left: 3%;
    padding-right: 3%;
    width: 94%;
    min-width: 300px;
    max-width: 1700px;
    height: 100%;
    display: block;
}
/* --- Верхняя часть --- */
#page {
    position: relative;
    float: left;
    display: block;
    margin-top: 10%;
    margin-bottom: 2%;
    height: 60%;
    width: 100%;
    content: " ";
}
.whowe,
.services {
    position: relative;
    float: left;
    display: block;
    width: 100%;
}
.whowe {
    margin-bottom: 2%;
}
.whowe p {
    font-size: 10em;
    line-height: 0.8;
    letter-spacing: -0.02em;
}
.services {
    margin: 2% 0 4% 0;
}
.services p {
    font-size: 2em;
    line-height: 0.9;
}
/* --- Чекбокс --- */
.services1,
.services2,
.services3,
.services4,
.services5,
.services6,
.services7,
.services8 {
    position: absolute;
    opacity: 0;
}
.services1 {
    -webkit-animation: slideRight 24s ease-in-out 0.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 0.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 0.5s backwards;
    animation: slideRight 24s ease-in-out 0.5s backwards;
    animation-iteration-count: infinite;
}
.services2 {
    -webkit-animation: slideRight 24s ease-in-out 3.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 3.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 3.5s backwards;
    animation: slideRight 24s ease-in-out 3.5s backwards;
    animation-iteration-count: infinite;
}
.services3 {
    -webkit-animation: slideRight 24s ease-in-out 6.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 6.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 6.5s backwards;
    animation: slideRight 24s ease-in-out 6.5s backwards;
    animation-iteration-count: infinite;
}
.services4 {
    -webkit-animation: slideRight 24s ease-in-out 9.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 9.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 9.5s backwards;
    animation: slideRight 24s ease-in-out 9.5s backwards;
    animation-iteration-count: infinite;
}
.services5 {
    -webkit-animation: slideRight 24s ease-in-out 12.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 12.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 12.5s backwards;
    animation: slideRight 24s ease-in-out 12.5s backwards;
    animation-iteration-count: infinite;
}
.services6 {
    -webkit-animation: slideRight 24s ease-in-out 15.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 15.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 15.5s backwards;
    animation: slideRight 24s ease-in-out 15.5s backwards;
    animation-iteration-count: infinite;
}
.services7 {
    -webkit-animation: slideRight 24s ease-in-out 18.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 18.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 18.5s backwards;
    animation: slideRight 24s ease-in-out 18.5s backwards;
    animation-iteration-count: infinite;
}
.services8 {
    -webkit-animation: slideRight 24s ease-in-out 21.5s backwards;
    -moz-animation: slideRight 24s ease-in-out 21.5s backwards;
    -ms-animation: slideRight 24s ease-in-out 21.5s backwards;
    animation: slideRight 24s ease-in-out 21.5s backwards;
    animation-iteration-count: infinite;
}
/* --- Нижняя часть --- */
#footer {
    position: relative;
    float: left;
    display: block;
    height: 30%;
    width: 100%;
    border-top: 2px solid #2c2c2c;
    content: " ";
}
#footer p,
#footer h1 {
    text-align: left;
    font-size: 0.9em;
    line-height: 1.05em;
    margin: 0;
}
#footer a {
    color: #1e1e1e;
    text-decoration: none;
}
.footer-left,
.footer-center,
.footer-right {
    position: relative;
    float: left;
    display: block;
    height: 30%;
    width: 30%;
    content: " ";
}
.footer-center,
.footer-right{
    margin: 1% 0 0 5%;
}
.profile {
    max-width: 300px;
}
.logo img{
    width: 50%;
    max-width: 190px;
    margin: 1% 0 0 0;
}
p.nodisp {
    display: none;
}
/* -webkit- */
@-webkit-keyframes slideRight{
    0%{
        opacity: 0;
        -webkit-transform: translateX(-1%);
    }
    0.5%{
        opacity: 0.8;
        -webkit-transform: translateX(0);
    }
    1%{
        opacity: 1;
        -webkit-transform: translateX(0);
    }
    12%{
        opacity: 1;
    }
    12.5%{
        opacity: 0;
    }
}
@-webkit-keyframes slideRightMobile{
    0%{
        opacity: 0;
        -webkit-transform: translateX(-2%);
    }
    80%{
        opacity: 0.8;
        -webkit-transform: translateX(0);
    }
    100%{
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}
/* -------------------------------------------резина-------------------------------------------- */
/* -мобильные-
iPhone 4-5 - 320
iPhone 6-8, X, 15 - 375
iPhone 13 - 390
iPhone 6+-8+,11,Xs, Xr - 414
iPhone 13 pro max - 428
*/
@media screen and (max-width: 349px) {
    .homepage {
        padding-left: 2%;
        padding-right: 2%;
    }
    #page {
        margin-top: 30%;
        margin-bottom: 10%;
        height: 60%;
    }
    .whowe {
        margin-bottom: 10%;
    }
    .whowe p {
        font-size: 2.8em;
        line-height: 0.9;
        letter-spacing: -0.03em;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    #footer {
        width: 100%;
        border-top: 1px solid #2c2c2c;
    }
    #footer p,
    #footer h1 {
        text-align: center;
        font-size: 0.8em;
        line-height: 1.00em;
        margin: 0;
    }
    .footer-left,
    .footer-center,
    .footer-right {
        position: relative;
        float: left;
        display: block;
        height: 30%;
        width: 100%;
        content: " ";
    }
    .footer-center,
    .footer-right{
        margin: 0 auto 0 auto;
        padding-top: 7%;
    }
    .footer-right {
        margin: 7% 0 7% 0;
        border-top: 1px solid #2c2c2c;
    }
    .profile {
        text-align: center;
        max-width: 250px;
        margin-left: auto;
        margin-right: auto;
    }
    .logo img{
        display: block;
        text-align: center;
        width: 80%;
        max-width: 200px;
        margin: 7% auto 0 auto;
    }
    .services p {
        font-size: 1.4em;
        line-height: 0.95;
    }
    .services1,
    .services2,
    .services3,
    .services4,
    .services5,
    .services6,
    .services7,
    .services8 {
        position: relative;
        opacity: 1;
        animation-iteration-count: 0;
    }
    .services1 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        animation: slideRightMobile 1s ease-in-out 0.5s backwards;
    }
    .services2 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        animation: slideRightMobile 1s ease-in-out 0.75s backwards;
    }
    .services3 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        animation: slideRightMobile 1s ease-in-out 1.0s backwards;
    }
    .services4 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        animation: slideRightMobile 1s ease-in-out 1.25s backwards;
    }
    .services5 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        animation: slideRightMobile 1s ease-in-out 1.5s backwards;
    }
    .services6 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        animation: slideRightMobile 1s ease-in-out 1.75s backwards;
    }
    .services7 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        animation: slideRightMobile 1s ease-in-out 2.0s backwards;
    }
    .services8 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        animation: slideRightMobile 1s ease-in-out 2.25s backwards;
    }
}
@media screen and (min-width: 350px) and (max-width: 413px) {
    .homepage {
        padding-left: 2%;
        padding-right: 2%;
    }
    #page {
        margin-top: 30%;
        margin-bottom: 10%;
        height: 60%;
    }
    .whowe {
        margin-bottom: 10%;
    }
    .whowe p {
        font-size: 3.2em;
        line-height: 0.9;
        letter-spacing: -0.03em;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    #footer {
        width: 100%;
        border-top: 1px solid #2c2c2c;
    }
    #footer p,
    #footer h1 {
        text-align: center;
        font-size: 0.85em;
        line-height: 1.00em;
        margin: 0;
    }
    .footer-left,
    .footer-center,
    .footer-right {
        position: relative;
        float: left;
        display: block;
        height: 30%;
        width: 100%;
        content: " ";
    }
    .footer-center,
    .footer-right{
        margin: 0 auto 0 auto;
        padding-top: 7%;
    }
    .footer-right {
        margin: 7% 0 7% 0;
        border-top: 1px solid #2c2c2c;
    }
    .profile {
        text-align: center;
        max-width: 300px;
        margin-left: auto;
        margin-right: auto;
    }
    .logo img{
        display: block;
        text-align: center;
        width: 80%;
        max-width: 200px;
        margin: 7% auto 0 auto;
    }
    .services p {
        font-size: 1.6em;
        line-height: 0.95;
    }
    .services1,
    .services2,
    .services3,
    .services4,
    .services5,
    .services6,
    .services7,
    .services8 {
        position: relative;
        opacity: 1;
        animation-iteration-count: 0;
    }
    .services1 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        animation: slideRightMobile 1s ease-in-out 0.5s backwards;
    }
    .services2 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        animation: slideRightMobile 1s ease-in-out 0.75s backwards;
    }
    .services3 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        animation: slideRightMobile 1s ease-in-out 1.0s backwards;
    }
    .services4 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        animation: slideRightMobile 1s ease-in-out 1.25s backwards;
    }
    .services5 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        animation: slideRightMobile 1s ease-in-out 1.5s backwards;
    }
    .services6 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        animation: slideRightMobile 1s ease-in-out 1.75s backwards;
    }
    .services7 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        animation: slideRightMobile 1s ease-in-out 2.0s backwards;
    }
    .services8 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        animation: slideRightMobile 1s ease-in-out 2.25s backwards;
    }
}
@media screen and (min-width: 414px) and (max-width: 460px) {
    .homepage {
        padding-left: 2%;
        padding-right: 2%;
    }
    #page {
        margin-top: 30%;
        margin-bottom: 10%;
        height: 60%;
    }
    .whowe {
        margin-bottom: 10%;
    }
    .whowe p {
        font-size: 3.8em;
        line-height: 0.9;
        letter-spacing: -0.04em;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    #footer {
        width: 100%;
        border-top: 1px solid #2c2c2c;
    }
    #footer p,
    #footer h1 {
        text-align: center;
        font-size: 1.0em;
        line-height: 1.05em;
        margin: 0;
    }
    .footer-left,
    .footer-center,
    .footer-right {
        position: relative;
        float: left;
        display: block;
        height: 30%;
        width: 100%;
        content: " ";
    }
    .footer-center,
    .footer-right{
        margin: 0 auto 0 auto;
        padding-top: 7%;
    }
    .footer-right {
        margin: 7% 0 7% 0;
        border-top: 1px solid #2c2c2c;
    }
    .profile {
        text-align: center;
        max-width: 350px;
        margin-left: auto;
        margin-right: auto;
    }
    .logo img{
        display: block;
        text-align: center;
        width: 80%;
        max-width: 200px;
        margin: 7% auto 0 auto;
    }
    .services p {
        font-size: 1.8em;
        line-height: 0.95;
    }
    .services1,
    .services2,
    .services3,
    .services4,
    .services5,
    .services6,
    .services7,
    .services8 {
        position: relative;
        opacity: 1;
        animation-iteration-count: 0;
    }
    .services1 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        animation: slideRightMobile 1s ease-in-out 0.5s backwards;
    }
    .services2 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        animation: slideRightMobile 1s ease-in-out 0.75s backwards;
    }
    .services3 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        animation: slideRightMobile 1s ease-in-out 1.0s backwards;
    }
    .services4 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        animation: slideRightMobile 1s ease-in-out 1.25s backwards;
    }
    .services5 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        animation: slideRightMobile 1s ease-in-out 1.5s backwards;
    }
    .services6 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        animation: slideRightMobile 1s ease-in-out 1.75s backwards;
    }
    .services7 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        animation: slideRightMobile 1s ease-in-out 2.0s backwards;
    }
    .services8 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        animation: slideRightMobile 1s ease-in-out 2.25s backwards;
    }
}
@media screen and (min-width: 461px) and (max-width: 540px) {
    .homepage {
        padding-left: 2%;
        padding-right: 2%;
    }
    #page {
        margin-top: 30%;
        margin-bottom: 10%;
        height: 60%;
    }
    .whowe {
        margin-bottom: 10%;
    }
    .whowe p {
        font-size: 4.4em;
        line-height: 0.9;
        letter-spacing: -0.04em;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    #footer {
        width: 100%;
        border-top: 1px solid #2c2c2c;
    }
    #footer p,
    #footer h1 {
        text-align: center;
        font-size: 1.15em;
        line-height: 1.05em;
        margin: 0;
    }
    .footer-left,
    .footer-center,
    .footer-right {
        position: relative;
        float: left;
        display: block;
        height: 30%;
        width: 100%;
        content: " ";
    }
    .footer-center,
    .footer-right{
        margin: 0 auto 0 auto;
        padding-top: 7%;
    }
    .footer-right {
        margin: 7% 0 7% 0;
        border-top: 1px solid #2c2c2c;
    }
    .profile {
        text-align: center;
        max-width: 380px;
        margin-left: auto;
        margin-right: auto;
    }
    .logo img{
        display: block;
        text-align: center;
        width: 80%;
        max-width: 200px;
        margin: 7% auto 0 auto;
    }
    .services p {
        font-size: 2.1em;
        line-height: 0.95;
    }
    .services1,
    .services2,
    .services3,
    .services4,
    .services5,
    .services6,
    .services7,
    .services8 {
        position: relative;
        opacity: 1;
        animation-iteration-count: 0;
    }
    .services1 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        animation: slideRightMobile 1s ease-in-out 0.5s backwards;
    }
    .services2 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        animation: slideRightMobile 1s ease-in-out 0.75s backwards;
    }
    .services3 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        animation: slideRightMobile 1s ease-in-out 1.0s backwards;
    }
    .services4 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        animation: slideRightMobile 1s ease-in-out 1.25s backwards;
    }
    .services5 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        animation: slideRightMobile 1s ease-in-out 1.5s backwards;
    }
    .services6 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        animation: slideRightMobile 1s ease-in-out 1.75s backwards;
    }
    .services7 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        animation: slideRightMobile 1s ease-in-out 2.0s backwards;
    }
    .services8 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        animation: slideRightMobile 1s ease-in-out 2.25s backwards;
    }
}
@media screen and (min-width: 541px) and (max-width: 620px) {
    .homepage {
        padding-left: 2%;
        padding-right: 2%;
    }
    #page {
        margin-top: 30%;
        margin-bottom: 10%;
        height: 60%;
    }
    .whowe {
        margin-bottom: 10%;
    }
    .whowe p {
        font-size: 5.1em;
        line-height: 0.9;
        letter-spacing: -0.04em;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    #footer {
        width: 100%;
        border-top: 1px solid #2c2c2c;
    }
    #footer p,
    #footer h1 {
        text-align: center;
        font-size: 1.3em;
        line-height: 1.05em;
        margin: 0;
    }
    .footer-left,
    .footer-center,
    .footer-right {
        position: relative;
        float: left;
        display: block;
        height: 30%;
        width: 100%;
        content: " ";
    }
    .footer-center,
    .footer-right{
        margin: 0 auto 0 auto;
        padding-top: 7%;
    }
    .footer-right {
        margin: 7% 0 7% 0;
        border-top: 1px solid #2c2c2c;
    }
    .profile {
        text-align: center;
        max-width: 420px;
        margin-left: auto;
        margin-right: auto;
    }
    .logo img{
        display: block;
        text-align: center;
        width: 80%;
        max-width: 200px;
        margin: 7% auto 0 auto;
    }
    .services p {
        font-size: 2.5em;
        line-height: 0.95;
    }
    .services1,
    .services2,
    .services3,
    .services4,
    .services5,
    .services6,
    .services7,
    .services8 {
        position: relative;
        opacity: 1;
        animation-iteration-count: 0;
    }
    .services1 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.5s backwards;
        animation: slideRightMobile 1s ease-in-out 0.5s backwards;
    }
    .services2 {
        -webkit-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 0.75s backwards;
        animation: slideRightMobile 1s ease-in-out 0.75s backwards;
    }
    .services3 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.0s backwards;
        animation: slideRightMobile 1s ease-in-out 1.0s backwards;
    }
    .services4 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.25s backwards;
        animation: slideRightMobile 1s ease-in-out 1.25s backwards;
    }
    .services5 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.5s backwards;
        animation: slideRightMobile 1s ease-in-out 1.5s backwards;
    }
    .services6 {
        -webkit-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 1.75s backwards;
        animation: slideRightMobile 1s ease-in-out 1.75s backwards;
    }
    .services7 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.0s backwards;
        animation: slideRightMobile 1s ease-in-out 2.0s backwards;
    }
    .services8 {
        -webkit-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -moz-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        -ms-animation: slideRightMobile 1s ease-in-out 2.25s backwards;
        animation: slideRightMobile 1s ease-in-out 2.25s backwards;
    }
}
@media screen and (min-width: 621px) and (max-width: 800px){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 5.5em;
    }
    #page {
        margin-top: 16%;
        margin-bottom: 4%;}
    .services {
        margin: 3% 0 5% 0;
    }
    .services p {
        font-size: 1.4em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.6em;
    }
    .profile {
        max-width: 200px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
@media screen and (min-width: 801px) and (max-width: 1023px){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 7.0em;
    }
    #page {
        margin-top: 8%;
        margin-bottom: 4%;}
    .services {
        margin: 3% 0 5% 0;
    }
    .services p {
        font-size: 1.6em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.63em;
    }
    .profile {
        max-width: 220px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
/* -альбом- */
/* для iPad pro 9.7, iPad 3, 4, 1, 2, mini */
@media screen and (min-width: 1024px) and (max-width: 1024px) and (orientation: landscape){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 9.2em;
    }
    #page {
        margin-top: 16%;
        margin-bottom: 4%;}
    .services {
        margin: 3% 0 5% 0;
    }
    .services p {
        font-size: 1.7em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.8em;
    }
    .profile {
        max-width: 300px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
@media screen and (min-width: 1025px) and (max-width: 1111px) and (orientation: landscape){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 9.2em;
    }
    #page {
        margin-top: 16%;
        margin-bottom: 4%;}
    .services {
        margin: 3% 0 5% 0;
    }
    .services p {
        font-size: 1.7em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.8em;
    }
    .profile {
        max-width: 270px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
/* для iPad pro 10.5 */
@media screen and (min-width: 1112px) and (max-width: 1112px) and (orientation: landscape){
    .whowe {
        margin-bottom: 4%;
    }
    .whowe p {
        font-size: 10.2em;
    }
    #page {
        margin-top: 18%;
        margin-bottom: 6%;}
    .services {
        margin: 3% 0 4% 0;
    }
    .services p {
        font-size: 2em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.85em;
    }
    .profile {
        max-width: 300px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
/* для iPad air */
@media screen and (min-width: 1180px) and (max-width: 1180px) and (orientation: landscape){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 10.8em;
    }
    #page {
        margin-top: 15%;
        margin-bottom: 5%;}
    .services {
        margin: 3% 0 4% 0;
    }
    .services p {
        font-size: 2em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.85em;
    }
    .profile {
        max-width: 300px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 2% 0 0 0;
    }
}
/* ----НОРМА---- */
@media screen and (min-width: 1181px) and (max-width: 1284px){
    .whowe p {
        font-size: 10em;
        line-height: 0.8;
        letter-spacing: -0.02em;
    }
    #page {
        margin-top: 10%;
        margin-bottom: 2%;
    }
    .services {
        margin: 2% 0 4% 0;
    }
    .services p {
        font-size: 2em;
    }
    #footer p,
    #footer h1 {
        font-size: 0.9em;
    }
    .profile {
        max-width: 300px;
    }
    .logo img{
        width: 50%;
        max-width: 190px;
        margin: 1% 0 0 0;
    }
}
@media screen and (min-width: 1285px) and (max-width: 1365px){
    .whowe p {
        font-size: 12em;
    }
    #page {
        margin-top: 12%;
        margin-bottom: 3%;}
    .services {
        margin: 3% 0 4% 0;
    }
    .logo img{
        width: 55%;
        max-width: 210px;
        margin: 2% 0 0 0;
    }
}
/* для iPad pro 12.9 */
@media screen and (min-width: 1366px) and (max-width: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 12.5em;
    }
    #page {
        margin-top: 17%;
        margin-bottom: 5%;}
    .services {
        margin: 3% 0 4% 0;
    }
    .services p {
        font-size: 2.1em;
    }
    #footer p,
    #footer h1 {
        font-size: 1.0em;
    }
    .profile {
        max-width: 350px;
    }
    .logo img{
        width: 55%;
        max-width: 210px;
        margin: 2% 0 0 0;
    }
}
@media screen and (min-width: 1366px) and (max-width: 1366px) and (orientation: landscape){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 12em;
    }
    #page {
        margin-top: 10%;
        margin-bottom: 3%;}
    .services {
        margin: 1% 0 4% 0;
    }
    .services p {
        font-size: 2.1em;
    }
    #footer p,
    #footer h1 {
        font-size: 1.0em;
    }
    .profile {
        max-width: 350px;
    }
    .logo img{
        width: 55%;
        max-width: 210px;
        margin: 2% 0 0 0;
    }
}
@media screen and (min-width: 1367px) and (max-width: 1599px){
    .whowe {
        margin-bottom: 3%;
    }
    .whowe p {
        font-size: 12em;
    }
    #page {
        margin-top: 8%;
        margin-bottom: 3%;}
    .services {
        margin: 1% 0 4% 0;
    }
    .services p {
        font-size: 2.5em;
    }
    #footer p,
    #footer h1 {
        font-size: 1.0em;
    }
    .profile {
        max-width: 350px;
    }
    .logo img{
        width: 55%;
        max-width: 210px;
        margin: 2% 0 0 0;
    }
}
/* максимум 1700px */
@media screen and (min-width: 1600px){
    .whowe p {
        font-size: 15em;
        line-height: 0.8;
        letter-spacing: -0.02em;
    }
    #page {
        margin-top: 12%;
        margin-bottom: 5%;}
    .services {
        margin: 3% 0 3% 0;
    }
    .services p {
        font-size: 3em;
    }
    #footer p,
    #footer h1 {
        font-size: 1.2em;
    }
    .profile {
        max-width: 400px;
    }
    .logo img{
        width: 70%;
        max-width: 250px;
        margin: 2% 0 0 0;
    }
}
@media screen and (min-width: 1600px) and (max-width: 1700px){
    .whowe p {
        font-size: 15em;
        line-height: 0.8;
        letter-spacing: -0.02em;
    }
    #page {
        margin-top: 12%;
        margin-bottom: 5%;}
    .services {
        margin: 3% 0 3% 0;
    }
    .services p {
        font-size: 3em;
    }
    #footer p,
    #footer h1 {
        font-size: 1.2em;
    }
    .profile {
        max-width: 400px;
    }
    .logo img{
        width: 70%;
        max-width: 250px;
        margin: 2% 0 0 0;
    }
}