/*.coin-loader {
	display: inline-block;
	transform: translateZ(1px);
}
.coin-loader > div {
	display: inline-block;
	width: 51px;
	height: 51px;
	margin: 6px;
	border-radius: 50%;
	background: #fff;
	animation: coin-loader 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

@keyframes coin-loader {
	0%, 100% {
		animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
	}
	0% {
		transform: rotateY(0deg);
	}
	50% {
		transform: rotateY(1800deg);
		animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
	}
	100% {
		transform: rotateY(3600deg);
	}
}
*/

@font-face {
	font-family: 'GoogleSans';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local('GoogleSans-Regular'), local('GoogleSans-Regular'), url(../site-fonts/GoogleSans-Regular.woff2) format('woff2');
}
@font-face {
	font-family: 'GoogleSans';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: local('GoogleSans-Medium'), local('GoogleSans-Medium'), url(../site-fonts/GoogleSans-Medium.woff2) format('woff2');
}
@font-face {
	font-family: 'GoogleSans';
	font-style: italic;
	font-weight: 600;
	font-display: swap;
	src: local('GoogleSans-MediumItalic'), local('GoogleSans-MediumItalic'), url(../site-fonts/GoogleSans-MediumItalic.woff2) format('woff2');
}
@font-face {
	font-family: 'GoogleSans';
	font-style: italic;
	font-weight: normal;
	font-display: swap;
	src: local('GoogleSans-Italic'), local('GoogleSans-Italic'), url(../site-fonts/GoogleSans-Italic.woff2) format('woff2');
}
@font-face {
	font-family: 'GoogleSans';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: local('GoogleSans-Bold'), local('GoogleSans-Bold'), url(../site-fonts/GoogleSans-Bold.woff2) format('woff2');
}

@font-face {
	font-family: 'GoogleSans';
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: local('GoogleSans-BoldItalic'), local('GoogleSans-BoldItalic'), url(../site-fonts/GoogleSans-BoldItalic.woff2) format('woff2');
}

.tabs-menu-wrapper-default-top,
.base-size {
	box-sizing: border-box;
	max-width: 1200px;
}

.base-size {
	display: flex;
	width: 100%;
	flex-direction: column;
	margin: auto;
	margin-top: 0px;
}

