@font-face {
  font-family: 'Gotham Book';
  src: url('https://weplayro.net/themes/weplayro/fonts/Gotham-Book.woff2') format('woff2'),
       url('https://weplayro.net/themes/weplayro/fonts/Gotham-Book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

.horizontal-table td {background: none !important;}
.horizontal-table th {padding: 5px 10px;background-color: #784cbf !important;}
body {color: white;font-family: 'Gotham Book';letter-spacing: 0.8px;background: black}
.logo-img {
  transition: transform 0.3s ease-in-out;
}
a {color: white;}
a:hover {color: #ffb600;}
/* Bounce animation */
.logo-img:hover {
  animation: bounce 0.6s;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-15px);
  }
  60% {
    transform: translateY(-8px);
  }
}
button, input, select, textarea {
  background: #292929;
}


h1 {letter-spacing: 0.7px;font-size: 52px}
		.sstatus {background: #202020;margin:9px;padding: 5px;border-radius: 0px}
		.sstatus p {color: #bbbbbb;font-size: 14px;}
		.spacer {height: 100px}

		.status-bar {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 12px;
		padding: 16px;
		}
		.sstatus {
		background: #202020;
		border-radius: 3px;
		padding: 6px 12px;
		color: #b0b0b0;
		font-weight: 600;
		display: inline-block;
		align-items: center;
		}
		.sstatus p {margin-bottom: 0px}
		.social{display: inline-block;}
		.sstatus span {
		margin-left: 6px;
		font-weight: 700;
		color: #fff;
		}
		.sstatus span.online {
		background: #19c37d;
		color: #0c1c12;
		padding: 4px 8px;
		border-radius: 6px;
		font-size: 12px;
		text-transform: uppercase;
		}
		.social a {
		  display: inline-flex;
		  align-items: center;
		  justify-content: center;
		  width: 22px;
		  height: 22px;
		  background: #747474;
		  border-radius: 16px;
		  color: black;
		  text-decoration: none;
		  font-size: 10px;}
		.social a:hover {
		opacity: 0.8;
		background:#d3d3d3}


    .navbar {
      margin-bottom: 0;
    }

    .navbar-nav > li > a { display: flex;align-items: center;gap: 6px;}
    .navbar-nav > li > a i { font-size: 14px;}
    #main-navbar .navbar-nav a{padding:50px 25px !important;color: white}
    .navbar-default {background: rgba(0, 0, 0, 0.65);border:0px}
    .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {color: #555;background-color: #1f152f;}
    .dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {color: #555;background-color: #1f152f;}
    .dropdown-menu {background: rgba(0, 0, 0, 0.65);border:0px}
    #main-navbar .navbar-nav .dropdown-menu li a {padding: 10px 25px !important;color: white; /* optional, since white on white may not be visible */}
    /*.headermain{background: url() no-repeat;background-position:bottom right; }*/
    .headermain h1,p {color: white;}
    .headermain span {color:#fab918;}
    .headermain p{font-size: 30px; padding: 40px 0px;width: 80%;}

.headermain {
  position: relative;
  overflow: hidden; /* keep it clipped if needed */
}

.headermain .bg-img {
  position: absolute;
  top: -7px;
  left: 45%; /* locked position */
  z-index: 1;
  pointer-events: none; /* so it doesn't block clicks */
}

.headermain .container {
  position: relative;
  z-index: 2; /* ensure text/buttons appear above image */
}
/* Default for md and larger (≥768px) */
.sinfo {background: url('../img/bginfo1x.png') no-repeat;background-position: center center;min-height: 564px;background-size: cover;}
.forge {background: url('../img/forge.png') no-repeat;background-position: top center;min-height: 852px;background-size:cover; }
.rbg {background: url('../img/rbg.png') no-repeat;background-position: center center;min-height: 400px;background-size:cover; }
.sinfo h1{display: none;}

.alert-warning
 {
    color: white;
    background-color: #0000007d;
    border-color: #3e3e3e;
}
.alert {
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;

.sinfodiv {padding-right:0px;padding-left: 0px;text-align: right}
.sinforow {margin-top:120px;}
.sinforow2{margin-top: 40px}

.forge h1{font-size: 48px;margin-top:80px;}
.forgeh {font-size: 18px;margin-bottom: 20px}
.fbtn img {margin-top: 25px;margin-bottom: 45px;}
.forge h4 {color: #fbb918;}

.rbg a {display: inline-block;margin-top:32px}
.rbg p{margin-top: 45px;font-size: 18px;}
.rbg img{ margin:0 10px; }
.ffooter p{color: #575757;}
.ffooter a{color: #575757;}
.ffooter a:hover{color: #c6c6c6;}
.ffooter {background:black;}
/* Default (md and up) */
.hdbt a{display: inline-block; margin:0px;padding: 10px;text-align: left;}

#mobile-nav-wrap {min-height: 100px;}
/* Hidden by default */
.scroll-animate {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease-out;
}

/* When visible */
.scroll-animate.visible {
  opacity: 1;
  transform: translateY(0);
}

/* For screens smaller than md (<768px) */
@media (max-width: 767px) {
	.sstatus {padding: 5px;}
  .sinfo {background: url('../img/bginfo.png') no-repeat;background-position: center center;min-height: 564px;background-size: cover;}
  .forge {background: url('../img/forge.png') no-repeat;background-position: top center;min-height: 852px;background-size:cover; }
  .rbg {background: url('../img/rbg.png') no-repeat;background-position: center center;min-height: 193px; background-size: cover;}
  .sinfo h1{display: block;text-align: center;font-size: xx-large;padding: 10px;background: #55118d;}
  .rbg a {display: block ruby;margin-top:0px;padding: 10px 0px 20px;}
  .rbg p{margin-top: 20px;font-size: 15px;}
  .hdbt a{display: inline-block; margin:0px;padding: 10px;text-align: center;}
  h1 {letter-spacing: 0.6px;font-size: 42px}
}




@media screen and (min-width: 0px) and (max-width: 992px) {

    #mobile-nav-wrap {

		background-color: #202020 !important;

		box-shadow: 0 0 2rem rgba(0,0,0,1);

	}

	

	#mobile-nav-wrap > #mobile-nav-logo {

		

		padding: 1rem 0;

	}

	

	#mobile-nav-btn {

		position: absolute;

		inset: 1;

		font-size: 1.25rem;

	}

	

	#mobile-nav-cont-wrap {

		z-index: 0 !important;

		width: 70% !important;

	}



	#status .status-group p {

		font-size: 0.875rem !important;

	}



	#header #header-group {

		margin: 12rem auto 4rem auto !important;

		text-align: center !important;

		text-shadow: 0 0 1rem rgba(0,0,0,1);

	}



	#content-wrap {

		margin: 4rem 0 8rem 0 !important;

		padding-top: 6rem !important;

		padding-bottom: 8rem !important;

	}



	#content-wrap > div#default{

		padding-bottom: 8rem !important;

	}



	#info {

		gap: 1rem !important;

	}



	#info .info-group {

		width: 24rem !important;

	}



	#social-link #socials {

		justify-content: center !important;

		gap: 0 2rem !important;

	}



	div.page-logo {

		max-width: 66.66% !important;

	}

	

	.download-wrap {

		gap: 1rem !important;

	}

	

	.download-wrap > .download-group {

		max-width: 100% !important;

	}

	

	#discord-embed {

		min-height: 30rem !important;

	}



	.vertical-table {

		width: 100% !important;

	}

	

	#vote-notice {

		width: 100% !important;

	}

	

	#vote-banner-wrap {

		max-width: 100% !important;

		gap: 0.25rem 0;

	}	



	.donate-wrap {

		max-width: 100% !important;

	}

}



