/*
colors:

#191919 - background. The darkest grey
#252525 - next grey
#2d76d0 - blue
#8496ac - Text and borders

#d0352d - required/negative red
#c7d02d - optimal/favored green

*/

body {
	padding:0;
	margin:0;
	font-size:13px;
	font-family: verdana, arial,sans-serif;
	color:#8496ac;
	font-weight:300;
	background-color:#191919;
}

select.mobtool, select.select {
background-color: #191919;
color: #8496ac;
border: 1px solid #8496ac;
border-radius:3px;
}

a.obtained {
cursor:pointer;
}

a.required, .negative {
color: #d0352d;
}

a.optimal {
color: #c7d02d;
}

p.gobtained {
font-size:13px;
}

ul.gobtained li {
font-size:13px;
}


div.favors {
//margin-left:-50px;
text-align:left;
}

textarea:hover {
cursor:default;
}

label {
cursor: pointer;
}

textarea.favors {
background-color: transparent;
border:none;
overflow: hidden; 
font-size:.8em; 
font-family:verdana,arial;
text-align:left;
color:#8496ac;
}

textarea.favored {
color:#c7d02d;
cursor:help;
}

textarea.required {
color:#d0352d;
cursor:help;
}

p.indent {
	margin: 12px 22px;
	}
	
li.indent {
	margin: 0 22px;
	}
	
ul.indent {
	margin: -10px 0 0 0;
	}
	
div.indent {
	background-color: #191919;
	border: 1px solid black;
	margin: 22px;
	padding: 0 8px;
	}
	
div.twitter {
	clear:both;
}
		
table.nameandimg {
	float:left; 
	background-color: #252525;
	margin-right: 20px;
	border-width:9px;
	-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/dark_low_border.png") 9 9 round;
}
		
table.nameandimg img {
	display:block;
	margin: auto; 
}

table.nameandimg td {
	padding: 14px 12px;
}

td.entryname {		
	text-align:center;
	background-color: #252525;
	border-bottom: 1px solid black;
	border-radius:3px;
	font-size: 1.3em;
	font-weight: 600;
	padding: -4px 12px;
}
		
table.nameandimg td.entryname {		
	padding: 4px 12px;
}

td.results {
	padding: 2px 6px;
}
		

td.resultheading {
	width:50%;
	font-size: 1.1em;
	background-color:#252525;
}
		
		
table#recipe {
	background-color: #252525;
	border: 1px solid black;
	border-radius:3px;
	float:left; 
	margin-right: 20px;
}

table#recipe td {
	padding: 4px 12px;	
}

table#usedin {
	background-color: #252525;
	border: 1px solid black;
	border-radius:3px;
}

table#usedin td {
	padding: 4px 12px;
}
		
div.entrycontainer {
	width: 800px;
	margin:20px auto; 
	display:block;
}

div.entrycontainer table#data td {
	white-space: normal;
	}
		
.navimg {
	position:absolute;
	margin-left:-20px;	
	border: none;
	width: 19px;
}	
		
div.collaphidden {
	display:none
}

.grey {
	color: #336666;
}


.recipe {
	height:32px;
	display:inline-block;
	text-align:center;
}

.recipe a {
	color: #fff;
	font-size: 1em;
	font-weight:900;
	text-shadow: 0px 0px 1px #000;
}

h9.lineup {
	position:relative;
	top:-6px;
}


/* 
.invisibleRow {display:none; visibility:hidden;}
	*/
	
a {
	color: #8496ac;
	text-decoration: none;
}

td a {
	color: #2d76d0;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.nohover a:hover {
	text-decoration: none;
}


body.sort-active * {
	cursor:wait;
}

 a.locPop {  
    position:relative;  
    z-index:20;  
 }  

 a.locPop:hover {  
     display:inline;  
     z-index:30;  
 }  

 a.locPop span {  
     display:none;  
 } 

a.locPop:hover span {  
    display:block;  
    position:absolute;  
    top:-320px;  
    left:-500px;   
}  		
		
		
 a.imPop {  
    position:relative;  
    z-index:20;  
 }  

 a.imPop:hover {  
     display:inline;  
     z-index:30;  
 }  

 a.imPop span {  
     display:none;  
 } 

a.imPop:hover span {  
    display:block;  
    position:absolute;  
    top:-64px;  
    left:180px;   
}  

 a.aimPop {  
    position:relative;  
    z-index:20;  
 }  

 a.aimPop:hover {  
     display:inline;  
     z-index:30;  
 }  

 a.aimPop span {  
     display:none;  
 } 

a.aimPop:hover span {  
    display:block;  
    position:absolute;  
    top:-32px;  
    left:124px;   
}  

div.indexframe {
width: 904px;
overflow: hidden;
display: block;
margin: 0 auto;
}



#index {
width: 1248px;
margin:0 auto;
}


div.leftframe {
	width:654px;
	float: left;
	overflow: hidden;
	display: block;
		}
		
