body {
    background-image: url("assets/background/minecraftbg.png");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;

    overflow-x: hidden;

    color: white;

    font-family: 'Minecraft';
}
.nav-link {
    display: inline-block;

    padding:
        clamp(14px, 1.2vw, 24px)
        clamp(36px, 3vw, 64px);

    font-size:
        clamp(1.1rem, 2vw, 2rem);

    color: gold;

    text-decoration: none;

    background:
        linear-gradient(
            to bottom,
            #4d73d4,
            #27408b
        );

    border: 2px solid #1c2d66;

    box-shadow:
        inset 0 3px 0 rgba(255,255,255,0.25),
        inset 0 -3px 0 rgba(0,0,0,0.35),

        0 0 0 2px #10204d,
        0 0 0 5px #d4af37,

        0 6px 15px rgba(0,0,0,0.5);

    text-shadow:
        0 2px 0 rgba(0,0,0,0.4);

    transition:
        transform 0.15s ease,
        filter 0.15s ease;
} 
header{
    min-height: clamp(80px, 10vh, 140px);
    
    border: 3px solid #8b6b2f;

    box-shadow:
    0 0 0 2px #3a2a12,
    0 0 0 5px #d4af37,
    0 0 25px rgba(0,0,0,0.6);

    position: relative;

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: clamp(12px, 2vw, 40px);

    background-color: darkslateblue;

    font-family: 'Minecraft';

    -webkit-text-stroke: 0.5px black;
}
#play_main {

    width: 90vw;

    margin: 40px auto;
}
.play_overlay {

    display: flex;

    gap: 30px;

    justify-content: center;

    align-items: stretch;
}
.join-card h2 {

    font-size: clamp(1.5rem, 3vw, 3rem);
}
.join-card {

    display: flex;

    flex-direction: column;

    flex: 1;

    min-height: clamp(500px, 70vh, 800px);

    padding: clamp(20px, 3vw, 40px);

    background-color: rgba(0,0,0,0.5);

    border: 2px solid #5c4420;

    box-shadow:
        0 0 0 2px #3b2a12,
        0 0 0 5px #d4af37,
        0 0 25px rgba(0,0,0,0.5);
}
.join-card p,
.join-card li {

    font-size: clamp(1rem, 1.4vw, 1.4rem);

    line-height: 1.6;
}
.copy-ip-button {

    font-family: 'Minecraft';

    width: fit-content;

    margin-top: auto;

    align-self: center;

    padding:
        clamp(12px, 1vw, 18px)
        clamp(24px, 2vw, 40px);

    font-size:
        clamp(0.9rem, 1vw, 1.2rem);

    background:
        linear-gradient(
            to bottom,
            #4d73d4,
            #27408b
        );

    border: 2px solid #1c2d66;

    color: white;

    cursor: pointer;

    max-width: 100%;

    box-sizing: border-box;
}
@media (max-width: 768px) {

    .play_overlay {

        flex-direction: column;
    }
}
@media (max-width: 768px) and (orientation: portrait) {
    .title-play {
        display: none;
    }
}