@media only screen and (max-width: 768px) {
    body {
        font-size: 18px; /* Adjust font size for readability on smaller screens */
        background: #100906; /* Remove background image for simplicity */
        padding: 10px; /* Add some padding for content */
        color: white;
    }
	
	#google_translate_element {
		position:relative;
	}
	
	.spacer {
	}
	
	.btn {
		width: 195px;
		height: 57px;
		display: block;
		overflow: hidden;
		text-indent: -9999px;
		margin: 0px auto;
		border-radius: 10px;
		background: url(btn-begin.gif) no-repeat;
	}

	.btn:hover {
		background: url(btn-begin.gif) no-repeat 0 -57px;
	}

	.disabled {
		width: 195px;
		height: 57px;
		display: block;
		overflow: hidden;
		text-indent: -9999px;
		margin: 0px auto;
		border-radius: 10px;
		background: url(btn-not.gif) no-repeat;
	}

    #tanki_header {
        width: auto; /* Allow the header to expand to the full screen width */
        padding: 0 10px; /* Adjust padding for smaller screens */
        text-align: center; /* Center-align the header content */
    }

    #tanki_content {
        width: auto; /* Allow content to expand to the full screen width */
        padding: 0 10px; /* Adjust padding for smaller screens */
    }

    .btn {
        width: 100%; /* Make buttons full width on mobile */
        height: 45px; /* Reduce button height for mobile */
    }

    .box {
        width: 100%; /* Make boxes full width on mobile */
        margin: 10px 0; /* Add margin for spacing */
    }

    #content, #side-bar {
        float: none; /* Remove floats on mobile for single-column layout */
        width: 100%; /* Make content and sidebar full width on mobile */
    }

    ul {
        margin: 10px 0; /* Add margin for spacing */
    }

    #menu {
        height: auto; /* Allow the menu to expand based on content */
    }

    #menu li {
        float: none; /* Remove floats on mobile for vertical menu */
        margin: 4px 0; /* Add margin for spacing */
        margin-left: 0; /* Remove left margin to center-align menu items */
    }
    
    #items {
        margin-top: 18px; /* Adjust spacing */
    }

    .new-wikitable {
        background: rgba(26, 50, 68, 0.4);
        border: 1px solid rgba(125, 157, 186, 0.4);
        color: white;
        margin: 10px 0;
        border-radius: 6px;
        padding: 10px; /* Add padding for better readability */
    }

    #disclogo {
        display: none;
    }
	
	a {
		font-size: 24px;
		line-height: 30px;
		margin-top: 14px;
		padding-top: 10px;
	}
	
	button {
		width: 66px;
		height: 40px;
	}
	
	h4 {
		font-size: 20px;
	}
	
	h3 {
		font-size: 24px;
	}
	
	div {
		font-size: 20px;
	}
	
	h2 {
		font-size: 26px;
	}
	
	b {
		font-size: 18px;
	}
	
	#supplies {
	  width: 100%;
	  border-collapse: collapse;
	  text-align: center;
	  margin: 0 auto;
	}

	#supplies th {
	  background: #4b536d;
	  color: white;
	  padding: 8px;
	}

	#supplies th, #supplies td {
	  border: 1px solid rgba(39, 61, 81, 255);
	}

	#supplies td {
	  padding: 8px;
	}
	
	#supplies th, #supplies td {
    font-size: 12px; /* Reduce font size for smaller screens */
    padding: 4px; /* Adjust cell padding */
	}

	/* Hide some table cells or reduce their size */
	#supplies tr:nth-child(2) td:nth-child(n+5),
	#supplies tr:nth-child(3) td:nth-child(n+5) {
		display: none;
	}

	  /* Adjust the table header width */
	#supplies th {
		font-size: 10px;
	}
	  
	  /* Adjust the width of the images */
	#supplies td img {
		max-width: 50px; /* Reduce image size for smaller screens */
		height: auto;
	}
	
	#footer {
		width: 100%;
		z-index: 1;
		overflow: hidden;
		text-align: center;
		position: relative;
	}
	
	.basicspan {
		font-size: 22px;
	}
}

