/* GENERAL */


/*---------- BODY ------- */

body {
	font-family: 'Rowdies', cursive;
	margin: 0;
	/*cursor: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/9632/heart.png"), auto;*/
}

body.modal-open {
	overflow: hidden;
	margin-right: 10px;
}

body.mobile-menu-open {
	overflow: hidden;
}


/* SCROLLBAR */

body::-webkit-scrollbar {
	width: 10px;
	background: rgb(15, 15, 10);
}

body::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px black;
	border-radius: 10px;
	background: rgb(15, 15, 10);
}

body::-webkit-scrollbar-thumb {
	background: #4fd7f7;
}

body::-webkit-scrollbar-thumb:hover {
	background: #4fd7f7;
}

 ::-webkit-scrollbar {
	width: 10px;
	background: rgb(15, 15, 10);
}

 ::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px black;
	border-radius: 10px;
	background: rgb(15, 15, 10);
}

 ::-webkit-scrollbar-thumb {
	background: #4fd7f7;
}

 ::-webkit-scrollbar-thumb:hover {
	background: #4fd7f7;
}


/* ETC */

.not_selectable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.fab{
	font-size: 17px;
}


/* INCLUDES */


/* HEADER */

#header_grid {
	width: 100%;
	height: 120px;
	background-color: #17161a;
	display: grid;
}

#header_rows1 {
	width: 100%;
	height: 100%;
	background-color: #101010;
	border: 1px black;
	clip-path: polygon(0 0, 78% 0, 96% 100%, 0% 100%);
}

#header_rows2 {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-rows: 35% 65%;
}

#header_rows3 {
	width: 100%;
	height: 100%;
	background-color: #101010;
	border: 1px black;
	clip-path: polygon(22% 0, 100% 0, 100% 100%, 4% 100%);
}

#header_social_bar {
	display: grid;
	grid-template-columns: 35% 30% 35%;
	align-self: center;
	background-color: #17161a;
}

#header_social_bar_social {
	place-content: center;
	color: #4fd7f7;
	display: grid;
	grid-template-columns: 50% 10% 10% 10% 10% 10%;
}

#header_social_bar_social>div {
	justify-self: center;
}

#header_social_bar_sponsoring {
	cursor: pointer;
	color: #4fd7f7;
	justify-self: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#header_menu {
	display: grid;
	grid-template-columns: 19% 19% 24% 19% 19%;
	border-top: 1px #50504a solid;
	background-color: #17161a;
	font-size: 25px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#header_menu>div {
	text-align: center;
	justify-self: center;
	place-self: center;
	color: #4fd7f7;
	width: auto;
	height: fit-content;
	cursor: pointer;
}


/* HEADER LOGO */

#header_logo {
	background-image: url(/pics/logo_sinsidea_illustrator.png);
	background-position-x: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 95%;
	background-position-x: 54% !important;
}


/* CLIPBOARD STYLE */

.content_header_row2_headers {
	cursor: pointer;
	font-size: 24px;
	color: #4fd7f7;
}

#content_header_row2_left {
	display: grid;
	grid-template-columns: 3% 15% 15% 67%;
	height: 100%;
}

#content_header_row2_left_discord {
	background-image: url(./pics/icon/discord.svg);
	background-position-x: center;
	background-repeat: no-repeat;
	background-size: contain;
	min-height: 50%;
	cursor: pointer;
	place-self: center;
	max-width: 70%;
	min-width: 70%;
}

#content_header_row2_left_discord:hover {
	background-image: url(/pics/icon/discord_2.svg);
}

#content_header_row2_left_vote {
	background-image: url(/pics/icon/vote.svg);
	background-position-x: center;
	background-repeat: no-repeat;
	background-size: contain;
	min-height: 50%;
	cursor: pointer;
	place-self: center;
	max-width: 70%;
	min-width: 70%;
}

#content_header_row2_left_vote:hover {
	background-image: url(/pics/icon/vote_2.svg);
}

.copyIpToClipboardTooltip {
	position: relative;
	display: inline-block;
}

.copyIpToClipboardTooltip .copyIpToClipboardTooltiptext {
	font-size: 15px;
	visibility: visible;
	width: 140px;
	background-color: #4fd7f7;
	color: #262b2f;
	text-align: center;
	border-radius: 6px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	bottom: -35px;
	left: 50%;
	margin-left: -75px;
	opacity: 0;
	transition: opacity 0.3s;
}

.copyIpToClipboardTooltip .copyIpToClipboardTooltiptext::after {
	transform: rotate(180deg);
	content: "";
	position: absolute;
	top: -35%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #4fd7f7 transparent transparent transparent;
}

.copyIpToClipboardTooltip:hover .copyIpToClipboardTooltiptext {
	visibility: visible;
	opacity: 1;
}


/* HEADER MOBILE */

#content_header_mobile {
	grid-template-columns: 15% 70% 15%;
	display: none;
}

#content_header_mobile_menubutton_list {
	height: -webkit-fill-available;
	display: none;
	grid-template-columns: minmax(100%, auto);
	justify-content: center;
	position: relative;

	flex-direction: column;
    place-content: flex-start;
}

#content_header_mobile_menubutton_list>div,
a {
	width: 100%;
	font-size: xx-large;
	cursor: pointer;
	text-align: center;
	color: #4fd7f7;
}

#content_header_mobile_menubutton {
	max-width: 50px;
	min-width: 50px;
	min-height: 50px;
	right: 5px;
	place-self: center;
}

.bar_container {
	display: inline-block;
	cursor: pointer;
}

.bar1,
.bar2,
.bar3 {
	width: 35px;
	height: 5px;
	background-color: #4fd7f7;
	margin: 6px 0;
	transition: 0.4s;
}

.change .bar1 {
	-webkit-transform: rotate(-45deg) translate(-9px, 6px);
	transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {
	opacity: 0;
}

.change .bar3 {
	-webkit-transform: rotate(45deg) translate(-8px, -8px);
	transform: rotate(45deg) translate(-8px, -8px);
}

/* Player Counter */

#ServerPlayer {
	color: #4fd7f7;
	font-size: 15px;
}


/* HEADER */

