@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;500;600;700&family=Red+Hat+Display:wght@300;400;500;600;700;800;900&family=Wix+Madefor+Text:wght@400;500;600;700&display=swap');
HTML, Body {
    font-family: 'Josefin Sans', sans-serif;
    font-family: 'Red Hat Display', sans-serif;
    font-family: 'Wix Madefor Text', sans-serif;
}

body {
    background-image:url("../images/tml-bg.png"); 
    background-size:cover;
    background-position-x: left;
    background-position-y: top;
    background-repeat:no-repeat;
    width:100vw;
    height:100vh;
    margin:0;   
}

.pink {
    color:#eb4c77!important;
}
.yellow {
    color:#e8ca1b!important;
}
.purple {
    color:#4d2770!important;
}
.blue {
    color:#1899aa!important;
}
.pinkBg {
    background-color:#eb4c77;
}
.yellowBg {
    background-color:#e8ca1b;
}
.purpleBg {
    background-color:#4d2770;
}
.blueBg {
    background-color:#1899aa;
}
h1, h2, h3, h4, h5, h6, p {
    margin-top:.8rem;
    margin-bottom:.8rem;
}
h1 {
    font-size:3rem;
    font-weight:700;
}
h2 {
    font-size:2.8rem;
    font-weight:700;
}
h3 {
    /*font-size:2.4rem;*/
    font-size:2vw;
    font-weight:700;
}
h4 {
    font-size:2rem;
    font-weight:600;
}
h5 {
    /*font-size:1.8rem;*/
    font-size:1.4vw;
    font-weight:600;
}
h6 {
    /*font-size:1.4rem;*/
    font-size:1.4vw;
    font-weight:500;
}
p {
    font-size:1rem;
    font-weight:400;
}

a.btn {
    color:white;
    text-decoration: none;
    font-size:1.4vw;
    display:inline-block;
    margin:0 1rem;
}

a.btnStyle {
    background-color:#eb4c77;
    color:white;
    padding:.5rem 1rem;
    border-radius:.4rem;
}
a.btnStyle:hover {
    background-color:#e8ca1b;
    color:#1899aa;
}
a.btnStyle>i {
    margin-right:1rem;
}

.logoBlock {
    background-image:url("../images/tml-logo.png");
    width:400px;
    height:170px;
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    margin-top:-140px;
}
.container {
    width:100vw;
    height:100vh;
    display:flex;
    align-items:center;
    justify-content:center; 
}

.contentBlock {
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    margin-top:10%;
    text-align:center;
   border-radius:74% 26% 36% 64% / 63% 59% 41% 37%;  
   width:60%;
   height:650px;
}
.messageBlock, .registrationBlock, .socialBlock {
    color:white;
}
.messageBlock {
    margin-top:1%;
}

@media only screen and (max-width: 600px) {
    h1, h2, h3, h4, h5, h6, p {
        margin-top:.5rem;
        margin-bottom:.5rem;
    }

    h3 {
        font-size:1.5rem;
    }

    h5 {
        font-size:1rem;
    }
    h6 {
        font-size:1rem;
    }

    a.btn {
        font-size:1rem;
    }

    .logoBlock {
        width:100%;
        height:115px;
        margin-top:-100px;
    }
    .contentBlock {
    margin-top:55%;
    border-radius:74% 36% 40% 64% / 53% 59% 51% 37%;  
    width:95%;
    height:380px;
    }
    .socialBlock {
        width:75%;
    }
}