#site-header {
	position: fixed;
	display: flex;
	z-index: 5;
	width: 100%;
	top: 0px;
}
	#site-search {
		display: flex;
		flex: 1;
		position: relative;
		margin-left: 15px;
		margin-right: 10px;
	}
		#site_search_input {
			flex: 1;
			outline: none;
			background-color: #ffffff;
			color: #2e3f57;
			border: 0px;
			padding: 11px 30px 11px 12px;
			border-radius: 20px;
			font-size: 14px;
			font-weight: 400;
			/*caret-color: #425ce4;*/
			border: 1px solid rgb(177, 189, 201);

			box-sizing: border-box;
		}
			#site_search_input:focus,
			.btn-header-search:focus {
				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			}
			#site_search_input:focus {
				background-color: #F2F5FC;
				border-color: rgba(49, 70, 225, 1);
			}
			#site_search_input::placeholder {
				color: #ACB8C4;
			}
		.form-header-search {
			display: flex;
			flex: 1;
		}
			.form-header-search .autocomplete-holder-items {
				display: flex;
				flex: 1;
			}
			.form-header-search .section-submit {
				position: absolute;
				display: flex;
				top: 0px;
				right: 0px;
				flex: none;
				width: auto;
			}
				#submit-header-search {
					display: flex;
					padding: 12px 12px;
					text-indent: -99999px;
					background-color: transparent;
					border: 0px;
				}
					#submit-header-search > .text {
						cursor: pointer;
						background-color: transparent;
						border: 0px;
						width: 16px;
						height: 16px;
						
						background-image: url(up-sprite.svg);
						background-position: 0px -130px;
					}
				#submit-header-search .loading {
					display: none;
				}
	#header {
		font-family: 'GoogleSans', sans-serif;
		position: relative;
		z-index: 2;
		flex-direction: row;
		background-color: #ffffff;
		box-sizing: border-box;
		padding: 14px 0px 14px 25px;
		margin: auto;
		align-self: center;
		border-bottom: 2px solid #f1f4fb;
	}
		#header > .shadow {
			position: absolute;
			left: 0px;
			bottom: 0px;
			/*#f1f4fb*/
		}
		#header-actions {
			display: flex;
			flex: 1;
			justify-content: flex-end;
			align-self: center;
		}
			#header-actions,
			#menu-dispay {
				
			}
		#header > .logo {
			flex: none;
			display: flex;
			position: relative;
			background-image: url(up-sprite.svg);
			width: 69px;
			height: 40px;
			background-position: 0px -1px;
		}
			#header > .logo > .site {
				flex: 1;
				height: 100%;
			}
			/* SAMP Specific CSS */
			#authorized-ip {
				background-color: #000000;
				position: absolute;
				display: inline-block;
				font-size: 12px;
				font-weight: bold;
				height: 17px;
				line-height: 18px;
				text-align: center;
				border-radius: 8px;
				color: #FFFFFF;
				padding: 0px 5px;
				left: 30px;
				top: 32px;
				text-transform: uppercase;
			}
				#authorized-ip:hover {
					text-decoration: none;
					background-color: #696969;
				}
			#warning-sign {
				background-color: #ff617b;
				position: absolute;
				display: inline-block;
				font-size: 17px;
				font-weight: bold;
				width: 20px;
				height: 20px;
				line-height: 20px;
				text-align: center;
				border-radius: 20px;
				color: #FFFFFF;
				left: 56px;
				top: 27px;
			}
				#warning-sign:hover {
					text-decoration: none;
					background-color: #FB8A9D;
				}
				.warning-cool {
					background-color: #000000 !important;
				}

		#header-actions > .name {
			font-size: 15px;
			color: #9ca2b3;
			margin-left: 10px;
			align-items: center;
			display: inline-block;
			margin-top: auto;
			max-width: 120px;
			width: 100%;
			margin-bottom: auto;
			justify-content: flex-end;
			text-overflow: ellipsis;
			white-space: nowrap;
			text-align: right;
			overflow: hidden;
		}
			#header-actions > .btn-header:first-child {
				margin-left: 0px;
			}
			.btn-header {
				white-space: nowrap;
				text-decoration: none;
				display: flex;
				align-items: center;
				justify-content: center;
				box-sizing: border-box;
				line-height: normal;
				height: 100%;
				min-width: 120px;
				border-radius: 4px;
				margin: 0px 0px 0px 15px;
				font-size: 14px;
			}
				.btn-header:hover,
				.btn-header:active {
					text-decoration: none;
					cursor: pointer;
				}
				.btn-header > .icon {
					flex: none;
					width: 19px;
					height: 24px;
					background-image: url(up-sprite.svg);
				}
				.btn-header-solid {
					font-weight: 600;
					padding: 11px 10px;
					color: #2e3f57;
				}
					.btn-header-solid:hover,
					.btn-header-solid:active {
						color: #FFFFFF;
						background-color: #425ce4;
					}
					.btn-header-solid.active {
						color: #FFFFFF;
						background-color: #425ce4;
					}
					.btn-header-solid.active:hover {
						background-color: #4242E4;
					}
				.btn-header-green {
					font-weight: 600;
					padding: 11px 10px;
					color: #2e3f57;
				}
				.btn-header.register {
					margin-right: 30px;
				}
					.btn-header-green:hover,
					.btn-header-green:active {
						color: #FFFFFF;
						background-color: #0ECD75;
					}
					.btn-header-green.active {
						color: #FFFFFF;
						background-color: #0ECD75;
					}
					.btn-header-green.active:hover {
						background-color: #0ABB69;
					}
				.btn-header.btn-notifications {
					align-self: center;
					min-width: auto;
					margin-right: 5px;
					padding: 6px 5px;
				}
					.btn-header.btn-notifications > .icon {
						width: 24px;
						height: 26px;
						background-position: 0px -84px;
						opacity: 0.7;
					}
					.btn-header.btn-notifications.active > .icon {
						opacity: 0.85;
					}
					.btn-header.btn-notifications:hover > .icon {
						opacity: 1.0;
					}
					.btn-header.btn-notifications.active > .icon {
						background-position: -24px -84px;
					}
				.btn-header-light {
					padding: 7px 10px;
					color: #2e3f57;
				}
					.btn-header-light:hover,
					.btn-header-light:active {
						background-color: #f7f9fd;
					}
				.btn-header-light.transactions > .icon {
					background-position: -69px -85px;
				}
					.btn-header-light.in-progress.transactions > .icon {
						background-position: -89px -85px;
					}
				.btn-header-light.wallet {
					min-width: auto;
				}
				.btn-header-light.wallet > .icon {
					background-position: -49px -85px;
				}
				.btn-header-light > .info {
					display: flex;
					flex-wrap: wrap;
					margin-left: 10px;
				}
					.btn-header-light > .info {
					}
						.btn-header-light > .info > .name {
							white-space: nowrap;
							width: 100%;
							color: #9ba2b3;
							text-transform: uppercase;
							font-size: 9px;
							font-weight: 500;
							line-height: 10px;
						}
						.btn-header-light > .info > .amount {
							width: 100%;
							color: #2e3f57;
							font-weight: 700;
							font-size: 14px;
							line-height: 10px;
							margin-top: 3px;
						}
						.btn-header-light.in-progress > .info > .amount,
						.btn-header-light.in-progress > .info > .name {
							color: #425ce3;
						}
	#menu-display {
		display: flex;
	}
		#menu-display > a {
			cursor: pointer;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			padding-left: 20px;
			padding-right: 25px;
		}
			#menu-display > a > .icon {
				background-image: url(up-sprite.svg);
				width: 20px;
				height: 20px;
				background-position: 0px -110px;
			}
				#menu-display:hover > a > .icon,
				#menu-display.active > a > .icon {
					background-position: -20px -110px;
				}
	#sub-menu {
		z-index: 2;
		display: none;
		position: absolute;
		top: 54px;
		left: 0px;
		right: 0px;
		width: 100%;
		width: auto;
		align-items: flex-end;
	}
		#sub-menu.base-size {
			background-color: transparent;
		}
		#sub-menu.active {
			display: flex;
		}
			#sub-menu > .menu-container {
				position: relative;
				width: auto;
				display: flex;
				flex-wrap: wrap;
				justify-content: flex-end;
				background-color: #FFFFFF;
				padding: 15px;
				box-shadow: 0 10px 10px 0px rgba(26, 37, 70, 0.10);
				background-color: #FFFFFF;
			}
			#sub-menu > .menu-container > .menu {
				display: flex;
				flex-direction: column;
				margin-right: 15px;
				border-right: 2px solid #f4f6fd;
				box-sizing: border-box;
			}
				#sub-menu > .menu-container > .menu:last-child {
					margin-right: 0px;
					border-right: 0px;
				}
				#sub-menu > .menu-container > .menu > h4 {
					color: #223257;
					text-transform: uppercase;
					font-size: 11px;
					margin: 0px;
					padding: 0px;
					margin-bottom: 20px;
					font-weight: 700;
					line-height: normal;
				}
				#sub-menu > .menu-container > .menu > div {
					display: flex;
					flex-direction: column;
					min-width: 180px;
				}
					#sub-menu > .menu-container > .menu > div > a {
						font-size: 15px;
						color: #949bad;
						line-height: normal;
						padding: 10px 0px;
					}
						#sub-menu > .menu-container > .menu > div > a:first-child {
							padding-top: 0px;
						}
						#sub-menu > .menu-container > .menu > div > a:last-child {
							padding-bottom: 0px;
						}
						#sub-menu > .menu-container > .menu > div > a:hover,
						#sub-menu > .menu-container > .menu > div > a:active {
							text-decoration: none;
							color: #425ce4;
						}
	#site-header > #loading-bar {
		height: 2px;
		display: inline-block;
		position: absolute;
		width: 100%;
		left: 0;
		top: 0;
		background-color: transparent;
		z-index: 99;
	}
		#site-header > #loading-bar > span {
			position: absolute;
			left: 0;
			top:  0;
			height: 4px;
			display: inline-block;
			background-color: #425ce4;
		}

