html {
    font-size: 16px;
}





*,
*:after,
*:before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}





html,body {
    height: 100%;
}





body {
    font-family: 'Open Sans', sans-serif;
    font-size: 1rem;
}





.wrapper {
    display: flex;
    min-height: 100%;
    overflow: hidden;
    flex-direction: column;
    max-width: 100vw;

}





.container {
        max-width: 100vw;
}






/*------/ Header /------*/

.header-container {
    display: flex;
    margin: 0px auto;
    padding: 1.56rem 1.56rem 0px;
    max-width: 1350px;
}

@media (max-width: 767px) {
    .header-container {
        padding: 15px;
        min-height: 84px;
        min-width: 100vw;
        position: fixed;
        background-color: #fff;
        z-index: 10;
        
        border-bottom: 1px solid #e5e5e5;
    }
}





.nav-image {
    flex-basis: 50%;
}

@media (max-width: 450px) {
    .nav-image {
        transform: scale(0.8);
        position: absolute;
        left: 0;
    }
}





.nav {
    flex-basis: 50%;
    
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    text-align: end;
}

@media (max-width: 767px) {
    .nav {
        display: none;
    }
}

.burger {
    margin-right: 15px;
    display: flex;
    flex-direction: column-reverse;
    position: absolute;
    right: 5px;
    max-width: 100%;
    z-index: 1;
}

@media (min-width: 767px) {
    .burger {
        display: none;
    }
}





.check-menu {
    display:none;
}





.check-menu:checked ~ .nav-burger {
    padding: 15px 30px;
    max-height: 500px;
    max-width: 500px;
    box-shadow: 0 0 2px #000;
    font-size: 1rem;
}





.burger label{
    margin: 0 auto;
    min-height: 100%;
    min-width: 100%;

    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}





.check-menu__text {
    margin: 0 auto;
    font-size: 0.9rem;
    font-family: inherit;
    text-shadow: 0 0 1px #000;
}

.check-menu:checked ~  .check-menu__text {
    display: none;
}





.check-menu__icon {
    margin: 5px auto 0;
    width: 40px;
    height: 30px;
}

.check-menu:checked ~ .check-menu__icon {
    margin-top: 15px;
}





.check-menu__burger {
    margin: 0 auto;
    width: 25px;
    position: relative;
    top: 0;
    left: 0;

    transform: scale(2);
}

.check-menu ~ .check-menu__icon .check-menu__burger {
    display: block;
}

.check-menu:checked ~ .check-menu__icon .check-menu__burger {
    display: none;
}





.check-menu__close {
    margin: 0 auto;
    width: 25px;

    transform: scale(1.6);
}

.check-menu ~ .check-menu__icon .check-menu__close {
    display: none;
}

.check-menu:checked ~ .check-menu__icon .check-menu__close {
    display: block;
}





.nav-burger {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 70px;
    right: -18px;

    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(50px);
    max-height: 0;
    font-size: 0;
    overflow: hidden;
    transition: all 0.2s linear;
}





.nav__link {
        position: relative;
        display: inline-block;
        padding: 1.08rem;

        
        text-decoration: none;
        transition: all 0.2s linear;

        color: hsl(243, 87%, 12%);
        text-align: center;
}
.nav__link:hover {
    color: #9c9bd8;
}

.nav__link:active {
    color: #6b6a99;
    transform: scale(0.9);
}

.nav__link:hover:after {
    content: "";
    margin-right: -2.009rem;
    width: 4.01rem;
    height: 0.06rem;

    position: absolute;
    bottom: 20%;
    right: 50%;

    background-color: #9c9bd8;
}





.active {
    position: relative;
    display: inline-block;
    padding: 1.08rem;

    
    text-decoration: none;
    transition: all 0.2s linear;

    color: #d09e2d;
}

.active:after {
    content: "";
    margin-right: -2.009rem;
    width: 4.01rem;
    height: 0.06rem;

    position: absolute;
    bottom: 20%;
    right: 50%;

    background-color: #d09e2d;
}