.header_menu_svg_spot {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.header_menu_svg {
	margin-top: 0;
	position: relative;
	width: 150px;
	height: 40px;
	display: inline-block;
	border-radius: 3px;
	margin-left: 5px;
	margin-right: 5px
}

#header_menu_svg_shape {
	stroke-width: 6px;
	fill: transparent;
	stroke: transparent;
	stroke-dasharray: 85 400;
	stroke-dashoffset: -220;
	transition: 1s all ease;
}

#header_menu_svg_text {
	margin-top: -36px;
	text-align: center;
}

#header_menu_svg_text a {
	color: #4fd7f7;
	text-decoration: none;
	font-weight: 100;
	font-size: 1.1em;
}

.header_menu_svg:hover #header_menu_svg_shape {
	stroke-dasharray: 50 0;
	stroke-width: 3px;
	stroke-dashoffset: 0;
	stroke: #4fd7f7;
}


/* SUBMENU HEADER */

.header_menu_submenus{
	width: 100%;
	display: none;
}

.header_menu_submenu {
	margin-top: -6px;
	z-index: 1;
	font-size: 23px;
	position: absolute;
	background-color: #17161a;
	top: 45px;
	width: 148px;
	color: #4fd7f7;
	border-left: solid 1px #404040;
	border-right: solid 1px #404040;
	border-bottom: solid 1px #404040;
	cursor: pointer;
	border-top: solid 1px #4fd7f7;
}

.header_menu_svg:hover>.header_menu_submenus {
	display: block;
}

.header_menu_submenus:hover > .header_menu_submenu:hover {
	display: block;
	z-index: 1;
	font-size: 23px;
	position: absolute;
	background-color: #3e3e3e;
	top: 45px;
	color: #4fd7f7;
	border-left: solid 1px #404040;
	border-right: solid 1px #404040;
	border-bottom: solid 1px #404040;
	cursor: pointer;
	border-top: solid 1px #4fd7f7;
}

.header_menu_submenus:hover {
	display: block ;
}

.header_menu_submenu>a {
	text-decoration: none !important;
}

.header_menu_submenu>a:link,
a:visited,
a:active {
	text-decoration: none !important;
}

.header_menu_submenu>a>div {
	padding: 10px;
	font-size: 19px;
	text-decoration: none !important;
	color: #4fd7f7;
}

.header_menu_submenu_second{
	margin-top: 40px;
}

.header_menu_submenu_third{
	margin-top: 86px;
}

.header_menu_submenu_fourth{
	margin-top: 132px;
}

/* RIGHT HEADER */

#content {}

#content_header {
	display: grid;
	height: 125px;
	grid-template-rows: 76% 24%;
}

#content_header_row1 {
	display: grid;
	height: 50px;
	background-color: #101010;
	grid-template-columns: 12.5% 15% 15% 15% 15% 15% 12.5%;
}

#content_header_row1>div {
	color: red;
	align-self: center;
	place-self: center;
}

.content_header_row1_menubutton {
	position: relative;
	border: none;
	background-color: transparent;
	cursor: pointer;
	outline: none;
	font-size: 24px;
	/*margin: 1em 0.8em;
    */
}

.content_header_row1_menubutton_animation {
	color: #E6BA6A;
}

.content_header_row1_menubutton_animation::after {
	content: "";
	display: block;
	position: absolute;
	height: 2px;
	width: 0;
	left: 0;
	background-color: #E6BA6A;
	transition: width 0.3s ease-in-out;
}

.content_header_row1_menubutton_animation::after {
	bottom: 0;
}

.content_header_row1_menubutton_animation:hover::after {
	width: 100%;
}


/*------------------------------------------------------------------------------------------------*/

#content_header_row2 {
	display: grid;
	height: 75px;
	text-align-last: center;
	background-color: #17161a;
}

#content_header_row2>div {
	width: 100%;
	min-width: 100%;
	align-self: center;
	place-self: center;
}

.content_header_row2_right_button {
	cursor: pointer;
	background-color: #101010;
	color: #4fd7f7;
	max-width: 110px;
	border: 1px solid;
	height: 30px;
	font-size: 15px;
	line-height: 30px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


/* PROFILE */

#ProfileForm {
	cursor: pointer;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: border-box;
	box-sizing: content-box;
}


/* MOBILE PROFILE */

#mobile_profile_form {
	color: white;
}

.content_header_row2_right_button:hover {
	background-color: #4fd7f7;
	color: #101010;
	max-width: 110px;
	border: 1px solid;
	height: 30px;
	font-size: 15px;
	line-height: 30px;
}

#content_header_row2_right_logins {
	display: grid;
	position: relative;
	top: -50px;
	width: 70%;
	left: 30%;
}


/* FOOTER */

#content_footer_mid {
	margin-top: 30px;
	background-color: #17161a;
}

#content_footer_mid>a {
	text-decoration: none;
	font-size: 16px;
	color: #4fd7f7;
}

#content_footer_mid>a:visited {
	text-decoration: none;
	font-size: 16px;
	color: #4fd7f7;
}

#content_footer_mid>a:hover {
	text-decoration: none;
	font-size: 16px;
	color: #4fd7f7;
}

#content_footer_mid>a:active {
	text-decoration: none;
	font-size: 16px;
	color: #4fd7f7;
}

#content_footer_mid>a:active {
	text-decoration: none;
	font-size: 16px;
	color: #4fd7f7;
}

#content_footer_mid_publicinfos {
	margin-bottom: 15px;
	display: grid;
	grid-template-columns: 33% 34% 33%;
}

#content_footer_mid_publicinfos>div {
	place-self: center;
}

.content_footer_mid_publicinfos_button {
	cursor: pointer;
}

#content_footer_mid_subdiv_copyright {
	text-align-last: center;
}

#content_footer_mid_subdiv_copyright>span {
	place-self: center;
	font-size: 10px;
}

#content_footer_copyright {
	text-align-last: center;
}


/* ------------------------------------------------------------------------------------------------ */


/* TermsAndConditions */

.TermsAndConditionsHeader {
	font-size: 18px;
	color: #4fd7f7;
}


/* PrivacyAndPolicy */

.PrivacyAndPolicyHeader {
	font-size: 18px;
	color: #4fd7f7;
}

.PrivacyAndPolicy_Span_Links {
	cursor: pointer;
	color: #4fd7f7;
}


/* ------------------------------------------------------------------------------------------------ */


/* Support */