@media only screen and (min-width: 768px) {
body {
    font: 13px/16px Tahoma,Verdana,sans-serif;
    color: #c6bab3;
    background: #100906 url(longbg.jpg) repeat-y 50% 89px;
    margin: 0;
    min-width: 1000px
}
	
	.spacer {
		line-height: 0px;
		display: none;
	}
	
	#google_translate_element {
		position:absolute;
	}

#tanki_main.tanki_fall {
    background: url(bg.jpg) no-repeat 50% 0!important
}

#tanki_main {
    width: 100%;
    overflow: hidden
}

#tanki_header {
    width: 717px;
    height: 425px;
    padding: 0 137px 0 146px;
    margin: 0 auto;
    overflow: hidden
}

#tanki_content {
    width: 960px;
    padding: 0 26px;
    min-height: 450px;
    margin: 30px auto 0;
    overflow: hidden;
    z-index: 2;
    position: relative
}

.btn {
	width: 195px;
    height: 57px;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    margin: 0px auto;
    border-radius: 10px;
	background: url(btn-begin.gif) no-repeat;
}

.btn:hover {
	background: url(btn-begin.gif) no-repeat 0 -57px;
}
	
	.basicspan {
		font-size: 16px;
	}

.disabled {
	width: 195px;
    height: 57px;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    margin: 0px auto;
    border-radius: 10px;
	background: url(btn-not.gif) no-repeat;
}

#footer {
    width: 100%;
    z-index: 1;
    overflow: hidden;
	text-align: center;
    position: relative;
}

.box {
    width: 400px;
    display: inline-block;
    padding: 0 15px;
}

#content {
	float: left;
	width: 64%;
}

#side-bar {
	float: right;
	width: 36%;
}

#side-bar img{
	margin-left: 17px;
}

ul {
    width: 100%;
    padding: 0;
    margin: 5px 0 0;
    overflow: hidden;
    list-style: none;
}

#content ul li {
    float: left;
    width: 189px;
    height: 134px;
    padding: 4px;
    margin: 0 4px 4px 0;
}

discord-widget {
	margin-top: 30px;
	margin-left: 11px;
}

#disclogo {
	position: absolute;
	margin-top: -289px;
	margin-left: 30px;
}

#menu {
	background: url(bgbuttons.png) no-repeat;
	height: 230px;
}

#menu li a {
	width: 141px;
	height: 31px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(bg-menu.jpg) no-repeat;
}

#menu li a.btn-about {
	background-position: 100% 0;
}
#menu li a.btn-about:hover {
	background-position: 0 0;
}
#menu li.active a.btn-about {
	background-position: 0 0;
}
#menu li a.btn-begin {
	background-position: 100% -35px;
}
#menu li a.btn-begin:hover {
	background-position: 0 -35px;
}
#menu li.active a.btn-begin {
	background-position: 0 -35px;
}
#menu li a.btn-article {
	background-position: 100% -70px;
}
#menu li a.btn-article:hover {
	background-position: 0 -70px;
}
#menu li.active a.btn-article {
	background-position: 0 -70px;
}
#menu li a.btn-blog {
	background-position: 100% -105px;
}
#menu li a.btn-blog:hover {
	background-position: 0 -105px;
}
#menu li.active a.btn-blog {
	background-position: 0 -105px;
}
#menu li a.btn-forum {
	background-position: 100% -140px;
}
#menu li a.btn-forum:hover {
	background-position: 0 -140px;
}
#menu li.active a.btn-forum {
	background-position: 0 -140px;
}

#menu li {
	float: left;
	width: 100%;
	margin: 4px 0 0;
	margin-left: 95px;
}

#items {
	margin-top: 18px;
}

.new-wikitable {
    color: white;
    margin: 10px 0;
}
.new-wikitable {
    background: rgba(26,50,68,.4);
    border: 1px solid rgba(125,157,186,.4);
    color: white;
    margin: 10px 0;
    border-radius: 6px;
}
table {
    border-collapse: collapse;
}

.thSlides {display:none;}
}