*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Outfit","Quicksand", sans-serif;
    box-sizing: border-box;
}

body{
    background-color: #030637;
    overflow-x: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100vh;
}


.homeContainer{
    width: 50vw;
    height: 50vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.homeContainer .links{
    width: 20vw;
    height: 20vh;
    border-radius: 15px;
    background-color: rgba(175, 174, 174, 0.281);
    display: flex;
    align-items: center;
    justify-content: center;
}

.links a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.links a p{
    font-size: 1.1rem;
    color: #030637;
    text-decoration: none;
    cursor: pointer;
}


.links a span:first-child, .links a span:last-child{
    color: #D80032;
    font-size: 2.5rem;
}

.links a span{
    font-size: 1.1rem;
    color: white;
}




/*                                                                   MEDIA                                                   */

@media (max-width: 320px) {

    .homeContainer{
        width: 100vw;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        flex-direction: column;
    }

    .homeContainer .links{
        width: 75vw;
        height: 20vh;
    }

    .links a span:first-child, .links a span:last-child{
        color: #D80032;
        font-size: 2rem;
    }
    
    .links a span{
        font-size: 0.8rem;
        color: white;
    }


}
@media (max-width: 480px) {
    .homeContainer{
        width: 100vw;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        flex-direction: column;
    }

    .homeContainer .links{
        width: 75vw;
        height: 20vh;
    }
}

@media (max-width: 768px) {
    .homeContainer{
        width: 100vw;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        flex-direction: column;
    }

    .homeContainer .links{
        width: 75vw;
        height: 20vh;
    }


}
@media (max-width: 1024px) {




}
@media (min-width: 1025px) {




}
@media (min-width: 1440px) {

    
}