.SupportFormHeader {
	font-size: 18px;
	color: #4fd7f7;
}

.SupportForm_Span_Links {
	cursor: pointer;
	color: #4fd7f7;
}


/* SHOP */

.shop_menu {
	grid-template-columns: 35% 28% 28% 9%;
	display: grid;
	background-color: #101010;
	border-radius: 5px;
	margin: 0 5px 10px;
	width: 80%;
	height: fit-content;
	margin-left: 10%;
}

.shop_cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(208px, 0.9fr));
	grid-auto-rows: minmax(285px, auto);
	grid-auto-flow: dense;
}


/* BANLIST */

#banlist_header {
	font-weight: bold;
	font-size: 19px;
	margin-bottom: 10px;
	display: grid;
	grid-template-columns: 10% 17% 15% 15% 23% 20%;
	color: #4fd7f7;
	/*box-shadow: 0px 7px 8px -5px black;*/
}


/* RESPONSIVE */

@media only screen and (min-width: 1px) and (max-width: 767px) {
    #header{
        display:none;
    }

	#header_grid {
		grid-template-columns: 17.5% 65% 17.5%;
	}
	#content_header_mobile {
		display: grid !important;
		height: 75px;
		background-color: #17161a;
	}
	#content_header_mobile_menubutton {
		display: block;
	}
	#content_header {
		display: none;
	}
	/* HEADER */
	#content_header_row2 {
		grid-template-columns: 20% 20% 20% 20% 20%;
	}
	.sinsidea_ipadress_span {
		font-size: 24px;
	}
	/* ULTIMATE SHOP */
	.shop_produkt_show {
		opacity: 100%;
		position: unset;
		-webkit-transition: all 0.7s ease-in;
		-moz-transition: all 0.7s ease-in;
		-o-transition: all 0.7s ease-in;
		transition: all 0.7s ease-in;
		width: calc(100% * (1) - 10px);
	}
	#SupportContainerMenu {
		row-gap: 12px;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#SupportContainerMenu>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	.shop_image {
		max-width: 100%;
	}
	/* SHOP2 */
	#shop_content_header {
		grid-template-columns: 23% 23% 23% 23%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: small;
		background-color: #262b2f;
		column-gap: 2%;
		width: 100%;
		margin-left: 1%;
	}
	.shop_content_header_buttons {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	#shop_content_headers {
		width: 100%;
		background-color: #262b2f;
	}
	/* WIKI */
	#wiki_content_span {
		text-shadow: 1px 1px 20px #000;
	}
	#wiki_content_container {
		color: #fc9d07;
		offset-rotate: 90;
		font-size: 60px;
		width: 100%;
		padding-top: 120px;
	}
	/* PROFILE MOBILE*/
	#mobile_profile_box {
		padding: 50px 15px 0px 15px;
		display: grid;
		grid-template-columns: 40% 60%;
	}
	#mobile_profilePIC {
		width: 52px;
	}
	/* FOOTER */
	#content_footer {
		display: grid;
		grid-template-columns: 0% 100% 0%;
		height: 90px;
		background-color: #101010;
	}
	#content_footer>div {
		font-size: 12px;
		color: #4fd7f7;
		cursor: pointer;
	}
	#content_header_mobile {
		align-items: center;
	}
	.bar_container {
		margin-top: 5px;
	}
	/* BANLIST */
	#banlist {
		font-size: 8px;
	}
	.banlist_container {
		padding: 35px 0px 30px 0px;
		/*padding: 35px 250px 30px 250px;
        */
	}
	#banlist_header {
		font-size: 11px;
	}
	.banlist_head {
		width: 24px;
	}
	/* RULES */
	#rules_content_body_content {
		display: grid;
		grid-template-columns: 0% 100% 0%;
	}
}

@media only screen and (min-width: 768px) and (max-width: 955px) {
    #header{
        display:none;
    }


	#header_grid {
		grid-template-columns: 17.5% 65% 17.5%;
	}
	#content_header_mobile {
		display: grid !important;
		height: 75px;
		background-color: #17161a;
	}
	#content_header_mobile_menubutton {
		display: block;
	}
	#content_header {
		display: none;
	}
	#content_header_row2_left {
		display: grid;
		grid-template-columns: 2% 44% 44% 0%;
		height: 100%;
	}
	#slider {
		height: 550px;
	}
	/* HEADER */
	#content_header_row2 {
		grid-template-columns: 10% 25% 30% 25% 10%;
	}
	.sinsidea_ipadress_span {
		font-size: 19px;
	}
	/* ULTIMATE SHOP */
	.shop_produkt_show {
		opacity: 100%;
		position: unset;
		-webkit-transition: all 0.7s ease-in;
		-moz-transition: all 0.7s ease-in;
		-o-transition: all 0.7s ease-in;
		transition: all 0.7s ease-in;
		width: calc(100% * (1) - 10px);
	}
	#SupportContainerMenu {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#SupportContainerMenu>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	.shop_image {
		max-width: 100%;
	}
	/* SHOP2 */
	#shop_content_header {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#shop_content_header>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	#shop_content_headers {
		width: 100%;
		background-color: #262b2f;
	}
	/* WIKI */
	#wiki_content_span {
		text-shadow: 1px 1px 20px #000;
	}
	#wiki_content_container {
		color: #fc9d07;
		offset-rotate: 90;
		font-size: 100px;
		width: 100%;
		padding-top: 120px;
	}
	/* PROFILE MOBILE*/
	#mobile_profile_box {
		padding: 30px 30px 0px 30px;
		display: grid;
		grid-template-columns: 40% 60%;
	}
	#mobile_profilePIC {
		width: 52px;
	}
	/* FOOTER */
	#content_footer {
		display: grid;
		grid-template-columns: 15% 70% 15%;
		height: 200px;
		background-color: #101010;
	}
	#content_footer>div {
		font-size: 20px;
		color: #4fd7f7;
		cursor: pointer;
	}
	/* BANLIST */
	#banlist {
		font-size: 16px;
	}
	.banlist_container {
		padding: 35px 20px 30px 20px;
	}
	#banlist_header {
		font-size: 19px;
	}
	.banlist_head {
		width: 48px;
	}
	/* RULES */
	#rules_content_body_content {
		display: grid;
		grid-template-columns: 20% 60% 20%;
	}
}

