html, body {
	background: #000 url(./images/bg.jpg) fixed;
    background-size: cover;
}

h3 {
	color: #000;
	border-bottom-color: #000;
}

hr {
	border-top-color: #000;
}

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus,
.search-box .button:hover {
	border-color: #4498d4;
}

.search-header {
	box-shadow: 0 0 10px #4498d4;
}

.wrap {
	border-color: #5fa8d3;
    border-radius: 10px;
	background-color: rgba(255,255,255,.8);
}

.headerbar {
    background-color: #0a3876;
    background-image: url(./images/header_ps.jpg);
    margin-bottom: 0;
    padding: 10px;
    border-radius: 5px;
    background-repeat: no-repeat;
}

.headerbar h1 {
      font-size: xx-large;
}

.forum-image {
    float: left;
    padding-top: 0;
    margin-right: 5px;
	margin-top: -3px;
}

.logo {
	padding: 0;
}

.site_logo {
	background-image: url("./images/gow_logo.png");
	width: 394px;
	height: 140px;
	vertical-align: middle;
	background-repeat:no-repeat;
}

.navbar {
	background-color: #dedede;
	border-radius: 0;
}

.forabg, .forumbg {
	background: #212121 url("./images/bg_forum.jpg") repeat-y;
	border-radius: 5px;
}

.panel {
	background-color: #d7d7d7;
	border-radius: 0;
}

.bg1 {
	background-color: #e7e7e7;
}

.bg2 {
	background-color: #ededed;
}

.bg3	{
	background-color: #dadada;
}

table.table1 tbody td {
	border-top-color: #000;
}

.pagination li.active span {
	background-color: #5fa8d3;
	border-color: #5fa8d3;
}

.pagination li a:hover, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	background-color: #124f91;
	border-color: #124f91;
}

div.rules {
	color: #008ed8;
	background-color: #6bfdca;
}