@media screen and (min-width: 992px) {

	div.modal#modal-promo > .modal-dialog {

		max-width: 50% !important;

		margin: auto !important;

		font-size: 0.875rem;

	}

}



@media screen and (max-width: 1120px) {

	#info {

		justify-content: space-around !important;

	}

}



@media screen and (min-width: 1920px) {

	#info {

		justify-content: flex-start !important;

	}

	

	#char-render > div {

		inset: 10.625rem 0 0 28rem !important;

	}

	

	div.modal[id^="modal-"] > .modal-dialog {

		max-width: 33% !important;

		margin: auto !important;

		font-size: 0.875rem;

	}

	

	div.modal#modal-promo > .modal-dialog {

		max-width: 50% !important;

		margin: auto !important;

		font-size: 0.875rem;

	}

}



html {

	scroll-behavior: smooth;

	position: relative;

	height: 100%;

}



.g-recaptcha {

	margin: 0 auto;

}







#content-wrap {

	min-height: 100%;

	padding-top: 8rem;

	margin: 4rem 0;

	padding-bottom: 12rem;

}



#content-wrap div#default {

	text-shadow: 0 0 0.5rem rgba(255,255,255,1);

	padding-bottom: 4rem;

	font-size: 0.875rem;

}



#content-wrap div#default p {

	text-shadow: 0 0 0.25rem rgba(255,255,255,1),

				 0 0 0.25rem rgba(255,255,255,1),

				 0 0 0.125rem rgba(255,255,255,1),

				 0 0 0.125rem rgba(255,255,255,1);

}