@media only screen and (min-width: 955px) and (max-width: 1023px) {
    #header{
        display:block;
    }

	#header_grid {
		grid-template-columns: 10% 80% 10%;
	}
	#content_header_mobile {
		display: none;
	}
	#content_header_mobile_menubutton {
		display: block;
	}
	#content_header {
		display: block;
	}
	/* HEADER */
	#content_header_row2 {
		grid-template-columns: 10% 25% 30% 25% 10%;
	}
	.sinsidea_ipadress_span {
		font-size: 19px;
	}
	#content_header_row2_left {
		display: grid;
		grid-template-columns: 2% 44% 44% 0%;
		height: 100%;
	}
	.h1 {
		text-align: center;
		font-size: 20px !important;
	}
	/* ULTIMATE SHOP */
	.shop_produkt_show {
		opacity: 100%;
		position: unset;
		-webkit-transition: all 0.7s ease-in;
		-moz-transition: all 0.7s ease-in;
		-o-transition: all 0.7s ease-in;
		transition: all 0.7s ease-in;
		width: calc(100% * (1) - 10px);
	}
	#SupportContainerMenu {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#SupportContainerMenu>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	.shop_image {
		max-width: 100%;
	}
	#giftbox {
		margin-top: 50px;
	}
	/* SHOP2 */
	#shop_content_header {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#shop_content_header>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	#shop_content_headers {
		width: 100%;
		background-color: #262b2f;
	}
	/* WIKI */
	#wiki_content_span {
		text-shadow: 1px 1px 20px #000;
	}
	#wiki_content_container {
		color: #fc9d07;
		offset-rotate: 90;
		font-size: 100px;
		width: 100%;
		padding-top: 120px;
	}
	/* PROFILE MOBILE*/
	#mobile_profile_box {
		padding: 30px 30px 0px 30px;
		display: grid;
		grid-template-columns: 40% 60%;
	}
	#mobile_profilePIC {
		width: 52px;
	}
	/* FOOTER */
	#content_footer {
		display: grid;
		grid-template-columns: 15% 70% 15%;
		height: 200px;
		background-color: #101010;
	}
	#content_footer>div {
		font-size: 20px;
		color: #4fd7f7;
	}
	/* BANLIST */
	#banlist {
		font-size: 16px;
	}
	.banlist_container {
		padding: 35px 20px 30px 20px;
	}
	#banlist_header {
		font-size: 19px;
	}
	.banlist_head {
		width: 48px;
	}
	/* RULES */
	#rules_content_body_content {
		display: grid;
		grid-template-columns: 20% 60% 20%;
	}
}

@media only screen and (min-width: 1024px) and (max-width: 1279px) {
    #header{
        display:block;
    }

	#header_grid {
		grid-template-columns: 17.5% 65% 17.5%;
	}
	/* HEADER */
	#content_header_row2 {
		grid-template-columns: 10% 25% 30% 25% 10%;
	}
	.sinsidea_ipadress_span {
		font-size: 19;
	}
	.h1 {
		text-align: center;
		font-size: 17px !important;
	}
	/* SHOP2 */
	#shop_content_header {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 80%;
		margin-left: 10%;
	}
	#shop_content_header>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	#shop_content_headers {
		width: 100%;
		background-color: #262b2f;
	}
	/* WIKI */
	#wiki_content_span {
		text-shadow: 1px 1px 20px #000;
	}
	#wiki_content_container {
		color: #fc9d07;
		offset-rotate: 90;
		font-size: 100px;
		width: 100%;
		padding-top: 120px;
	}
	/* PROFILE MOBILE*/
	#mobile_profile_box {
		padding: 30px 30px 0px 30px;
		display: grid;
		grid-template-columns: 40% 60%;
	}
	#mobile_profilePIC {
		width: 52px;
	}
	/* FOOTER */
	#content_footer {
		display: grid;
		grid-template-columns: 20% 60% 20%;
		height: 200px;
		background-color: #101010;
	}
	#content_footer>div {
		font-size: 19px;
		color: #4fd7f7;
	}
	/* BANLIST */
	#banlist {
		font-size: 16px;
	}
	.banlist_container {
		padding: 35px 20px 30px 20px;
	}
	#banlist_header {
		font-size: 19px;
	}
	.banlist_head {
		width: 64px;
	}
	/* RULES */
	#rules_content_body_content {
		display: grid;
		grid-template-columns: 24% 52% 24%;
	}
}

@media only screen and (min-width: 1280px) {
	#header_grid {
		grid-template-columns: 17.5% 65% 17.5%;
	}
	/* HEADER */
	#content_header_row2 {
		grid-template-columns: 20% 20% 20% 20% 20%;
	}
	.sinsidea_ipadress_span {
		font-size: 24;
	}
	#content_header_row2_left {
		display: grid;
		grid-template-columns: 3% 15% 15% 67%;
		height: 100%;
	}
	/* WIKI */
	#wiki_content_span {
		text-shadow: 1px 1px 20px #000;
	}
	#wiki_content_container {
		color: #fc9d07;
		offset-rotate: 90;
		font-size: 130px;
		width: 80%;
		padding-top: 120px;
		margin-left: 10%;
	}
	/* SHOP2 */
	#shop_content_header {
		grid-template-columns: 16% 16% 16% 16%;
		display: grid;
		color: #4fd7f7;
		justify-items: center;
		font-size: 20px;
		background-color: #262b2f;
		column-gap: 12%;
		width: 61%;
		margin-left: 19.5%;
	}
	#shop_content_header>div {
		padding: 10px;
		background-color: #101010;
		border: 1px solid #404040;
		border-radius: 4px;
		width: 100%;
		text-align: center;
		cursor: pointer;
	}
	#shop_content_headers {
		width: 100%;
		background-color: #262b2f;
	}
	/* PROFILE MOBILE*/
	#mobile_profile_box {
		padding: 30px 30px 0px 30px;
		display: grid;
		grid-template-columns: 40% 60%;
	}
	#mobile_profilePIC {
		width: 52px;
	}
	/* FOOTER */
	#content_footer {
		display: grid;
		grid-template-columns: 20% 60% 20%;
		/*height: 200px;
        */
		height: 110px;
		background-color: #101010;
	}
	#content_footer>div {
		font-size: 19px;
		color: #4fd7f7;
	}
	/* BANLIST */
	#banlist {
		font-size: 16px;
	}
	.banlist_container {
		padding: 35px 250px 30px 250px;
	}
	#banlist_header {
		font-size: 19px;
	}
	#banlist_head {
		width: 64px;
	}
	/* RULES */
	#rules_content_body_content {
		display: grid;
		grid-template-columns: 24% 52% 24%;
	}
}


