/*
 ::Table Of Content

 1.) Home page Content
 2.) Slide-show
 3.) Server-Time page Content
 -------------------------------------------*/
/*
 1.) Home page Content
 -----------------------------------------------*/
#content  {
	overflow: hidden;
	padding-top: 138px;
	position: relative;
	min-height: 760px;
	display: grid;
	grid-template-columns: 255px minmax(0, 1fr) 255px;
	gap: 18px;
	align-items: start;
}

#content::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 108px;
	transform: translateX(-50%);
	width: min(980px, 92vw);
	height: min(540px, 56vw);
	background: url('../images/mail/war0nline_transparent_bg_logo.png') no-repeat center center;
	background-size: contain;
	opacity: 0.34;
	filter: drop-shadow(0 18px 34px rgba(0, 0, 0, 0.34));
	pointer-events: none;
	z-index: 0;
}

#content > * {
	position: relative;
	z-index: 1;
}
#menu {
    padding: 5px 20px;
    font-family: "Helvetica Neue", Helvetica, Arial;
    font-size: 12px;
    line-height: 18px;
    color: #0471cc;
}

a { text-decoration: none }

/* ===[ Dark Button CSS ]=== */

.button {
    outline: 0;
    padding: 5px 12px;
    display: block;
    color: #9fa8b0;
    font-weight: bold;
    text-shadow: 1px 1px #1f272b;
    border: 1px solid #0471cc;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background: #0471cc; /* old browsers */
    background: -moz-linear-gradient(top, #3D4850 3%, #313d45 4%, #0471cc 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#3D4850), color-stop(4%,#313d45), color-stop(100%,#0471cc)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3D4850', endColorstr='#0471cc',GradientType=0 ); /* ie */
    box-shadow: 1px 1px 1px rgba(0,0,0,0.2); /* CSS3 */
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.2); /* Firefox */
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2); /* Safari, Chrome */
}