div.rightframe {
	width:250px;
	float: right;
	overflow: hidden;
	display: block;	
		}		

table.article {
	margin: 0 auto 8px auto;
	width: 900px;
	padding: 0 10px;
	background-color: #252525;
	overflow: hidden;
	border-width:9px;
	-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/dark_low_border.png") 9 9 round;
	}
		
		
div.leftframe table.article {
	width:600px;
	margin: 0 auto 8px auto;
	padding: 0 10px;
	background-color: #252525;
	overflow: hidden;
	border-width:9px;
	-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/dark_low_border.png") 9 9 round;
	}
		
div.rightframe table.article {
	width:244px;
	margin: 0 auto 8px auto;
	padding: 0 10px;
	background-color: #151515;
	overflow: hidden;
	border-width:9px;
	-moz-border-image:url("../images/interface/drop_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/drop_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/drop_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/drop_border.png") 9 9 round;
	}
		
div.article {
	padding: 0 6px;
	overflow: hidden;
	}
		
div.leftframe  img {
	border: 1px solid black;
	border-radius:5px;
}
	
p.little {
	font-size: 0.8em;
	}

li.little {
	font-size: 0.8em;
	font-weight: 600;
	}	
	
.article p {
	color:#8496ac;
	}
		
h1 {
	font-weight:lighter;
	text-align:center;
	margin-top:0.6em;
	color:#8496ac;
	font-size:1.6em;
}

h2 {		
	margin-top:1.7em;
	margin-bottom:-.5em;
	color:#8496ac;
	letter-spacing:1px;
	font-size:1em;
}
	
h2 span {
	font-variant:small-caps;
	text-transform:none;
	}

h3 {
	text-align:center;
	margin-top:0.1em;
	color:#8496ac;
	font-size:1.1em;
}

#content {
z-index: 10;
}

.use-sidebar #content {
margin-left: 244px;
}

.checkboxes {
z-index: 10;
}
		
.recipeul1 {
background-color:#212121; 
border:1px solid black
}	

#recipeul {
background-color:#212121; 
border:1px solid black
}	
		
.recipeul2 {
background-color:#191919; 
border-top:1px solid black; 
border-left:1px solid black; 
border-bottom:1px solid black;
}	

table#recipe td {
padding-left:30px;
}
		
		
/* ============== ================ ============= Sort and stripe tables =============== ================ ============== */

table.transborder {
margin:0 auto;
overflow: hidden;
}

div.transborder {
border-width:9px;
-moz-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Firefox */
-webkit-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Safari and Chrome */
-o-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Opera */
border-image:url("../images/interface/dark_trans_border.png") 9 9 round;
}



table#data   {
        width:auto;
        padding: 0;
        border-left: 1px solid #000;
    //    border-collapse:collapse;
		border-spacing: 0px;
        border-right: 1px solid #222;
}

table#data td  {
        font: normal 11px;
        border-right: 1px solid #171717;
    //    border-bottom: 1px solid #000;
        border-left: 1px solid #292929;
        border-top: 1px solid #191919;
        padding: 2px ;
        text-align:center; 
		white-space:nowrap;
		cursor:default;
}

table#data input {
	background-color:#191919;
	border:1px solid #4a4e54;
	border-radius: 1px;
	color: #8d8f9c;
	font-family: Verdana;
}

caption  {
        padding: 0 0 5px 0;
        margin:0 auto;
        width:auto;
}

th a {
       color: #000;
	   }

table#data th  {
		font-weight: 600;
        color: #000;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
        border-top: 1px solid #000;
        letter-spacing: .5px;
        text-transform: uppercase;
        text-align:center;
        padding: 0 6px;
        background-color: #2d76d0;
        vertical-align:middle;
 }



table#data.entry td {
		text-align:left;}
		
		
table#data.entry {
margin-bottom: 37px;
border-width:9px;
-moz-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Firefox */
-webkit-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Safari and Chrome */
-o-border-image:url("../images/interface/dark_trans_border.png") 9 9 round; /* Opera */
border-image:url("../images/interface/dark_trans_border.png") 9 9 round;

}

table#data td a  {
// cursor:default;
text-decoration: none;
}

table#data td a:hover  {
// cursor:default;
text-decoration: underline;
}

table#data tr {
	    background-color: #252525;
        color: #8d8f9c;
        }	
		
/* Alternate row style */
table#data tr.alt {
        background-color: #212121;
        color: #8d8f9c;
        }
/* The current cell */
table#data  tbody tr td.currentCell,
table#data  tbody tr td:hover,
table#data  tbody tr.alt td:hover {
        background-color:#292929;
        color: #8d8f9c;
        }
/* Normal row hover styles */ 
table#data  tr.rowHover td,  /* Internet Explorer < 7 (and 7 in quirks mode) requires a specific class */
table#data tr:hover td            /* All others can use the :hover pseudo */
        {
        background-color:#252525;
        }  
