@import url('./style.css');

.home-main{
    display: flex;
    justify-content: center;
height: 100vh;
    min-height: 650px;
    flex-direction: row;
    font-family: var(--body-font-family);
}

.home-image{
    background-image: url(../img/homeBg.jpg);
    min-width:42.1875vw ;
    background-position: center;
    background-size: cover;
}

.home-info{
    padding: 8vh 11vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.home-info-title{
font-weight: bold;
font-size: var(--h1-font-size);
line-height: 1.1754;
text-align: right;
padding-left: 1vw;
margin: 0 0 3vh 0;
}

.home-info-text{
    font-size: var(--body-text);
    line-height: 1.167;
    text-align: justify;
    margin: 0 0 3vh 0;
    }

.home-info-links {
    display: flex;
    flex-direction: column;
}

.home-info-link{
    font-family: var(--heading-font-family);
font-weight: bold;
font-size: var(--body-text);
line-height: 1.18;
text-align: center;
border: 3px solid var(--primary-color);
padding: 2.083vh;
color: var(--primary-color);
}

.home-info-link:nth-of-type(2n+1){
    color: var(--primary-color);
}

.home-info-link:nth-of-type(2){
    color: #FFFFFF;
    background-color: var(--primary-color);
    margin: 18px 0;
}


/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {  
    .home-image{
        width: 100vw;
position: relative;
height: 100%;
z-index: -1;
background: linear-gradient(rgba(24, 24, 24, 0.6), rgba(24, 24, 24, 0.6)) ,  url(../img/homeBg.jpg) center center;
    }

    .home-info-title{
        padding-left: 0;
    }

    .home-main{
        color: #FFFFFF;
        min-height:unset ;
        height: max(100vh,850px);
    }
    .home-info{
        top: 120px;
        position: absolute;
        padding: 2vh 9.5vw;
    }

    .home-info-link:last-of-type{ 
        border-color: #FFFFFF ;
        color: #FFFFFF;
    }

}