/*------/ Part-1 /------*/

.part-1 {
    margin: 0px auto 20rem;
    padding: 0px 3.125rem 0px 1.56rem;
    max-width: 1350px;
    display: flex;
}

@media (max-width: 992px) {
    .part-1 {
        margin-bottom: 15rem;

        flex-direction: column-reverse;
        padding: 0px 1.2rem;
    }
}

@media (max-width: 767px) {
    .part-1 {
        margin-top: 40px;
    }
}

@media (max-width: 377px) {
    .part-1 {
        margin-bottom: 10rem;
    }
}





.part-1__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-basis: 50%;
}

@media (max-width: 992px) {
    .part-1__info {
        text-align: center;
    }
}





.image {
    max-width: 100%;
    flex-basis: 50%;
}





.illustration-1 {
    position: relative;
    top: 3.75rem;
    max-width: 100%;
}

@media (max-width: 992px) {
    .illustration-1 {
        margin-bottom: 7rem;
        padding: 0px 1.2rem;
    }
}

@media (max-width: 377px) {
    .illustration-1 {
        padding: 0px;
    }
}





.title {
    font-family: 'Raleway', sans-serif;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.5;
    color: hsl(243, 87%, 12%);
}





.part-1__title {
    padding-right: 1.25rem;
    margin-bottom: 1.25rem;
}

@media (max-width: 992px) {
    .part-1__title {
        padding: 0px;
    }
}





.text {
    margin-bottom: 1.25rem;
    color: hsl(243, 87%, 12%);
}





.part-1__text {
    padding-right: 6.25rem;
}

@media (max-width: 992px) {
    .part-1__text {
        padding: 0px;
    }
}





.part-1__mail {
    display: flex;
}

@media (max-width: 992px) {
    .part-1__mail {
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .part-1__mail {
        flex-direction: column;
        margin-top: 1rem;
    }
}





.btn {
    display: inline-block;
    padding: 0.68rem 3.75rem;

    text-decoration: none;
    box-shadow: 2px 2px 5px rgb(220 218 218);
    border-radius: 3px;
    background-color: hsl(224, 93%, 58%);

    font-size: 0.9rem;
    color: #fff;
    transition: all 0.2s linear;
}

.btn:hover {
    background-color: hsl(224, 77%, 47%);
    box-shadow: 0px 0px 3px hsl(224, 77%, 47%);
}

.btn:active {
    background-color: hsl(224, 79%, 37%);
    box-shadow: 0px 0px 3px hsl(224, 79%, 37%);
    transform: scale(0.95);
}





.part-1__btn {
    margin-left: 0.8rem;
}

@media (max-width: 767px) {
    .part-1__btn {
        margin: 0.8rem auto 0px;
        padding: 0.8rem 8.21rem;
    }
}

@media (max-width: 377px) {
    .part-1__btn {
        padding: 0.8rem 6.21rem;
    }
}





.input {
    padding: 0.81rem 3.75rem 0.62rem 0.93rem; 
    border: 1px solid hsl(243, 87%, 12%);
    border-radius: 3px;
    transition: all 0.2s linear;
}

.input::placeholder {
    color: #cac9ca;
}

.input:focus {
    color: #333;
    border: 1px solid hsl(224, 93%, 58%);
    outline: none;
    box-shadow: 0px 0px 3px hsl(224, 93%, 58%);
}





@media (max-width: 767px) {
    .part-1__input {
        padding-right: 10rem;
    }
}

@media (max-width: 377px) {
    .part-1__input {
        padding: 0.8rem 6rem 0.8rem 0.93rem;
    }
}







/*------/ Part-2 /------*/

.container__part-2 {
    background-color: #f8f8fe;
    position: relative;
}





.bg-image__curve {
    min-width: 100%;
    max-height: 114px;
    position: relative;
    top: -110px;
    left: 0;
}

@media (max-width: 767px) {
    .bg-image__curve {
        display: none;
    }
}





.bg-image__curve-mobile {
    display: none;
}

@media (max-width: 767px) {
    .bg-image__curve-mobile {
        display: inline;
        min-width: 100%;
        position: relative;
        top: -70px;
        left: 0;
    }
} 

@media (max-width: 500px) {
    .bg-image__curve-mobile {
        top: -45px;
    }
}





.part-2 {
    margin: 0px auto;
    padding: 0px 3.125rem 6.25rem 1.56rem;
    max-width: 1350px;
    display: flex;

    background-color: #f8f8fe;
}

@media (max-width: 992px) {
    .part-2 {
        flex-direction: column-reverse;
        padding: 0px 1.2rem 6.25rem;
    }
}





.part-2__info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-basis: 50%;
}