/* Alternate row hover styles */
table#data tr.alt:hover td  {
        background-color:#252525;
        }    
/* Column "cell" highlighting */
table#data  tr td.rowHover   {
        background-color:#252525;
        }
/* Header highlighting */
table#data  tr th.rowHover {
        color:#000;
        }   
/* Row select styles */ 
table#data  tbody tr.alt.rowSelect,   /* Everything but Internet Explorer (IE treats this rule as being tr.rowSelect) */
table#data  tbody tr.alt.rowSelect td,
table#data  tbody tr.rowSelect, /* All browsers */
table#data  tbody tr.rowSelect td {
        background-color:#2d76d0;
        color:#000 !important;
        }
		
table#data  tbody tr.alt.rowSelect a, table#data  tbody tr.rowSelect a {
background-color: #2d76d0;
color: #000;
}

table#data  tbody tr.alt.rowSelect a:hover, table#data  tbody tr.rowSelect a:hover {
text-decoration: underline;
color: #000;
}

table#data tr.rowSelect td.rowHover, table#data tr.rowSelect:hover td {
        background-color:#2d76d0;
        }
table#data tr.alt.rowSelect td.rowHover, table#data tr.alt.rowSelect:hover td {
        background-color:#2d76d0;
        }
table#data  tr.rowSelect td:hover, table#data tr.rowSelect td.currentCell {
        background-color:#2d76d0;
        }
table#data  tr.alt.rowSelect td:hover {  
background-color:#2d76d0;
        }

table.rowselect-rowSelect tbody td {
       /* cursor:crosshair; */
        }

		
/* ============== ================ =============  NAVigation =============== ================ ============================================================================================= */

li img {
border: none;
}


#topbar span.header img, #prodbar span.header img {
	position: relative;
	top: 10px;
}


div#topbar, div#prodbar {
	cursor: default;
	}

div.topweapon, div.toparmor, div.toptools, div.topitems, div.toprecipes, div.topabilities, div.topother, div.armor, div.tools, div.items, div.recipes, div.dowabilities, div.dohabilities, div.others {
	display: none;
}

span.topweapon:hover div table, span.toparmor:hover div table, span.toptools:hover div table, span.topitems:hover div table, span.toprecipes:hover div table, span.topabilities:hover div table, span.topother:hover div table {
	border-collapse:collapse;
	padding:0;
	margin:0;
}

span.topweapon:hover div td.menu, span.toparmor:hover div td.menu, span.toptools:hover div td.menu, span.topitems:hover div td.menu, span.toprecipes:hover div td.menu, span.topabilities:hover div td.menu, span.topother:hover div td.menu {
	padding:6px 6px 6px 0;
	background-color:#212121;
	border:1px solid black;
	border-radius:3px;	
}

span.topweapon:hover div, span.toparmor:hover div, span.toptools:hover div, span.topitems:hover div, span.toprecipes:hover div, span.topabilities:hover div, span.topother:hover div {
	display:block;
	position: fixed;
	font-size:1.0em;
	padding: 0px 0px 0px 0;
	z-index:100;
	top:0px; 
	margin-top:34px;
	
	box-shadow: 0 0px 8px #111;
	-webkit-box-shadow: 0 0px 8px #111;
	-moz-box-shadow: 0 0px 8px #111;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#000')";
}

span.topweapon:hover div ul, span.toparmor:hover div ul, span.toptools:hover div ul, span.topitems:hover div ul, span.toprecipes:hover div ul, span.topabilities:hover div ul, span.topother:hover div ul {
margin-top: -6px;
}

span.topweapon:hover div img, span.toparmor:hover div img, span.toptools:hover div img, span.topitems:hover div img, span.toprecipes:hover div img, span.topabilities:hover div img, span.topother:hover div img {
width: 32px;
}

span.topweapon:hover div li, span.toparmor:hover div li, span.toptools:hover div li, span.topitems:hover div li, span.toprecipes:hover div li, span.topabilities:hover div li, span.topother:hover div li { 
	list-style:none;
	text-align:left;
	margin-left:-22px;
}

/* individual topnav popup */

span.topweapon:hover div { 
	left:50%; 
	margin-left:-280px;
}	

span.toparmor:hover div { 
	left:50%; 
	margin-left:-210px;
}	

span.toptools:hover div { 
	left:50%; 
	margin-left:-86px;
}

span.topitems:hover div { 
	left:50%; 
	margin-left:26px;
}

span.toprecipes:hover div { 
	left:50%; 
	margin-left:110px;
}

span.topabilities:hover div { 
	left:50%; 
	margin-left:180px;
}

span.topother:hover div { 
	left:50%; 
	margin-left:320px;
}

table.topabilities td {
	vertical-align: top;
	width: 140px;
}

table.toparmor td {
	vertical-align: top;
	width: 130px;
}

div.topmenu {
margin-left: 200px;
}





