body{

margin:0;
font-family:'Press Start 2P', cursive;
color:white;

background:linear-gradient(-45deg,#0f0f0f,#1a1a1a,#121212,#0a0a0a);
background-size:400% 400%;

animation:bg 16s ease infinite;

}

@keyframes bg{

0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}

}


header{

text-align:center;
padding:40px 0;

}

.logo{

width:220px;
display:block;
margin:auto;

}

nav{

margin-top:25px;

}

nav a{

margin:0 25px;
text-decoration:none;
color:white;
font-size:14px;

}

nav a:hover{

color:#7cffb3;

}


.home{

display:flex;
justify-content:space-between;
align-items:center;

max-width:1100px;
margin:auto;

padding:120px 40px;

}

.server-info{

text-align:left;

}

.ip{

font-size:20px;
color:#7cffb3;
cursor:pointer;

}

.copy{

font-size:10px;
color:#aaa;

}

.discord{

text-align:right;

}

.discord-btn{

background:#5865F2;

padding:18px 30px;

border-radius:8px;

color:white;
text-decoration:none;

}

.discord-btn:hover{

background:#4752c4;

}


.page{

max-width:900px;
margin:auto;

text-align:center;

padding:120px 40px;

}


.vote-btn{

display:block;

margin:25px auto;

background:#7cffb3;

color:black;

padding:15px;

width:220px;

text-decoration:none;

border-radius:6px;

}


.patreon-btn{

background:#ff424d;

padding:18px 30px;

border-radius:8px;

color:white;

text-decoration:none;

}


.rules{

text-align:left;

max-width:500px;

margin:auto;

line-height:2;

}

header {
    text-align: center;
    padding-top: 20px;
}

.logo {
    width: 220px;
    margin-bottom: 15px;
}

.navbar{

display:flex;
justify-content:space-between;
align-items:center;

padding:15px 40px;

background:rgba(20,20,20,0.75);
backdrop-filter:blur(10px);

border-radius:12px;
margin:30px auto;

max-width:1100px;

box-shadow:0 0 20px rgba(0,0,0,0.6);

}

.nav-left a {
    color: white;
    text-decoration: none;
    margin-right: 25px;
    font-size: 18px;
}

.nav-left a:hover {
    color: #00ff9d;
}
.nav-left a{

position:relative;

}

.nav-left a::after{

content:"";
position:absolute;
width:0%;
height:2px;

background:#7cffb3;

bottom:-6px;
left:0;

transition:0.3s;

}

.nav-left a:hover::after{

width:100%;

}

.nav-right button {
    margin-left: 10px;
    padding: 8px 18px;
    border-radius: 6px;
    border: none;
    font-weight: bold;
    cursor: pointer;
}

.nav-right span{

margin-right:15px;
font-size:14px;
color:#7cffb3;

}

.login-btn {
    background: transparent;
    color: white;
    border: 2px solid white;
}

.signup-btn {

background:#00ff9d;
color:black;

}

.signup-btn:hover{

background:#00cc7a;

}


.sidebar{

position:fixed;
right:20px;
top:200px;

width:220px;

background:rgba(20,20,20,0.8);
padding:20px;

border-radius:10px;

}

.sidebar h3{

font-size:12px;
margin-bottom:15px;

}

.player{

display:flex;
align-items:center;
margin-bottom:10px;

}

.player img{

width:28px;
height:28px;
margin-right:10px;

}