/*TOOLTIP UNDER SELECTION*/


/* dfn {
     background: rgba(0,0,0,0.2);
     border-bottom: dashed 1px rgba(0,0,0,0.8);
     padding: 0 0.4em;
     cursor: help;
     font-style: normal;
     position: relative;
}
 dfn::after {
     content: attr(data-info);
     display: inline;
     position: absolute;
     top: 22px;
     left: 0;
     opacity: 0;
     width: 230px;
     font-size: 13px;
     font-weight: 700;
     line-height: 1.5em;
     padding: 0.5em 0.8em;
     background: rgba(0,0,0,0.8);
     color: #fff;
     pointer-events: none;
    /* This prevents the box from apearing when hovered. transition: opacity 250ms, top 250ms;
}
 dfn::before {
     content: '';
     display: block;
     position: absolute;
     top: 12px;
     left: 20px;
     opacity: 0;
     width: 0;
     height: 0;
     border: solid transparent 5px;
     border-bottom-color: rgba(0,0,0,0.8);
     transition: opacity 250ms, top 250ms;
}
 dfn:hover {
    z-index: 2;
}
/* Keeps the info boxes on top of other elements dfn:hover::after, dfn:hover::before {
    opacity: 1;
}
 dfn:hover::after {
    top: 30px;
}
 dfn:hover::before {
    top: 20px;
}
 <dfn data-info="Lorem ipsum dolor sit amet, perspiciatis consectetur dolor.">Iste aliquid perspiciatis</dfn> */

 body{
     background-color: #17161a;
     margin: 0;
     font-family: 'Rowdies', cursive;
     font-size: 12px;
     overflow-y: scroll;
}
 body.modal-open {
     overflow: hidden;
     margin-right: 10px;
}
 body.mobile-menu-open {
     overflow: hidden;
}
/* Others */
 .not_selectable {
     -webkit-touch-callout: none;
    /* iOS Safari */
     -webkit-user-select: none;
    /* Safari */
     -khtml-user-select: none;
    /* Konqueror HTML */
     -moz-user-select: none;
    /* Old versions of Firefox */
     -ms-user-select: none;
    /* Internet Explorer/Edge */
     user-select: none;
    /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}
/* INCLUDES */
/* HEADER LOGO */
 #header_logo{
     background-image: url(/pics/logo_sinsidea_illustrator.png);
     background-position-x: center;
     background-repeat: no-repeat;
     background-size: contain;
     height: 95%;
     background-position-x: 55%;
}
/* CLIPBOARD STYLE */
 .content_header_row2_headers{
     cursor: pointer;
     font-size: 24px;
     color: #4fd7f7;
}

#content_header_row2_left{
    display: grid;
    grid-template-columns: 3% 15% 15% 67%;
    height: 100%;
}

#content_header_row2_left_discord{
    background-image: url(/pics/icon/discord.svg);
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 50%;
    cursor: pointer;
    place-self: center;
    max-width: 70%;
    min-width: 70%;
}

#content_header_row2_left_discord:hover{
    background-image: url(/pics/icon/discord_2.svg);
}

#content_header_row2_left_vote{
    background-image: url(/pics/icon/vote.svg);
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 50%;
    cursor: pointer;
    place-self: center;
    max-width: 70%;
    min-width: 70%;
}

#content_header_row2_left_vote:hover{
    background-image: url(/pics/icon/vote_2.svg);
}


 .copyIpToClipboardTooltip {
     position: relative;
     display: inline-block;
}
 .copyIpToClipboardTooltip .copyIpToClipboardTooltiptext {
     font-size: 15px;
     visibility: visible;
     width: 140px;
     background-color: #4fd7f7;
     color: #262b2f;
     text-align: center;
     border-radius: 6px;
     padding: 5px;
     position: absolute;
     z-index: 1;
     bottom: -35px;
     left: 50%;
     margin-left: -75px;
     opacity: 0;
     transition: opacity 0.3s;
}
 .copyIpToClipboardTooltip .copyIpToClipboardTooltiptext::after {
     transform: rotate(180deg);
     content: "";
     position: absolute;
     top: -35%;
     left: 50%;
     margin-left: -5px;
     border-width: 5px;
     border-style: solid;
     border-color: #4fd7f7 transparent transparent transparent;
}
 .copyIpToClipboardTooltip:hover .copyIpToClipboardTooltiptext {
     visibility: visible;
     opacity: 1;
}
/* Scrollbar */
 body::-webkit-scrollbar {
     width: 10px;
     background: rgb(15,15,10);
}
 body::-webkit-scrollbar-track {
     box-shadow: inset 0 0 5px black;
     border-radius: 10px;
     background: rgb(15,15,10);
}
 body::-webkit-scrollbar-thumb {
     background: #4fd7f7;
}
 body::-webkit-scrollbar-thumb:hover {
     background: #4fd7f7;
}
 ::-webkit-scrollbar {
     width: 10px;
     background: rgb(15,15,10);
}
 ::-webkit-scrollbar-track {
     box-shadow: inset 0 0 5px black;
     border-radius: 10px;
     background: rgb(15,15,10);
}
 ::-webkit-scrollbar-thumb {
     background: #4fd7f7;
}
 ::-webkit-scrollbar-thumb:hover {
     background: #4fd7f7;
}
/* ----------- MODAL --------------- */
 .modal {
     display: none;
    /* Hidden by default */
     position: fixed;
    /* Stay in place */
     z-index: 2;
    /* Sit on top */
     padding-top: 100px;
    /* Location of the box */
     left: 0;
     top: 0;
     width: 100%;
    /* Full width */
     height: 100%;
    /* Full height */
     overflow: scroll;
    /* Enable scroll if needed */
     background-color: rgb(0,0,0);
    /* Fallback color */
     background-color: rgba(0,0,0,0.4);
    /* Black w/ opacity */
}
 .modal-content{
     font-size: 16px;
    /*background-color: #060606f2;
    */
     background-color: #0e0d10;
     margin: auto;
     padding: 45px;
     width: 70%;
     margin-bottom: 235px;
     color: white;
     box-shadow: 0 0 20px 0px #267c91;
}
 .modal-hidden{
     visibility: hidden;
}
/* The Close Button */
 .close {
     color: #aaaaaa;
     float: right;
     font-size: 28px;
     font-weight: bold;
}
 .close:hover, .close:focus {
     color: #000;
     text-decoration: none;
     cursor: pointer;
}