#header-top-notifications {
	display: flex;
	position: relative;
	margin-right: 10px;
	cursor: pointer;
	user-select: none;
	align-items: center;
	margin-left: 10px;
}
	#header-top-notifications-button {
		height: 24px;
		min-width: 14px;
		background-color: #ff617b;
		border-radius: 4px;
		color: #FFF;
		text-align: center;
		line-height: 24px;
		font-size: 14px;
		padding: 0px 5px;
		font-weight: normal;
	}
		#header-top-notifications .menu-holder {
			position: absolute;
			width: 160px;
			text-align: left;
			z-index: 998;
			top: 40px;
			right: -5px;
			padding-top: 2px;
			visibility: hidden;
			display: inline-block;
		}
			#header-top-notifications.dynamic-focus .menu-holder {
				visibility: visible;
				top: 47px;
				right: 1px;
				transition: top 0.2s;
			}
			#header-top-notifications .menu {
				margin: 0;
				padding: 10px 0px;
				border-radius: 4px;
				background-color: #FFF;
				border: 1px solid #EBEBEB;
				box-shadow: #E4E4E4 0px 2px 0px 0px;
				width: 100%;
				display: inline-block;
				padding: 5px 0px;
			}
			#header-top-notifications .menu-holder > span.arrow {
				top: -4px;
				right: 3%;
				width: 10px;
				height: 10px;
				display: inline-block;
				position: absolute;
				z-index: 999;
				background-color: #FFF;
				border-top: 1px solid #EBEBEB;
				border-right: 1px solid #EBEBEB;
				-webkit-transform: rotate(-45deg);
				-moz-transform: rotate(-45deg);
				-ms-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}
				#header-top-notifications .menu > li {
					float: left;
					position: relative;
					display: inline-block;
					left: 0;
					width: 100%;
					line-height: 32px;
					padding-left: 20px;
					box-sizing: border-box;
				}
					#header-top-notifications .menu > li:hover,
					#header-top-notifications .menu > li.active {
						background-color: #FBFBFB;
						box-shadow: none ;
					}

					#header-top-notifications .menu > li > a {
						text-decoration: none;
						display: inline-block;
						width: 100%;
						color: #B4B4B4;
						font-size: 14px;
						line-height: 16px;
						padding-top: 8px;
						padding-bottom: 8px;
					}
						#header-top-notifications .menu > li:hover > a,
						#header-top-notifications .menu > li.active > a {
							color: #3495DF;
						}

						#header-top-notifications .menu > li > a > i {
							left: 10px;
							top: 8px;
							position: absolute;
							display: inline-block;
							background-image: url(<?php echo image( '1.1/sprite.svg' ); ?>);
							width: 14px;
							height: 15px;
						}

