@import url('https://fonts.googleapis.com/css2?family=Averia+Serif+Libre:wght@400;700&family=Jacques+Francois&family=Lato:wght@400;700&display=swap');

:root{
    --color-givia-main: #1E78C2;
    --color-givia-second: #3AB5E6;
    --color-givia-header: #C2681E;
    --color-givia-header-second: #E5C6B4;
    --color-background: #F6F5FD;
}
  




.welcome-message{
    margin-top: 5vh;
    margin-inline: 250px;
    width: 562px;
    height: fit-content;
    border-radius: 26px;
    background: rgba(228, 237, 233, 0.90);

    color: var(--color-givia-main);

    display: flex;
    flex-flow: column;
    align-items: center;
    padding-block: 20px;
}

.welcome-message > p:nth-child(1){
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: normal; 
}

.welcome-message > p:nth-child(2){
    font-size: 24px;
    font-style: normal;
    font-weight: 400; 
    margin-bottom: 22px;
    margin-top: 5px;
}
.welcome-message > p:nth-child(3){
    width: 458px;
    height: auto;
    font-size: 20px;
    font-style: normal;
    font-weight: 400; 
    margin-bottom: 20px;
}

.homepage-container{
    background-image: url(../images/homepage_images/pic1.jpg);
    background-position: center;
    background-size: cover;
    transition: background 1s;
}


@media(max-width: 40em){

    .welcome-message{
        width: 100%;
        margin: 0;
        margin-top: 6vh;
        border-radius: 0;
        padding-bottom: 30px;
    }

    .welcome-message > p:nth-child(1){
        font-size: 6vw;
    }
    .welcome-message > p:nth-child(2){
        font-size: 4.2vw;
    }
    .welcome-message > p:nth-child(3){
        width: 80%;
        font-size: 4vw;
        height: auto;
    }
}

@media (min-width: 40em) and (max-width: 1100px){
    .homepage-container{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .welcome-message{
        margin:0;
        padding: 0;

    }
}