@import url('https://fonts.googleapis.com/css?family=Montserrat');

body{
    padding: 0;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

p {
    padding: 0;
    margin: 0;
}

.gridcontainer{
    width: 100vw;
    height: 100vh;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(8, 1fr);
}

.left{
    background-color: antiquewhite;
    grid-column: 1;
    grid-row: 1 / 9;
}

.right{
    background-color: #0e1111;
    grid-column: 2;
    grid-row: 1 / 9;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-direction: column;
}

.right a {
    width: 15vw;
}

.welcome {
    grid-column: 1;
    grid-row: 6 / 7;
    padding-left: 3vw;
    font-size: 5rem;
    align-items: bottom;
}

.intro {
    grid-column: 1;
    grid-row: 7 / 8;
    padding-left: 3vw;
    font-size: 2rem;
}


@media (max-width: 1200px) {

    .left{
        grid-column: 1 / 3;
         grid-row: 1 / 5;
    }

    .right{
        grid-column: 1 / 3;
         grid-row: 5 / 9;
         flex-direction: row;
    }

    .right a {
        width: 25vw;
    }

    .welcome{
        grid-row: 3  / 4;
        grid-column: 1 / 3;
        font-size: 3rem;
    }

    .intro{
        grid-row: 4  / 5;
        font-size: 1rem;
        grid-column: 1 / 3;
        align-items: flex-end; 
    }


}