body.user-admin #site-footer {
	margin-bottom: 24px;
}

body {
	background-color: #171D28;
	background-image: url(../../images/bg-repeat.png);
	background-size: contain;
	background-repeat: repeat;
}

.page {
	flex: 1;
	border-top: 11px solid #f5f7fc;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	background-color: #FFFFFF;
	margin-bottom: 20px;
}
.header-games {
	display: flex;
}
.header-avatar-a {
	margin-left: 10px;
	display: flex;
	justify-content: center;
	align-self: center;
}
	.header-avatar-a:hover .header-avatar {
		border: 2px solid #223D51;
	}
	.header-avatar {
		vertical-align: top;
		height: 32px;
		width: 32px;
		border-radius: 100%;
		border: 2px solid #F1F1F1;
		box-sizing: border-box;
	}

#site-footer {
	align-self: flex-end;
	display: flex;
	width: 100%;
}
	#footer {
		font-family: 'GoogleSans', sans-serif;
		display: flex;
		flex-wrap: wrap;
		background-color: #292b3c;
		box-sizing: border-box;
		padding: 15px 25px;
		color: #FFFFFF;
	}
		#footer > div {
			width: 100%;
		}
		#footer > .footer-samp {
			padding-top: 10px;
			padding-bottom: 30px;
			display: flex;
			font-size: 20px;
			flex-direction: column;
		}
			#footer > .footer-samp > .server {
				width: 100%;
			}
				#footer > .footer-samp > .server > .status {
					text-align: center;
					width: 100%;
					margin-bottom: 20px;
					font-size: 20px;
					line-height: 22px;
				}
				#footer > .footer-samp > .server > .offline {
					width: 100%;
					text-align: center;
					color: #ff617b;
				}
			#footer > .footer-samp > .players {
				background-color: #242635;
				max-height: 200px;
				overflow: hidden;
				overflow-y: scroll;
				-webkit-overflow-scrolling: touch;
				box-sizing: border-box;
				padding: 10px;
			}
					#footer > .footer-samp > .players::-webkit-scrollbar {
						width: 10px;
					}

					#footer > .footer-samp > .players::-webkit-scrollbar-track {
						box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
					}

					#footer > .footer-samp > .players::-webkit-scrollbar-thumb {
						background-color: #83A2C1;
						outline: 1px solid slategrey;
						border-radius: 4px;
					}
				#footer > .footer-samp > .players > ul {
					display: flex;
					flex-wrap: wrap;
				}
					#footer > .footer-samp > .players > ul > li {
						display: flex;
						width: 25%;
						line-height: normal;
					}
						#footer > .footer-samp > .players > ul > li > .player {
							display: flex;
							margin-bottom: 5px;
						}
							#footer > .footer-samp > .players > ul > li > .player > img {
								flex: none;
								margin: auto;
								margin-right: 5px;
								width: 16px;
								height: 11px;
								overflow: hidden;
							}
							#footer > .footer-samp > .players > ul > li > .player > .name {
								flex: 1;
								font-size: 14px;
							}
							#footer > .footer-samp > .players > ul > li > .player > .level {
								font-size: 14px;
								margin-left: 5px;
							}
		#footer > .footer-content {
			display: flex;
			line-height: normal;
		}			
			#footer > .footer-content > div {
				flex: 1;
			}
				#footer > .footer-content > .copyright {
					font-size: 14px;
				}
				#footer > .footer-content > .legal {
					display: flex;
					justify-content: flex-end;
				}
					#footer > .footer-content > .legal > a {
						font-size: 14px;
						margin-left: 40px;
						color: #FFFFFF;
					}
						#footer > .footer-content > .legal > a:hover,
						#footer > .footer-content > .legal > a:active {
							text-decoration: underline;
							color: #FFFFFF;
						}