div#prodbar {
	display: block;
	text-align:center;
	overflow:hidden;
	position: fixed;
	z-index: 10000;
	width: 100%;
	top: 0;
	height: 42px;
	background-color:#212121;
	box-shadow: 0 0px 8px #000;
	-webkit-box-shadow: 0 0px 8px #000;
	-moz-box-shadow: 0 0px 8px #000;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#000')";
}


#topbar {
	display: none;
	top: 0px; 
	text-align:center;
	overflow:hidden;
	z-index: 100;
	width: 100%;
	height: 42px;
	background-color:#212121;
	box-shadow: 0 0px 8px #000;
	-webkit-box-shadow: 0 0px 8px #000;
	-moz-box-shadow: 0 0px 8px #000;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#000')";
}

#sidebar {
    display: none;
}

.use-sidebar #sidebar {
    display: block;
	position: absolute;
}

.use-topbar #topbar {
    display: block;
}


.use-sidebar div#separator {
left: 250px;
}

div#separator {
	display: inline;
	position:relative;
	top:14px;
	left: -4px;
	z-index: 200;
	background-color: #252525;
	border-top-width:9px;
	border-right-width:9px;
	border-bottom-width:9px;
	border-left-width:0px;
	padding-left: 5px;
	-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/dark_low_border.png") 9 9 round;
	cursor: pointer;
}

div.pricebox {
	position: absolute;
	top: 1800px;
}



/* These apply to all the sidenav popups */

div.weapons, div.tools, div.items, div.recipes, div.dowabilities, div.dohabilities, div.others {
	display: none;
}

ul#weapons:hover div table, ul#tools:hover div table, ul#items:hover div table, ul#recipes:hover div table, ul#dowabilities:hover div table, ul#dohabilities:hover div table, ul#other:hover div table {
	border-collapse:collapse;
	padding:0;
	margin:0;
}

ul#weapons:hover div td.menu, ul#tools:hover div td.menu, ul#items:hover div td.menu, ul#recipes:hover div td.menu, ul#dowabilities:hover div td.menu, ul#dohabilities:hover div td.menu, ul#other:hover div td.menu {
	padding:6px 6px 6px 0;
	background-color:#212121;
	border:1px solid black;
	border-radius:3px;	
}


ul#weapons:hover div, ul#tools:hover div, ul#items:hover div, ul#recipes:hover div, ul#dowabilities:hover div, ul#dohabilities:hover div, ul#other:hover div {
	display:block;
	position: absolute;
	font-size:1.2em;
	padding: 40px 40px 40px 0;
	z-index:100;
}


/* side armor popup */

div.hey img, div.sidehead img, div.sidehands img, div.sidewaist img, div.sidebody img, div.sideneck img, div.sideear img, div.sideshield img, div.sidewrist img, div.sidefinger img, div.sideunderwear img, div.sidelegs img, div.sidefeet img {
	height: 0; 
	width: 0; 
	border-width: 0;
}

ul.hey:hover div.hey img {
	width: 350px;
	height: 425px;
	z-index:100;
}

div.sidehead, div.sidehands, div.sidewaist, div.sidebody, div.sideneck, div.sideear, div.sideshield, div.sidewrist, div.sidefinger, div.sideunderwear, div.sidelegs, div.sidefeet {
	position: absolute;
	top: 210px;
	left: 140px;
	z-index:100;
}

div.hey {
	position: absolute;
	top: 220px;
	left: 140px;
	z-index:50;
}


div.tophey img, div.tophead img, div.tophands img, div.topwaist img, div.topbody img, div.topneck img, div.topear img, div.topshield img, div.topwrist img, div.topfinger img, div.topunderwear img, div.toplegs img, div.topfeet img {
	height: 0; 
	width: 0; 
	border-width: 0;
}



span.toparmor:hover div.tophey img {
	width: 350px;
	height: 425px;
	z-index:100;
}


div.tophey {
	position: fixed;
	top: 34px;	
	left:50%;	
	margin-left: -290px;
	z-index:50;
	background-color:transparent;
	padding: 0;
}


div.tophead, div.tophands, div.topwaist, div.topbody, div.topneck, div.topear, div.topshield, div.topwrist, div.topfinger, div.topunderwear, div.toplegs, div.topfeet {
	position: fixed;
	top: 34px;	
	left:50%;	
	margin-left: -290px;
	z-index:100;
	background-color:transparent;
	padding: 0 ;	
}


div.hidden img {
	height: 0; 
	width: 0; 
	border-width: 0;
}

div.revealed img {
	width: 350px; 
	height: 425px;
	z-index:100;
}



/* Weapon sidenav popup */

ul#weapons:hover div { top:65px; left:120px; }	
td.weaponzoom { width: 44px; height: 275px; vertical-align:top; padding:0; }
td.weaponzoom img { width:44px; height: 275px; margin-top: 66px; }

/* Tool sidenav popup */

