p.name {
    font-family: 'Ubuntu', sans-serif;
    text-align: center;
    font-size: 10vh;
    position: relative;
    color: white;
    top: 11vh;
    letter-spacing: 10px;
}


p.description {
    font-family: 'Ubuntu', sans-serif;
    text-align: center;
    font-size: 4vh;
    position: relative;
    color: white;
    top: 2vh;
    opacity: 0.7;
}


nav{
    position: relative;
    top: 8vh;
}


.ulsocial {
    margin: 0px;
    padding: 0px;
    font-size: 0px;
    text-align: center;
    text-align: center;
    position: relative;
    top: -4vh;

}


button.joinButton{
    font-family: 'Ubuntu', sans-serif;
    font-size: 18PX;
    color:black;
    opacity: 0.5;
    padding: 15px;
    border-radius:10px;
    margin:20px;
}

.buttons {
    text-align: center;
position: relative;
top: 11vh;
}

.social {
    padding-left: 15px;
    padding-right: 15px;
    display: inline;
}

.fab{
    color: white;
    opacity: 0.5;
    font-size: xxx-large;
    text-align: center;
}

.fas{
    color: white;
    opacity: 0.5;
    font-size: xxx-large;
    text-align: center;
}

.fab:hover {
    opacity: 1;
}

.fas:hover {
    opacity: 1;
}

body {
/*     making the background black as there was no color */
    background-color: black;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}


@media (max-width: 480px) {
    p.name {
        font-size: 7vh;
    }
    p.description{
        font-size:3vh;
        top: 4vh;
    }
}