@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;1,200;1,300&display=swap');

*{
    box-sizing: border-box;
    margin: 0; padding: 0;
    transition: .3s;
}

body{
    background: #242c32;
    display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	font-family: 'Nunito', sans-serif;
	height: 95dvh;
}

.logo{
    width: 450px;
    height: 60px;
    background: url(images/logo.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.social{
    width: 380px;
    display: grid;
    justify-content: center;
    grid-template-columns: 33% 33% 33%;
    gap: 1rem;
    margin: 2rem 0 0;
}

a{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    text-decoration: none;
    font-size: 1.4rem;
    cursor: pointer;
    width: 100%;
    height: 2rem;
    border-radius: .5rem;
    background: #b3b8cd;
    color: #242c32;
}

a:hover{
    background: #ddd;
    transform: translateY(.2rem);
}

@media (max-width: 450px) {
    .logo{
        width: 90%;
    }

    .social{
        width: 70%;
    }
}