#status-wrap {

	width: 100%;

	background: #000;

	color: #bbbbbb;

	z-index: 999;

	position: relative;

	padding: 0.5rem 0;

}



#status {

	display: flex;

	justify-content: flex-start;

	gap: 0 0.5rem;

}



#status .status-group {

	min-width: 10rem;

	background-color: #202020;

	padding: 0.25rem 0.5rem;

	border-radius: 0.25rem;

	display: flex;

	justify-content: space-between;

}



#status .status-group p {

	margin: 0;

	font-size: 0.675rem;

}



#status .status-group:not(#time) p.value {

	text-transform: uppercase;

	font-weight: 700;

}



#status .status-group:not(#time) p.value.icon-green {

	color: #33cc33;

}



#status .status-group:not(#time) p.value.icon-yellow {

	color: #cccc33;

}



#status .status-group:not(#time) p.value.icon-red {

	color: #cc3333;

}



#status-wrap #btn-wrap {

	margin-left: 2rem;

	gap: 0 0.75rem;

}



#status-wrap #btn-wrap a {

	text-decoration: none;

	color: #bbbbbb;

	transition: color 0.25s ease-in-out;

}



#status-wrap #btn-wrap a:hover,

#status-wrap #btn-wrap a:focus,

#status-wrap #btn-wrap a:focus-within {

	color: #ffc606;

}



#status-wrap #btn-wrap i {

	font-size: 1.25rem;

}



#nav-wrap {

	width: 100%;

	background: rgba(0,0,0,0.65);

	color: #fff;

	position: absolute;

	z-index: 1020;

}



#nav-wrap ul {

	min-height: 8rem;

	list-style-type: none;

	padding-left: 0 !important;

	margin: 0;

}



#navbar a#home > img {

	max-height: 4rem;

}



#navbar a {

	color: #fff;

	text-decoration: none;

	transition: filter 0.25s ease-in-out,

				color 0.25s ease-in-out;

}



#navbar a:hover,

#navbar a:focus, 

#navbar a:focus-within {

	color: #ffc606;

	filter: drop-shadow(0 0 0.75rem rgba(255,255,255,0.5));

}



#navbar #account-group i {

	font-size: 1.5rem;

}



#navbar #account-group {

	display: flex;

	gap: 0 1rem;

}



#mobile-nav-cont-wrap {

	z-index: -1 !important;

	position: fixed !important;

	left: -100%;

	width: 75%;

	height: 100%;

	overflow-x: hidden !important;

	transition: all 0.25s ease-in-out;

	padding: 1.5rem 1.5rem 8rem 1.5rem;

	background-color: rgba(0,0,0,0.85);

}