.button:hover {
    color: #0471cc;
    background: #0471cc; /* old browsers */
    background: -moz-linear-gradient(top, #0471cc 3%, #404F5A 4%, #2E3940 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#0471cc), color-stop(4%,#404F5A), color-stop(100%,#2E3940)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0471cc', endColorstr='#2E3940',GradientType=0 ); /* ie */
}

.button:active {
    background-position: 0 top;
    position: relative;
    top: 1px;
    color: #fff;
    padding: 6px 12px 4px;
    background: #0471cc; /* old browsers */
    background: -moz-linear-gradient(top, #0471cc 3%, #252E34 51%, #222A30 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#0471cc), color-stop(51%,#252E34), color-stop(100%,#222A30)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0471cc', endColorstr='#222A30',GradientType=0 ); /* ie */
    -moz-box-shadow: 1px 1px 1px rgba(255,255,255,0.1); /* Firefox */
    -webkit-box-shadow: 1px 1px 1px rgba(255,255,255,0.1); /* Safari, Chrome */
    box-shadow: 1px 1px 1px rgba(255,255,255,0.1); /* CSS3 */
}

/* ===[ Other stuff: ]=== */

.vertical-list {
    list-style: none;
    padding: 10px;
    width: 200px;
    border-radius: 5px;

}

.vertical-list .button {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    background: #515B62; /* old browsers */
    background: -moz-linear-gradient(top, #515B62 3%, #444E55 5%, #394147 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#515B62), color-stop(5%,#444E55), color-stop(100%,#394147)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515B62', endColorstr='#394147',GradientType=0 ); /* ie */
}

.vertical-list li { margin: 0 0 5px }

.side-bar  {
	width: auto;
	float: none;
}

.main-content  {
	width: auto;
	max-width: none;
	float: none;
	margin: 0;
	min-width: 0;
}

.side-link  {
	width: auto;
	float: none;
}

.form  {
	color: #ffffff;
	margin-top: 3px;
}

.title  {
	background: url(../images/h1-repeater.png) repeat-x left top;
	margin: 0 50px 0 29px;
	border-radius: 3px 3px 0px 0px;
	-webkit-border-radius: 6px 6px 0px 0px;
	border: 1px solid #0471cc;
	border-bottom: none;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
}

.main-form  {
	background: url(../images/side-box-repeater.png) repeat-x left top;
	padding: 0 3px;
	border: 1px solid #0471cc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
}



.cpanel-form  {
	background: url(../images/side-box-repeater.png) repeat-x left top;
	padding: 0 3px;
	border: 1px solid #0471cc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
}

.pilot-summary {
	margin: 8px 10px 14px;
	padding: 14px 14px 12px;
	background: rgba(8, 29, 47, 0.72);
	border: 1px solid rgba(92, 174, 241, 0.24);
	border-radius: 10px;
	color: #eaf6ff;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}

.pilot-summary h3 {
	margin: 0 0 4px;
	font-size: 15px;
	font-weight: normal;
	color: #ffffff;
	text-shadow: 0 0 10px rgba(1, 134, 243, 0.28);
}

.pilot-summary-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 10px;
}

.pilot-summary-subtitle {
	font-size: 11px;
	letter-spacing: 0.7px;
	text-transform: uppercase;
	color: #87accb;
}

.pilot-role-badge {
	padding: 6px 10px;
	border-radius: 999px;
	border: 1px solid rgba(110, 188, 245, 0.2);
	background: linear-gradient(180deg, rgba(17, 61, 96, 0.9) 0%, rgba(8, 31, 49, 0.92) 100%);
	color: #d8f3ff;
	font-size: 11px;
	letter-spacing: 0.9px;
	text-transform: uppercase;
	white-space: nowrap;
}

.pilot-summary-name {
	font-size: 20px;
	font-weight: bold;
	color: #8ee7ff;
	margin-bottom: 10px;
	text-shadow: 0 0 12px rgba(1, 134, 243, 0.32);
}

.pilot-summary-grid,
.pilot-currency-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 10px;
}

.pilot-quick-strip {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 10px;
}

.pilot-currency-grid {
	grid-template-columns: 1fr;
	margin-bottom: 0;
}

.pilot-summary-grid div,
.pilot-currency-grid div,
.pilot-quick-strip div {
	padding: 8px 10px;
	background: rgba(12, 37, 58, 0.82);
	border: 1px solid rgba(96, 165, 222, 0.14);
	border-radius: 8px;
}

.pilot-summary-grid span,
.pilot-currency-grid span,
.pilot-quick-strip span,
.pilot-last-login span {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.7px;
	color: #8fb2cf;
	margin-bottom: 3px;
}

.item-shop-shell {
	padding: 22px 20px 24px;
	color: #d9f3ff;
}

.item-shop-hero {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	padding: 24px;
	margin-bottom: 22px;
	border: 1px solid rgba(79, 170, 235, 0.32);
	border-radius: 16px;
	background:
		radial-gradient(circle at top right, rgba(111, 214, 255, 0.18), transparent 28%),
		linear-gradient(135deg, rgba(6, 23, 38, 0.95) 0%, rgba(11, 42, 67, 0.9) 60%, rgba(6, 20, 32, 0.96) 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 16px 34px rgba(0, 0, 0, 0.24);
}

.item-shop-kicker {
	font-size: 11px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: #80c7f2;
	margin-bottom: 6px;
}

.item-shop-hero h3,
.item-shop-section-header h3 {
	margin: 0 0 8px;
	font-size: 28px;
	font-weight: normal;
	color: #ffffff;
}

.item-shop-hero p,
.item-shop-section-header p,
.item-shop-card p,
.item-shop-note {
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
	color: #accde0;
}

.item-shop-balance {
	min-width: 180px;
	padding: 16px;
	border-radius: 12px;
	border: 1px solid rgba(111, 196, 255, 0.2);
	background: rgba(6, 21, 34, 0.74);
	text-align: right;
}

.item-shop-balance span,
.item-shop-balance em {
	display: block;
}

.item-shop-balance span {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #8cb7d7;
}

.item-shop-balance strong {
	display: block;
	margin: 8px 0 6px;
	font-size: 28px;
	color: #8ce8ff;
	text-shadow: 0 0 12px rgba(67, 202, 255, 0.34);
}

.item-shop-balance em {
	font-style: normal;
	font-size: 11px;
	line-height: 1.5;
	color: #9cb9ce;
}

.item-shop-section {
	margin-bottom: 24px;
}

.item-shop-section-header {
	margin-bottom: 14px;
}

.item-shop-grid {
	display: grid;
	gap: 12px;
}

.item-shop-grid-packs {
	grid-template-columns: repeat(2, minmax(320px, 1fr));
}

.item-shop-grid-prestige {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.item-shop-grid-gear {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.item-shop-card {
	padding: 18px;
	border-radius: 16px;
	border: 1px solid rgba(87, 174, 234, 0.24);
	background:
		linear-gradient(180deg, rgba(8, 30, 47, 0.92) 0%, rgba(7, 22, 36, 0.96) 100%);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
}

.item-shop-card-topline,
.item-shop-badge {
	display: inline-block;
	padding: 5px 9px;
	border-radius: 999px;
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.item-shop-card-topline {
	margin-bottom: 10px;
	background: rgba(0, 146, 255, 0.14);
	color: #9ae6ff;
	border: 1px solid rgba(78, 196, 255, 0.18);
}

.item-shop-card h4 {
	margin: 0 0 10px;
	font-size: 19px;
	font-weight: normal;
	color: #ffffff;
}

.item-shop-price {
	margin-bottom: 7px;
	font-size: 28px;
	font-weight: bold;
	color: #ffd36e;
	text-shadow: 0 0 12px rgba(255, 188, 59, 0.22);
}

.item-shop-value {
	font-size: 18px;
	font-weight: bold;
	color: #8ee7ff;
}

.item-shop-bonus {
	margin: 6px 0 10px;
	font-size: 12px;
	color: #a7efff;
}

.item-shop-badge {
	margin-top: 12px;
	background: rgba(255, 255, 255, 0.06);
	color: #bfd7ea;
	border: 1px solid rgba(255, 255, 255, 0.08);
}

.item-shop-badge-inline {
	margin-top: 0;
}

.item-shop-hero-badges {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
	flex-wrap: wrap;
}

.pegi-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border-radius: 22px;
	box-shadow: 0 16px 30px rgba(3, 14, 20, 0.28);
}

.pegi-badge-image {
	display: block;
	width: 92px;
	height: 92px;
}

.item-shop-hero-note {
	margin-top: 10px;
	max-width: 720px;
	padding: 10px 12px;
	border-radius: 12px;
	background: rgba(84, 199, 255, 0.08);
	border: 1px solid rgba(84, 199, 255, 0.14);
	color: #d5efff;
	font-size: 12px;
	line-height: 1.55;
}

.gear-card {
	padding: 0;
	overflow: hidden;
}

.gear-card-art {
	position: relative;
	min-height: 340px;
	padding: 18px 18px 14px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	isolation: isolate;
}

.gear-card-art::after {
	content: "";
	position: absolute;
	inset: auto 12px 12px;
	height: 78px;
	border-radius: 18px;
	background: linear-gradient(180deg, rgba(7, 18, 28, 0) 0%, rgba(7, 18, 28, 0.82) 100%);
	z-index: 0;
}

.gear-card-meta {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.gear-card-sigil {
	width: 58px;
	height: 58px;
	border-radius: 14px;
	border: 1px solid rgba(255,255,255,0.24);
	background: rgba(255,255,255,0.08);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	font-weight: bold;
	color: #ffffff;
	text-shadow: 0 0 10px rgba(255,255,255,0.28);
}

.gear-card-label,
.gear-card-tier {
	position: relative;
	z-index: 2;
}

.gear-card-label {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1.4px;
	color: rgba(255,255,255,0.74);
	text-align: right;
	flex: 1;
}

.gear-card-image {
	position: absolute;
	left: 50%;
	top: 58%;
	transform: translate(-50%, -50%);
	width: auto;
	height: 248px;
	max-width: 88%;
	object-fit: contain;
	filter: drop-shadow(0 18px 22px rgba(0, 0, 0, 0.42));
	z-index: 1;
	pointer-events: none;
}

.gear-card-tier {
	font-size: 28px;
	font-weight: bold;
	color: #ffffff;
	text-shadow: 0 0 12px rgba(0,0,0,0.38);
	text-align: center;
}

.gear-bgear {
	background: radial-gradient(circle at top left, rgba(100, 208, 255, 0.46), transparent 40%), linear-gradient(135deg, #0e3b57 0%, #0b6785 52%, #041a26 100%);
}

.gear-agear {
	background: radial-gradient(circle at top right, rgba(255, 166, 68, 0.42), transparent 42%), linear-gradient(135deg, #4d1f08 0%, #9d4a15 48%, #1e0d05 100%);
}

.gear-mgear {
	background: radial-gradient(circle at top left, rgba(87, 255, 188, 0.36), transparent 42%), linear-gradient(135deg, #07362a 0%, #0d7054 50%, #041711 100%);
}

.gear-igear {
	background: radial-gradient(circle at top right, rgba(178, 140, 255, 0.36), transparent 42%), linear-gradient(135deg, #261448 0%, #4e3296 54%, #090612 100%);
}

.gear-card-body {
	padding: 16px;
}

.gear-bgear .gear-card-image,
.gear-mgear .gear-card-image {
	height: 236px;
}

.gear-igear .gear-card-image {
	height: 216px;
}

.item-shop-message {
	margin-bottom: 18px;
	padding: 14px 16px;
	border-radius: 12px;
	font-size: 13px;
	line-height: 1.55;
}

.item-shop-order-panel {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 22px;
}

.item-shop-order-card {
	padding: 18px;
	border-radius: 16px;
	border: 1px solid rgba(90, 173, 231, 0.2);
	background:
		radial-gradient(circle at top right, rgba(129, 217, 255, 0.1), transparent 26%),
		linear-gradient(180deg, rgba(8, 29, 45, 0.95) 0%, rgba(6, 20, 31, 0.98) 100%);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.item-shop-order-card summary {
	list-style: none;
	cursor: pointer;
}

.item-shop-order-card summary::-webkit-details-marker {
	display: none;
}

.item-shop-order-topline {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.item-shop-order-card:not([open]) .item-shop-order-topline {
	margin-bottom: 0;
}

.item-shop-order-topline strong,
.item-shop-order-topline span {
	display: block;
}

.item-shop-order-topline strong {
	font-size: 20px;
	color: #ffffff;
}

.item-shop-order-topline span {
	margin-top: 4px;
	font-size: 11px;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	color: #89b8d6;
}

.item-shop-order-status {
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
	white-space: nowrap;
}

.item-shop-order-status-completed {
	background: rgba(88, 219, 138, 0.12);
	border: 1px solid rgba(88, 219, 138, 0.24);
	color: #bdf8d0;
}

.item-shop-order-status-pending {
	background: rgba(255, 208, 97, 0.12);
	border: 1px solid rgba(255, 208, 97, 0.24);
	color: #ffe7a7;
}

.item-shop-order-status-other {
	background: rgba(120, 168, 214, 0.12);
	border: 1px solid rgba(120, 168, 214, 0.24);
	color: #d5ebff;
}

.item-shop-order-meta {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 12px;
}

.nation-snapshot-note {
	margin-top: 10px;
	padding: 10px 12px 0;
	color: #a3d8f3;
	font-size: 11px;
	line-height: 1.45;
	text-align: center;
}

.item-shop-order-meta div {
	padding: 10px;
	border-radius: 10px;
	background: rgba(7, 24, 39, 0.7);
	border: 1px solid rgba(91, 162, 214, 0.12);
}

.item-shop-order-meta span,
.item-shop-order-meta strong {
	display: block;
}

.item-shop-order-meta span {
	margin-bottom: 4px;
	font-size: 10px;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	color: #8db9d6;
}

.item-shop-order-meta strong {
	font-size: 13px;
	font-weight: normal;
	color: #f2fbff;
}

.item-shop-order-lines {
	margin: 0;
	padding: 0;
	list-style: none;
}

.item-shop-order-lines li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 0;
	border-top: 1px solid rgba(96, 171, 220, 0.12);
	font-size: 12px;
	color: #c8e3f1;
}

.item-shop-order-lines li:first-child {
	border-top: 0;
	padding-top: 0;
}

.item-shop-order-lines strong {
	color: #8ee7ff;
	font-weight: bold;
}

.item-shop-message-success {
	border: 1px solid rgba(117, 255, 179, 0.3);
	background: rgba(8, 44, 27, 0.84);
	color: #d8ffe8;
}

.item-shop-message-fail {
	border: 1px solid rgba(255, 120, 120, 0.3);
	background: rgba(53, 14, 18, 0.84);
	color: #ffe0e0;
}

.item-shop-loadout-list {
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.item-shop-loadout-list li {
	margin: 0 0 8px;
	padding-left: 16px;
	position: relative;
	font-size: 12px;
	line-height: 1.55;
	color: #c8e3f1;
}

.item-shop-loadout-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #70dfff;
	box-shadow: 0 0 10px rgba(112, 223, 255, 0.42);
}

.item-shop-grid-combat,
.item-shop-grid-contours {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.item-shop-grid-topups {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.topup-card {
	min-height: 100%;
	background:
		radial-gradient(circle at top right, rgba(255, 218, 113, 0.12), transparent 26%),
		linear-gradient(180deg, rgba(13, 35, 49, 0.96) 0%, rgba(7, 21, 33, 0.99) 100%);
}

.paypal-button-shell {
	margin-top: 14px;
	padding: 12px;
	border-radius: 14px;
	background: linear-gradient(180deg, rgba(245, 249, 253, 0.98) 0%, rgba(232, 241, 249, 0.98) 100%);
	border: 1px solid rgba(59, 103, 140, 0.18);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
	color: #18344a;
}

.paypal-button-shell iframe {
	border-radius: 12px;
}

.paypal-button-shell .paypal-powered-by,
.paypal-button-shell .paypal-button-text,
.paypal-button-shell .paypal-button-tagline,
.paypal-button-shell .paypal-legal-text,
.paypal-button-shell [class*="legal"],
.paypal-button-shell [class*="terms"],
.paypal-button-shell [class*="privacy"] {
	color: #254860 !important;
}

.topup-card {
	display: flex;
	flex-direction: column;
}

.topup-card .paypal-button-shell {
	margin-top: 12px;
}

.item-shop-card-note {
	margin-top: 12px;
	padding: 10px 12px;
	border-radius: 10px;
	background: rgba(7, 24, 39, 0.72);
	border: 1px solid rgba(91, 162, 214, 0.14);
	font-size: 12px;
	line-height: 1.55;
	color: #b4d4e7;
}

.item-shop-buy-form {
	display: grid;
	grid-template-columns: 1fr 1fr auto;
	gap: 10px;
	align-items: end;
	margin-top: 14px;
}

.item-shop-buy-form label {
	display: block;
	font-size: 11px;
	letter-spacing: 0.7px;
	text-transform: uppercase;
	color: #8fbad5;
}

.item-shop-buy-form select {
	width: 100%;
	margin-top: 6px;
	padding: 8px 10px;
	border-radius: 8px;
	border: 1px solid rgba(91, 168, 224, 0.18);
	background: rgba(6, 20, 32, 0.86);
	color: #eaf8ff;
	font-size: 12px;
}

.item-shop-buy-button {
	height: 38px;
	padding: 0 16px;
	border: 1px solid rgba(121, 214, 255, 0.24);
	border-radius: 10px;
	background: linear-gradient(180deg, #1da3e1 0%, #0d6fab 100%);
	color: #ffffff;
	font-weight: bold;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	cursor: pointer;
}

.item-shop-buy-button:hover {
	background: linear-gradient(180deg, #31b3ef 0%, #1180bf 100%);
}

.combat-card,
.contour-card {
	min-height: 100%;
}

.contour-card {
	position: relative;
	overflow: hidden;
}

.contour-card-media {
	display: grid;
	grid-template-columns: 1fr;
	justify-items: center;
	gap: 8px;
	padding: 14px 14px 10px;
	margin-bottom: 8px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(144, 203, 239, 0.14);
}

.contour-card-slot {
	font-size: 11px;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	color: #d9eefb;
}

.contour-card-image {
	display: block;
	width: min(150px, 100%);
	height: 110px;
	object-fit: contain;
	filter: drop-shadow(0 12px 26px rgba(0, 0, 0, 0.28));
}

.contour-card-gear {
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 0.7px;
	text-transform: uppercase;
	color: #9edcff;
}

.contour-card.contour-bgear {
	background:
		radial-gradient(circle at top left, rgba(89, 219, 255, 0.18), transparent 32%),
		linear-gradient(180deg, rgba(7, 33, 52, 0.96) 0%, rgba(5, 20, 33, 0.98) 100%);
}

.contour-card.contour-mgear {
	background:
		radial-gradient(circle at top left, rgba(70, 255, 166, 0.16), transparent 32%),
		linear-gradient(180deg, rgba(8, 33, 29, 0.96) 0%, rgba(5, 20, 17, 0.98) 100%);
}

.contour-card.contour-agear {
	background:
		radial-gradient(circle at top right, rgba(255, 180, 81, 0.16), transparent 32%),
		linear-gradient(180deg, rgba(47, 24, 11, 0.96) 0%, rgba(23, 12, 6, 0.98) 100%);
}

.contour-card.contour-igear {
	background:
		radial-gradient(circle at top right, rgba(170, 126, 255, 0.16), transparent 32%),
		linear-gradient(180deg, rgba(34, 20, 56, 0.96) 0%, rgba(15, 9, 27, 0.98) 100%);
}

.contour-card.contour-neutral {
	background:
		radial-gradient(circle at top center, rgba(255, 213, 129, 0.14), transparent 32%),
		linear-gradient(180deg, rgba(32, 31, 41, 0.96) 0%, rgba(14, 16, 22, 0.98) 100%);
}

.item-shop-note {
	padding: 14px 16px;
	border-radius: 10px;
	border: 1px solid rgba(96, 171, 220, 0.18);
	background: rgba(4, 18, 30, 0.72);
}

.item-shop-lane {
	display: grid;
	grid-template-columns: 1.3fr 0.9fr;
	gap: 18px;
	margin-bottom: 24px;
}

.item-shop-feature,
.item-shop-philosophy {
	padding: 20px;
	border-radius: 16px;
	border: 1px solid rgba(95, 179, 236, 0.24);
	background:
		linear-gradient(180deg, rgba(7, 26, 42, 0.92) 0%, rgba(5, 18, 29, 0.96) 100%);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.item-shop-feature {
	background:
		radial-gradient(circle at top right, rgba(255, 207, 107, 0.16), transparent 26%),
		linear-gradient(180deg, rgba(18, 34, 50, 0.94) 0%, rgba(6, 20, 31, 0.98) 100%);
}

.item-shop-feature-topline {
	display: inline-block;
	margin-bottom: 10px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(255, 211, 110, 0.14);
	border: 1px solid rgba(255, 211, 110, 0.2);
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffe4a2;
}

.item-shop-feature h3,
.item-shop-philosophy h3 {
	margin: 0 0 10px;
	font-size: 24px;
	font-weight: normal;
	color: #ffffff;
}

.item-shop-feature p,
.item-shop-philosophy p {
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.65;
	color: #b1d4e7;
}

.item-shop-feature-bullets,
.item-shop-philosophy-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.item-shop-feature-bullets li,
.item-shop-philosophy-list li {
	margin: 0 0 9px;
	padding-left: 16px;
	position: relative;
	font-size: 13px;
	line-height: 1.55;
	color: #d8f0ff;
}

.item-shop-feature-bullets li::before,
.item-shop-philosophy-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #69d5ff;
	box-shadow: 0 0 10px rgba(105, 213, 255, 0.5);
}

.pack-card-featured {
	position: relative;
	transform: translateY(-6px);
	border-color: rgba(255, 211, 110, 0.34);
	box-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
}

.pack-card-featured::after {
	content: "Best Momentum";
	position: absolute;
	top: 14px;
	right: 14px;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(255, 211, 110, 0.16);
	border: 1px solid rgba(255, 211, 110, 0.24);
	color: #ffe7aa;
	font-size: 10px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.prestige-card {
	min-height: 240px;
}

.prestige-card-featured {
	background:
		radial-gradient(circle at top left, rgba(255, 205, 119, 0.14), transparent 30%),
		linear-gradient(180deg, rgba(18, 31, 46, 0.96) 0%, rgba(9, 18, 29, 0.99) 100%);
	border-color: rgba(255, 213, 129, 0.28);
}

.public-shop-cta {
	padding: 4px 12px 14px;
}

.public-shop-cta .button {
	text-align: center;
}

.shop-home-panel {
	margin-bottom: 18px;
	padding: 20px 22px;
	border-radius: 16px;
	border: 1px solid rgba(96, 182, 242, 0.22);
	background:
		radial-gradient(circle at top right, rgba(117, 213, 255, 0.12), transparent 24%),
		linear-gradient(135deg, rgba(8, 27, 43, 0.95) 0%, rgba(10, 38, 60, 0.9) 58%, rgba(5, 19, 31, 0.98) 100%);
	box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
}

.shop-home-kicker {
	margin-bottom: 8px;
	font-size: 11px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: #8fd9ff;
}

.shop-home-panel h3 {
	margin: 0 0 10px;
	font-size: 28px;
	font-weight: normal;
	color: #ffffff;
}

.shop-home-panel p {
	margin: 0 0 14px;
	font-size: 13px;
	line-height: 1.65;
	color: #bfd9e9;
}

.shop-home-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.shop-home-actions .button {
	display: inline-block;
	min-width: 170px;
	text-align: center;
}

.pilot-summary-grid strong,
.pilot-currency-grid strong,
.pilot-quick-strip strong,
.pilot-last-login strong {
	display: block;
	font-size: 18px;
	font-weight: normal;
	color: #ffffff;
}

.pilot-summary-footer {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid rgba(118, 178, 227, 0.12);
}

.pilot-last-login {
	padding: 8px 10px;
	background: rgba(10, 31, 49, 0.62);
	border: 1px solid rgba(96, 165, 222, 0.12);
	border-radius: 8px;
}

.pilot-last-login strong {
	font-size: 16px;
}

.pilot-summary-actions {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
}

.pilot-mini-button {
	display: block;
	padding: 8px 10px;
	border-radius: 8px;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	color: #dbefff;
	border: 1px solid rgba(96, 165, 222, 0.18);
	background: linear-gradient(180deg, rgba(27, 76, 113, 0.95) 0%, rgba(9, 35, 57, 0.95) 100%);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.pilot-mini-button:hover {
	color: #ffffff;
	background: linear-gradient(180deg, rgba(34, 91, 132, 0.98) 0%, rgba(12, 42, 67, 0.98) 100%);
}

.pilot-mini-danger {
	border-color: rgba(217, 106, 106, 0.24);
	background: linear-gradient(180deg, rgba(112, 33, 33, 0.94) 0%, rgba(60, 17, 17, 0.95) 100%);
}

.pilot-mini-danger:hover {
	background: linear-gradient(180deg, rgba(132, 42, 42, 0.98) 0%, rgba(77, 20, 20, 0.98) 100%);
}

.pilot-summary-home {
	margin: 12px 0 18px;
	padding: 16px 16px 14px;
}


label,  input[type="text"]  {
	display: block;
}

label  {
	font-size: 1.2em;
	line-height: 2;
	text-shadow: 2px -1px 3px #0186f3;
	filter: dropshadow(color=#0186f3,  offx=2,  offy=-1);
}

input[type="text"]  {
	background: url(../images/input-repeater.png) repeat-x left top;
	width: 250px;
	height: 26px;
	border: 1px solid #0471cc;
	border-top: 2px solid #0471cc;
	border-right: 2px solid #0471cc;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	color: #ffffff;
	padding: 0 5px;
}

input[type="password"]  {
	background: url(../images/input-repeater.png) repeat-x left top;
	width: 250px;
	height: 26px;
	border: 1px solid #0471cc;
	border-top: 2px solid #0471cc;
	border-right: 2px solid #0471cc;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	color: #ffffff;
	padding: 0 5px;
}

input[type="submit"]  {
	background: url(../images/button.png) no-repeat left -4px;
	display: block;
	border: none;
	width: 191px;
	height: 64px;
	margin: 9px auto;
	font-family: Tahoma,  sans-serif;
	font-size: 1.8em;
	line-height: 1;
	color: #ffffff;
	cursor: pointer;
	text-transform: uppercase;
}

input[type="submit"]:hover, input[type="submit"]:focus {
	 background-position:left -88px;
	 ;
}


.main-form span  {
	font-size: 1.2em;
	line-height: 1.2;
	display: block;
	text-shadow: 2px -1px 3px #0186f3;
	filter: dropshadow(color=#0186f3,  offx=2,  offy=-1);
	padding:0px 0px 5px 20px;
}

.performance,  .performnace-time  {
	margin-top: 16px;
}

.performance-desc,  .introduction-desc  {
	background: url(../images/performance.png) repeat-x left top;
	text-align: center;
	padding: 19px 16px 7px;
	border: 1px solid #0471cc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
}

.performance span,  .performnace-time span  {
	display: block;
	border: 1px solid #0471cc;
	border-top: 2px solid #0471cc;
	border-right: 2px solid #0471cc;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	text-align: center;
	font-size: 1.2em;
	line-height: 1.4;
	margin-bottom: 17px;
	color: #ffffff;
	background: url(../images/span-back.png) repeat-x left top;
}

.performnace-time span  {
	margin: 10px 0 28px;
}

.performnace-time .span  {
	margin-bottom: 0px;
}

.side-nav li  {
	background: url(../images/link-back.png) repeat-x left top;
	font-size: 2.4em;
	line-height: 1.7;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	 text-shadow: 1px 1px 10px #000000;
filter: dropshadow(color=#000000,  offx=1,  offy=1);

}

.side-nav a  {
	color: #ffffff;
	display: block;
	padding: 13px 21px 13px 16px;
	overflow: hidden;
	text-align: center;
}

.arrow,  .doller,  .home  {
	background-image: url(../images/sprite.png);
	background-repeat: no-repeat;
	float: left;
}

.arrow  {
	display: inline-block;
	width: 52px;
	height: 46px;
	background-position: left -38px;
	vertical-align: middle;
}

.doller  {
	display: inline-block;
	width: 52px;
	height: 46px;
	background-position: -79px -35px;
	vertical-align: middle;
}

.home  {
	display: inline-block;
	width: 52px;
	height: 46px;
	background-position: -178px -38px;
	vertical-align: middle;
}

.online  {
	margin-top: 14px;
}

.onlien  {
	background: url(../images/side-box-repeater.png) repeat-x left top;
	padding: 12px 0;
	text-align: center;
	border: 1px solid #0471cc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
}

.onlien span,  .digit span,  .time li span  {
	font-family: 'ds-digitalitalic';
	font-size: 5em;
	line-height: 0.95;
	color: #ffffff;
	border-radius: 0;
	text-shadow: 2px -1px 3px #0186f3;
}

.number  {
	padding: 0;
	position: relative;
}

.img-desc  {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 2px 0 14px;
}

.img-desc img  {
	flex: 0 0 85px;
	display: block;
}

.digit  {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	height: 74px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.digit span  {
	margin-top: 0;
	display: block;
	width: 100%;
	text-align: center;
}

.back-text,  .number-text  {
	opacity: 0.1;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	/* IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	/* IE 5-7 */
	filter: alpha(opacity=10);
}

.number-text  {
	right: 114px;
}

.img-desc span  {
	background: none;
	border: none;
}

.introduction  {
	margin-top: 0px;
}

.intoduction-title  {
	margin: 0 110px 0 34px;
}

.introduction-desc  {
	background: url(../images/introduction-back.png) repeat-x left top;
	text-align: left;
	font-size: 1.2em;
	line-height: 1.2;
	color: #ffffff;
	padding: 33px 16px 32px;
	text-shadow: 2px -1px 3px #0186f3;
}

.introduction-desc span  {
	display: block;
	float: left;
}

.introduction-desc ul  {
	overflow: hidden;
	font-weight: bold;
}

.introduction-desc .upadate  {
	width: 73px;
	color: #111111;	
}

.introduction-desc .new  {
	width: 216px;
}

.introduction-desc .by  {
	float: right;
	text-align: right;
}

.comment  {
	background: url(../images/second-box-repeater.png) repeat-x left top;
	padding: 5px 16px 41px 5px;
	border: 1px solid #0471cc;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	margin-top: 10px;
	-webkit-box-shadow: 3px 3px 10px 2px #000000;
	box-shadow: 3px 3px 10px 0px #000000;
	font-style: italic;
}

.comment span,  .comment a  {
	display: block;
	float: none;
	color: #ffffff;
}

.comment p  {
	margin-top: 12px;
}

.home-hero-logo {
	display: block;
	width: 440px;
	height: 220px;
	max-width: 100%;
	margin: 0 auto;
	text-align: center;
}

.war-popup-hero-art {
	width: min(980px, calc(100vw - 48px));
	height: min(520px, calc(100vh - 64px));
	max-width: none;
	max-height: none;
	margin: 0 auto;
	text-align: center;
	overflow: hidden;
	display: flex;
	align-items: stretch;
	justify-content: stretch;
}

.home-hero-logo-image,
.war-popup-hero-image {
	display: inline-block;
	border: 0;
}

.home-hero-logo-image {
	width: 440px;
	max-width: 100%;
	height: auto;
	max-height: 220px;
	filter: drop-shadow(0 12px 24px rgba(0, 0, 0, 0.28));
}

.war-popup-hero-image {
	width: 760px;
	max-width: 100%;
	height: auto;
	max-height: 420px;
	margin-top: 18px;
}

.war-popup-hero-video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 12px;
	background: transparent;
}

.war-popup-wrap .fancybox-skin {
	background: rgba(2, 10, 18, 0.88);
	border: 1px solid rgba(70, 170, 255, 0.45);
	border-radius: 12px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
}

.war-popup-wrap .fancybox-inner {
	overflow: hidden !important;
	background: transparent !important;
	width: 100% !important;
	height: 100% !important;
}

.war-popup-wrap .fancybox-outer,
.war-popup-wrap .fancybox-inner > div {
	width: 100% !important;
	height: 100% !important;
}

.war-popup-wrap .fancybox-close {
	top: -14px;
	right: -14px;
	border-radius: 50%;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45);
}

.war-popup-wrap .fancybox-overlay {
	background: rgba(0, 0, 0, 0.78);
}

@media (max-width: 1320px) {
	#content {
		grid-template-columns: 235px minmax(0, 1fr) 235px;
		gap: 14px;
	}

	.item-shop-grid-packs,
	.item-shop-grid-prestige,
	.item-shop-grid-combat,
	.item-shop-grid-contours,
	.item-shop-grid-topups,
	.item-shop-order-panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.item-shop-grid-gear {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 1040px) {
	#content {
		padding-top: 146px;
		min-height: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 16px;
	}

	#content::before {
		top: 132px;
		width: min(760px, 110vw);
		height: min(460px, 62vw);
		opacity: 0.28;
	}

	.side-bar,
	.main-content,
	.side-link {
		float: none;
		width: 100%;
		margin: 0;
	}

	.main-content {
		order: 1;
	}

	.side-bar {
		order: 2;
	}

	.side-link {
		order: 3;
	}

	.intoduction-title {
		margin: 0 auto;
		width: min(345px, calc(100% - 40px)) !important;
	}

	.item-shop-grid-packs,
	.item-shop-grid-prestige,
	.item-shop-grid-gear,
	.item-shop-grid-combat,
	.item-shop-grid-contours,
	.item-shop-grid-topups,
	.item-shop-order-panel,
	.item-shop-lane {
		grid-template-columns: 1fr;
	}

	.item-shop-buy-form {
		grid-template-columns: 1fr;
	}

	.item-shop-order-meta {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 700px) {
	#content::before {
		top: 152px;
		width: 130vw;
		height: 54vw;
		opacity: 0.24;
	}

	.vertical-list {
		width: auto;
	}

	input[type="text"],
	input[type="password"] {
		width: calc(100% - 12px);
		box-sizing: border-box;
	}

	.home-hero-logo {
		height: 180px;
	}

	.home-hero-logo-image {
		max-height: 180px;
	}

	.war-popup-hero-art {
		width: min(100vw - 28px, 980px);
		height: min(62vw, calc(100vh - 88px));
	}

	.war-popup-hero-image {
		max-height: 340px;
	}
}

/*
 2.) Slide-Show
 -----------------------------------------------*/
.slides_container {
	border-radius: 5px;
	-webkit-border-radius: 5px;
}

.pagination  {
	position: absolute;
	right: -17px;
	bottom: 31px;
	background: url(../images/slider-back.png) no-repeat right top;
	width: 100%;
	z-index: 100;
	padding-right: 18px;
}

#slides  {
	position: relative;
}

.pagination li  {
	float: right;
	background: url(../images/li-back.png) repeat-x left center;
	padding: 15px 4px;
}

#slides a  {
	text-indent: -9999px;
	display: block;
}

.pagination li a  {
	background: url(../images/sprite.png) no-repeat -41px top;
	width: 20px;
	height: 18px;
	margin-top: 1px;
}

.pagination li.current a,  .pagination li a:hover  {
	background: url(../images/sprite.png) no-repeat left top;
}

#slides .prev,  #slides .next  {
	display: none;
}

/*
 3.) Server-Time page Content
 -----------------------------------------------*/
.server-time  {
	width: 519px;
	margin: 100px auto;
	border: 1px solid #02759c;
	background: url(../images/server-time-back.png) no-repeat left top;
	position: relative;
	padding-bottom: 19px;
}

.wrapper-back  {
	background: none !important;
}

.dang  {
	background: url(../images/server-time.png) no-repeat left top;
	width: 100%;
	height: 26px;
}

.dang a  {
	font-size: 1.4em;
	line-height: 1.2;
	color: #ffffff;
	font-weight: bold;
	float: right;
	margin: 6px 12px 0 0;
	padding: 0 33px;
	text-shadow: 2px -1px 3px #0186f3;
	filter: dropshadow(color=#0186f3,  offx=2,  offy=-1);
}

.time  {
	text-align: center;
	color: #ffffff;
	text-shadow: 2px -1px 3px #0186f3;
	filter: dropshadow(color=#0186f3,  offx=2,  offy=-1);
	margin-top: 19px;
}

.time li  {
	font-size: 1.4em;
	line-height: 1;
	font-weight: bold;
	position: relative;
}

.time li span  {
	font-size: 3.5em;
	font-weight: normal;
}

.time-text  {
	opacity: 0.1;
	position: absolute;
	right: 205px;
	top: 0;
	/* IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	/* IE 5-7 */
	filter: alpha(opacity=10);
}

.server-content  {
	width: 425px;
	padding: 73px 37px;
	margin: 0 10px;
}

.server-content li  {
	font-size: 1.3em;
	line-height: 1;
	color: #ffffff;
	font-weight: bold;
}

.server-content .li-content  {
	font-size: 0.71em;
	font-style: italic;
	font-weight: normal;
	line-height: 1.3;
	display: block;
}

.dang-form  {
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 5;
	margin: 1px;
	width: 100%;
}

.request-form  {
	width: 476px;
	background: url(../images/drop-down.png) repeat-x left top;
	padding: 9px 18px 5px 23px;
	overflow: hidden;
	display: none;
}

.dang-form label  {
	color: #ffffff;
	margin-left: 2px;
	line-height: 1.3;
}

.dang-form input[type="text"]  {
	width: 163px;
	height: 22px;
	border-radius: 4px;
}

.dang-form .text  {
	width: 76px !important ;
}

.dang-form input[type="submit"]  {
	background: url(../images/button-2.png) no-repeat left top;
	width: 122px;
	height: 39px;
	font-size: 1.4em;
	line-height: 1;
	font-weight: bold;
}

.form-one  {
	float: left;
	margin-top: 11px;
	width: 179px;
}

.form-one label {
line-height: 1.8;
}

	
.form-two  {
	float: right;
	width: 179px;
}

.form-two input[type="text"],  .form-one .input  {
	background: url(../images/form-text.png) repeat-x left top;
}

.form-two input[type="submit"]  {
	margin: 9px 0 3px;
}