a { color: #000; }
a:hover	{ color: #0f80c6; }

.postlink {
	border-bottom-color: #124f91;
	color: #124f91;
}

.postlink:hover {
	background-color: transparent;
}

a.arrow-left:hover {
	color: #124f91;
}

a.arrow-right:hover {
	color: #124f91;
}

ul.forums {
	background-color: #f3f3f3;
	background-image: -webkit-linear-gradient(top, #dedede 0%, #f3f3f3 100%);
	background-image: linear-gradient(to bottom, #dedede 0%,#f3f3f3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#f3f3f3',GradientType=0 );
}

li.row:hover {
	background-color: #fff;
}

.content h2, .panel h2 {
	border-bottom-color:  #000;
}

.signature {
	border-top-color: #93b5f5;
}

.notice {
	border-top-color:  #000;
}

blockquote {
	background-color: #fff;
}

.codebox p {
	border-bottom-color:  #000;
}

dl.thumbnail dt a:hover img {
	border-color: #124f91;
}

.button {
	border-color: #4498d4;
	color: #4498d4;
}

.global_read								{ background-image: url("./images/announce_read.svg"); }
.global_read_mine							{ background-image: url("./images/announce_read_mine.svg"); }
.global_read_locked							{ background-image: url("./images/announce_read_locked.svg"); }
.global_read_locked_mine					{ background-image: url("./images/announce_read_locked_mine.svg"); }
.global_unread								{ background-image: url("./images/announce_unread.svg"); }
.global_unread_mine							{ background-image: url("./images/announce_unread_mine.svg"); }
.global_unread_locked						{ background-image: url("./images/announce_unread_locked.svg"); }
.global_unread_locked_mine					{ background-image: url("./images/announce_unread_locked_mine.svg"); }

.announce_read								{ background-image: url("./images/announce_read.svg"); }
.announce_read_mine							{ background-image: url("./images/announce_read_mine.svg"); }
.announce_read_locked						{ background-image: url("./images/announce_read_locked.svg"); }
.announce_read_locked_mine					{ background-image: url("./images/announce_read_locked_mine.svg"); }
.announce_unread							{ background-image: url("./images/announce_unread.svg"); }
.announce_unread_mine						{ background-image: url("./images/announce_unread_mine.svg"); }
.announce_unread_locked						{ background-image: url("./images/announce_unread_locked.svg"); }
.announce_unread_locked_mine				{ background-image: url("./images/announce_unread_locked_mine.svg"); }

.forum_link									{ background-image: url("./images/forum_link.svg"); }
.forum_read									{ background-image: url("./images/forum_read.svg"); }
.forum_read_locked							{ background-image: url("./images/forum_read_locked.svg"); }
.forum_read_subforum						{ background-image: url("./images/forum_read_subforum.svg"); }
.forum_unread								{ background-image: url("./images/forum_unread.svg"); }
.forum_unread_locked						{ background-image: url("./images/forum_unread_locked.svg"); }
.forum_unread_subforum						{ background-image: url("./images/forum_unread_subforum.svg"); }

.sticky_read								{ background-image: url("./images/sticky_read.svg"); }
.sticky_read_mine							{ background-image: url("./images/sticky_read_mine.svg"); }
.sticky_read_locked							{ background-image: url("./images/sticky_read_locked.svg"); }
.sticky_read_locked_mine					{ background-image: url("./images/sticky_read_locked_mine.svg"); }
.sticky_unread								{ background-image: url("./images/sticky_unread.svg"); }
.sticky_unread_mine							{ background-image: url("./images/sticky_unread_mine.svg"); }
.sticky_unread_locked						{ background-image: url("./images/sticky_unread_locked.svg"); }
.sticky_unread_locked_mine					{ background-image: url("./images/sticky_unread_locked_mine.svg"); }

.topic_moved								{ background-image: url("./images/topic_moved.svg"); }
.topic_read									{ background-image: url("./images/topic_read.svg"); }
.topic_read_mine							{ background-image: url("./images/topic_read_mine.svg"); }
.topic_read_hot								{ background-image: url("./images/topic_read_hot.svg"); }
.topic_read_hot_mine						{ background-image: url("./images/topic_read_hot_mine.svg"); }
.topic_read_locked							{ background-image: url("./images/topic_read_locked.svg"); }
.topic_read_locked_mine						{ background-image: url("./images/topic_read_locked_mine.svg"); }
.topic_unread								{ background-image: url("./images/topic_unread.svg"); }
.topic_unread_mine							{ background-image: url("./images/topic_unread_mine.svg"); }
.topic_unread_hot							{ background-image: url("./images/topic_unread_hot.svg"); }
.topic_unread_hot_mine						{ background-image: url("./images/topic_unread_hot_mine.svg"); }
.topic_unread_locked						{ background-image: url("./images/topic_unread_locked.svg"); }
.topic_unread_locked_mine					{ background-image: url("./images/topic_unread_locked_mine.svg"); }

.pm_read									{ background-image: url("./images/topic_read.svg"); }
.pm_unread									{ background-image: url("./images/topic_unread.svg"); }

dl.row-item dt .list-inner {
    padding-left: 50px;
}

.panel-container .panel li.row {
	border-top-color: #000;
}

.panel-container table.table1 thead th {
	border-bottom-color: #000;
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
	background: #dadada;
	background: -webkit-linear-gradient(top, #ffffff 0%, #dadada 100%);
	background: linear-gradient(to bottom, #ffffff 0%, #dadada 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dadada', GradientType=0 );
	border-color: #dadada;
}

.navigation a {
	background: #dadada;
	background: -webkit-linear-gradient(left, #B4C4D1 50%, #dadada 100%);
	background: linear-gradient(to right, #B4C4D1 50%, #dadada 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#B4C4D1', endColorstr='#dadada', GradientType=1 );
}

.rtl .navigation a {
	background: #B4C4D1;
	background: -webkit-linear-gradient(left, #dadada 0%, #B4C4D1 50%);
	background: linear-gradient(to right, #dadada 0%, #B4C4D1 50%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dadada', endColorstr='#B4C4D1', GradientType=1 );
}

.dropdown-extended .header {
	background: #dadada;
	background: -webkit-linear-gradient(top, #F1F8FF 0%, #dadada 100%);
	background: linear-gradient(to bottom, #F1F8FF 0%, #dadada 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1F8FF', endColorstr='#dadada',GradientType=0 );
}

ul.linklist li.responsive-menu a.responsive-menu-link:hover:before, ul.linklist li.responsive-menu.visible a.responsive-menu-link:before {
	border-color: #0f80c6;
}

.dropdown .dropdown-contents {
	border-color: #dedede;
}

.nav-main .rightside > [href*="./ucp.php"] {
	position: relative;
}

.badge {
	font-size: .9em;
	position: absolute;
	left: .5em;
	top: -.5em;
	padding: 2px;
	border-radius: 0;
}

.compact .rightside > [href*="./ucp.php"] > span {
	display: none;
}

.compact .badge {
	position: static;
	margin: 3px 0 0 1px;
	padding: 3px;
}

/* FontPs4 */
@font-face {
	font-family: 'FontPs4pro';
	src: url('fonts/FontPs4pro.eot');
	src: url('fonts/FontPs4pro.eot') format('embedded-opentype'),
		 url('fonts/FontPs4pro.ttf') format('truetype'),
		 url('fonts/FontPs4pro.woff') format('woff'),
		 url('fonts/FontPs4pro.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
.dropdown-contents .fa-sliders:before,
.dropdown-contents .fa-user:before,
.navbar .fa-question-circle:before,
.navbar .fa-bell:before,
.navbar .fa-inbox:before,
.navbar .fa-cogs:before,
.navbar .fa-gavel:before,
.navbar .fa-group:before,
.navbar .fa-shield:before,
.navbar .fa-envelope:before,
.breadcrumbs .fa-home:before,
.dropdown-contents .fa-file-o:before {
	font-family: FontPs4pro;
}
/* Icons & Button icons */
.dropdown-contents .fa-sliders:before		{ content: "\e0b1"; }
.dropdown-contents .fa-user:before			{ content: "\e0b2"; }
.navbar .fa-question-circle:before 			{ content: "\e0a1"; }
.navbar .fa-bell:before 						{ content: "\e0a4"; }
.navbar .fa-inbox:before 					{ content: "\e0a5"; }
.navbar .fa-envelope:before 					{ content: "\e0a5"; }
.navbar .fa-cogs:before 						{ content: "\e0a2"; }
.navbar .fa-gavel:before						{ content: "\e0a3"; }
.navbar .fa-group:before						{ content: "\e0a8"; }
.navbar .fa-shield:before					{ content: "\e0a7"; }
.breadcrumbs .fa-home:before 				{ content: "\e0a6"; }
.dropdown-contents .fa-file-o:before			{ content: "\e0c4"; }


/*troops classes*/
.troopsclass { font-size:120%; display:inline-block; padding:10px 0; width:100%;}
.troopspicture { float:left; margin-right:10px; width:20%; border-radius:10px; }
.troopsmana { height:25px; float:left; margin-right:5px; }
.troopsname { font-size:150%; line-height:116%}


/*new troops card*/
.troopwrapper { border-radius:10px; background-color:#AAA;  overflow:hidden; font-family:sans-serif; width:340px; font-size:120%; display:inline-block; margin-bottom:20px; margin-right:10px; float:left;}
.troopimage { background-repeat:no-repeat!important; background-position:center!important; height:450px; position:relative;}
.weaponimage { background-repeat:no-repeat!important; background-position:center!important; height:250px; position:relative;}
.troopmana { background: #AAA; display: block; height: 25px; padding: 10px; color:white;} 
.troopsmana { height:25px; float:left; margin-right:5px;}
.troop {position:absolute;bottom:0;width:100%;text-align:right;}
.troopname {font-size:220%;line-height:116%;color:white;padding: 5px 10px;display: block; background: rgba(0,0,0,.5);}
.troopstype {color:white;background: #AAA; display:block; padding:10px; text-align:center;}
.troopskingdom {color: #FFF; padding: 0 10px 10px 10px;display: block; font-weight:bold;}
.troopspell{background:#CCC; font-size:80%; text-align:center; padding:10px; font-size:110%;}


/*announcement troops card*/
.announce_wrapper {padding-top:10px; display: inline-block;}
.a_troopwrapper { border-radius:10px; background-color:#AAA;  overflow:hidden; font-family:sans-serif; width:200px; font-size:10px; display:inline-block; margin-right:10px; margin-bottom:10px; vertical-align:top; }
.a_troopimage { background-repeat:no-repeat!important; background-position:center!important; background-size:cover!important; height:250px; position:relative;}
.a_weaponimage { background-repeat:no-repeat!important; background-position:center!important; background-size:cover!important; height:150px; position:relative;}
/*.a_troopmana { display: block; padding: 10px; /*color:white; height: 15px;} */

.a_trooptrait {max-width: 10px; margin: auto; display: block; position: absolute; bottom: 70px;}
.a_trooptraitimg { float: left;
    width: 25px;
    margin-right: 10px;
    background: rgba(0,0,0,.6);
    margin-bottom: 5px;
    padding: 5px;
    vertical-align: middle;
    border-radius:0 10px 10px 0;}
.a_troopspellimg {max-width:175px;}
.a_troopmana { display: block; padding: 10px; height: 15px;}
.a_troopmanadoomed { background:#bb0000; color:white; display: block; padding: 10px; height: 15px;}
.a_troopmanamythic { background:#51d1f5; display: block; padding: 10px; height: 15px;}
.a_troopmanalegendary { background:#f5ab00; display: block; padding: 10px; height: 15px;}
.a_troopmanaepic { background:#9900d1; color:white; display: block; padding: 10px; height: 15px;}
.a_troopmanaultrarare { background:#3e34b2; color:white; display: block; padding: 10px; height: 15px;}
.a_troopmanarare { background:#51b234; color:white; display: block; padding: 10px; height: 15px;}
.a_troopmanacommon { background:#FFF; display: block; padding: 10px; height: 15px;}

.a_petred { background:#bb0000; color:white; display: block; height: 10px;}
.a_petyellow { background:#f4fc1d; display: block; height: 10px;}
.a_petgreen { background:#51b234; color:white; display: block; height: 10px;}
.a_petblue { background:#3e34b2; color:white; display: block; height: 10px;}
.a_petbrown { background:#974802; color:white; display: block; height: 10px;}
.a_petpurple { background:#9900d1; color:white; display: block; height: 10px;}

.petred { border-left:6px solid #bb0000;}
.petyellow { border-left:6px solid #f4fc1d; }
.petgreen { border-left:6px solid #51b234; }
.petblue { border-left:6px solid #3e34b2; }
.petbrown { border-left:6px solid #974802; }
.petpurple { border-left:6px solid #9900d1; }


.a_troopskill {display: block;padding: 5px; text-align: center;font-weight: bold; font-size: 110%;color: white;   background: linear-gradient(.25turn, black, #555,#555, black);}
.a_troopsskill {height:20px; margin:0 2px; }

.a_troopsmana {height:15px; margin-right:2px;}

.a_mana {float:right;font-weight: 700; font-size: 120%;}
.a_announce { float:right; font-size:110%;}
.a_troop {position:absolute;bottom:0;width:100%;text-align:right;}
.a_troopsname {font-size:110%;}
.a_troopname {font-size:220%;line-height:116%;color:white;padding: 5px 10px;display: block; background: rgba(0,0,0,.5);}

.a_troopstypedoomed { background:#bb0000; color:white; display:block; text-align:center;}
.a_troopstypemythic { background:#51d1f5; display:block; text-align:center;}
.a_troopstypelegendary { background:#f5ab00; display:block; text-align:center;}
.a_troopstypeepic { background:#9900d1; color:white; display:block; text-align:center;}
.a_troopstypeultrarare { background:#3e34b2; color:white; display:block; text-align:center;}
.a_troopstyperare { background:#51b234; color:white; display:block; text-align:center;}
.a_troopstypecommon { background:#FFF; display:block; text-align:center;}

.a_troopskingdom {color: #FFF; padding: 0 10px 10px 10px;display: block; font-weight:bold;}
.a_troopspell{background:#CCC; font-size:80%; text-align:center; padding:5px; font-size:110%;}
.clearline {clear:both;}
.a_trooprate { float:left; margin-top: -3px;}

/*banner*/
.banner { width:202px; height:322px; background-repeat:no-repeat!important; font-size:120%;}
.bannertitle { width:100%; background:rgba(0,0,0,.5); color:white; font-weight:bold; padding: 5px 0; position: relative; top: 50%; text-align:center; border-radius: 5px;}

/*class*/
.classes { display:table; background: rgba(0,0,0,.3); color: white; font-size: 120%; font-weight: bold; padding: 5px; border-radius: 10px; margin-bottom:10px; }
.classimg { margin-right:5px; display:inline-block; width:55px;}
.classtitle { display:inline-block;}

/*Team copy field*/
.teamtext { cursor:pointer; background:#666; color:white; padding:5px;  text-align:center; border-radius:5px;}
.teamhelp { color:lightgray; }
.teambox { width:95%; text-align:center; }
.teamblock {display:block;}

.floorclass {
        display: inline-block;
    color: white;
    background: #AAA;
    border-radius: 5px;
    padding: 5px;
    font-size: 20px;
    font-weight: bold;
    min-width: 40px;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 5px;
}

.iframecontainer{
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; 
  height: 0;
}
.iframecontainer iframe{
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*the container must be positioned relative:*/
.custom-select {
  position: relative;
  
}

.custom-select select {
  display: none; /*hide original SELECT element:*/
}

.select-selected {
  background-color: #FFF;
  padding: 7px 10px;
  border: 1px solid #b4bac0;
 /* border-color: #DDD;*/
  cursor: pointer;
  user-select: none;
}

/*style the arrow inside the select element:*/
.select-selected:after {
    position: absolute;
    content: "";
    top: 12px;
    right: 10px;
    width: 0;
    height: 0;
    border: 4px solid transparent;
    border-color: #000 transparent transparent transparent;
}

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #000 transparent;
  top: 7px;
}

/*style the items (options), including the selected item:.select-selected*/
.select-items div {
  /*color: #ffffff;*/
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
  user-select: none;
background-repeat: no-repeat!important;
    padding-left: 50px;
    background-size: contain!important;
    height: 45px;
    vertical-align:middle;
}

/*style items (options):*/
.select-items {
    position: absolute;
    background-color: white;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;       
    height: 262px;
    overflow-y: auto;
    font-size: 130%;
	border: 2px solid #DDDDDD;
	
}

/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}
.innerimage { height: 55px; margin-right: 10px;};

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

.event-calendar {
/*	width:98%;
    font-size: 24pt;
	font-weight:bold;
    text-align: center;
    background: #570f8a;
    padding: 10px;
    border-radius: 5px;*/
    width: 98%;
    font-size: 24pt;
    font-weight: bold;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    display: block;
    top: -10px;
    position: relative;
    background: linear-gradient(.25turn, rgba(0, 0, 0, 0),30%,rgba(0, 0, 0, 1),41%,rgba(0, 0, 0, 1),60%,rgba(0, 0, 0, 1),71%,rgba(0, 0, 0, 0));
}

.team-list {
  width: 98%;
    font-size: 16pt;
    font-weight: bold;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    display: block;
    top: -10px;
    position: relative;
    background: linear-gradient(.25turn, rgba(0, 0, 0, 0),30%,rgba(0, 0, 0, 1),41%,rgba(0, 0, 0, 1),60%,rgba(0, 0, 0, 1),71%,rgba(0, 0, 0, 0));
	color:white;

}

.event-wrapper { 
    padding: 10px;
    border: 4px solid #888;
    margin: 10px;
    border-radius: 10px;
	background-repeat: no-repeat!important;
    background-size: cover!important;
	background-position: center!important;
	width: 300px;
    display: inline-block;
    vertical-align: top;
}

.event-title {

    font-size: 340%;
    color: white;
    background: rgba(0,0,0,.3);
    display: block;
    padding: 10px 20px;
    margin: -10;

	text-align: right;
}
.event-day {
    position: absolute;
    margin: -5px;
    color: black;
    background: white;
    padding: 5px 10px;
    font-weight: bold;
    font-size: 120%;
    border-radius: 10px;
}
/*.common {background:#FFF;}
.rare {background:#c7ebbc;}
.ultrarare {background:#acb4e7; }
.epic {background:#ecb8ff; }
.legendary {background:#ffeec7;}
.mythic {background:#c0effb;}*/

.doomed {border-left:6px solid #D00;}
.common {border-left:6px solid #FFF;}
.rare {border-left:6px solid #51b234;}
.ultrarare {border-left:6px solid #3e34b2; }
.epic {border-left:6px solid #9900d1; }
.legendary {border-left:6px solid #f5ab00;}
.mythic {border-left:6px solid #51d1f5;}

.navbar_gowtools{
     margin-left: -15px;
}

.langswitcher{
 float: right;
    display: table;
    padding: 7px;
    background: black;
    margin-right: -15px;
    border-radius: 0 10px;
    margin-bottom: -10;
}

.event-table {
 font-size:10pt;
 color:black;
 border-collapse: separate;
    border-spacing: 0 5px;
 width:100%;
}

.event-table a{
 text-decoration:underline;
}

.event-table-header {
 background: black;
 color:white;
 text-align:center;
}

.event-table th {
 padding: 5px 10px;
}

.event-modus {
 border:none;
 vertical-align: baseline;
 margin-left:20px;
}

.event-table td {
 padding:5px 10px;
}

.eventimg {
 width:30px;
 margin-right:10px;
}

.event-tr:nth-child(even) {
  background-color: #f2f2f2;
}

.event-tr:nth-child(odd) {
  background-color: #d2d2d2;
}

.event-tr-unpredicted:nth-child(even) {
 background-color: #fff;
 color:lightgray;

}

.event-tr-unpredicted:nth-child(odd) { 
background-color: #fdfdfd;
color:lightgray;
}

.event-tr-new:nth-child(odd) {
  background-color: #d2d2d2;
  
}
.event-tr-new:nth-child(even) {
  background-color: #f2f2f2;
}

.event-tr-mod:nth-child(odd) {
  background-color: #d2d2d2;
}
.event-tr-mod:nth-child(even) {
  background-color: #f2f2f2;
}

.event-dates {
 font-weight:bold;
 font-size:18pt;
 color:white;
 text-align: center;
    background: rgba(0,0,0,.2);
    padding: 5px 0;
    margin-bottom: 10px;
}

.hidden{
 display:none;
}

.event-img {
 margin:auto;
}

.event-troop{
 text-align:center;
}
.event-kingdom {
 display: inline-block;
    float: right;
    color: lightgrey;
    font-size: 120%;
    background: black;
    padding: 5px 10px;
    margin-right: -10px;
    border-radius: 5px 0 0 5px;
}

/* spoilers */
#rareimg {
display:none;
width: 20px;
cursor: pointer;
}

.spoiler_mana {height:15px; margin-right:2px;}

.spoilers-switch {
 text-align:center;
}

.spoilers-switch td {
    border-top: 2px solid black;
    border-right: 2px solid black;
    border-left: 2px solid black;
    padding: 5px 25px;
    border-radius: 15px 5px 0 0;
    background: #333;
    margin-bottom: -5px;
    display: inline-block;
}

.spoilers-switch img {
 border:none;
}

/*Loader*/
#cssload-contain {
	width: 230px;
    z-index: 100;
    height: 30px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
	opacity: 0;
	background: rgba(0,0,0,.3);
    padding: 10px;
    border-radius: 10px;
	animation: fadeIn 1.6s 1;
		-o-animation: fadeIn 1.6s 1;
		-ms-animation: fadeIn 1.6s 1;
		-webkit-animation: fadeIn 1.6s 1;
		-moz-animation: fadeIn 1.6s 1;
	animation-fill-mode: forwards;
		-o-animation-fill-mode: forwards;
		-ms-animation-fill-mode: forwards;
		-webkit-animation-fill-mode: forwards;
		-moz-animation-fill-mode: forwards;
}

.cssload-wrap {
	animation: translate 1600ms infinite ease-in-out alternate, zindex 3200ms infinite ease-in-out;
		-o-animation: translate 1600ms infinite ease-in-out alternate, zindex 3200ms infinite ease-in-out;
		-ms-animation: translate 1600ms infinite ease-in-out alternate, zindex 3200ms infinite ease-in-out;
		-webkit-animation: translate 1600ms infinite ease-in-out alternate, zindex 3200ms infinite ease-in-out;
		-moz-animation: translate 1600ms infinite ease-in-out alternate, zindex 3200ms infinite ease-in-out;
	position: absolute;
}

.cssload-ball {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	animation: scale 1600ms infinite ease-in-out alternate;
		-o-animation: scale 1600ms infinite ease-in-out alternate;
		-ms-animation: scale 1600ms infinite ease-in-out alternate;
		-webkit-animation: scale 1600ms infinite ease-in-out alternate;
		-moz-animation: scale 1600ms infinite ease-in-out alternate;
	animation-delay: -200ms;
		-o-animation-delay: -200ms;
		-ms-animation-delay: -200ms;
		-webkit-animation-delay: -200ms;
		-moz-animation-delay: -200ms;

}
	
#cssload-wrap1 {
    animation-delay: -200ms;
		-o-animation-delay: -200ms;
		-ms-animation-delay: -200ms;
		-webkit-animation-delay: -200ms;
		-moz-animation-delay: -200ms;
}

#cssload-ball1{
	background: url('/styles/ps4_pro/theme/images/mana/red.png') no-repeat;
	background-size:cover;
	
}

#cssload-wrap2 {
    animation-delay: -400ms;
		-o-animation-delay: -400ms;
		-ms-animation-delay: -400ms;
		-webkit-animation-delay: -400ms;
		-moz-animation-delay: -400ms;
}

#cssload-ball2 {
	background: url('/styles/ps4_pro/theme/images/mana/yellow.png') no-repeat;
	background-size:cover;
	
}

#cssload-wrap3 {
 animation-delay: -600ms;
		-o-animation-delay: -600ms;
		-ms-animation-delay: -600ms;
		-webkit-animation-delay: -600ms;
		-moz-animation-delay: -600ms;
}

#cssload-ball3 {
	background: url('/styles/ps4_pro/theme/images/mana/green.png') no-repeat;
	background-size:cover;
		
}

#cssload-wrap4 {
animation-delay: -800ms;
		-o-animation-delay: -800ms;
		-ms-animation-delay: -800ms;
		-webkit-animation-delay: -800ms;
		-moz-animation-delay: -800ms;
}

#cssload-ball4 {
	background: url('/styles/ps4_pro/theme/images/mana/blue.png') no-repeat;
	background-size:cover;
	
}

#cssload-wrap5 {
	animation-delay: -1000ms;
		-o-animation-delay: -1000ms;
		-ms-animation-delay: -1000ms;
		-webkit-animation-delay: -1000ms;
		-moz-animation-delay: -1000ms;
	
}

#cssload-ball5 {
	background: url('/styles/ps4_pro/theme/images/mana/purple.png') no-repeat;
	background-size:cover;

}

#cssload-wrap6 {
	animation-delay: -1200ms;
		-o-animation-delay: -1200ms;
		-ms-animation-delay: -1200ms;
		-webkit-animation-delay: -1200ms;
		-moz-animation-delay: -1200ms;
}	
	
#cssload-ball6 {
	background: url('/styles/ps4_pro/theme/images/mana/brown.png') no-repeat;
	background-size:cover;
	

}




@keyframes translate {
	100% {
		transform: translateX(200px);
	}
}

@-o-keyframes translate {
	100% {
		-o-transform: translateX(200px);
	}
}

@-ms-keyframes translate {
	100% {
		-ms-transform: translateX(200px);
	}
}

@-webkit-keyframes translate {
	100% {
		-webkit-transform: translateX(200px);
	}
}

@-moz-keyframes translate {
	100% {
		-moz-transform: translateX(200px);
	}
}

@keyframes scale {
	100% {
		transform: scale(1);
	}
}

@-o-keyframes scale {
	100% {
		-o-transform: scale(1);
	}
}

@-ms-keyframes scale {
	100% {
		-ms-transform: scale(1);
	}
}

@-webkit-keyframes scale {
	100% {
		-webkit-transform: scale(1);
	}
}

@-moz-keyframes scale {
	100% {
		-moz-transform: scale(1);
	}
}

@keyframes zindex {
	25% {
		z-index: -1;
	}
	75% {
		z-index: 1;
	}
}

@-o-keyframes zindex {
	25% {
		z-index: -1;
	}
	75% {
		z-index: 1;
	}
}

@-ms-keyframes zindex {
	25% {
		z-index: -1;
	}
	75% {
		z-index: 1;
	}
}

@-webkit-keyframes zindex {
	25% {
		z-index: -1;
	}
	75% {
		z-index: 1;
	}
}

@-moz-keyframes zindex {
	25% {
		z-index: -1;
	}
	75% {
		z-index: 1;
	}
}

@keyframes fadeIn {
	100% {
		opacity: 1;
	}
}

@-o-keyframes fadeIn {
	100% {
		opacity: 1;
	}
}

@-ms-keyframes fadeIn {
	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadeIn {
	100% {
		opacity: 1;
	}
}

@-moz-keyframes fadeIn {
	100% {
		opacity: 1;
	}
}
/* End of Loader*/

/*campaigns*/
.Bronze {
 border-left:6px solid #e18b09;
}

.Silver {	
	 border-left:6px solid #cccccc;
}

.Gold {
	border-left:6px solid #e1e109;
}

/* Troop_Show*/

.ts_wrapper {
 width:1024px;
 height:648px;
 display:block;
margin:auto;
 position:relative;
}

.ts_troopcoatofarms {
display: block;
    position: absolute;
    left: 0;
    right: 150;
    text-align: center;
}

.ts_date {
    padding: 20px;
    display: block;
    max-width: 50%;
    color: white;
    font-size: 22pt;
    background: linear-gradient(.25turn, rgba(0,0,0,.4),rgba(0,0,0,.0));
    font-weight: bold;
}

.ts_kingdom {
font-size:50%;
color:lightgray;
display:block;
}

.ts_troop {
position:absolute;
left:0;
bottom:0;
}

[class*="ts_troopname"] {
    float: right;
    position: relative;
    top: 20px;    
    padding: 10px 30px;    
    min-width: 50%;
    text-align: right;
/*    background: linear-gradient(to right, rgba(0,0,0,.0) ,25%,rgba(0,0,0,.7));*/
}

.ts_troopname-common {
   background: linear-gradient(to right, rgba(255,255,255,.0) ,25%,rgba(255,255,255,.7));
   color:black;
}

.ts_troopname-rare {
   background: linear-gradient(to right, rgba(81,178,52,.0) ,25%,rgba(81,178,52,.7));
   color:white;
}

.ts_troopname-ultrarare {
   background: linear-gradient(to right, rgba(62,52,178,.0) ,25%,rgba(62,52,178,.7));
   color:white;
}

.ts_troopname-epic {
   background: linear-gradient(to right, rgba(153,0,209,.0) ,25%,rgba(153,0,209,.7));
   color:white;
}

.ts_troopname-legendary {
   background: linear-gradient(to right, rgba(245,171,0,.0) ,25%,rgba(245,171,0,.7));
   color:black;
}

.ts_troopname-mythic {
   background: linear-gradient(to right, rgba(81,209,245,.0) ,25%,rgba(81,209,245,.7));
   color:black;
}

.ts_troopname-doomed {
   background: linear-gradient(to right, rgba(187,0,0,.0) ,25%,rgba(187,0,0,.7));
   color:white;
}

.ts_download {
 width:25px;
}

.ts_troopspell {
    float: right;
    position: relative;
    top: 35px;    
    padding: 10px 30px;    
    max-width: 50%;
    background: linear-gradient(to right, rgba(0,0,0,.0) ,25%,rgba(0,0,0,.7));
	font-size:15pt;
	color:white;
}

.ts_troopspellimg {
 float:left;
 width:40%;
 margin:10px;
}

.ts_title {
    font-size: 25pt;
	color: white;
}

.ts_undertitle {
  color: lightgrey;
	font-size: 18pt;
}

.ts_spoiler_mana {height:35px; margin-right:2px;}

.ts_spell {
    color: lightgray;
    font-size: 80%;
    padding: 50px 0;
    position: relative;
    top: 15px;
}

.ts_trooptraits {
    float: right;
    position: relative;
    top: 45px;    
    padding: 10px 5px;    
    max-width: 55%;
    background: linear-gradient(to right, rgba(0,0,0,.0) ,25%,rgba(0,0,0,.7));
	font-size:15pt;
	color:white;
}

.ts_trait {
    font-size: 70%;
    width: 90%;
    display: inline-block;
    vertical-align: top;
    background: rgba(0,0,0,.4);
    padding: 5px; 
	border-radius:10px;
	margin-bottom:5px;
}

.ts_trait_portrait {
    font-size: 80%;
    display: inline-block;
    vertical-align: top;
	width:100%;
    background: rgba(0,0,0,.4);
    padding: 2px; 
}

.ts_traitname {
color:white;
font-weight:bold;
margin-right: 10px;
}

.ts_traitimg {
float:left;
width:35px;
margin-right:10px;
}
.ts_traitimg_portrait {
float:left;
width:25px;
margin-right:5px;
}


.ts_traitdesc {
color:lightgray;
}


.ts_params {
background:rgba(0,0,0,.5);
    position: absolute;
    right: 0;
    bottom: 0;
    border-radius: 10px 0 0 0;
    font-size: 15pt;
    color: white;
    padding: 5px 15px;
    font-weight: bold;
}

.ts_params img {
 width:35px;
}

.popup {
position: fixed;
    width: 0;
    height: 0;
    margin: auto;
    /* background: black; */
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	transition: all 1.5s linear;
	opacity: 0;    

}

.overlayclass {
 display: block;
 position: absolute;
 width: 35px;
 height: 35px;
	background:url('/styles/ps4_pro/theme/images/icons/close.png');
	background-repeat:no-repeat;
    right: -35px;
	cursor:pointer;
}

.popup>iframe{
 width:100%;
 height:100%;
 margin:0;
 padding:0;
 border-radius:10px;
}

.campaign_note {
background: darkred;
    max-width: 80%;
    display: inline-block;
    padding: 10px 15px;
    border: #300 2px solid;
    color: white;
}

.first_ts_td {
 width:10%;
 text-align:right;
}

.showtroop {
 padding:0;
 overflow:hidden;
 background: none transparent;
}
.platformswitch{
    width: 200px;
    margin: auto;
    position: absolute;
    top: 15px;
    left: 0;
    right: 0;
}
.gohome {
    display: table;
    padding: 5px;
    background: black;
    margin-top: -15px;
    margin-left: -15px;
    border-radius: 10px 0;
    margin-bottom: -10;

}

.upform {
 font-size:16px;
}

.pvp_wrapper{
	width: 100%;
    height: 600px;
    overflow-y: scroll;
}



.pvp_table {
 font-size:10pt;
 color:white;
 /*border-collapse: separate;*/
    border-spacing: 0 5px;
 width:100%;
}
.pvp_guild{
 color:lightgray;
}

.pvp_tr {
 background:#444;
}
.pvp_tr>td{
 padding:5px 10px;
}

.pvp_first{
 color:#ffe414;
 font-size:170%;
 font-weight:bold;
 text-align:center;
 vertical-align:middle;
 width:1%;
 white-space:nowrap;
 
}

.pvp_name {
 color:#ffe414;
 font-weight:bold;
 font-size:130%;
 padding:0 10px!important;
}

.pvp_empty{
 height:5px;
}

.pvp_ncenter{
 width:1%;
 text-align:center;
 padding:0;
}
.pvp_n{
 width:1%;
 text-align:left;
 padding:0;
 font-weight:bold;
}

.pvp_shield {
 padding:0!important;
 text-align:center;
}

.pvp_color{
 color:#ffe414;
 font-weight:bold;
 text-align:center;
 width:1%;
}

.profilewrapper {
	font-size:14pt;
	display:table;
	background:rgba(0,0,0,.1);
	border-radius:10px;
}

.profilename {
 color:white;
 font-size:140%;
 background: linear-gradient(to right, rgba(0,0,0,.7) ,75%,rgba(0,0,0,.0));
 padding: 5px 10px;
}

.userlevel{
 color:lightgray;
 font-size:50%
}

.statswrapper{
 padding:10px;
 font-family:sans-serif;
}

.manamastery{
 white-space:nowrap;
 font-size:70%;
 font-weight:bold;
 text-align: center;
 padding: 5px;
}

.profileseparator{
height: 40px;
    width: 100%;
    background: url(/gowassets/icons/separator.png);
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: -10px;
    margin-bottom: -20px;
}

.profilestats{
 text-align:center;
 width:100%;
 background:rgba(0,0,0,.4);
 border-radius: 10px;
}

.profileheaders {
 color:white;
 font-weight:bold;
 width:50%;
 padding: 5px;
}

.profilefooters {
 color:white;
 font-weight:bold;
 width:50%;
 padding: 5px;
 background:rgba(0,0,0,.6);
}
.profileguild{
 margin: 10px;
    font-size: 70%;
    background: rgba(0,0,0,.7);
    padding: 5px;
    color: white;
    border-radius: 5px;
 
}
.profileparams{
 white-space:nowrap;
 font-size:90%;
 font-weight:bold;
 text-align: center;
 padding: 5px;
}

.profileheroclass{
width:60px;
cursor:hand;
}
.profilewrap {
border-spacing: 5px 0;
}
.profilewrap>tbody {

vertical-align:top;
}

.krystarastats {
 border-collapse:separate;
 text-align:center;
 font-size: 80%;
}

.mythicstats{
 font-size:90%;
}

.mythicstats tbody {
	vertical-align:top;
}

.mythicstats th {
 background:rgba(0,0,0,.7);
 padding: 2px 7px;
 color:white;	
 text-align:center;
}


.krystarastats th {
 background:rgba(0,0,0,.7);
 padding: 2px 7px;
 color:white;	
}

.krystarastats tr:nth-child(odd) {
   background-color: #ededed;
}

.krystd {
 text-align:right;
 padding:5px;
}

.tablehonor{
width:50px;
}

.spoilerbanner{
width:100px;
}
.spoilermap {
max-width: 150px; max-height: none; border: 3px solid transparent; border-radius: 6px; transition: border-color 0.1s ease-out 0s; cursor: pointer;
}

.filebase {
 font-size: xx-small;
 color: gray;
 font-weight: normal;
}

.locale-body{
 width:90%;
}

.locale-table {
 font-size:10pt;
 color:black;
 border-collapse: separate;
    border-spacing: 0 5px;
 width:100%;
}

.todnotimp{
 display:inline-block;
 padding:5px; 
 font-size: 14pt;
}

.todhaste{
 display:inline-block;
 padding:5px;
 font-size: 14pt;
 background: rgba(0,255,255,.2);
 border-radius: 5px;
 color: darkblue;
}

.todluck{
 display:inline-block;
 padding:5px;
 font-size: 14pt;
 background: lightgreen;
 border-radius: 5px;
 color: rgba(0,100,0,.5);
}

.todpower{
     display: inline-block;
    padding: 5px;
    font-size: 14pt;
    background: rgba(100,100,100,.2);
    border-radius: 5px;
    color: gray;
}

.todheroism{
 display:inline-block;
 padding:5px;
 font-size: 14pt;
 background: rgba(100,0,100,.2);
 border-radius: 5px;
 color: purple;
}

.todunlock{
 display:inline-block;
 padding:5px;
 background: rgba(100,0,0,.5);
 border-radius: 5px;
 color: white;
 font-size: 14pt;
}

.todfireball{
 display: inline-block;
    padding: 5px;
    background: #FFFFEE;
    border-radius: 5px;
    color: rgba(100,100,0,.5);
    font-size: 14pt;
}