html, body {
	height: 100%; 
	scrollbar-color: #2d2d2d #151515 !important;
}
body * { scrollbar-color: auto; }

body {
	height: 100%;
	min-width: 1024px;
	margin: 0;
	padding: 0;
	color: #d2d2d2;
	font-size: 12px;
	font-family: 'Arial', 'Helvetica', sans-serif;
	text-rendering: optimizeLegibility;
	background: #000 url('../images/bg_main_new.jpg') no-repeat 50% 0;
}

a img { border: 0; }
a:focus, a:active { outline: 0; }

/*
 * anchor styles
 * form styles
 * button styles
 * select, input, etc.
 * */

/* Main wrapper styles
----------*/
#main-wrapper {
	min-height: 100%;
	margin-bottom: -221px;
}

/* Main header styles
----------*/
#main-header-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	min-width: 1024px;
	z-index: 1000;
}
#main-header {
	background-color: #112037;
	border-bottom: 1px solid #4d5870;
}
#main-header-content {
	position: relative;
	width: 1024px;
	height: 48px;
	margin: 0 auto;
}

/* Media query overrides to disable fixed header when browser window
 * is too narrow. */
@media all and (max-width: 1024px) {
	#main-header-wrapper {
		position: absolute;
		top: 0;
		left: 0;
	}
}

/* Main logo styles. */
#main-header .main-logo {
	position: absolute;
	top: 10px;
	left: 10px;
	display: block;
	width: 30px;
	height: 48px;
	padding: 0;
	text-indent: -9999px;
	overflow: hidden;
	background: url('../images/logo.png') no-repeat 0 0;
}

/* Main menu styles
----------*/
#main-menu {
	position: absolute;
	top: 0;
	left: 44px;
}
#main-menu > ul {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
	background: rgba(200,200,200,0.4);
}
#main-menu > ul li.menu-item {
	float: left;
	position: relative;
	margin: 0;
	margin-right: 5px;
    z-index: 50;
}
#main-menu > ul li.menu-item:hover {
	background-color: #111922;
}
#main-menu > ul li.menu-item > a {
	color: #D5D5D5;
	padding: 14px 7px;
	line-height: 48px;
	font-size: 17px;
	font-family: 'Arial', 'Helvetica', sans-serif;
	font-weight: bold;
	text-decoration: none;
}

/* Submenu styles. */
#main-menu .sub-menu,
#main-user-menu .user-menu .sub-menu {
	position: absolute;
	top: 48px;
	left: -8px;
	display: none;
	width: 150px;
	margin: 0;
	padding: 10px 0;
	list-style: none;
	/*overflow: hidden;*/
	background-color: #111922;
	-moz-box-shadow: 3px 4px 4px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 3px 4px 4px rgba(0, 0, 0, 0.5);
	box-shadow: 3px 4px 4px rgba(0, 0, 0, 0.5);
}
#main-menu > ul li.menu-item:hover > .sub-menu,
#main-user-menu .user-menu:hover > .sub-menu {
	display: block;
}
#main-menu .sub-menu .sub-menu-item,
#main-user-menu .user-menu .sub-menu-item {
	display: block;
	font-size: 10pt;
}
#main-menu .sub-menu .sub-menu-item:hover,
#main-user-menu .user-menu .sub-menu-item:hover {
	background: #282f37;
}
#main-menu .sub-menu .sub-menu-item > a,
#main-user-menu .user-menu .sub-menu-item > a {
	display: block;
	padding: 5px 12px;
	color: #B5B5B5;
	font-weight: normal;
	text-decoration: none;
}
#main-menu .sub-menu .sub-menu-item.sub-menu-heading {
	text-align: center;
    font-size: 13px;
    font-weight: bold;
    color: #EAEAEA;
    font-style: italic;
    margin: 2px 0 -5px 0;
}

#main-menu .sub-menu .sub-menu-item.sub-menu-heading:hover {
	background-color: #111922;
}

#main-menu .sub-menu .sub-menu-item.sub-menu-heading > a {
	color: #D4D3DE;
}

/* Nested menu styles. */
#main-menu .sub-menu-item.has-sub-menu {
	position: relative;
}
#main-menu .sub-menu-item.has-sub-menu > a {
	background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 79%,rgba(0, 0, 0, 0.33) 100%); /* FF3.6+ */
	background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 79%,rgba(0, 0, 0, 0.33) 100%); /* Chrome10+,Safari5.1+ */
	background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 79%,rgba(0, 0, 0, 0.33) 100%); /* IE10+ */
	background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 79%,rgba(0, 0, 0, 0.33) 100%); /* W3C */
}
#main-menu .sub-menu-item.has-sub-menu > a:after {
	content: "\276f";
    display: inline-block;
    float: right;
    margin: -1px -5px;
    color: rgba(255, 255, 255, 0.25);
}