#mobile-nav-cont-wrap.active {

	z-index: 1030 !important;

	overflow-y: auto !important;

	left: 0;

}



#mobile-nav-cont-wrap .btn {

	color: #fff;

	font-size: 0.75rem;

}



#mobile-nav-cont-wrap #mobile-login {

	margin: 2rem auto;

}



#mobile-nav-cont-wrap hr {

	background-color: #fff;

}



#mobile-nav-cont-wrap > #mobile-nav-menu,

#mobile-nav-cont-wrap > #mobile-login {

	min-height: 1rem;

	width: 100%;

}



#mobile-nav-menu > a {

	position: relative;

	padding: 1rem 0;

	display: flex;

	justify-content: flex-start;

	color: #fff;

	text-decoration: none !important;

}



#mobile-nav-menu > a:hover,

#mobile-nav-menu > a:focus,

#mobile-nav-menu > a:focus-within {

	color: #ffc606 !important;

}



#mobile-nav-menu > a:after {

	content: '';

	position: absolute;

	height: 0.125rem;

	width: 0%;

	left: 50%;

	bottom: 0rem;

	background-color: #ffc606;

	transition: all 0.25s ease-in-out;

}



#mobile-nav-menu > a:hover:after,

#mobile-nav-menu > a:focus:after,

#mobile-nav-menu > a:focus-within:after {

	width: 100%;

	left: 0;

}



#mobile-nav-menu > a > i {

	font-size: 1.5rem;

	width: 3rem;

	text-align: center !important;

}



#mobile-nav-menu > a > p {

	font-family: 'Gotham Book', Arial, Helvetica, sans-serif;

	font-size: 1rem;

	margin-left: 1rem;

}



#mobile-nav-btn {

	position: fixed !important;

	z-index: 1031 !important;

	border: none;

	background-color: transparent;

	color: #fff;

	inset: 1;

	transition: all 0.25s ease-in-out;

}



#mobile-nav-btn i {

	font-size: 1.25rem !important;

}



#header-wrap {

	background-image: url('../img/bg_header.webp');

	background-repeat: no-repeat;

	background-position: top center;

	background-size: cover;

}



#header {

	margin-top: -12rem;

	position: relative;

	min-height: 36rem;

	z-index: 1;

}



#header #header-group {

	margin-top: 12rem;

	font-size: 0.875rem;

	color: #fff;

}



#header-wrap > #char-render {

	position: absolute;

	inset: 0;

	z-index: 0;

	height: 28rem;

	width: inherit;

}



#char-render > div {

	height: inherit;

	width: 44rem;

	position: absolute;

	background-image: url('../img/char_render.webp');

	background-repeat: no-repeat;

	background-position: bottom right;

	background-size: contain;

	inset: 10.625rem 0 0 calc(50% - 16rem);

	filter: drop-shadow(0 0 1rem #b1ecff);

}



#header #header-group h1 {

	font-size: 3.25rem;

	font-family: 'Gotham', Arial, Helvetica, sans-serif;

	color: #fff;

}



#header-group h1 > span,

.feature-group h6 {

	color: #ffc606;

}



#header-group a {

	font-size: 0.875rem;

	font-weight: 700;

	color: #fff;

	padding: 1rem 2.5rem;

	border-radius: 2.5rem;

	text-shadow: 0 0 0.5rem rgba(0,0,0,0.25), 0.125rem 0.125rem 0.125rem rgba(0,0,0,0.25);

}



#info-wrap {

	background-color: #f1f1f1;

	min-height: 60rem;

	padding: 3rem 0 6rem 0;

	color: #929292;

	position: relative;

	z-index: 999;

}



#info {

	

	gap: 2rem 1.75rem;

}



#info .info-group {

	max-width: 16.5rem;

}



.info-group > .thumbnail {

	height: 12.5rem;

	position: relative;

	background-repeat: no-repeat;

	background-position: top center;

	background-size: cover;

}



.info-group > .thumbnail#thumb_1 {

	background-image: url('../img/info/thumb_1.webp');

}