/* RIGHT HEADER */
 #content{
}
 #content_header{
     display: grid;
     height: 125px;
     grid-template-rows: 76% 24%;
}
 #content_header_row1{
     display: grid;
     height: 50px;
     background-color: #101010;
     grid-template-columns: 12.5% 15% 15% 15% 15% 15% 12.5%;
}
 #content_header_row1 > div{
     color: red;
     align-self: center;
     place-self: center;
}
 .content_header_row1_menubutton {
     position: relative;
     border: none;
     background-color: transparent;
     cursor: pointer;
     outline: none;
     font-size: 24px;
    /*margin: 1em 0.8em;
    */
}
 .content_header_row1_menubutton_animation {
     color: #E6BA6A;
}
 .content_header_row1_menubutton_animation::after {
     content: "";
     display: block;
     position: absolute;
     height: 2px;
     width: 0;
     left: 0;
     background-color: #E6BA6A;
     transition: width 0.3s ease-in-out;
}
 .content_header_row1_menubutton_animation::after {
     bottom: 0;
}
 .content_header_row1_menubutton_animation:hover::after {
     width: 100%;
}
/*--------------------------------------------------------------------*/
 #content_header_row2{
     display: grid;
     height: 75px;
     text-align-last: center;
     background-color: #17161a;
}
 #content_header_row2 > div{
     width: 100%;
     min-width: 100%;
     align-self: center;
     place-self: center;
}
 #content_body{
     background-color: #282a2d;
}
 .content_body{
     background-color: #282a2d;
}
 #content_body_updateinfobox{
}
 .content_header_row2_right_button{
     cursor: pointer;
     background-color: #101010;
     color: #4fd7f7;
     max-width: 110px;
     border: 1px solid;
     height: 30px;
     font-size: 15px;
     line-height: 30px;
     -webkit-touch-callout: none;
    /* iOS Safari */
     -webkit-user-select: none;
    /* Safari */
     -khtml-user-select: none;
    /* Konqueror HTML */
     -moz-user-select: none;
    /* Old versions of Firefox */
     -ms-user-select: none;
    /* Internet Explorer/Edge */
     user-select: none;
    /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}