#main-menu .sub-menu-item.new > a{
	color: #C14646;
}
#main-menu .sub-menu-item.highlight > a{
	color: #80A942;
}
#main-menu .sub-menu-item > a span{
	color: #FFA500;
}

#main-menu .sub-menu-item.has-sub-menu .sub-menu {
	display: none;
	top: -10px;
	left: 150px;
	box-shadow: -2px 4px 4px rgba(0, 0, 0, 0.5);
}
#main-menu .sub-menu-item.has-sub-menu:hover .sub-menu {
	display: block;
}

/* Main user menu styles
----------*/
#main-user-menu {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
}
#main-user-menu > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#main-user-menu > ul > li {
	float: left;
	position: relative;
	height: 48px;
	margin-right: 5px;
	line-height: 48px;
	font-size: 10pt;
}
#main-user-menu > ul li.menu-item:hover {
	background-color: #111922;
}
#main-user-menu > ul > li > a {
	color: #D5D5D5;
	text-decoration: none;
}

#main-user-menu .menu-item {
	margin-right: 10px;
	padding: 0 10px;
}
#main-user-menu .menu-item.icon {
	padding: 0;
}
#main-user-menu .menu-item.icon > a {
	display: inline-block;
    width: 48px;
    height: 48px;
    text-indent: -9999px;
    vertical-align: middle;
	background: url('../images/icons/header_icons.png') no-repeat;
}

#main-user-menu .mail-inbox {
	margin-right: 10px;
}
#main-user-menu .icon.mail-inbox > a { background-position: 0 0; }
#main-user-menu .icon.log-attack > a { background-position: 0 -96px; }
#main-user-menu .icon.log-raid > a { background-position: 0 -144px; }
#main-user-menu .icon.log-notif > a { background-position: 0 -48px; }
#main-user-menu .icon.new > a { background-position-x: -48px; }
#main-user-menu .icon.new > span { display: block; }
#main-user-menu .icon:hover > a {
	opacity: 0.65;
	background-position-x: -48px;
}
#main-user-menu .icon > span {
	width: 14px;
	height: 14px;
	background-color: #B50404;
	display: none;
	position: absolute;
	top: 2px;
	right: 2px;
	border-radius: 100%;
	padding: 2px;
	text-align: center;
	font-size: 10px;
	vertical-align: middle;
	color: #CECECE;
	box-shadow: -1px 1px 3px rgba(0, 0, 0, 0.51);
	z-index: 20;
	line-height: 14px;
	font-weight: bold;
}

#main-user-menu .icon.new.joined > a {
	background-position: 0 -192px;
}
#main-user-menu .icon.new.joined.unjoined > a {
	background-position: -48px -192px;
}












/* Drop-down tooltip style for notification icons
----------*/
#main-user-menu .menu-item.icon:hover .dropdown.enabled {
	display: block;
}
#main-user-menu .menu-item.icon .dropdown {
	display: none;
    background-color: rgba(0, 0, 0, 0.9);
    width: 188px;
    position: absolute;
    top: 50px;
    left: -70px;
    z-index: 120;
    border: 1px solid #2D2D2D;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.49);
    cursor: initial;
	line-height: normal;
	padding: 10px;
	box-sizing: border-box;
}
#main-user-menu .menu-item.icon .dropdown:before,
#main-user-menu .menu-item.icon .dropdown:after {
	content: '\A';
	border-style: solid;
	border-width: 10px;
	border-color: transparent transparent #2D2D2D transparent;
	position: absolute;
	left: calc(50% - 10px);
	top: -20px;
	pointer-events: none;
}
#main-user-menu .menu-item.icon .dropdown:after {
	border-color: transparent transparent rgba(0, 0, 0, 0.9) transparent;
	top: -19px;
}
/*#main-user-menu .menu-item.icon .dropdown ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#main-user-menu .menu-item.icon .dropdown ul li {
	line-height: 20px;
	padding: 5px;
	border-bottom: 1px solid #2D2D2D;
}
#main-user-menu .menu-item.icon .dropdown ul::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
#main-user-menu .menu-item.icon .dropdown ul::-webkit-scrollbar-track {
	background: #1F1F1F;
}
#main-user-menu .menu-item.icon .dropdown ul::-webkit-scrollbar-thumb {
	background: #444444;
}*/







#main-user-menu .mobile-menu-btn {
	display: none;
}
#main-mobile-menu {
	display: none;
}







/* User drop-down menu styles. */
#main-user-menu .user-menu {
	float: right;
	list-style: none;
	margin: 0;
	padding: 0 10px;
}
#main-user-menu .user-menu > a {}
#main-user-menu .user-menu > a:after {
	content: '\25BC';
}
#main-user-menu .user-menu > a > img {
	vertical-align: middle;
}

