@font-face {
    font-family: black;
    src: url(../fonts/Merriweather-Black.ttf);
}
@font-face {
    font-family: blackItalic;
    src: url(../fonts/Merriweather-BlackItalic.ttf);
}
@font-face {
    font-family: bold;
    src: url(../fonts/Merriweather-Bold.ttf);
}
@font-face {
    font-family: boldItalic;
    src: url(../fonts/Merriweather-Blackitalic.ttf);
}
@font-face {
    font-family: italic;
    src: url(../fonts/Merriweather-Italic.ttf);
}
@font-face {
    font-family: light;
    src: url(../fonts/Merriweather-Light.ttf);
}
@font-face {
    font-family: lightItalic;
    src: url(../fonts/Merriweather-LightItalic.ttf);
}
@font-face {
    font-family: regular;
    src: url(../fonts/Merriweather-Regular.ttf);
}



















body {
    margin:0;
    padding:0;
    font-size:10px;
    background:url('../img/1/background.png');
    background-size:cover;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}





@media (min-width:1500px) {
.logo {
    width:205px;
    margin-bottom: -100px;
    z-index:3;
}
.main {
    width: 1345px;
    height:700px;
    margin-top: 40px;
    border:35px solid white;
    border-radius: 120px;
    background:url('../img/1/back.png');
    background-size: cover;
    background-position: right bottom;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
}
.main__top {
    width:1455px;
    position: absolute;
    left:-60px;
    top:-75px;
    height: 270px;
}
.main__oalph {
    position: absolute;
    bottom:0;
    left: 50px;
    width:550px;
    z-index: 3;
}
.main-hero {
    position:absolute;
    right:-80px;
    top:-20px;
    z-index:3;
}
.main-hero__avatar {
    width:325px;
}
.main-hero__name {
    position: absolute;
    top: 260px;
    left: 120px;
    font-family: black;
    font-size: 3.3em;
    color:#2f383f;
}
.main-firstReplica {
    width: 662px;
    height:173px;
    border-radius: 75px;
    background-color: rgb(255,255,255,0.7);
    margin-top: 163px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items:center;
}
.main-firstReplica__text {
    font-size:33px;
    font-family: bold;
    color: #2d2d2d;
    margin-left: 60px;
}
.main-secondReplica {
    width: 778px;
    height: 191px;
    border-radius: 70px 0px 0px 70px;
    filter: drop-shadow(0px 10px 8px rgba(0,0,0,0.13));
    background-color: rgba(239, 161, 39, 0.8);
    margin-top: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index:2;
}
.main-secondReplica__text {
    font-family: bold;
    font-size: 25px;
    color: #2d2d2d;
    width: 700px;
}
.main-secondReplica__text span {
    font-family: black;
    color: #131313;
}
.main-secondReplica__arrow {
    position: absolute;
    left: 440px;
    bottom:-150px;
    width: 180px;
    opacity:0.9;
}
.main-button {
    align-self: center;
    width: 570px;
    height: 114px;
    border-radius: 57px;
    background-image: linear-gradient(135deg, #2193af 0%, #6dd5ed 100%);
    border: 8px solid #ffffff;
    position: absolute;
    bottom: -75px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family:bold;
    font-size: 3em;
    color: white;
    cursor: pointer;
    text-decoration: none;
    box-shadow:0px 1px 24px 11px rgba(109, 213, 237, 0.69);
}
.main-button img {
    width:65px;
    margin-left: 27px;
}
}























@media (min-width:1200px) and (max-width: 1499px) {
    .logo {
        width:180px;
        margin-bottom:-90px;
        z-index:3;
    }
    .main {
        width: 1070px;
        height:700px;
        margin-top: 40px;
        border:25px solid white;
        border-radius: 120px;
        background:url('../img/1/back.png');
        background-size: cover;
        background-position: right bottom;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-end;
    }
    .main__top {
        width:1150px;
        position: absolute;
        left:-50px;
        top:-50px;
        height: 200px;
    }
    .main__oalph {
        position: absolute;
        bottom:0;
        left: 50px;
        width:350px;
        z-index: 3;
    }
    .main-hero {
        position:absolute;
        right:-40px;
        top:-20px;
        z-index:3;
    }
    .main-hero__avatar {
        width:300px;
    }
    .main-hero__name {
        position: absolute;
        top:235px;
        left: 110px;
        font-family: black;
        font-size: 3.3em;
        color:#2f383f;
    }
    .main-firstReplica {
        width: 622px;
        height:173px;
        border-radius: 75px 0px 0px 75px;
        background-color: rgb(255,255,255,0.7);
        margin-top: 133px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items:center;
    }
    .main-firstReplica__text {
        font-size:29px;
        font-family: bold;
        color: #2d2d2d;
        margin-left: 50px;
    }
    .main-secondReplica {
        width: 678px;
        height: 161px;
        border-radius: 70px 0px 0px 70px;
        filter: drop-shadow(0px 10px 8px rgba(0,0,0,0.13));
        background-color: rgba(239, 161, 39, 0.8);
        margin-top: 70px;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index:2;
    }
    .main-secondReplica__text {
        font-family: bold;
        font-size: 21px;
        color: #2d2d2d;
        width: 520px;
    }
    .main-secondReplica__text span {
        font-family: black;
        color: #131313;
    }
    .main-secondReplica__arrow {
        position: absolute;
        left: 440px;
        bottom:-150px;
        width: 180px;
        opacity:0.9;
    }
    .main-button {
        align-self: center;
        width: 570px;
        height: 114px;
        border-radius: 57px;
        background-image: linear-gradient(135deg, #2193af 0%, #6dd5ed 100%);
        border: 8px solid #ffffff;
        position: absolute;
        bottom: -75px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-family:bold;
        font-size: 3em;
        color: white;
        cursor: pointer;
        text-decoration: none;
        box-shadow:0px 1px 24px 11px rgba(109, 213, 237, 0.69);
    }
    .main-button img {
        width:65px;
        margin-left: 27px;
    }
}






















@media (min-width:900px) and (max-width: 1199px) {
    .logo {
        width:150px;
        margin-bottom:-80px;
        z-index:3;
    }
    .main {
        width: 800px;
        height:600px;
        margin-top: 40px;
        border:25px solid white;
        border-radius: 120px;
        background:url('../img/1/back.png');
        background-size: cover;
        background-position: right bottom;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-end;
    }
    .main__top {
        width:860px;
        position: absolute;
        left:-40px;
        top:-50px;
        height: 200px;
    }
    .main__oalph {
        position: absolute;
        bottom:0;
        left: 70px;
        width:220px;
        z-index: 3;
    }
    .main-hero {
        position:absolute;
        right:-40px;
        top:-20px;
        z-index:3;
    }
    .main-hero__avatar {
        width:250px;
    }
    .main-hero__name {
        position: absolute;
        top:195px;
        left: 80px;
        font-family: black;
        font-size: 3em;
        color:#2f383f;
    }
    .main-firstReplica {
        width: 500px;
        height:143px;
        border-radius: 75px 0px 0px 75px;
        background-color: rgb(255,255,255,0.7);
        margin-top: 133px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items:center;
    }
    .main-firstReplica__text {
        font-size:24px;
        font-family: bold;
        color: #2d2d2d;
        margin-left: 40px;
    }
    .main-secondReplica {
        width: 638px;
        height: 121px;
        border-radius: 70px 0px 0px 70px;
        filter: drop-shadow(0px 10px 8px rgba(0,0,0,0.13));
        background-color: rgba(239, 161, 39, 0.8);
        margin-top: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index:2;
    }
    .main-secondReplica__text {
        font-family: bold;
        font-size: 18px;
        color: #2d2d2d;
        width: 520px;
    }
    .main-secondReplica__text span {
        font-family: black;
        color: #131313;
    }
    .main-secondReplica__arrow {
        position: absolute;
        left: 440px;
        bottom:-150px;
        width: 180px;
        opacity:0.9;
    }
    .main-button {
        align-self: center;
        width: 470px;
        height: 90px;
        border-radius: 57px;
        background-image: linear-gradient(135deg, #2193af 0%, #6dd5ed 100%);
        border: 8px solid #ffffff;
        position: absolute;
        bottom: -65px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-family:bold;
        font-size: 2.6em;
        color: white;
        cursor: pointer;
        text-decoration: none;
        z-index: 4;
        box-shadow:0px 1px 24px 11px rgba(109, 213, 237, 0.69);
    }
    .main-button img {
        width:55px;
        margin-left: 27px;
    }
}




















@media (min-width:600px) and (max-width: 899px) {
    .logo {
        width:120px;
        margin-bottom:-70px;
        z-index:3;
    }
    .main {
        width: 530px;
        height:600px;
        margin-top: 40px;
        border:20px solid white;
        border-radius: 80px;
        background:url('../img/1/back.png');
        background-size: cover;
        background-position: right bottom;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-end;
    }
    .main__top {
        width:580px;
        position: absolute;
        left:-30px;
        top:-45px;
        height: 160px;
    }
    .main__oalph {
        position: absolute;
        bottom:0;
        left: 70px;
        width:220px;
        z-index: 3;
    }
    .main-hero {
        position:absolute;
        right:-30px;
        top:-20px;
        z-index:3;
    }
    .main-hero__avatar {
        width:190px;
    }
    .main-hero__name {
        position: absolute;
        top:155px;
        left: 65px;
        font-family: black;
        font-size: 2.6em;
        color:#2f383f;
    }
    .main-firstReplica {
        width: 350px;
        height:143px;
        border-radius: 75px 0px 0px 75px;
        background-color: rgb(255,255,255,0.7);
        margin-top: 133px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items:center;
    }
    .main-firstReplica__text {
        font-size:20px;
        font-family: bold;
        color: #2d2d2d;
        margin-left: 40px;
        z-index:5;
    }
    .main-secondReplica {
        width: 488px;
        height: 101px;
        border-radius: 70px 0px 0px 70px;
        filter: drop-shadow(0px 10px 8px rgba(0,0,0,0.13));
        background-color: rgba(239, 161, 39, 0.8);
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index:2;
    }
    .main-secondReplica__text {
        font-family: bold;
        font-size: 16px;
        color: #2d2d2d;
        width: 420px;
    }
    .main-secondReplica__text span {
        font-family: black;
        color: #131313;
    }
    .main-secondReplica__arrow {
        position: absolute;
        left: 307px;
        transform:rotate(-30deg);
        bottom:-150px;
        width: 180px;
        opacity:0.9;
    }
    .main-button {
        align-self: center;
        width: 470px;
        height: 90px;
        border-radius: 57px;
        background-image: linear-gradient(135deg, #2193af 0%, #6dd5ed 100%);
        border: 8px solid #ffffff;
        position: absolute;
        bottom: -65px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-family:bold;
        font-size: 2.6em;
        color: white;
        cursor: pointer;
        text-decoration: none;
        z-index: 4;
        box-shadow:0px 1px 24px 11px rgba(109, 213, 237, 0.69);
    }
    .main-button img {
        width:55px;
        margin-left: 27px;
    }
}















@media (min-width:1px) and (max-width: 599px) {
    .logo {
        width:120px;
        margin-bottom:-70px;
        z-index:3;
    }
    .main {
        width: 100%;
        height:600px;
        margin-top: 40px;
        border-top: 20px solid white;
        border-bottom: 20px solid white;
        background:url('../img/1/back.png');
        background-size: cover;
        background-position: right bottom;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-end;
    }
    .main__top {
        width:100%;
        position: absolute;
        top:-45px;
        height: 140px;
    }
    .main__oalph {
        position: absolute;
        bottom:0;
        left: 20px;
        width:220px;
        z-index: 3;
    }
    .main-hero {
        position:absolute;
        right: 10px;
        top:-20px;
        z-index:3;
    }
    .main-hero__avatar {
        width:140px;
    }
    .main-hero__name {
        position: absolute;
        top:105px;
        left: 45px;
        font-family: black;
        font-size: 2.2em;
        color:#2f383f;
    }
    .main-firstReplica {
        width: 90%;
        max-width: 400px;
        height:123px;
        border-radius: 75px 0px 0px 75px;
        background-color: rgb(255,255,255,0.7);
        margin-top: 113px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items:center;
    }
    .main-firstReplica__text {
        font-size:20px;
        font-family: bold;
        color: #2d2d2d;
        margin-left: 40px;
        z-index:5;
    }
    .main-secondReplica {
        width: 95%;
        border-radius: 70px 0px 0px 70px;
        filter: drop-shadow(0px 10px 8px rgba(0,0,0,0.13));
        background-color: rgba(239, 161, 39, 0.8);
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index:2;
    }
    .main-secondReplica__text {
        font-family: bold;
        font-size: 16px;
        color: #2d2d2d;
        width: 80%;
        margin-left: 20px;
        margin-bottom:20px;
        margin-top: 20px;
    }
    .main-secondReplica__text span {
        font-family: black;
        color: #131313;
    }
    .main-secondReplica__arrow {
        position: absolute;
        left: 307px;
        transform:rotate(-30deg);
        bottom:-150px;
        width: 180px;
        opacity:0.9;
        display: none;
    }
    .main-button {
        align-self: center;
        width: 300px;
        height: 70px;
        border-radius: 37px;
        background-image: linear-gradient(135deg, #2193af 0%, #6dd5ed 100%);
        border: 4px solid #ffffff;
        position: absolute;
        bottom: -45px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-family:bold;
        font-size: 1.8em;
        color: white;
        cursor: pointer;
        text-decoration: none;
        z-index: 4;
        box-shadow:0px 1px 24px 11px rgba(109, 213, 237, 0.69);
    }
    .main-button img {
        width:45px;
        margin-left: 17px;
    }
}