#social #s-media {
    text-align: left;
    margin-top: 1rem;
}

#social #s-media ul {
    float: left;
}

#social #s-media ul li {
    float: left;
    padding-left: 10px;
    list-style-type: none;
}  

.category{
    position: relative;
    top: 0;
    transition: top ease 0.2s;
}

p.category:hover {
    background-color: transparent!important;
    color: white!important;
    top: -3px;
}

.games-all {
    position: relative!important;
    top: 0!important;
    transition: top ease 0.2s!important;
    text-align: center!important;
    color: black !important;
    font-weight: bold;
}

.games-grid {
    position: relative!important;
    text-align: center!important;
    color: white !important;
    margin-left: 3rem !important; 
    margin-bottom: -4rem !important; 
    font-size: 15px !important;
    font-weight: bold;
}

.bold {
    font-weight: bold;
}

.black {
    color: black;
}

h3 {
    font-size: large;
    font-weight: bold;
}

.games-top {
    position: relative!important;
    color: black !important;
    font-size: 4rem!important;
    word-break: break-all;
    font-weight: bold;
}

.login-s {
    font-size: xx-large;
    font-weight: bold;
}

.p.games-all:hover {
    top: -3px!important;
}

.td-none {
    text-decoration: none!important;
}

.font-md {
    font-size: medium;
}

.align-center {
    text-align: center;
    margin: auto;
}

/* margin */

.m-left-1 {
    margin-left: 1rem;
}

.m-left-2 {
    margin-left: 2rem;
}

.m-left-3 {
    margin-left: 3rem;
}

.m-left-4 {
    margin-left: 4rem;
}

.m-left-5 {
    margin-left: 5rem;
}

/* negative margin */

.-m-left-1 {
    margin-left: -1rem;
}

.-m-left-2 {
    margin-left: -2rem;
}

.-m-left-3 {
    margin-left: -3rem;
}

.-m-left-4 {
    margin-left: -4rem;
}

.-m-left-5 {
    margin-left: -5rem;
}

.width-5 {
    width: 3rem;
}

.m-top-1 {
    margin-top: 1rem;;
}

.m-top-2 {
    margin-top: 2rem;;
}

.m-top-3 {
    margin-top: 3rem;;
}

.m-top-4 {
    margin-top: 4rem;;
}

.m-top-5 {
    margin-top: 5rem;;
}

.-m-top-1 {
    margin-top: -1rem;;
}

.-m-top-2 {
    margin-top: -2rem;;
}

.-m-top-3 {
    margin-top: -3rem;;
}

.-m-top-4 {
    margin-top: -4rem;;
}

.-m-top-5 {
    margin-top: -5rem;;
}

/* Padding */

.p-1 {
    padding: 1rem;
}

.p-2 {
    padding: 2rem;
}

.p-3 {
    padding: 3rem;
}

.p-4 {
    padding: 4rem;
}

.p-5 {
    padding: 5rem;
}

.d-inline {
    display: inline;
}