#main-user-menu .user-menu .sub-menu {
	line-height: normal;
}

/*
#main-user-menu .user-menu:hover .sub-menu { display: block; }
#main-user-menu .user-menu .sub-menu-item {}
#main-user-menu .user-menu .sub-menu-item > a {}
*/

/* Stats bar styles
----------*/
#user-stats-bar-wrapper {
	background-color: #041124;
	border-bottom: 1px solid #4d5870;
}
#user-stats-bar {
	width: 1024px;
	height: 30px;
	margin: 0 auto;
}
#user-stats-bar ul {
	list-style: none;
	margin: 0;
	padding: 0;
	height: 100%;
}

#user-stats-bar ul > li {
	float: left;
	margin-right: 5px;
	padding-right: 12px;
	line-height: 31px;
	/*font-family: 'pro_semibold';*/
	font-weight: bold;
}

#user-stats-bar .stats-item .icon {
	width: 12px;
	height: 12px;
	text-indent: -99999px;
	overflow: hidden;
	background: url("../images/icons/statsbar_icons.png");
	position: absolute;
	top: 4px;
	left: 5px;
}

#user-stats-bar .stats-item {
    height: 20px;
    background: rgba(255, 255, 255, 0.1);
    margin: 5px 10px 5px 0;
    line-height: 20px;
    padding: 0 5px;
    font-size: 13px;
    color: #A7A7A7;
    text-shadow: -1px -1px 0 #301F1F, 1px -1px 0 #301F1F, -1px 1px 0 #301F1F, 1px 1px 0 #301F1F;
	position: relative;
	padding-left: 20px;
	cursor: default;
}
#user-stats-bar .stats-item a {
	color: #D5D5D5;
	text-decoration: none;
}

#user-stats-bar .stats-item.time .icon { background-position: 0 0; }
#user-stats-bar .stats-item.level .icon { background-position: 0 -12px; }
#user-stats-bar .stats-item.prestige-level .icon { background-position: 0 -72px; }
#user-stats-bar .stats-item.points .icon { background-position: 0 -60px; }
#user-stats-bar .stats-item.experience .icon { background-position: 0 -48px; }
#user-stats-bar .stats-item.experience { padding: 0; }
#user-stats-bar .stats-item.experience .percent:before { content: '(' }
#user-stats-bar .stats-item.experience .percent:after { content: ')' }
#user-stats-bar .stats-item.experience .progress {
	height: 16px;
    position: absolute;
    top: 2px;
    left: 3px;
    z-index: 1;
    min-width: 1px;
	opacity: 0.8;
}
#user-stats-bar .stats-item.experience .progress-data {
	position: relative;
    text-align: center;
    z-index: 2;
    padding: 0 6px 0 20px;
}


#user-stats-bar .stats-item.credits .icon { background-position: 0 -36px; }
#user-stats-bar .stats-item.turns .icon { background-position: 0 -24px; }

/* Notification icon styles. */
#user-stats-bar .stats-icon > a {
	display: block;
	width: 22px;
	height: 22px;
	padding: 0;
	margin: 4px 0;
	background: url('../images/icons/stats_bar_sprite.png') no-repeat 0 0;
	text-indent: -9999px;
}

#user-stats-bar .stats-icon.notif > a { background-position: -22px 0; }
#user-stats-bar .stats-icon.notif.new > a { background-position: 0 0; }

#user-stats-bar .stats-icon.attacks > a { background-position: -22px -22px; }
#user-stats-bar .stats-icon.attacks.new > a { background-position: 0 -22px; }

#user-stats-bar .stats-icon.raids > a { background-position: -22px 0; }
#user-stats-bar .stats-icon.raids.new > a { background-position: 0 0; }

/* Automated events styles. */
#user-stats-bar .stats-item.events {
    float: right;
    border: 0;
    padding: 0;
    line-height: 17px;
    background: transparent;
}
#user-stats-bar .stats-item.events img {
    vertical-align: middle;
    display: inline;
}

/* Search box styles. */
#user-stats-bar .search-box {
	float: right;
	margin: 0;
	padding: 0;
}
#user-stats-bar .search-box form {
	display: inline-block;
	height: 26px;
	vertical-align: middle;
}
#user-stats-bar .search-box input[type="text"] {
	display: block;
	width: 120px;
	height: 20px;
	border: 0;
	padding-left: 6px;
	color: #888888;
	font-size: 12px;
	background: rgba(223, 223, 223, 0.11);
	border: 1px solid rgba(255, 255, 255, 0.07);
	transition: width 500ms, color 500ms, background 500ms;
}
#user-stats-bar .search-box input[type="text"]:focus {
	width: 150px;
	color: #DBDBDB;
	background: rgba(255, 255, 255, 0.37);
}