.info-group > .thumbnail#thumb_2 {

	background-image: url('../img/info/thumb_2.webp');

}



.info-group > .thumbnail#thumb_3 {

	background-image: url('../img/info/thumb_3.webp');

}



.info-group > .thumbnail#thumb_4 {

	background-image: url('../img/info/thumb_4.webp');

}



.info-group > .thumbnail#thumb_5 {

	background-image: url('../img/info/thumb_5.webp');

}



.info-group > .thumbnail#thumb_6 {

	background-image: url('../img/info/thumb_6.webp');

}



.info-group > .thumbnail#thumb_7 {

	background-image: url('../img/info/thumb_7.webp');

}



.info-group > .thumbnail#thumb_8 {

	background-image: url('../img/info/thumb_8.webp');

}



.info-group > .thumbnail:after {

	content: '';

	position: absolute;

	height: 100%;

	width: 100%;

	z-index: 0;

	background-image: linear-gradient(180deg, transparent 55%, rgba(1, 101, 235, 0.75) 100%);

}



.info-group > .thumbnail > p.title {

	font-family: 'Gotham Condensed', Arial, Helvetica, sans-serif;

	color: #fff;

	font-weight: normal;

	text-transform: uppercase;

	letter-spacing: 0.25rem;

	font-size: 2rem;

	position: absolute;

	bottom: 0;

	margin-bottom: 0.5rem;

	width: 100%;

	text-align: center;

	z-index: 999;

	line-height: 2rem;

	padding: 0 0.5rem;

	text-shadow: 0 0 0.5rem rgba(0,0,0,0.5);

}



.info-group > .caption {

	padding: 1rem;

	box-shadow: 0 1rem 4rem rgba(64,64,64,0.25);

}



.info-group > .caption > p.title {

	color: #038edd;

	font-size: 0.875rem;

}



.info-group > .caption > p:not(.title) {

	color: #929292 !important;

	font-size: 0.75rem !important;

	margin-bottom: 0;

}



#feature-wrap {

	min-height: 44rem;

	background-image: url('../img/bg_feature.webp');

	background-repeat: no-repeat;

	background-position: center;

	background-size: cover;

	color: #fff;

}



#feature-wrap h1 {

	font-size: 2.75rem;

	font-family: 'Gotham Book', Arial, Helvetica, sans-serif;

	color: #fff;

}



#feature-wrap h6 {

	font-family: 'Gotham Book', Arial, Helvetica, sans-serif;

	font-size: 0.875rem;

}



#feature-wrap p {

	font-family: 'Gotham Book', Arial, Helvetica, sans-serif;

	font-size: 1.05rem;

}



#feature-wrap #char-render2 {

	background-image: url('../img/char_render2.webp');

	background-repeat: no-repeat;

	background-position: bottom left;

	height: 48rem;

	background-size: contain;

	margin-top: 4rem;

}



#feature-wrap .feature-group {

	display: flex;

	justify-content: space-between;

	align-items: center;

	gap: 0 1rem;

}



#feature-wrap .feature-group p {

	font-size: 0.75rem;

}



#content-wrap hr.separator {

	width: 100%;

	color: #b7b7b7;

	margin: 1rem auto 3rem auto;

}



#register-wrap {

	min-height: 20rem;

	background-image: url('../img/bg_register.webp'),

					linear-gradient(0deg, rgba(1,94,234,1) 0%, rgba(0,192,250,1) 100%);

	background-repeat: no-repeat;

	background-position: center, top center;

	background-size: cover;

	background-blend-mode: soft-light;

	box-shadow: 0 -2rem 4rem rgba(0,0,0,0.25);

	color: #fff;

}



#register-wrap a {

	font-size: 1rem;

	color: #fff;

	padding: 1rem 2.5rem;

	border-radius: 2.5rem;

	text-shadow: 0 0 0.25rem rgba(0,0,0,0.25);

	text-transform: uppercase;

}



#register {

	min-height: 20rem;

	display: grid;

	align-content: center;

	gap: 1rem 0;

}