/* PROFILE */
 #ProfileForm{
     cursor: pointer;
     -webkit-box-sizing: content-box;
     -moz-box-sizing: border-box;
     box-sizing: content-box;
}
/* MOBILE PROFILE */
 #mobile_profile_form{
     color: white;
}
 .content_header_row2_right_button:hover{
     background-color: #4fd7f7;
     color: #101010;
     max-width: 110px;
     border: 1px solid;
     height: 30px;
     font-size: 15px;
     line-height: 30px;
}
 #content_header_row2_right_logins{
     display: grid;
     position: relative;
     top: -50px;
     width: 70%;
     left: 30%;
}
/* FOOTER */
 #content_footer_mid{
     margin-top: 30px;
     background-color: #17161a;
}
 #content_footer_mid > a{
     text-decoration:none;
     font-size: 16px;
     color: #4fd7f7;
}
 #content_footer_mid > a:visited {
     text-decoration:none;
     font-size: 16px;
     color: #4fd7f7;
}
 #content_footer_mid > a:hover {
     text-decoration:none;
     font-size: 16px;
     color: #4fd7f7;
}
 #content_footer_mid > a:active {
     text-decoration:none;
     font-size: 16px;
     color: #4fd7f7;
}
 #content_footer_mid > a:active {
     text-decoration:none;
     font-size: 16px;
     color: #4fd7f7;
}
 #content_footer_mid_publicinfos{
     margin-bottom: 15px;
     display: grid;
     grid-template-columns: 33% 34% 33%;
}
 #content_footer_mid_publicinfos > div{
     place-self: center;
}
 .content_footer_mid_publicinfos_button{
     cursor: pointer;
}
 #content_footer_mid_subdiv_copyright{
     text-align-last: center;
}
 #content_footer_mid_subdiv_copyright > span{
     place-self: center;
     font-size: 10px;
}
 #content_footer_copyright{
     text-align-last: center;
}
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* TermsAndConditions */
 .TermsAndConditionsHeader{
     font-size: 18px;
     color: #4fd7f7;
}
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* PrivacyAndPolicy */
 .PrivacyAndPolicyHeader {
     font-size: 18px;
     color: #4fd7f7;
}
 .PrivacyAndPolicy_Span_Links{
     cursor: pointer;
     color: #4fd7f7;
}
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* ------------------------------------------------ */
/* Support */
 .SupportFormHeader {
     font-size: 18px;
     color: #4fd7f7;
}
 .SupportForm_Span_Links{
     cursor: pointer;
     color: #4fd7f7;
}
/* SHOP */
 .shop_menu{
     grid-template-columns: 35% 28% 28% 9%;
     display: grid;
     background-color: #101010;
     border-radius: 5px;
     margin: 0 5px 10px;
     width: 80%;
     height: fit-content;
     margin-left: 10%;
}
 .shop_cards{
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(208px, 0.9fr));
     grid-auto-rows: minmax(285px, auto);
     grid-auto-flow: dense;
}
/* BANLIST */
 #banlist_header{
     font-weight: bold;
     font-size: 19px;
     margin-bottom: 10px;
     display: grid;
     grid-template-columns: 10% 17% 15% 15% 23% 20%;
     color: #4fd7f7;
    /*box-shadow: 0px 7px 8px -5px black;
    */
}
/* RESPONSIVE */
 @media only screen and (min-width: 100px) and (max-width: 767px) {
     #content_header_mobile{
        display:grid !important;
        height:75px;
        background-color:#17161a;
    }
     #content_header_mobile_menubutton{
        display:block;
    }
     #content_header{
        display:none;
    }
     #slider{
        height: 550px;
    }
    /* HEADER */
     #content_header_row2{
         grid-template-columns: 20% 20% 20% 20% 20%;
    }
     .sinsidea_ipadress_span{
         font-size:24px;
    }
    /* ULTIMATE SHOP */
     .shop_produkt_show {
         opacity: 100%;
         position: unset;
         -webkit-transition: all 0.7s ease-in;
         -moz-transition: all 0.7s ease-in;
         -o-transition: all 0.7s ease-in;
         transition: all 0.7s ease-in;
         width: calc(100% * (1) - 10px);
    }
     #SupportContainerMenu{
         row-gap: 12px;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #SupportContainerMenu > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     .shop_image{
         max-width: 100%;
    }
    /* SHOP2 */
     #shop_content_header{
         grid-template-columns: 23% 23% 23% 23%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: small;
         background-color: #262b2f;
         column-gap: 2%;
         width: 100%;
         margin-left: 1%;
    }
     .shop_content_header_buttons{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     #shop_content_headers{
         width: 100%;
         background-color: #262b2f;
    }
    /* WIKI */
     #wiki_content_span{
         text-shadow: 1px 1px 20px #000;
    }
     #wiki_content_container{
         color: #fc9d07;
         offset-rotate: 90;
         font-size: 60px;
         width: 100%;
         padding-top: 120px;
    }
    /* PROFILE MOBILE*/
     #mobile_profile_box{
         padding: 50px 15px 0px 15px;
         display:grid;
        grid-template-columns:40% 60%;
    }
     #mobile_profilePIC{
         width:52px;
    }
    /* FOOTER */
     #content_footer{
         display: grid;
         grid-template-columns: 0% 100% 0%;
         height: 90px;
         background-color: #101010;
    }
     #content_footer > div{
         font-size: 12px;
         color: #4fd7f7;
         cursor: pointer;
    }
     #content_header_mobile{
         align-items: center;
    }
     .bar_container{
         margin-top: 5px;
    }
    /* BANLIST */
     #banlist{
         font-size: 8px;
    }
     .banlist_container{
         padding: 35px 0px 30px 0px;
        /*padding: 35px 250px 30px 250px;
        */
    }
     #banlist_header{
         font-size: 11px;
    }
     .banlist_head{
         width: 24px;
    }
    /* RULES */
     #rules_content_body_content{
         display:grid;
         grid-template-columns: 0% 100% 0%;
    }
}
 @media only screen and (min-width: 768px) and (max-width: 959px){
     #content_header_mobile{
        height:75px;
        background-color:#17161a;
    }
     #content_header_mobile_menubutton{
        display:block;
    }
     #content_header{
        display:none;
    }

    #content_header_row2_left {
        display: grid;
        grid-template-columns: 2% 44% 44% 0%;
        height: 100%;
    }
     #slider{
        height: 550px;
    }
    /* HEADER */
     #content_header_row2{
         grid-template-columns: 10% 25% 30% 25% 10%;
    }
     .sinsidea_ipadress_span{
         font-size:19px;
    }
    /* ULTIMATE SHOP */
     .shop_produkt_show {
         opacity: 100%;
         position: unset;
         -webkit-transition: all 0.7s ease-in;
         -moz-transition: all 0.7s ease-in;
         -o-transition: all 0.7s ease-in;
         transition: all 0.7s ease-in;
         width: calc(100% * (1) - 10px);
    }
     #SupportContainerMenu{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #SupportContainerMenu > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     .shop_image{
         max-width: 100%;
    }
    /* SHOP2 */
     #shop_content_header{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #shop_content_header > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     #shop_content_headers{
         width: 100%;
         background-color: #262b2f;
    }
    /* WIKI */
     #wiki_content_span{
         text-shadow: 1px 1px 20px #000;
    }
     #wiki_content_container{
         color: #fc9d07;
         offset-rotate: 90;
         font-size: 100px;
         width: 100%;
         padding-top: 120px;
    }
    /* PROFILE MOBILE*/
     #mobile_profile_box{
         padding: 30px 30px 0px 30px;
         display:grid;
        grid-template-columns:40% 60%;
    }
     #mobile_profilePIC{
         width:52px;
    }
    /* FOOTER */
     #content_footer{
         display: grid;
         grid-template-columns: 15% 70% 15%;
         height: 200px;
         background-color: #101010;
    }
     #content_footer > div{
         font-size: 20px;
         color: #4fd7f7;
         cursor: pointer;
    }
    /* BANLIST */
     #banlist{
         font-size: 16px;
    }
     .banlist_container{
         padding: 35px 20px 30px 20px;
    }
     #banlist_header{
         font-size: 19px;
    }
     .banlist_head{
         width: 48px;
    }
    /* RULES */
     #rules_content_body_content{
         display:grid;
         grid-template-columns: 20% 60% 20%;
    }
}
 @media only screen and (min-width: 960px){
     #content_header_mobile{
        display:none;
    }
     #content_header_mobile_menubutton{
        display:block;
    }
     #content_header{
        display:block;
    }
    /* HEADER */
     #content_header_row2{
         grid-template-columns: 10% 25% 30% 25% 10%;
    }
     .sinsidea_ipadress_span{
         font-size:19px;
    }

    #content_header_row2_left {
        display: grid;
        grid-template-columns: 2% 44% 44% 0%;
        height: 100%;
    }

    .h1 {
        text-align: center;
        font-size: 20px !important;
    }
    /* ULTIMATE SHOP */
     .shop_produkt_show {
         opacity: 100%;
         position: unset;
         -webkit-transition: all 0.7s ease-in;
         -moz-transition: all 0.7s ease-in;
         -o-transition: all 0.7s ease-in;
         transition: all 0.7s ease-in;
         width: calc(100% * (1) - 10px);
    }
     #SupportContainerMenu{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #SupportContainerMenu > div{
         padding:10px;
         background-color: #17161a;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     .shop_image{
         max-width: 100%;
    }
     #giftbox{
         margin-top:50px;
    }
    /* SHOP2 */
     #shop_content_header{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #shop_content_header > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     #shop_content_headers{
         width: 100%;
         background-color: #262b2f;
    }
    /* WIKI */
     #wiki_content_span{
         text-shadow: 1px 1px 20px #000;
    }
     #wiki_content_container{
         color: #fc9d07;
         offset-rotate: 90;
         font-size: 100px;
         width: 100%;
         padding-top: 120px;
    }
    /* PROFILE MOBILE*/
     #mobile_profile_box{
         padding: 30px 30px 0px 30px;
         display:grid;
        grid-template-columns:40% 60%;
    }
     #mobile_profilePIC{
         width:52px;
    }
    /* FOOTER */
     #content_footer{
         display: grid;
         grid-template-columns: 15% 70% 15%;
         height: 200px;
         background-color: #101010;
    }
     #content_footer > div{
         font-size: 20px;
         color: #4fd7f7;
    }
    /* BANLIST */
     #banlist{
         font-size: 16px;
    }
     .banlist_container{
         padding: 35px 20px 30px 20px;
    }
     #banlist_header{
         font-size: 19px;
    }
     .banlist_head{
         width: 48px;
    }
    /* RULES */
     #rules_content_body_content{
         display:grid;
         grid-template-columns: 20% 60% 20%;
    }
}
 @media only screen and (min-width: 1024px) {
    /* HEADER */
     #content_header_row2{
         grid-template-columns: 10% 25% 30% 25% 10%;
    }
     .sinsidea_ipadress_span{
         font-size:19;
    }

    .h1 {
        text-align: center;
        font-size: 17px !important;
    }
    /* SHOP2 */
     #shop_content_header{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 80%;
         margin-left: 10%;
    }
     #shop_content_header > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     #shop_content_headers{
         width: 100%;
         background-color: #262b2f;
    }
    /* WIKI */
     #wiki_content_span{
         text-shadow: 1px 1px 20px #000;
    }
     #wiki_content_container{
         color: #fc9d07;
         offset-rotate: 90;
         font-size: 100px;
         width: 100%;
         padding-top: 120px;
    }
    /* PROFILE MOBILE*/
     #mobile_profile_box{
         padding: 30px 30px 0px 30px;
         display:grid;
        grid-template-columns:40% 60%;
    }
     #mobile_profilePIC{
         width:52px;
    }
    /* FOOTER */
     #content_footer{
         display: grid;
         grid-template-columns: 20% 60% 20%;
         height: 200px;
         background-color: #101010;
    }
     #content_footer > div{
         font-size: 19px;
         color: #4fd7f7;
    }
    /* BANLIST */
     #banlist{
         font-size: 16px;
    }
     .banlist_container{
         padding: 35px 20px 30px 20px;
    }
     #banlist_header{
         font-size: 19px;
    }
     .banlist_head{
         width: 64px;
    }
    /* RULES */
     #rules_content_body_content{
         display:grid;
         grid-template-columns: 24% 52% 24%;
    }
}
 @media only screen and (min-width: 1280px) {
    /* HEADER */
     #content_header_row2{
         grid-template-columns: 20% 20% 20% 20% 20%;
    }
     .sinsidea_ipadress_span{
         font-size:24;
    }

    #content_header_row2_left {
        display: grid;
        grid-template-columns: 3% 15% 15% 67%;
        height: 100%;
    }
    /* WIKI */
     #wiki_content_span{
         text-shadow: 1px 1px 20px #000;
    }
     #wiki_content_container{
         color: #fc9d07;
         offset-rotate: 90;
         font-size: 130px;
         width: 80%;
         padding-top: 120px;
         margin-left: 10%;
    }
    /* SHOP2 */
     #shop_content_header{
         grid-template-columns: 16% 16% 16% 16%;
         display: grid;
         color: #4fd7f7;
         justify-items: center;
         font-size: 20px;
         background-color: #262b2f;
         column-gap: 12%;
         width: 61%;
         margin-left: 19.5%;
    }
     #shop_content_header > div{
         padding:10px;
         background-color: #101010;
         border: 1px solid #404040;
         border-radius: 4px;
         width: 100%;
         text-align: center;
         cursor: pointer;
    }
     #shop_content_headers{
         width: 100%;
         background-color: #262b2f;
    }
    /* PROFILE MOBILE*/
     #mobile_profile_box{
         padding: 30px 30px 0px 30px;
         display:grid;
        grid-template-columns:40% 60%;
    }
     #mobile_profilePIC{
         width:52px;
    }
    /* FOOTER */
     #content_footer{
         display: grid;
         grid-template-columns: 20% 60% 20%;
        /*height: 200px;
        */
         height: 110px;
         background-color: #101010;
    }
     #content_footer > div{
         font-size: 19px;
         color: #4fd7f7;
    }
    /* BANLIST */
     #banlist{
         font-size: 16px;
    }
     .banlist_container{
         padding: 35px 250px 30px 250px;
    }
     #banlist_header{
         font-size: 19px;
    }
     #banlist_head{
         width: 64px;
    }
    /* RULES */
     #rules_content_body_content{
         display:grid;
         grid-template-columns: 24% 52% 24%;
    }
}
/*TOOLTIP UNDER SELECTION*/
/* dfn {
     background: rgba(0,0,0,0.2);
     border-bottom: dashed 1px rgba(0,0,0,0.8);
     padding: 0 0.4em;
     cursor: help;
     font-style: normal;
     position: relative;
}
 dfn::after {
     content: attr(data-info);
     display: inline;
     position: absolute;
     top: 22px;
     left: 0;
     opacity: 0;
     width: 230px;
     font-size: 13px;
     font-weight: 700;
     line-height: 1.5em;
     padding: 0.5em 0.8em;
     background: rgba(0,0,0,0.8);
     color: #fff;
     pointer-events: none;
    /* This prevents the box from apearing when hovered. transition: opacity 250ms, top 250ms;
}
 dfn::before {
     content: '';
     display: block;
     position: absolute;
     top: 12px;
     left: 20px;
     opacity: 0;
     width: 0;
     height: 0;
     border: solid transparent 5px;
     border-bottom-color: rgba(0,0,0,0.8);
     transition: opacity 250ms, top 250ms;
}
 dfn:hover {
    z-index: 2;
}
/* Keeps the info boxes on top of other elements dfn:hover::after, dfn:hover::before {
    opacity: 1;
}
 dfn:hover::after {
    top: 30px;
}
 dfn:hover::before {
    top: 20px;
}
 <dfn data-info="Lorem ipsum dolor sit amet, perspiciatis consectetur dolor.">Iste aliquid perspiciatis</dfn> */