ul#tools:hover div{ top:360px; left:120px; }
td.toolzoom { width: 44px; height: 385px; text-align:center; padding:0; }
td.toolzoom img { width:44px; height: 385px; margin-top: 110px; }

/* Items sidenav popup */

ul#items:hover div{ top:500px; left:120px; }
td.itemzoom { width: 44px; height: 385px; text-align:center; padding:0; }
td.itemzoom img { width:44px; height: 385px; margin-top: 110px; }

/* Recipes sidenav popup */

ul#recipes:hover div{ top:676px; left:230px; }
ul#recipes:hover div td.menu li { width: 310px; }
td.recipezoom { width: 44px; height: 385px; text-align:center; padding:0; }
td.recipezoom img { width:44px; height: 295px; margin-top: 120px; }

/* DoW abilities sidenav popup */

ul#dowabilities:hover div{ top:890px; left:140px; }
td.dowabilitieszoom { width: 44px; height: 275px; text-align:center; padding:0; }
td.dowabilitieszoom img { width:44px; height: 275px; margin-top: 70px; }

/* DoH abilities sidenav popup */

ul#dohabilities:hover div{ top:972px; left:140px; }
td.dohabilitieszoom { width: 44px; height: 385px; text-align:center; padding:0; }
td.dohabilitieszoom img { width:44px; height: 385px; margin-top: 110px; }

/* Other stuff sidenav popup */

ul#other:hover div{ top:900px; left:120px; }
td.otherzoom { width: 44px; height: 385px; text-align:center; padding:0; }
td.otherzoom img { width:44px; height: 385px; margin-top: 110px; }

/* end all that sidenav popup nonsense */

ul.zoomed {
	margin: 10px 0 10px -10px;
}

ul.zoomed li:hover {
	background-color:#252525;
}

div.nav ul {
	list-style: none;
	margin-left: -32px;
}

div.nav ul li {
	margin-left:-5px;
}

img.moogle {
	position: absolute;
	top: 12px;
	left: 34px;
	z-index:0;
}


div.topmoogle {
	position:absolute;
	left:0;
	top:0;
	height: 60px;
	z-index: 1;
	float:right;
	}

.topmoogle td {
	background-image:url(../images/moogle.png);
	background-position:0px -70px;
	background-repeat:no-repeat;
	background-size:160px 179px;
	height: 38px;
	width: 156px;
	z-index: 1;
	}
	
.topmoogle table {
z-index: 1;

}

form.topform {
	position: absolute;
	z-index: 99999999;
	top: 14px;
	left: 50%;
	margin-left: -480px;

}

div.nav {
	float:left;
	margin-left:2px;
}


.green, div.nav .green a, li.green a {
	color: #c7d02d;
}

.red, .red a {
	color: #d0352d;
}

.truegreen, .truegreen a {
color:#53d02d;
}

.gray, .gray a {
color:#818181;
}

.blue, .blue a {
color:#2d76d0;
}

.teal, .teal a {
color:#2dbfd0;
}

.yellow, .yellow a {
color:#ced02c;
}

.orange, .orange a {
color:#e78a26;
}

.purple, .purple a {
color:#bc26e7;
}

.white, .white a {
color:#cecece;
}

.default, .default a {
color:#8496ac;
}

div.nav a {
	color: #8496ac;
}

table.nav {
	border-width:9px;
	-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
	-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
	-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
	border-image:url("../images/interface/dark_low_border.png") 9 9 round;
	background-color: #252525;
}

ul.list li:hover {
	background-color:#191919;
}

.sidesearch {
	margin-top: 10px;
}

span.header  {
	font-weight: 600;
	font-size: 1.1em;
	color: #2d76d0;
	line-height:22px;
}	

/* this makes the nav icons a little offset to match the headers */
div.nav li.liOpen img {
	position: relative;
	top: 10px;
}

ul#recipes li {
	width:225px;
}

ul.list {
	font-weight: 300;
	font-size: .9em;
	width: 200px;
}

ul.list li {
	list-style: none;
	padding-left:30px;
}


a.tooltip {
	text-decoration:none;
	cursor:help;
}

td.togglecss {
	width: 300px;
	font-weight: 600;
	font-size: .9em;
	padding: 0 0 0 4px;
}






/* ====== ================ ====== Forms ====== ================ ====== */

//what is this?
label {
vertical-align: middle;
}


td.searchbox {
width: 300px;
border-width:9px;
-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
border-image:url("../images/interface/dark_low_border.png") 9 9 round;
background-color: #252525;
vertical-align: middle;
margin: 50px 0 0 0px;
	padding: 4px 0 0 8px;
	z-index: 10001;
}

input.searchbox {
border: 1px solid #8496ac;
border-radius:3px;
background-color:#191919;
color: #8496ac;
font-family: verdana, arial,sans-serif;
z-index: 10001;
}

input.submitbutton {
border: 1px solid #8496ac;
	border-radius:3px;
background-color:#212121;
color: #8496ac;
}