.autocomplete-default .autocomplete-list.market-list {
	display: flex;
	float: none;
	box-shadow: 0 0 18px rgba(66, 92, 227, 0.15);
	bottom: auto;
	top: 32px !important;
}
	.autocomplete-default .autocomplete-list.market-list.market-list-search {
		top: 56px !important;
	}
	.autocomplete-default .autocomplete-list.market-list .autocomplete-items {
		display: flex;
		flex-direction: column;
		border: 1px solid transparent;
		border-top: 0px;
		background-color: #FFFFFF;
	}
	.autocomplete-default .autocomplete-list.market-list .autocomplete-items > .autocomplete-item {
		display: flex;
		float: none;
		color: #223257;
	}
		.autocomplete-default .autocomplete-list.market-list .autocomplete-items > .autocomplete-item > .text {
			padding: 10px 10px;
			box-sizing: border-box;
			line-height: normal;
			display: inline-block;
			font-size: 15px;
			max-width: 100%;
			width: 100%;
			text-overflow: ellipsis;
			overflow: hidden;
			white-space: nowrap;
		}
		.autocomplete-default .autocomplete-list.market-list .autocomplete-items > .autocomplete-item:hover,
		.autocomplete-default .autocomplete-list.market-list .autocomplete-items > .autocomplete-item.active {
			color: #425ce4;
			background-color: transparent;
		}
#social-footer {
	display: flex;
	margin-bottom: 10px;
	justify-content: center;
}
	#social-footer > .icons {
		display: flex;
	}
		#social-footer > .icons > a {
			display: flex;
			margin: 10px 10px;
		}
			#social-footer > .icons > a > span {
				text-indent: -9999px;
			}
			#social-footer > .icons > a::after {
				content: '';
				height: 32px;
				width: 32px;
				background-image: url(social-f.svg);
			}
			#social-footer > .icons > a.youtube::after {
				background-position: 0px -32px;
			}
				#social-footer > .icons > a.youtube:hover::after {
					background-position: 0px 0px;
				}
			#social-footer > .icons > a.facebook::after {
				background-position: -64px -32px;
			}
				#social-footer > .icons > a.facebook:hover::after {
					background-position: -64px 0px;
				}
			#social-footer > .icons > a.twitter::after {
				background-position: -160px -32px;
			}
				#social-footer > .icons > a.twitter:hover::after {
					background-position: -160px 0px;
				}
			#social-footer > .icons > a.instagram::after {
				background-position: -128px -32px;
			}
				#social-footer > .icons > a.instagram:hover::after {
					background-position: -128px 0px;
				}
			#social-footer > .icons > a.discord::after {
				background-position: -32px -32px;
			}
				#social-footer > .icons > a.discord:hover::after {
					background-position: -32px 0px;
				}
			#social-footer > .icons > a.teamspeak::after {
				background-position: -96px -32px;
			}
				#social-footer > .icons > a.teamspeak:hover::after {
					background-position: -96px 0px;
				}
			#social-footer > .icons > a.twitch::after {
				background-position: -192px -32px;
			}
				#social-footer > .icons > a.twitch:hover::after {
					background-position: -192px 0px;
				}
@media screen and (max-width: 1024px) {
	body.device-desktop .btn-header {
		min-width: auto;
	}
}