#discord {

	min-height: 32rem;

	display: grid;

	align-content: center;

	gap: 1rem 0;

}



#footer-wrap {

	margin-top: -16rem;

	background-color: #1c1c1a;

	border-top: 0.0625rem solid #636363;

	min-height: 16rem;

	padding: 2rem 0;

}



#footer-wrap #footer-link > #qlink {

	padding-left: 0;

	list-style-type: none;

	font-size: 0.75rem;

}



#qlink > li {

	position: relative;

	padding: 0 1rem;

}



#qlink > li:not(:last-child):after {

	content: '';

	position: absolute;

	height: 100%;

	border-right: 0.0625rem solid #575757;

	margin: 0 1rem;

}



#qlink a {

	color: #575757;

	text-decoration: none;

	transition: color 0.25s ease-in-out;

}



#qlink a:hover,

#qlink a:focus,

#qlink a:focus-within {

	color: #fff;

}



#copyright p {

	font-size: 0.875rem;

	color: #575757;

}



#footer-link #logo {

	gap: 0 2rem;

}



#footer-link #logo > #server {

	background-image: url('../img/logo.webp');

	background-repeat: no-repeat;

	background-position: center;

	background-size: contain;

	height: 4rem;

	width: 25%;

	margin-right: -1rem;

}






.generic-form-table p,

.generic-form-table label,

.generic-form-table button, 

.generic-form-table input[type="submit"], 

.generic-form-table input[type="reset"], 

.generic-form-table input[type="button"] {

	margin: 1rem 0;

}



.generic-form-table label {

	padding-right: 4rem;

}



#menu-group {

	background-color: rgba(255,255,255,0.25);

	border: 0.0625rem solid #929292;

	padding: 1rem;

	font-size: 0.75rem;

	margin-bottom: 2rem;

	border-radius: 0.25rem;

}



#password-note, #email-note {

	position: absolute;

	top: 10rem;

	opacity: 0;

	z-index: -1;

	visibility: hidden;

	padding: 1rem;

	font-size: 0.75rem !important;

	transition: all 0.25s ease-in-out;

}



#password-note.active,

#email-note.active {

	opacity: 1;

	visibility: visible;

	z-index: 1;

}



#notif-wrap {

	z-index: 1030;

	position: absolute;

	top: 8rem;

	animation: pop-out-msg .5s 1.5s;

	-webkit-animation: pop-out-msg .5s 1.5s;

	animation-fill-mode: forwards;

	animation-delay: 3s;

	-webkit-animation-delay: 3s;

	-webkit-animation-fill-mode: forwards

}



.bg-black {

	background-color: rgba(20, 20, 20, 0.80);

	text-shadow: none !important;

	color: #f1f1f1 !important;

}



.bg-black p {

	text-shadow: none !important;

}



.empty-row {

	display: none;

}



.search-form {

	display: none;

}



.horizontal-table {

	min-width: 100% !important;

}



.vertical-table {

	width: 50%;

}



.horizontal-table,

.vertical-table {

	font-size: 0.75rem !important;

	border-collapse: separate;

	border-spacing: 0;

}



.horizontal-table th, 

.vertical-table th {

	background-color: rgba(0,0,0,0.65);

	text-shadow: none;

	color: #f1f1f1;

	padding: 0.5rem;

	font-weight: normal;

	border: 0.0625rem solid rgba(0,0,0,0.25);

}



.horizontal-table td, 

.vertical-table td {

	border: 0.0625rem solid rgba(0,0,0,0.25);

	background-color: rgba(255,255,255,0.25);

	padding: 0.5rem;

}



td.char-head-sprite {

	width: 3rem !important;

	text-align: center;

}



table:not(.generic-form-table) tr:first-child td:first-child,

table:not(.generic-form-table) tr:first-child th:first-child {

	border-top-left-radius: 0.275rem;

}



table:not(.generic-form-table) tr:first-child td:last-child,

table:not(.generic-form-table) tr:first-child th:last-child {

	border-top-right-radius: 0.275rem;

}