th#fdFilterInp input {
width: 30px;
}

.datatype-text input {
width: 30px;
}

/* ========= ================ ======= Show/hide columns checkboxes ========== ================ ======= */
table#showhide {
        padding: 0;
        margin: 0 auto 8px auto;
		width:600px;
        }

div.center {
	margin: 0 auto;
	display:block;
	width: 910px;
}
		
div#showhide {
		padding: 0;
		overflow: hidden;
		width: 600px;
		margin: 0 8px 0 0;
		float:left;
		}
		
table#showhide td {
	width:150px;
	}
/*
colors:

#191919 - background. The darkest blue
#252525 - next blue. Checkbox table backgrounds
#252525 - next blue
#252525 - light blue. Article table background
#252525 - lightest blue
#2d76d0    - pink

Text and borders are black
*/




/* ========= ================ ======= ability colors ======== ================ ========= */




/* ======= ================ ========= autocomplete ========= ================ ======== */

div.autocomplete {
  position:absolute;
  width:250px;
  border:1px solid #888;
	border-radius:3px;
  margin:0;
  padding:0;
}

div.autocomplete ul {
  list-style-type:none;
  margin:0;
  padding:0;
}

div.autocomplete ul li.selected { 
background-color: #dce3d4;
}

div.autocomplete ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  height:32px;
  cursor:pointer;
}


.ac_results {
	padding: 0px;
	border: 1px solid black;
	border-radius:3px;
	background-color: #252525;
	overflow: hidden;
	z-index: 99999;
       font-family: verdana, arial,sans-serif;
	
}

.ac_results ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ac_results li {
	margin: 0px;
	padding: 2px 5px;
	cursor: default;
	display: block;
	/* 
	if width will be 100% horizontal scrollbar will apear 
	when scroll mode will be used
	*/
	/*width: 100%;*/
	font: menu;
	font-size: 12px;
	/* 
	it is very important, if line-height not setted or setted 
	in relative units scroll will be broken in firefox
	*/
	line-height: 16px;
	overflow: hidden;
}

.ac_loading {
	background: white url('indicator.gif') right center no-repeat;
}

.ac_odd {
	background-color: #232323;
}

.ac_over {
	background-color: #212121;
	color: #2d76d0;
}

table.checkboxes {
	background-color: #252525;
border-width:9px;
-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
border-image:url("../images/interface/dark_low_border.png") 9 9 round;
background-color: #252525;
}

/*  ======= ================ ========= Pagination list styles ======== ================ ========  */
ul.fdtablePaginater
        {
        display:block;
        list-style:none;
        padding:auto;
        text-align:center;
        margin:6px 0 6px 20%;
        }
ul.fdtablePaginater li
        {
        display:table-cell;
        padding:0 1px;
        color:#666;
        list-style:none;
        
        -moz-user-select:none;
        -khtml-user-select:none;
        }
ul.fdtablePaginater li a.currentPage
        {
        border-color:#000 !important;
        color:#000;
        }
ul.fdtablePaginater li a:active
        {
        border-color:#222 !important;
        color:#222;
        }
ul.fdtablePaginater li a,
ul.fdtablePaginater li div
        {
        display:block;
        width:2em;
        font-size:1em;
        color:#666;
        padding:0;
        margin:0;
        text-decoration:none;
        outline:none;
        border:1px solid #666;
        }
ul.fdtablePaginater li div
        {
        cursor:normal;
        opacity:.5;
        filter:alpha(opacity=50);
        }
ul.fdtablePaginater li a span,
ul.fdtablePaginater li div span
        {
        display:block;
        line-height:2em;
        border:0px solid #fff;
		background-color: #252525;
        /* background:#fff url(../images/gradient.gif) repeat-x 0 -20px; */
        }
ul.fdtablePaginater li a
        {
        cursor:pointer;
        }
ul.fdtablePaginater li a:focus
        {
        color:#333;
        text-decoration:none;
        border-color:#fff;
        }
.fdtablePaginaterWrap
        {
        text-align:center;
        clear:both;
        text-decoration:none;
        }
ul.fdtablePaginater li .next-page span,
ul.fdtablePaginater li .previous-page span,
ul.fdtablePaginater li .first-page span,
ul.fdtablePaginater li .last-page span
        {
        font-weight:bold !important;
        }
/* Keep the table columns an equal size during pagination */
td.sized1
        {
        width:1em;
        text-align:left;
        }
td.sized2
        {
        width:1em;
        text-align:left;
        }
td.sized3
        {
        width:1em;
        text-align:left;
        }
tfoot td
        {
        text-align:right;
        font-weight:bold;
        text-transform:uppercase;
        letter-spacing:1px;
        }
#visibleTotal
        {
        text-align:center;
        letter-spacing:auto;
        }
* html ul.fdtablePaginater li div span,
* html ul.fdtablePaginater li div span
        {
        background:#eee;
        }