@media (max-width: 992px) {
    .part-2__info {
        text-align: center;
        align-items: center;
    }
}





.part-2__image {
    flex-basis: 45%;
}





.part-2__title {
    margin-bottom: 1.25rem;
}





.part-2__text {
    max-width: 31.25rem;
}





.part-2__see-more {
    display: flex;
    margin-bottom: 3rem;
}





.see-more__btn {
    display: flex;
    position: relative;

    align-items: center;
    text-decoration: none;

    transition: all 0.2s linear;
}

.see-more__btn:hover {
    transform: translateX(3px);
}

.see-more__btn:active {
    transform: scale(0.95);
}

.see-more__btn::after {
    content: "";
    width: 10.2rem;
    height: 1px;

    box-shadow: 0px 0px 1px #3da08f;
    background-color: #3da08f;

    position: absolute;
    bottom: -3px;
    left: 0;
}





.see-more__text {
    display: inline-block;
    color: #3da08f;
}





.see-more__image {
    margin-left: 0.3rem;
    max-width: 100%;
}





.part-2__comment {
    padding: 1.25rem 1.87rem 1.87rem;
    max-width: 21.87rem;
    display: flex;
    flex-direction: column;

    font-size: 0.87rem;
    color: hsl(243, 87%, 12%);
    text-align: left;

    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0px 0px 10px #e4dddd;
}





.bg__image {
    max-width: 100%;
}





.comment__avtor {
    margin-top: 1.25rem;
    display: flex;
}





.avtor__avatar {
    display: flex;
}





.avtor__image {
    border-radius: 50%;
}





.avtor__data {
    margin-left: 0.62rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}





.avtor__name {
    font-size: 0.81rem;
    font-weight: 700;
} 





.avtor__position {
    font-size: 0.68rem;
}





.part-2__image {
    position: relative;
}





.illustration-2 {
    position: relative;
    top: 1.87rem;
    left: 3.75rem;
    max-width: 100%;
}

@media (max-width: 992px) {
    .illustration-2 {
        margin-bottom: 5rem;
        padding: 0px 1.2rem;
        top: 0;
        left: 0;
    }
}

@media (max-width: 377px) {
    .illustration-2 {
        padding: 0px;
        margin-bottom: 2.5rem;
    }
}






/*------/ Support /------*/
.container__support {
    background-color:  hsl(238deg 26% 40%);
}





.support {
    margin: 0px auto 0px;
    padding: 5rem 3.125rem 3rem 1.56rem;
    max-width: 1350px;
    display: flex;
}