table:not(.generic-form-table) tr:last-child td:first-child,

table:not(.generic-form-table) tr:last-child th:first-child {

	border-bottom-left-radius: 0.275rem;

}



table:not(.generic-form-table) tr:last-child td:last-child,

table:not(.generic-form-table) tr:last-child th:last-child {

	border-bottom-right-radius: 0.275rem;

}



table:not(.generic-form-table) tr:first-child td,

table:not(.generic-form-table) tr:first-child th {

	border-top-style: solid;

}



table:not(.generic-form-table) tr td:first-child,

table:not(.generic-form-table) tr th:first-child {

	border-left-style: solid;

}



div.page-logo {

	max-width: 33.33%;

	filter: drop-shadow(0 0 1rem rgba(255,255,255,1))

			drop-shadow(0 0 0.5rem rgba(255,255,255,0.5));

}



.sub-header {

	display: flex;

	align-items: center;

	margin-bottom: 2rem;

	color: #0165eb;

}



.sub-header > .module-title {

	margin-top: 0 !important;

	margin-bottom: 0;

}



.sub-header > i {

	font-size: 1.5rem !important;

	padding-right: 1rem;

}



#trans-wrap {

	gap: 1rem;

}



.trans-group {

	padding: 1rem;

	border-radius: 0.5rem;

	background-color: rgba(255,255,255,0.35);

	border: 0.0625rem solid rgba(53,53,53,0.25);

}



.admin-menu-item,

.sub-menu-item,

.page-menu-item {

	margin: 0 0.25rem;

}



.request, .fs-path {

	font-family: Monaco, "Lucida Console", "Bitsteam Vera Sans Mono", monospace;

	text-align: center;

	background-color: rgba(255,255,255,0.75);

	padding: 0.25rem;

	border: 0.0625rem solid rgba(0,0,0,0.25);

	border-radius: 0.125rem;

}



.current-sub-menu {

	text-decoration: underline !important;

}



#content-wrap #default h2 {

	text-align: center;

}



* + h3 {

	margin-top: 1.5rem;

}



.download-wrap {

	gap: 1rem;

	text-shadow: none !important;

}



.download-group {

	max-width: 25% !important;

	border: 0.0625rem solid #0165eb;

	padding: 0.5rem;

	text-align: center;

	border-radius: 0.5rem;

	text-decoration: none !important;

	transition: all 0.25s ease-in-out !important;

}



.download-group > i {

	font-size: 2rem !important;

	text-align: center;

	color: #0165eb;

	transition: all 0.25s ease-in-out !important;

}



.download-group > span {

	font-family: 'Gotham Book', Arial, Helvetica, sans-serif;

	font-weight: none !important;

	font-size: 0.9rem;

	transition: all 0.25s ease-in-out !important;

}



.download-group:hover,

.download-group:focus,

.download-group:focus-within {

	border: 0.0625rem solid #0165eb;

	background-color: #0165eb;

}



.download-group:hover > i,

.download-group:focus > i,

.download-group:focus-within > i,

.download-group:hover > span,

.download-group:focus > span,

.download-group:focus-within > span {

	color: #fff;

}



.donate-wrap {

	display: flex;

	justify-content: center;

	align-items: center;

	flex-wrap: wrap;

	gap: 2rem;

	max-width: 75%;

}



a.donate-group {

	height: 8rem;

	width: 8rem;

	background-color: rgba(255,255,255,0.5);

	border-radius: 4rem;

	filter: saturate(0.85);

	transition: all 0.25s ease-in-out;

}



a.donate-group:hover,

a.donate-group:focus,

a.donate-group:focus-within {

	background-color: rgba(255,255,255,1);

	filter: saturate(1.15);

	

}



a.donate-group#btn-paypal {

	background-image: url('../img/icon/paypal.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 50%;

}



a.donate-group#btn-gcash {

	background-image: url('../img/icon/gcash.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 66%;

}



a.donate-group#btn-gcash2bank {

	background-image: url('../img/icon/gcash2bank.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 66%;

}