tr.invisibleRow
        {
        display:none;
        visibility:hidden;
        }
p.paginationText
        {
        font-style:oblique;
        }

tr.old a {
color:#522;
}	

tr.old td {
color:#522;
}



table#data td.reqlev {
background-image:url('../images/req.png');
background-repeat:no-repeat;
background-position:5px 50%;
text-align:right;
}

table#data td.optlev {
background-image:url('../images/opt.png');
background-repeat:no-repeat;
background-position:5px 50%;
text-align:right;
}



/* ------------ ================ ----------- maps ------------ ================ ---------- */

div.map {
background-color: #252525;
width:798px;
height:800px;
margin:auto;
border:1px solid black;
border-radius:3px;
overflow: hidden;
}

div#thanalan {
overflow: hidden;
}

.olControlMousePosition, .olControlNoSelect {
color:#000;
text-shadow: 0 0 2px #fff;
font-weight:600;
}


/* ----------- ================ ------------ qtip ------------ ================ ---------- */

.ui-tooltip-wiki{
   max-width: 840px;
}
 
   .ui-tooltip-wiki .ui-tooltip-content{
      padding: 10px;
      
      line-height: 12.5px;
   }
 
   .ui-tooltip-wiki h1{
      margin: 0 0 7px;
 
      font-size: 1.5em;
      line-height: 1em;
   }
 
   .ui-tooltip-wiki img{ padding: 0 10px 0 0; }
   
   .ui-tooltip-wiki p{ margin-bottom: 9px; }
   .ui-tooltip-wiki .note{ margin-bottom: 0; font-style: italic; color: #888; }
   
button.location {
background-color:transparent;
border:none;
font-weight:bold;
text-decoration:underline;
}

a.tooltip {
text-decoration:underline;
}

/*
#191919 - background. The darkest grey
#252525 - next grey
#2d76d0 - blue
#8496ac - Text and borders

#d0352d - required/negative red
#c7d02d - optimal/favored green


/* Core qTip styles */
.ui-tooltip, .qtip{
	position: absolute;
	left: -28000px;
	top: -28000px;
	display: none;

	max-width: 680px;
	min-width: 50px;
	
	font-size: 10.5px;
	line-height: 12px;

	z-index: 15000;
}

	/* Fluid class for determining actual width in IE */
	.ui-tooltip-fluid{
		display: block;
		visibility: hidden;
		position: static !important;
		float: left !important;
	}

	.ui-tooltip-content{
		position: relative;
		padding: 5px 9px;
		overflow: hidden;
		
		border-width: 1px;
		border-style: solid;
		
		text-align: left;
		word-wrap: break-word;
		overflow: hidden;
	}

	.ui-tooltip-titlebar{
		position: relative;
		min-height: 14px;
		padding: 5px 35px 5px 10px;
		overflow: hidden;
		
		border-width: 1px 1px 0;
		border-style: solid;

		font-weight: bold;
	}

	.ui-tooltip-titlebar + .ui-tooltip-content{ border-top-width: 0px !important; }

		/*! Default close button class */
		.ui-tooltip-titlebar .ui-state-default{
			position: absolute;
			right: 4px;
			top: 50%;
			margin-top: -9px;

			cursor: pointer;
			outline: none;

			border: 0px solid black;
		}
		
		* html .ui-tooltip-titlebar .ui-state-default{ top: 16px; } /* IE fix */

		.ui-tooltip-titlebar .ui-icon,
		.ui-tooltip-icon .ui-icon{
			display: block;
			text-indent: -1000em;
		}

		.ui-tooltip-icon, .ui-tooltip-icon .ui-icon{
		//	-moz-border-radius: 3px;
		//	-webkit-border-radius: 3px;
		//	border-radius: 3px;
		}

			.ui-tooltip-icon .ui-icon{
				width: 14px;
				height: 14px;
border: 1px solid black;
				text-align: center;
				text-indent: 0;
				font: normal bold 10px/13px Tahoma,sans-serif;
				
				color: black;
				background-color:#8496ac;
			}


/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
.ui-tooltip-focus{

}

/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
.ui-tooltip-hover{
	
}


/*! Default tooltip style */
.ui-tooltip-default .ui-tooltip-titlebar,
.ui-tooltip-default .ui-tooltip-content{
	border-color: #8496ac;
	border-radius:3px;
	background-color: #191919;
	color: #8496ac;
	box-shadow: 0px 0px 5px #111;
}

/*! Image tooltip style */
.ui-tooltip-image .ui-tooltip-titlebar,
.ui-tooltip-image .ui-tooltip-content{
	border: 0px;
	background-color: transparent;
	color: #000;
}

	.ui-tooltip-default .ui-tooltip-titlebar{
		background-color: #252525;
	}

	.ui-tooltip-default .ui-tooltip-icon{
		border-color: #CCC;
		background: #F1F1F1;
		color: #777;
	}
	
	.ui-tooltip-default .ui-tooltip-titlebar .ui-state-hover{
		border-color: #AAA;
		color: #111;
	}

/* Tips plugin */
.ui-tooltip .ui-tooltip-tip{
	margin: 0 auto;
	overflow: hidden;

	background: transparent !important;
	border: 0px dashed transparent !important;
	z-index: 10;
}

	.ui-tooltip .ui-tooltip-tip,
	.ui-tooltip .ui-tooltip-tip *{
		position: absolute;
		
		line-height: 0.1px !important;
		font-size: 0.1px !important;
		color: #123456;

		background: transparent;
		border: 0px dashed transparent;
	}
	
	.ui-tooltip .ui-tooltip-tip canvas{ top: 0; left: 0; }




/* ============== ================ ============= Mob location tool =============== ================ ============== */

a.gatherpops {

}

div.popups {
border: 1px solid black;
background-color: #191919;
border-top-left-radius:5px;
border-bottom-left-radius:5px;
border-bottom-right-radius:5px;
}

table.popups th {
align: center;
font-size:16px;
font-weight:600;
}

#OpenLayers.Control.MousePosition_119 {
display:none
}

