@import url('https://fonts.googleapis.com/css?family=Roboto');

@import url('https://fonts.googleapis.com/css?family=Neucha');

@import url('https://fonts.googleapis.com/css?family=Amatic+SC|Exo+2|Play|Rubik|Ubuntu');

@import url('https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz');

/*----------- Общие настройки -----------*/

body {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-size: 12px;
    color: #3500ff;
    background-color: #fff;

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touth;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

p {
    font-size: 16px;
    margin: 0px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0px;
    margin: 0px;
}

h1 {
    font-size: 60px;
}

h2 {
    font-size: 28px;
}

h3 {
    font-size: 24px;
}

h4 {
    font-size: 18px;
}

.name-box {
    width: 100%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 60px;
    margin-bottom: 20px;
}

.name-box h2 {
    font-size: 26px;
}



/*----------- Header -----------*/

header {
    width: 100%;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;

    justify-content: space-between;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 0px 100px;
    /*    margin-top: -30px;*/
}



.logo {
    width: 200px;
    min-height: 40px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 10px;
    margin-bottom: 10px;
}

nav {
    width: 810px;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

nav a {
    margin: 0px 20px;
    font-size: 14px;
    color: #fafafa;
    text-transform: uppercase;
    font-weight: 600;
    border-bottom: 2px solid rgba(255, 255, 255, 0);
    transition: all 0.3s ease;
}

nav a:hover {
    color: #fff;
    border-bottom: 2px solid #fff;
}




/*----------- banner -----------*/

.banner {
    width: 100%;
    min-height: 460px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    background: url(../img/fon-banner-2.jpg) no-repeat;
    background-size: cover;
    background-position: top;
    background-attachment: fixed;

    color: #fff;
}



.banner h1 {
    text-align: left;
    font-size: 42px;
    color: #fff;
    line-height: 1.5;
    font-weight: 600;
}

.banner-item {
    max-width: 100%;
    min-height: 300px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.zagl {
    width: 320px;
    height: 10px;
}

.banner-left p {
    font-size: 26px;
}

.zelen {
    /*    background: radial-gradient(80% 80%, rgba(110, 188, 15, 0.73), rgba(255, 255, 255, 0));*/
    padding: 30px;
    border-radius: 20px;
    margin-left: -40px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.zelen span {
    font-size: 42px;
    color: #fff;
}

.zelen h1 {
    color: #fff;
}

.button-1 {
    width: 380px;
    min-height: 54px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    border-radius: 30px;
    /*    background-color: #ad10bd;*/
    background-color: #fff;
    color: #ad10bd;
    transition: all 0.3s ease;

}


.button-1 p {
    font-size: 16px;
    text-transform: uppercase;
}

.button-1:hover {
    background-color: rgb(110, 188, 15);
    box-shadow: 0 15px 20px rgba(110, 188, 15, .4);
}



.mini-p-1 {
    margin-top: 20px;
}

.mini-p {
    font-size: 30px;
}


/*----------- f-1-----------*/

.fblok-1 {
    width: 100%;
    min-height: 380px;
    padding: 40px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    color: #3500ff;

    background: url(../img/no_hotlinking3.png) no-repeat;
    background-size: cover;
    background-position: center;
}

.fblok-1-name {
    width: 100%;
    min-height: 80px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    margin-top: 20px;
}

.fblok-1-name h2 {
    font-weight: 700;
    font-size: 48px;
}

.fblok-1-content {
    width: 80%;
    min-height: 300px;
    padding: 20px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}




.fblok-1-content-item {
    width: 600px;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.fblok-1-content-item img {
    margin-right: 30px;
}

.krug-txt {
    width: 440px;
    min-height: 80px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-start;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.krug-txt p {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    text-align: left;
}



.krug {
    width: 70px;
    height: 70px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    /*    background-color: #535353;*/
    border-radius: 50%;
    border: 2px solid #3500ff;

    margin-right: 40px;
}

.krug span {
    font-size: 22px;
    color: #3500ff;
    font-weight: 600;
}






/*----------- fblok-2-----------*/

.fblok-2 {
    width: 100%;
    min-height: 300px;
    padding: 20px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    box-shadow: inset 2px 2px 5px rgba(154, 147, 140, 0.5), 1px 1px 5px rgba(255, 255, 255, 1);

    background-color: #5db3ff;
    color: #fff;
}

.fblok-2-item {
    width: 240px;
    min-height: 240px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.fblok-2-item span {
    color: #fff;
    font-size: 20px;
    margin-top: 10px;
    text-align: center;
}





/*----------- Форма-----------*/

.forma {
    width: 100%;
    min-height: 100px;
    margin: 20px auto;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: "Roboto";

    margin-bottom: 20px;
}

.forma-ver {
    width: 600px;
    margin: 0;
}

form {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    font-family: "Roboto";
    margin-bottom: 10px;
    margin-top: 20px;
}

.form-ver {
    width: 80%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
}

.form-ver input {
    width: 100%;
}

.name-forma {
    display: 28px;
}

input {
    width: 280px;
    height: 48px;

    margin: 10px;
    padding: 10px;
    font-size: 18px;
    border: 1px solid #fff;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    color: #8000ff;

}

input:focus {
    outline: none;
    border: 1px solid #fff;
    color: #8000ff;
}

button {
    width: 280px;
    height: 48px;
    margin: 10px;

    font-size: 18px;

    background: #6ec001;
    color: #fff;
    transition: background .4s;
    cursor: pointer;
    border: none;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
    border-radius: 10px;

}

button:hover {
    background: #5da300;

}

.polz-sogl {
    text-align: center;
    color: rgba(98, 98, 98, 0.36);
}

.polz-sogl a {
    color: rgba(98, 98, 98, 0.36);
}





/*----------- BLOK-2-----------*/

.blok-2 {
    width: 100%;
    min-height: 980px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 30px;

    color: #3500ff;
    background: url(../img/no_hotlinking3.png) no-repeat;
    background-size: cover;
    background-position: center;
}

.blok-2-name {
    width: 100%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.blok-2-name p {
    font-size: 22px;
    margin-bottom: 10px;
    text-align: center;
}

.blok-2-name h2 {
    font-size: 48px;
    font-weight: 600;
    text-align: center;
}


.blok-2-content {
    width: 100%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.blok-2-content-item {
    width: 800px;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
    padding: 10px;
    text-align: center;

    border: 1px solid #cecece;
    border-radius: 20px;
    transition: all 0.2s ease;
}

.blok-2-content-item:hover {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
}



.blok-2-content-item img {
    margin-right: 20px;
}

.blok-2-content-item p {
    font-size: 20px;
    width: 90%;
}

.blok-2 a {
    margin-top: 20px;
}

.blok-2-content-item p span {
    font-size: 12px;
    color: #ccc;
}

/*----------- rasch -----------*/

.rasch {
    width: 100%;
    min-height: 400px;
    padding: 40px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    background-color: #b764ff;
    box-shadow: 0px -2px 28px rgba(0, 0, 0, 0.25), 0px -4px 10px rgba(0, 0, 0, 0.22);
}



.rasch h2 {
    font-size: 48px;
    width: 600px;
    text-align: right;
    color: #fff;
    font-weight: 600;
    margin-bottom: 70px;
}




/*----------- step-----------*/

.step {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 30px;

    background: url(../img/white.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.step-item {
    width: 280px;
    min-height: 280px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 20px;
    padding: 20px;

    color: #fff;

    border-radius: 10px;
    transition: all 0.3s ease;
}

.step-item:hover {
    -webkit-transform: rotateZ(-5deg);
    -ms-transform: rotateZ(-5deg);
    transform: rotateZ(-5deg);
}

.step-item img {
    margin-bottom: 20px;
}

.step-item span {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 20px;
}

.step-item p {
    font-size: 20px;
    text-align: center;
}

.step-1-name {
    min-height: 160px;
}


.step-item-1 {
    background-color: #ff5959;
}

.step-item-2 {
    background-color: #dd9636;
}


.step-item-3 {
    background-color: #85c63a;
}


.step-item-4 {
    background-color: #3ac685;
}


.step-item-5 {
    background-color: #3abbc6;
}


.step-item-6 {
    background-color: #8b3ac6;
}


.step-item-7 {
    background-color: #c63aab;
}


.step-item-8 {
    background-color: #c63a55;
}




/*----------- telephone -----------*/

.telephone {
    width: 100%;
    min-height: 300px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.telephone-box {
    width: 80%;
    min-height: 160px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    background-color: #b764ff;
    border-radius: 30px;
    color: #fff;
    padding: 10px;
}

.krug-tel {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.2);

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.krug-tel i {
    font-size: 38px;
    color: #fff;
}

.telephone-box span {
    font-size: 24px;
}

.ss-tel {
    width: 200px;
    min-height: 60px;

    border-radius: 20px;
    background-color: #fff;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 28px;
    color: #b764ff;
    text-align: center;
}

.ss-tel p {
    font-size: 16px;
}

.ss-tel-mobi {
    display: none;
}



/*----------- info -----------*/

.info {
    width: 100%;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px;
    margin-bottom: -20px;
}

.info h2 {
    font-size: 36px;
    font-weight: 600;
    text-align: center;
}

.info a {
    padding: 6px;
    padding-left: 14px;
    padding-right: 14px;
    background-color: #b764ff;
    color: #fff;
    border-radius: 20px;
    margin-left: 10px;
    font-size: 32px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.info a:hover {
    background-color: #c37fff;
}




/*----------- BLOK-3-----------*/

.blok-3 {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    margin-top: 40px;
}

.blok-3-content {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 30px;
}

.blok-3-item {
    width: 540px;
    min-height: 360px;
    margin: 20px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

}

.b3i-img {
    width: 100%;
    min-height: 300px;

    background-color: #d69948;
}

.b3i-txt {
    width: 100%;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.b3i-txt p {
    font-size: 20px;
    text-transform: uppercase;
}

.blok-2-fon {
    background: url(../img/dddfff.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-1 {
    background: url(../img/bi-0.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-2 {
    background: url(../img/bi-2.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-3 {
    background: url(../img/bi-3.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-4 {
    background: url(../img/bi-4.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-5 {
    background: url(../img/bi-5.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-6 {
    background: url(../img/bi-6.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-7 {
    background: url(../img/bi-7.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-8 {
    background: url(../img/bi-8.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-9 {
    background: url(../img/bi-9.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-10 {
    background: url(../img/bi-10.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b3i-11 {
    background: url(../img/bi-11.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}


/*----------- BLOK-4-----------*/

.blok-4 {
    width: 100%;
    min-height: 400px;
    background-color: rgba(207, 255, 209, 0.49);
    padding-bottom: 40px;
    padding-top: 40px;
    margin-top: 40px;
}

.blok-4-item {
    width: 350px;
    height: 250px;
}

.vip-form {
    width: 600px;
    min-height: 200px;
    padding: 20px;
    background-color: rgba(163, 38, 255, 0.66);
    border-radius: 10px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.forma-vip {
    width: 100%;
}

.blok-4-kanal {
    width: 90%;
    min-height: 40px;
    text-align: center;
}

.blok-4-kanal p {
    font-size: 24px;
    color: #fff;
    font-weight: 600;
    text-align: center;
}

.blok-4-kanal p a {
    color: #ff5a5a;
}

.blok-4-kanal p a:hover {
    color: #ff8484;
}

.button-1 {
    margin-top: 20px;
}



/*----------- BLOK-5-----------*/

.blok-5 {
    width: 100%;
    min-height: 600px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 20px;
    padding-top: 40px;
    padding-bottom: 60px;

    background: url(../img/fon-c.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.blok-5-item {
    width: 540px;
    min-height: 500px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.blok-5-left {
    width: 540px;
    min-height: 500px;

    /*    border: 1px solid #ccc;*/
    border-radius: 20px;
    padding: 20px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: flex-start;
    align-items: flex-start;
    font-weight: wrap;
    margin-left: 20px;
}

.blok-5-left p {
    text-align: left;
}

.blok-5-left h3 {
    min-height: 20px;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 20px;
}

.blok-5-down {
    margin-top: 30px;
    width: 100%;
    text-align: center;
}

.raspisanie {
    margin-bottom: 12px;
    font-size: 18px;
}





.blok-5-right {
    min-height: 500px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.b5i-f {
    width: 500px;
    height: 240px;

    border-radius: 20px;
}

.b5i-f1 {
    background: url(../img/f1.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b5i-f2 {
    background: url(../img/f2.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}


/*----------- Таблица-----------*/

.raspisanie-table {
    width: 70%;
}

th {
    padding: 10px 20px;
    border: 1px solid #ccc;
    font-size: 18px;
}

tr {
    vertical-align: middle;
    padding: 10px;
    text-align: center;
}

/*----------- BLOK-6-----------*/

.blok-6 {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    margin-top: 40px;
    margin-bottom: 40px;
}

.blok-6-name h2 {
    font-size: 34px;

    width: 300px;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    background: url(../img/fon-name.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    color: #fff;
    padding-top: 10px;
}

.blok-6-content {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.b6c-item {
    width: 340px;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 20px;
    transition: all 0.3s ease;

    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.b6c-item-2 {
    width: 480px;
    min-height: 240px;
}

.b6c-item:hover {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}

.fon-6 {
    width: 340px;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    text-align: center;

    background-color: rgba(0, 0, 0, 0.5);
}

.fon-6-2 {
    width: 480px;
    min-height: 240px;
    padding: 20px;
}

.fon-6 p {
    font-size: 20px;
    color: #fff;
}

.b6-i-1 {
    background: url(../img/6-1.jpeg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-2 {
    background: url(../img/6-2.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-3 {
    background: url(../img/6-3.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-4 {
    background: url(../img/6-4.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-5 {
    background: url(../img/6-5.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-6 {
    background: url(../img/6-6.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-7 {
    background: url(../img/6-7.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-8 {
    background: url(../img/6-8.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-9 {
    background: url(../img/6-9.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.b6-i-10 {
    background: url(../img/6-10.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-1 {
    background: url(../img/a6-6.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-2 {
    background: url(../img/a6-2.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-3 {
    background: url(../img/a6-3.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-4 {
    background: url(../img/bi-0.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-5 {
    background: url(../img/a6-5.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-6 {
    background: url(../img/a6-11.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-7 {
    background: url(../img/a6-12.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-8 {
    background: url(../img/a6-8.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-9 {
    background: url(../img/a6-10.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}

.a6-i-10 {
    background: url(../img/a6-9.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}




.fon-new {
    /*    margin-top: -40px;*/
    padding-bottom: 40px;
    padding-top: 20px;
    background: url(../img/white.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}


/*----------- BLOK-7-----------*/

.blok-7 {
    width: 100%;
    min-height: 400px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    /*    background-color: #dbffe3;*/
    background: linear-gradient(45deg, #90ffaa, #c7edff);


    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.blok-7 h2 {
    width: 80%;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    font-size: 26px;
    text-align: center;
    font-weight: 600;
}

.blok-7 span {
    font-size: 28px;
}

/*----------- BLOK-8-----------*/

.blok-8-name {
    font-size: 28px;
    text-transform: uppercase;
}

.blok-8-name h2 {
    font-size: 28px;
    text-transform: uppercase;
    margin-bottom: 60px;
    margin-top: 20px;
    line-height: 1.5;
}

.blok-8-content {
    width: 100%;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.blok-8-item {
    width: 200px;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    border-radius: 10px;
    /*    box-shadow: 0 6px 8px rgba(0,0,0,0.25), 0 1px 1px rgba(0,0,0,0.22);*/
    box-shadow: 0 0 10px rgba(100, 100, 100, 0.2) inset, 1px 1px 1px #CCC;

    margin: 10px;
    transition: all 0.3s ease;
    background-color: aqua;
}

.blok-8-item:hover {
    -webkit-transform: rotateZ(-5deg);
    -ms-transform: rotateZ(-5deg);
    transform: rotateZ(-5deg);
}

.blok-8-item span {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #000;
}

.blok-8-item p {
    font-size: 20px;
    color: #000;
}

.b8i-1 {
    background-color: #00c08b;
}

.b8i-2 {
    background-color: #ea5180;
}

.b8i-3 {
    background-color: #53bfe2;
}

.b8i-4 {
    background-color: #f8c54d;
}

.b8i-5 {
    background-color: #dd6dc1;
}

.b8i-6 {
    background-color: #a076ff;
}




/*----------- Контакты-----------*/

.blok-9-name h2 {
    width: 100%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    min-height: 200px;
    background: radial-gradient(40% 50%, #d2a9ff, #ffffff);
}

.name {
    width: 100%;
    min-height: 60px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.name2 {
    margin-top: 60px;
}

.name p {
    font-size: 20px;
}

footer {
    width: 100%;
    min-height: 200px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    background-color: #5c5c5c;
    color: #fff;
}

.fi-tel {
    width: 300px;
    min-height: 40px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    color: #fff;
}

.fi-tel a {
    transition: all 0.3s ease;
    color: #fff;
}

.fi-tel a:hover {
    color: #6ec001;
}


.fi-tel i {
    margin-right: 10px;
    font-size: 20px;
}

.copy {
    width: 100%;
    min-height: 10px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-end;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    background-color: #5c5c5c;
    color: #b7b4b4;
    font-size: 10px;
    padding: 4px;
}

.copy a {
    color: #b7b4b4;
}



/*----------- Отзывы -----------*/

.comment {
    width: 100%;
    min-height: 600px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;

    background: url(../img/white.jpg) no-repeat;
    background-size: cover;
    background-position: center;

    padding-bottom: 60px;
}

.comment-name {
    width: 100%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.comment-name h2 {
    padding-right: 30px;
    padding-left: 30px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 34px;
    color: #fff;
    text-transform: uppercase;
    background: url(../img/fon-name-2.png) no-repeat;
    background-size: cover;
    background-position: center;
}


.comment-content {
    width: 90%;
    min-height: 100px;

    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 20px;
}

.comment-content-item iframe {
    border: 4px solid #6ec001;
}


.blok-r {
    margin-top: 20px;
    margin-bottom: -20px;
}


.blok-r > h2 {
    font-size: 30px;
}

.blok-r-box {
    width: 100%;
    min-height: 200px;
    padding: 10px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
}

.blok-r-item {
    width: 600px;
    min-height: 200px;
    padding: 16px;
    -ms-text-align-last: auto;
    text-align-last: auto;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: flex-start;
    -ms-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    background-color: #fff;
    margin: 20px;
    border-radius: 14px;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.blok-r-item-2 {
    width: 400px;
}

.blok-r-item > h4 {
    font-size: 16px;
    color: #b764ff;
}

.blok-r-item > p {
    font-size: 14px;
    color: #000;
}
















.blok-d {
    background: url(../img/blok-d.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    margin-top: -20px;
    padding: 10px;
    padding-top: 20px;
}

.blok-d-name > h2 {
    color: #fff;
}

.blok-d-content-item {
    background-color: #fff;
}







/*------------ Медиа ------------*/

@media screen and (max-width: 850px) {
    .blok-2-content-item {
        width: 90%;
    }

    .blok-2-content-item p {
        font-size: 14px;
    }

    .blok-2-content-item img {
        width: 20px;
    }

    .zelen {
        margin-left: 0px;
        text-align: center;
    }

    .zagl {
        display: none;
    }

    .banner-item {
        width: 100%;
    }

    header {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 10px;
    }

    nav {
        width: 100%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .banner h1 {
        font-size: 32px;
        text-align: center;
    }

    .banner-left p {
        font-size: 28px;
    }

    .mini-p-1 {
        margin-top: 10px;
    }

    .banner-right-item p {
        font-size: 16px;
    }

    h2 {
        font-size: 24px;
    }

    footer {
        padding-top: 10px;
    }



}

@media screen and (max-width: 750px) {
    .button-1 {
        width: 280px;
    }

    .blok-2-content-item {
        padding: 6px;
        text-align: center;
    }

    .blok-2-content-item img {
        margin: 0;
    }
}

@media screen and (max-width: 650px) {
    .blok-2-content-item img {
        margin: 0;
    }
}

@media screen and (max-width: 600px) {
    .banner {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
    }

    .banner-item {
        max-width: 90%;
    }

    .banner-right {
        width: 90%;
        margin-bottom: 30px;
        margin-top: 20px;
    }

    .blok-3-item {
        width: 90%;
    }

    .b5i-f {
        width: 99%;
    }

    .banner-item {
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
    }

    .fblok-2-item {
        width: 100%;
        min-height: 160px;
    }

}

@media screen and (max-width: 600px) {

    .fblok-1-content-item img {
        margin-right: 0px;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .blok-5-left h3 {
        font-size: 20px;
    }

    .raspisanie {
        font-size: 14px;
    }

    .blok-6-content {
        margin-bottom: 30px;
    }

    .blok-7 h2 {
        width: 90%;
        font-size: 18px;
        margin-top: 20px;
    }

    .name-forma {
        text-align: center;
    }

    .banner-left p {
        font-size: 22px;
    }

    .fon-6-2 {
        width: 90%;
    }

    .comment-content-item iframe {
        width: 100%;
    }

    .fblok-1-name h2 {
        font-size: 28px;
        text-align: center;
    }

    .fblok-1-content-item {
        width: 100%;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
        flex-wrap: wrap;
    }



    .krug-txt {
        width: 98%;
        text-align: center;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
    }

    .krug-txt p {
        width: 98%;
        text-align: center;
    }

    .krug {
        margin: 0;
    }

    .fblok-1-content {
        width: 100%;
    }

    .blok-2-name h2 {
        font-size: 28px;
    }

    .rasch h2 {
        font-size: 22px;
        text-align: center;
        margin-bottom: 0;
    }

    .form-ver {
        width: 100%;
    }
}


@media screen and (max-width: 350px) {


    nav {
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
    }

    .blok-2-name {
        padding-left: 2px;
        padding-right: 2px;
    }

    .b3i-txt p {
        font-size: 14px;
        text-align: center;
    }

    .blok-4-item iframe {
        width: 100%;
    }

    .blok-6-name h2 {
        font-size: 18px;
    }

    .b6c-item {
        width: 98%;
    }

    .fon-6 {
        width: 100%;
    }

    .name p {
        font-size: 16px;
    }

    .button-1 {
        width: 90%;
    }

    .raspisanie-table {
        width: 100%;
    }

    .blok-7 span {
        font-size: 24px;
        text-align: center;
    }

    .info h2 {
        font-size: 26px;
    }

    .fon-6-2 {
        width: 100%;
    }

    .blok-r-item {
        padding: 8px;
        margin: 8px;
    }

    .telephone-box span {
        text-align: center;
        font-size: 18px;
        margin-top: 8px;
        margin-bottom: 8px;
    }
    
    .krug-txt p {
        font-size: 14px;
    }

}