body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	gap: 2.5rem;
	margin: 0;
    background-color: #000000;
	color: white;
    font-family: "Carlito", sans-serif;
	padding: 0 5.5rem;
}

.logo-img {
	width: 100%;
	display: flex;
    flex-direction: column;
    align-items: center;
	margin-top: 1rem;
}

.logo-img img {
	width: 35%;
	transform: rotate(-2deg);
}

h1,h2,h3,p,ul,li {
	margin: 0;
}

h2 {
	font-size: 1.3rem;
}

p,ul,li {
	font-size: 0.9rem;
}

.title {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.title img {
	width: 50px;
}

.main {
	display: flex;
	justify-content: space-between;
	margin-bottom: 4rem;
}

.main-text {
	width: 50%;
	display: flex;
    flex-direction: column;
    gap: 1rem;
}

.main-menu {
	width: 20%;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.main-menu p,
.main-menu label,
.main-menu a {
	font-size: 0.8rem;
}

.main-menu a {
	color: #1bb000;
}

footer {
	display: flex;
    flex-direction: column;
    align-items: center;
	text-align: center;
	padding-bottom: 1rem;
	gap: 0.5rem;
}

.banners {
	display: flex;
    align-items: center;
	gap: 1rem;
}

.banners img {
	max-height: 70px;
}

.visitor-counter {
    background-color: #000;
    color: #00ff00;
    display: inline-block;
    padding: 5px 10px;
    border: 2px solid #444;
    font-family: "Courier Prime", monospace;
    letter-spacing: 5px;
    font-weight: bold;
    font-size: 20px;
    box-shadow: inset 0 0 5px #00ff00;
}

.counter-label {
    font-size: 10px;
    color: #666;
    display: block;
    margin-top: 3px;
}

.winamp-player {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
    background-color: #333;
    color: #00ff00;
    border: 2px inset #555;
    padding: 5px;
    font-size: 11px;
    font-family: "Open Sans", sans-serif;
}

.song-title {
    white-space: nowrap;
    overflow: hidden;
    background: #000;
    border: 1px solid #555;
    padding: 2px;
}

.poll-container {
    font-family: "Courier Prime", monospace;
    font-size: 0.8rem;
}

.poll-option {
    margin-bottom: 5px;
    display: block;
    cursor: crosshair;
}

.poll-button {
    background: #d4d0c8;
    border: 2px outset #fff;
    cursor: pointer;
    font-size: 11px;
    margin-top: 5px;
}

.status-box {
    font-weight: bold;
    color: #ff0000;
}

.blink {
    animation: blinker 1s linear infinite;
}

@keyframes blinker {
    50% { opacity: 0; }
}

.sidebar-widget-2 {
	display: flex;
    flex-direction: column;
    align-items: center;
	gap: 0.5rem;
}

@media (max-width: 500px) {
	body {
		padding: 0 0.5rem;
	}
	
	.logo-img {
		width: 100%;
	}
	
	.logo-img img {
		width: 100%;
	}
	
	.title img {
		width: 50px;
	}
	
	.main {
		flex-direction: column-reverse;
		margin-bottom: unset;
		padding: 0 1rem;
	}
	
	.main-text,
	.main-menu	{
		width: unset;
		margin-bottom: 2rem;
	}
	
	.banners img {
		max-height: 50px;
	}
}

@media screen and (min-width: 768px) and (max-width: 920px) {
	body {
		padding: 0 3.5rem;
	}
	.main-text {
		width: 60%;
	}
	
	.main-menu {
		width: 30%;
	}
}