@media (max-width: 992px) {
    .support {
        padding: 5rem 1.2rem 3rem;

        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}





.support__info {
    display: flex;
    flex-direction: column;
    flex-basis: 50%;
}





.support__title {
    margin-bottom: 1rem;

    font-size: 1.9rem;
    color: #ffffffe0;
}





.support__text {
    max-width: 500px;
    color: #ffffffe0;
}





.support__connection {
    padding-left: 5.62rem;
    flex-direction: column;
    flex-basis: 50%;
}

@media (max-width: 992px) {
    .support__connection {
        padding: 0px;
    }
}





.support__input {
    padding-right: 15.62rem;
    margin-bottom: 0.9rem;
    display: block;
}

@media (max-width: 992px) {
    .support__input {
        padding-right: 10rem;
    }
}

@media (max-width: 377px) {
    .support__input {
        padding: 0.8rem 6rem 0.8rem 0.93rem;
    }
}





.connection__btn {
    padding: 0.8rem 1.75rem;
    display: inline-block;

    font-size: 0.8rem;

    box-shadow: 2px 2px 5px rgb(66 67 103);
}

.connection__btn:hover {
    box-shadow: 0px 0px 10px rgb(66 67 103);
}

@media (max-width: 992px) {
    .connection__btn {
        padding: 0.8rem 6.84rem;
    }
}

@media (max-width: 377px) {
    .connection__btn {
        padding: 0.8rem 4.83rem;
    }
}






/*------/ Footer /------*/

.container__footer {
    background-color: hsl(243, 87%, 12%);
    
}





.footer {
    margin: 0px auto 0px;
    padding: 5rem 3.125rem 3rem 1.56rem;
    max-width: 1350px;
}

@media (max-width: 992px) {
    .footer {
        padding: 5rem 3.125rem 3rem;
    }
}

@media (max-width: 377px) {
    .footer {
        padding: 5rem 1.56rem 3rem 2rem;
    }
}





.footer__image {
   margin-bottom: 1.25rem;
}





.footer__info {
    display: flex;
}

@media (max-width: 992px) {
    .footer__info {
        flex-direction: column;
    }
}





.footer-contact {
    padding-right: 1.25rem;
    display: flex;
    flex-direction: column;
    flex-basis: 33.333%;
}

@media (max-width: 992px) {
    .footer-contact {
        padding: 0px;
    }
}





.contact__icon {
    margin-right: 0.9rem;
    max-width: 100%;

    opacity: 0.8;
    transition: all 0.2s linear;
}

.contact__link:hover .contact__icon {
    transform: scale(1.1);
}





.contact__link {
    margin-bottom: 1rem;
    display: flex;
    
    text-decoration: none;
    color: #ffffffbf;
    transition: all 0.2s linear;
}

.contact__link:hover {
    text-decoration: underline;
}

.contact__link:active {
    transform: scale(0.95);
}





.footer__about {
    display: flex;
    flex-basis: 33.333%;
    justify-content: space-between;

    color: #ffffffbf;
    font-size: 0.8rem;
}

@media (max-width: 992px) {
    .footer__about {
        padding: 3rem 3.125rem 3rem;
        justify-content: space-around;
    }
}

@media (max-width: 767px) {
    .footer__about {
        padding-top: 2rem;
    }
}

@media (max-width: 377px) {
    .footer__about {
        flex-direction: column;
        padding-left: 0px;
    }
}





.about__column-1 {
    display: flex;
    flex-direction: column;
}

@media (max-width: 377px) {
    .about__column-1 {
        margin-bottom: 1rem;
    }
}





.column-1__iteam {
    margin-bottom: 0.62rem;

    text-decoration: none;
    color: #ffffffbf;
    transition: all 0.2s linear;
}

.column-1__iteam:hover {
    text-decoration: underline;
    transform: scale(1.05);
}

.column-1__iteam:active {
    transform: scale(0.95);
}





.about__column-2 {
    display: flex;
    flex-direction: column;
}





.column-2__iteam {
    margin-bottom: 0.62rem;

    text-decoration: none;
    color: #ffffffbf;
    transition: all 0.2s linear;
}

.column-2__iteam:hover {
    text-decoration: underline;
    transform: scale(1.05);
}

.column-2__iteam:active {
    transform: scale(0.95);
}






.footer__social {
    display: flex;
    flex-basis: 33.333%;
    justify-content: center;
}




.social__link {
    margin-left: 1.56rem;
    display: inline-block;

    text-decoration: none;
    transition: all 0.2s linear;
}

.social__link:hover {
    transform: scale(1.05);
}

.social__link:active {
    transform: scale(0.95);
}

@media (max-width: 992px) {
    .social__link {
        margin: 0px 2rem;
    }
}

@media (max-width: 400px) {
    .social__link {
        margin: 0px 1.5rem;
    }
}







/*------/ TEAM.html /------*/

.team__container {
    background-image: linear-gradient(to top, #8d88a4, #a8a4ba, #c5c2d1, #e1e0e8, #ffffff);
}

@media (max-width: 767px) {
    .team__container {
        margin-top: 80px;
    }   
}





.team {
    margin: 0px auto 0px;
    padding: 1.56rem 3.125rem 0px 1.56rem;
    max-width: 1350px;

    display: flex;
    flex-direction: column;
}





.team__title {
    margin-bottom: 3rem;
    position: relative;

    text-align: center;
    font-size: 3.5rem;
}

.team__title::after {
    margin-left: -9.37rem;
    content: "";
    height: 1px;
    width: 18.75rem;

    position: absolute;
    bottom: 0;
    left: 50%;

    background-color: hsl(243, 87%, 12%);
    box-shadow: 0px 0px 2px hsl(243, 87%, 12%);
}

@media (max-width: 355px) {
    .team__title {
        font-size: 2.5rem;
    }

    .team__title::after {
        margin-left: -7rem;
        width: 14rem;
    }
}




.team__row {
    margin-bottom: 1.56rem;
    display: flex;
    flex-direction: column;
}





.team__block {
    position: relative;
    margin-bottom: 2rem;
}





.team__block:after {
    content: "";
    height: 100%;
    width: 1px;
    background-color: hsl(243, 87%, 12%);
    box-shadow: 0px 0px 2px hsl(243, 87%, 12%);

    position: absolute;
    left: 0;
    top: 0;
}





.block-1__member,
.block-2__member,
.block-3__member,
.block-4__member,
.block-5__member {
    display: flex;
}





.block-1__image,
.block-2__image,
.block-3__image,
.block-4__image,
.block-5__image {
    display: block;
    border-radius: 50%;
    box-shadow: 0px 0px 10px #2e298b;
}





.block-1__member-info,
.block-2__member-info,
.block-3__member-info,
.block-4__member-info,
.block-5__member-info {
    margin-left: 0.62rem;

    display: flex;
    flex-direction: column;
    justify-content: center;
}





.block-1__name,
.block-2__name,
.block-3__name,
.block-4__name,
.block-5__name {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;

    color: hsl(243, 87%, 12%);
}





.block-1__position,
.block-2__position,
.block-3__position,
.block-4__position,
.block-5__position {
    font-family: 'Raleway', sans-serif;
    font-size: 0.9rem;
    color: hsl(243, 87%, 12%)
}





.block-1__text,
.block-2__text,
.block-3__text,
.block-4__text,
.block-5__text {
    margin: 0.9rem auto 0px;
    font-size: 0.9rem;
}






/*------/ block-1 /------*/

.block-1 {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;

    border-radius: 10px;/*
    background-color: #eeecf1;
    box-shadow: 0px 0px 10px #dfdced;*/
}






/*------/ block-2 /------*/

.block-2 {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;

    border-radius: 10px; /*
    background-color: #eeecf1;
    box-shadow: 0px 0px 10px #dfdced;*/
}






/*------/ block-3 /------*/

.block-3 {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;

    border-radius: 10px; /*
    background-color: #eeecf1;
    box-shadow: 0px 0px 10px #dfdced;*/
}






/*------/ block-4 /------*/

.block-4 {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;

    border-radius: 10px;/*
    background-color: #eeecf1;
    box-shadow: 0px 0px 10px #dfdced;*/
}






/*------/ block-5 /------*/

.block-5 {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;

    border-radius: 10px;
}






/*------/ Sign-IN.html /------*/

.sign-in__container {
    background-image: linear-gradient(to top, #8d88a4, #a8a4ba, #c5c2d1, #e1e0e8, #ffffff);
}

@media (max-width: 767px) {
    .sign-in__container {
        margin-top: 60px;
    }
}





.sign-in {
    margin: 0px auto 0px;
    padding: 3rem 2rem 0px;
    max-width: 1350px;

    display: flex;
    flex-direction: column;
}

@media (max-width: 428px) {
    .sign-in {
        padding: 3rem 0.5rem 0px;
    }
}





.sign-in__title {
    margin-bottom: 3rem;
    position: relative;

    text-align: center;
    font-size: 2.3rem;
}

.sign-in__title:after {
    margin-left: -4.68rem;
    content: "";
    height: 1px;
    width: 9.37rem;

    position: absolute;
    bottom: 0;
    left: 50%;

    background-color: hsl(243, 87%, 12%);
    box-shadow: 0px 0px 2px hsl(243, 87%, 12%);
}

@media (max-width: 767px) {
    .sign-in__title {
        margin-bottom: 1rem;
    }
}





.sign-in__area {
    padding: 6.25rem 4.37rem 3.12rem;
    margin: 2rem auto 6.25rem;
    max-width: 364px;

    display: flex;
    flex-direction: column;
    position: relative;

    border-radius: 10px;
    box-shadow: 0px 0px 15px #797893;
    background-image: linear-gradient(to right top, #837896, #c586a7, #ff9997, #ffc177, #f9f871);
}

@media (max-width: 428px) {
    .sign-in__area {
        padding: 6.25rem 3rem 3.12rem;
    }
}

@media (max-width: 374px) {
    .sign-in__area {
        padding: 6.25rem 2rem 3.12rem;
    }
}





.sign-in__email {
    display: flex;
    flex-direction: column;

    position: relative;
}





.sign-in__label {
    margin-bottom: 0.5rem;
    position: relative;
}

.sign-in__label:after {
    content: "";
    height: 1px;
    width: 100%;

    background-color: hsl(243, 87%, 12%);
    box-shadow: 0px 0px 2px hsl(243deg 87% 12%);

    position: absolute;
    left: 0;
    top: 1.4rem;
}





.sign-in__password {
    display: flex;
    flex-direction: column;

    position: relative;
}





.sign-in__input {
    display: inline-block;
    margin: 0.5rem 0px 3.12rem;
    padding: 0.62rem 3.12rem 0.62rem 0.62rem;

    border-radius: 10px;
    border: 1px solid hsl(243, 87%, 12%);
    box-shadow: 0px 0px 2px hsl(243deg 87% 12%);

    position: relative;
}

.sign-in__input:focus {
    outline: none;
    border: 2px solid #5688e3;
}





.sign-in__btn {
    padding: 0.43rem 0.87rem;

    text-decoration: none;
    font-family: 'Raleway', sans-serif;
    color: #fff;
    text-align: center;

    border-radius: 10px;
    background-color: hsl(243deg 87% 12%);
    box-shadow: 0px 0px 10px hsl(243deg 87% 12%);

    position: relative;
    transition: all 0.2s linear;
}

.sign-in__btn:hover {
    transform: scale(1.05);
}

.sign-in__btn:active {
    transform: scale(0.95);
}





.sign-in__with {
    margin: 1.87rem 2.5rem 0px;
    display: flex;
    flex-direction: column;
}





.sign-in__with-text {
    text-align: center;
    font-weight: 700;
    color: hsl(243deg 87% 12%);

}





.sign-in__social {
    margin-top: 1.25rem;
    display: flex;
    justify-content: space-between;
}





.sign-in__icons {
    transform: scale(1.2);
    transition: all 0.2s linear;
}

.sign-in__icons:hover {
    transform: scale(1.4);
}

.sign-in__icons:active {
    transform: scale(1.1);
}






































































































