/* Alignment borders */
.Light {
    border: 2px solid #89CFF0;
}
.Dark {
    border: 2px solid red;
}
.Neutral {
    border: 2px solid #FAF9F6;
}

.game-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.game-square {
    width: 400px;
    height: 100px;

    display: flex;
    justify-content: flex-start;
    align-items: center;

    /* border: 2px solid white; */
    
    text-decoration: none;
    margin: 35px;

    transition: 0.4s ease-in-out;
}
.game-square img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 50%;
    object-fit: contain;

    margin-right: 5px;
}
.game-square:hover {
    transform: scale(1.1);
}
.game-square-desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    width: 100%;
    height: 100%;
    margin-left: 5px;

    background: rgba(0, 180, 255, 0.15);
    box-shadow:
        0 0 8px rgba(0, 180, 255, 0.6),
        inset 0 0 8px rgba(0, 180, 255, 0.4);
    border: 1px solid rgba(0, 200, 255, 0.6);
    border-radius: 4px;
}
.game-square-desc h2 {
    font-family: 'Star Jedi', sans-serif;
    font-size: 30px;
    letter-spacing: 0.2rem;
    color: #121213;
    text-shadow: -2px 0 yellow, 0 2px yellow, 2px 0 yellow, 0 -2px yellow;
    text-transform: lowercase;

    margin-top: 2px;
    margin-bottom: 4px;
}
.game-square-text {
    /* font-family: 'Star Jedi', sans-serif; */
    font-family: 'Times New Roman', Times, serif;
    font-size: 15px;

    margin-top: 4px;
    margin-bottom: 2px;
    color: white;
}

.landing-intro {
    width: 400px;
    /* height: 30vh; */
    overflow-y: auto;
    margin-top: 25px;
    padding-bottom: 30px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;

    background: rgba(0, 180, 255, 0.15);
    box-shadow:
        0 0 8px rgba(0, 180, 255, 0.6),
        inset 0 0 8px rgba(0, 180, 255, 0.4);
    border: 1px solid rgba(0, 200, 255, 0.6);
    border-radius: 4px;
}
.landing-intro h2 {
    font-family: 'Star Jedi', sans-serif;
    letter-spacing: 0.2rem;
    color: #121213;
    text-shadow: -2px 0 yellow, 0 2px yellow, 2px 0 yellow, 0 -2px yellow;
    text-transform: lowercase;
    
    margin-bottom: 5px;
    margin-left: 15px;
    margin-right: 15px;
}
.landing-intro p {
    font-family: 'Times New Roman', Times, serif;
    font-size: 17px;
    line-height: 2.0;
    color: white;
    
    margin-left: 15px;
    margin-right: 15px;
}