table.popups td p {
font-weight:600;
color:8496ac;
}

table.popups td.img {
border-width:9px;
-moz-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Firefox */
-webkit-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Safari and Chrome */
-o-border-image:url("../images/interface/dark_low_border.png") 9 9 round; /* Opera */
border-image:url("../images/interface/dark_low_border.png") 9 9 round;
background-color: #252525;
width:122px;
}

p.aggro {
margin: -2px 0 -10px 0;
}

.olPopupCloseBox {
  background-attachment:initial;
  background-clip:initial;
  background-color:initial;
  background-image:url(../images/maps/close.gif);
  background-origin:initial;
  background-position:initial initial;
  background-repeat:no-repeat no-repeat;
  cursor:pointer;
}


div.entryadds {
margin: 0 auto;
width: 806px;
display: block;
}

.entryadds td {
vertical-align: top;
}

/* -------------------------------------------------------- mob entries ---------------------------------------*/


div.mobphoto {
float:left;
width: 280px;
}


table.adoptedby {
border-collapse:collapse;
margin:0;
padding:0;
width:100%;
}



table.addinfo input, select {
background-color:#151515;
color:#8496ac;
border:1px solid #8496ac;
border-radius:3px;
}

table.addinfo td {
vertical-align:top;
width:250px;
background-color: #252525;
padding: 14px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}

td.labels {
text-align:right;
width:300px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}

table.addinfo {
border-collapse: collapse;
margin-top:12px;
}

table.addinfo img {
border:1px solid black;
border-radius:5px;
}

div.moblinks {
height:120px;
width:502px;
overflow:scroll;
background-color: #151515;
border-radius:5px;
overflow-x:hidden;
padding:0 52px;
resize:vertical;
}

.moblinks p {
text-align:center;
font-weight:600;
}

div.middleml {
margin:auto;
width:200px;
text-align:left;
}

div.middleml a {
color: #2d76d0;
}

/* -------------------------------------------------------- ad space ---------------------------------------*/

div.homesidebarad {
text-align: center;
}

.doublesidebarads img {
border: 1px solid black;
}

a.homesidebanner01 img {
border: 0px;
}

div.topbanner {
text-align: center;
}

div.content {
clear:both;
}





/* -------------------------------------------------------- jq ui ---------------------------------------*/

div#tabs {
width: 800px;
margin: 20px auto;
}

/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; }
.ui-helper-clearfix:after { clear: both; }
.ui-helper-clearfix { zoom: 1; }
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


/* workarounds */
* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */

.ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 0; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }

/* Component containers
----------------------------------*/
.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/;  }

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; }
.ui-widget-content { border: 1px solid #333/*{borderColorContent}*/; background: #252525/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #aaa/*{fcContent}*/; }
.ui-widget-content a { color: #aaa/*{fcContent}*/; }
.ui-widget-header { border: 1px solid #333/*{borderColorHeader}*/; background: #212121/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #aaa/*{fcHeader}*/; font-weight: bold; }
.ui-widget-header a { color: #aaa/*{fcHeader}*/; }

/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #333/*{borderColorDefault}*/; background: #212121/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #aaa/*{fcDefault}*/; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #aaa/*{fcDefault}*/; text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #444/*{borderColorHover}*/; background: #212121/*{bgColorHover}*/ url(images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #fff/*{fcHover}*/; }
.ui-state-hover a, .ui-state-hover a:hover { color: #fff/*{fcHover}*/; text-decoration: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #333/*{borderColorActive}*/; background: #252525/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #fff/*{fcActive}*/; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #fff/*{fcActive}*/; text-decoration: none; }
.ui-widget :active { outline: none; }



/* Corner radius */
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -khtml-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; -khtml-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }

/* Overlays */
.ui-widget-overlay { background: #151515/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; }
.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #151515/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; }