#user-stats-bar .search-box input::-webkit-input-placeholder { color: rgba(225, 225, 225, 0.2); }
#user-stats-bar .search-box input::-moz-placeholder { color: rgba(225, 225, 225, 0.2); }
#user-stats-bar .search-box input::ms-input-placeholder { color: rgba(225, 225, 225, 0.2); }

#user-stats-bar .search-box input[type="submit"] { display: none; }

/* Page content styles
----------*/
#page-wrapper {
	padding-top: 88px;
	padding-bottom: 208px;
}
#page-content {
	width: 1004px;
	padding: 10px;
	margin: 30px auto;
	background: rgba(255,255,255,0.15);
}

/* Main anchor styles. */
.ui-modal a:link,
#page-content a {
	color: #438dbf;
	font-weight: normal;
	text-decoration: none;
}
#page-content a:hover {
	color: #195984;
}

/* Main footer styles
----------*/
#main-footer-wrapper {
	position: relative;
	width: 100%;
	padding-bottom: 8px;
	background: black;
	overflow: hidden;
}
#main-footer {
	width: 1024px;
	height: 144px;
	margin: 0 auto;
	overflow: hidden;
}

#main-footer .column {
	float: left;
	width: 260px;
	padding: 0 10px;
	margin-right: 30px;
}
#main-footer .column a {
	color: #5a637d;
	font-size: 13px;
	text-decoration: none;
}

/* Shared link list column styles. */
#main-footer .column ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#main-footer .column ul li {}
#main-footer .column ul li:before {
	content: '\2022';
    color: #2c303e;
    font-size: 16px;
    padding-right: 5px;
}

#main-footer .column h1 {
	margin: 10px 0;
	font-size: 18px;
}
#main-footer .column p {
	color: #848483;
	font-size: 13px;
}

#main-footer .column.useful-links { width: 195px; }
#main-footer .column.follow-us {}
#main-footer .column.newsletter {}
#main-footer .column.copyright { margin-right: 0; }

/* Social icon styles. */
/*#main-footer .column.follow-us .social-icons {
	margin: 14px 0 0 0;
	padding: 0;
	list-style: none;
}
#main-footer .column.follow-us .social-icons li {
	float: left;
	display: block;
	width: 37px;
	height: 38px;
	margin: 0 7px 7px 0;
	background: #4d4d4d;
}
#main-footer .column.follow-us .social-icons li:hover {
	opacity: 0.8;
}
#main-footer .column.follow-us .social-icons li:nth-child(6n) {
	margin-right: 0;
}
#main-footer .column.follow-us .social-icons li > a {
	background: url('../images/icons/social_sprite.png') no-repeat top right;
	display: block;
	width: 37px;
	height: 38px;
	padding: 0;
	overflow: hidden;
	text-indent: -9999px;
}
#main-footer .column.follow-us .social-icons li.facebook > a {
	background-position: 0 0;
}
#main-footer .column.follow-us .social-icons li.twitter > a {
	background-position: -37px 0;
}
#main-footer .column.follow-us .social-icons li.youtube > a {
	background-position: -74px 0;
}
#main-footer .column.follow-us .social-icons li.tumbler > a {
	background-position: -111px 0;
}
#main-footer .column.follow-us .social-icons li.rss > a {
	background-position: -148px 0;
}
#main-footer .column.follow-us .social-icons li.zazzle > a {
	background-position: -185px 0;
}
#main-footer .column.follow-us .social-icons li.googleplus > a {
	background-position: -222px 0;
}
#main-footer .column.follow-us .social-icons li.ello > a {
	background-position: -259px 0;
}*/
/*#main-footer .column.follow-us .social-icons li.blank > a {}*/

/* Copyright column styles. */
#main-footer .column.copyright ul {
	list-style: none;
	display: block;
	padding: 0;
	margin: 0;
    color: #848483;
}
#main-footer .column.copyright ul li {
	display: inline;
}
#main-footer .column.copyright ul li:before {
	display: none;
}
#main-footer .column.copyright ul li:after {
	content: ', ';
}
#main-footer .column.copyright ul li:last-child:after {
	display: none;
}

#main-footer-wrapper .love-msg {
	display: block;
	margin: 7px auto 0 auto;
	text-align: center;
	color: #3A3A3A;
}


/* Tagline bar styles. */
#tagline-bar-wrapper {
	background: #0e0d14;
	border: 1px solid #1B1B1D;
	border-width: 1px 0;
}
#tagline-bar {
	width: 1024px;
	height: 46px;
	margin: 0 auto;
	line-height: 46px;
	text-align: center;
}
#tagline-bar a {
	display: inline-block;
	width: 140px;
	height: 24px;
	vertical-align: middle;
	padding: 0;
	margin-left: 4px;
	text-indent: -9999px;
	background: url('../images/footer_logo.png') no-repeat 0 0;
}