a.donate-group#btn-maya {

	background-image: url('../img/icon/maya.webp');

	background-position: center 55%;

	background-repeat: no-repeat;

	background-size: 75%;

}



a.donate-group#btn-bank {

	background-image: url('../img/icon/bank.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 75%;

}



a.donate-group#btn-gotyme {

	background-image: url('../img/icon/gotyme.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 75%;

}



a.donate-group#btn-coins {

	background-image: url('../img/icon/coinsph.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 75%;

}



a.donate-group#btn-bitcoin {

	background-image: url('../img/icon/bitcoin.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 75%;

}



a.donate-group#btn-usdt {

	background-image: url('../img/icon/usdt.webp');

	background-position: center;

	background-repeat: no-repeat;

	background-size: 75%;

}



iframe.converter {

	width: 100%;

	height: 7rem !important;

	border: none;

}



.paypal-input {

	width: 16.5rem !important;

	text-align: center;

	letter-spacing: 0;

}



span.donate-info {

	font-family: 'Lucida Sans', Arial, Helvetica, sans-serif;

	color: #0165eb;

	font-weight: 700;

	text-decoration: underline;

	cursor: pointer;

}



.form-check.checkbox-lg > .form-check-input {

	height: 1.5rem;

	width: 1.5rem;

	cursor: pointer;

}



.form-check.checkbox-lg > .form-check-label {

	margin-left: 1rem;

	cursor: pointer;

}



.pages,

.jump-to-page {

	display: flex;

	justify-content: center;

	gap: 0 0.5rem;

}



.page-num,

.page-prev,

.page-next {

	text-align: center;

	min-width: 2rem !important;

	padding: 0.5rem 0.5rem;

	border: 0.0625rem solid #929292;

	background-color: rgba(255,255,255,0.5);

	border-radius: 0.25rem;

	text-decoration: none !important;

}



tr.top-ranked > td {

	background-color: rgba(51, 160, 255, 0.25);

}



#vote-notice {

	width: 50%;

}



#vote-banner-wrap {

	max-width: 75%;

	gap: 1rem;

}



.disabled {

	cursor: not-allowed;

}



.disabled > table > tr:first-child > td {

	opacity: 0.25;

}



a[id^="votelink-"] > img {

	transition: filter 0.25s ease-in-out;

}



a[id^="votelink-"]:hover > img,

a[id^="votelink-"]:focus > img,

a[id^="votelink-"]:focus-within > img {

	filter: saturate(1.15) brightness(1.05) contrast(1.05);

}



div[id^=banner-].disabled {

	filter: saturate(0);

	opacity: 0.66;

}



.qr-wrap {

	max-width: 60% !important;

	padding: 1rem;

	margin: 0 auto;

}



#navbar a {

	position: relative;

}



#navbar a > div.icon-promo {

	height: 3.3rem;

	width: 3.3rem;

	position: absolute;

	right: -2.25rem;

	bottom: calc(50% - 0.75rem);

	background-image: url('../img/icon/promo.webp');

	background-repeat: no-repeat;

	background-position: center;

	background-size: contain;

	z-index: -1;

	animation: sway 3s cubic-bezier(0.25, 0.25, 0.25, 0.25) forwards infinite;

}



@keyframes pop-out-msg {

    from {opacity: 1; visibility: visible; z-index: 1030;}

    to {opacity: 0; visibility: hidden; z-index: -1;}

}



@-webkit-keyframes pop-out-msg {

    from {opacity: 1; visibility: visible; z-index: 1030;}

    to {opacity: 0; visibility: hidden; z-index: -1;}

}



@keyframes sway {

	0% { transform: rotate(0deg); }

	4.16% { transform: rotate(2.5deg); }

	8.32% { transform: rotate(-2.5deg); }

	12.48% { transform: rotate(5deg); }

	16.64% { transform: rotate(-5deg); }

	20.8% { transform: rotate(2.5deg); }

	24.96% { transform: rotate(-2.5deg); }

	24.97% { transform: rotate(0); }

}