/*
 * Project Name: MiniManager for Trinity Server
 * Date: 17.10.2006 inital version (0.0.1a)
 * Author: SixSixNine
 * Copyright: SixSixNine
 * Email: *****
 * License: GNU General Public License (GPL)
 */
html{
	overflow-x:auto;	/* fixes MSIE scrollbar bug DO NOT REMOVE,has no effect in Mozilla,or Opera */
						/* https://www.blooberry.com/indexdot/css/properties/position/overflowx.htm */
}
html,body{
	background-color:#0a1324;
        background-image: url(background.jpg);
	height:100%;
	padding:0; /* required for Opera to have 0 margin */
	margin:0;
	font:11pt Verdana,sans-serif;
	cursor:default;
}

a:link, a:visited{ color: #87cfff; text-decoration: none }
a:hover, a:focus{ color: #20b2f6; text-decoration: none }


/*********** MENU BAR***********/

#menubar{

    position:absolute;

    left:20px;
    bottom:10px;

    z-index:200;
}

#menubar a:hover{

    background:rgba(32,148,246,.8);

    box-shadow:0 0 10px #87cfff;

    color:#fff;
}

}
#menuwrapper {
	font:11pt Verdana,sans-serif;
}
#menubar, #menubar ul {
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 160%;
}

#menubar a{

    background:rgba(20,40,70,.65);

    color:#fff;

    padding:8px 15px;

    border:1px solid rgba(255,255,255,.15);

    border-radius:5px;

    text-shadow:0 0 5px #000;

    margin-right:4px;
}

#menubar a.trigger {
	padding: 5px 15px 5px 15px;
}
#menubar li {
	float: left;
	width: 9em;
}
#menubar li {position: relative;}
/* hide from IE mac \*/
#menubar li {position: static; width: auto;}
/* end hiding from IE5 mac */
#menubar li ul, #menubar ul li  {
	width: 11em; /*submenu len*/
}

#menubar ul li a {

    display:block;

    color:#dcecff;

    background:#1b2433;

    border:none;

    padding:8px 14px;

    text-shadow:none;
}

#menubar li ul {

    position:absolute;
    display:none;

    background:#1b2433;

    border:1px solid #365679;

    border-radius:4px;

    box-shadow:
        0 8px 20px rgba(0,0,0,.6);

    overflow:hidden;
}
#menubar li:hover a, #menubar a:focus,
#menubar a:active, #menubar li.hvr a {
	color: #000000; /*menu selected text color*/
	background-color: #cefbff; /*menu selected bg color*/
}
#menubar li:hover ul, #menubar li.hvr ul {
	display: block;
}
#menubar li:hover ul a, #menubar li.hvr ul a {
	color: #000000; /*submenu text color*/
	background-color: transparent;
}

#menubar ul a:hover {

    background:#365679 !important;

    color:#ffffff !important;
}
/*********** MENU BAR END***********/

#username{

    position:absolute;

    right:20px;
    bottom:12px;

    z-index:200;

    background:rgba(0,0,0,.45);

    padding:8px 15px;

    border-radius:5px;

    border:1px solid rgba(255,255,255,.15);

    color:#fff;

    text-shadow:0 0 5px #000;
}

}
#version {
	position:absolute;
	left:48%;
	top:122px;
	z-index:10;
	color:#87cfff;
	font:8pt Verdana,sans-serif;
}
h1{
    margin:0;
    font:16pt Trebuchet MS,sans-serif;
    font-weight:bold;
    color:#e9e6e6;
	line-height:1.2em;
}

form {
   margin: 0;
}
input, input.mouseover, a.button {
	border: 1px solid #565656;
	background:#2a2a2a;
	font: 10pt Verdana,sans-serif;
	font-weight: bold;
	line-height:100%;
}

input {
    background:#93b3bf;
    color:#000000;
    padding:2px 1px;
	margin-right: 2px;
	margin-left: 2px;
}
input[type="text"],input[type="password"]{
	background:#a2a2a2;
}
input[type="text"]:hover, input[type="password"]:hover {
    background:#ffffff;
	border-color:#000;
	cursor: default;
}
input[type="text"]:focus,input[type="password"]:focus {
	background:#93b3bf;
	border-color:#87cfff;
}
input[type="radio"],input[type="checkbox"]{
	background:none;
	border:0;
}
select,textarea{
	color:#000000;
	border:1px solid #565656;
	background-color: #93b3bf;
	}
img {
	border: 0;
	padding: 0;
}
a.button {

    background:
        linear-gradient(
            #354b63,
            #223247
        );

    border:1px solid #4f79a6;

    color:#e6f2ff;

    text-shadow:
        0 1px 2px #000;

    border-radius:4px;

    padding:6px 12px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.1),
        0 1px 3px rgba(0,0,0,.4);
}

a.button:visited{   
	background-color: #93b3bf; 
	color: #000000;
}

a.button:hover {

    background:
        linear-gradient(
            #4f79a6,
            #365679
        );

    color:#ffffff;

    box-shadow:
        0 0 10px rgba(120,190,255,.5);
}

a[type="wrn"].button {

    background:
        linear-gradient(
            #6b2d2d,
            #4c1c1c
        );

    border:1px solid #a54d4d;
}

a.button:active, a.button:focus {   
	border-color: #76827B;
}
a[type="wrn"].button:hover{
	background-color:#4a1a1a;
	background-image:url(../../img/sml_warn.png);
	background-repeat:no-repeat;
	background-position: 99% 1px;
}
a[type="def"].button:hover{
	background-color:#1a4a1a;
	background-image:url(../../img/sml_tick.png);
	background-repeat:no-repeat;
	background-position: 99% 1px;
}

fieldset,
table.flat,
div.bubble {

    background:#1d2733;

    border:1px solid #4a6a7d;

    color:#d8e8f5;
}

fieldset.half_frame{
	width: 550px;
}
fieldset.tquarter_frame{
	width: 680px;
}
fieldset.full_frame{
	width: 760px;
}
legend{
	margin-top:-5px;
	color: #ffffff;
	background-color: #1b2433;
	padding: 2px 6px;
	position:absolute;
	top: -5px;
	left: 5px;
}

/*****TABLES******/

.table_top {
	width: 1024px;
	height: 380px;
	position:relative;
	position:relative;

	border-collapse: collapse;
	border: 0;

	margin: 0 auto;

	background:
	linear-gradient(
		rgba(0,0,0,.15),
		rgba(0,0,0,.60)
	),
	url("header_wotlk.jpg");

	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;

	border: 1px solid #4f7da3;

	box-shadow:
		0 0 20px rgba(32,148,246,.5),
		inset 0 0 60px rgba(0,0,0,.5);
}

.table_top_left,
.table_top_middle,
.table_top_right {
	background:none;
	width:auto;
}
table.flat {
	border-width: 5px;
	border-spacing: 5px;
	border-style: none;
	border-collapse: collapse;
	background-color: #1b2433;
	text-align: left;
}
table.flat td {
	padding: 5px;
}
table.hidden {
	border-width: 0;
	border-spacing: 0;
	border-style: none;
	border-collapse: collapse;
	text-align: center;
}
table.top_hidden {
	width: 770px;
	border: 0 none #d4ddd8;
	border-spacing: 0;
	border-collapse: collapse;
	text-align: left;
}
table.top_hidden td, table.hidden td {
	padding: 4px 0;
}
table.lined {
	width: 770px;
	border-collapse: collapse;
	text-align: center;
}

table.lined, table.lined td, table.lined td.head, table.lined td.hidden{
	border-bottom: 1px solid  #1b2433;
	border-top: 1px solid  #1b2433;
	padding: 5px;
}
table.lined, table.lined tr, table.lined tr.hidden{
	border-left: 1px solid  #1b2433;
	border-right: 1px solid  #1b2433;
}
table.lined tr th{
	background-color: #30465e;
	font-weight: bold;
	font-size: 11px;
	color:#87cfff;
	padding: 5px;
}
table.lined td.hidden {
	background-color: transparent;
}
table.lined td{
	background-color: #ffffff;
}
tr td div.gradient_p,div.gradient_pp{
	float: left;
	clear: right;
	display: table-cell;
	text-align: right;
	padding: 1px 5px;
}
tr td div.gradient_p{
	background-color:#30465e;color:#ffffff;
	text-shadow:0 0 8px #2094f6ee
	width: 120px;
}
tr td div.gradient_pp{
	background-color:#1b2433;
	width: 70px;
}
img.bag_icon {
	float: left;
	width: 24px; 
	height: 24px;
	border: 1px solid #585858;
	margin-left: 5px;
}

tr td.bag div,
tr td.bank div {
	position: relative;
	border: 0;
	margin: 2px;
	background-image: url(../../img/INV/Slot_Bag.gif);
	background-repeat: repeat;
	background-color: #242424;
}
tr td.bank div {
	background-image: url(../../img/INV/Slot_Bank.gif);
	background-color: #858585;
}
tr td.bag div div,
tr td.bank div div{
	position: absolute;
	background: none;
}
tr td.bag div div img,
tr td.bank div div img{
	border: 0;
	padding: 1px;
	width: 35px; 
	height: 35px;
}
tr td.bag div.no_slot,
tr td.bank div.no_slot{
	position: absolute;
	margin: 0;
	width: 86px;
	height: 41px;
	background-image: url(../../img/INV/Slot_Bag_Out.gif);
}
tr td.bank div.no_slot{
	background-image: url(../../img/INV/Slot_Bank_Out.gif);
}

tr th a{
	padding-right:10px;
	background-repeat:no-repeat;
}
tr th a.ASC{
	background-image: url(../../img/arr_up.gif);
	background-position: 100% 2px;
}
tr th a.DESC{
	background-image: url(../../img/arr_dw.gif);
	background-position: 100% 6px;
}
/*****TABLES END******/

body{

    background:
        url(background.jpg)
        fixed
        center top
        no-repeat;

    background-size:cover;

    color:#d8e8f5;
}

#body_main {
    position:relative;
    width:95%;
    max-width:800px;
    margin:0 auto;
}

.error {
	color:#ffffff;
	text-shadow:0 0 8px #2094f6;
}
.bold {
	font:13pt Trebuchet MS,sans-serif;
	font-weight:bold;
}
.small {
	font-size: 8px;
}	
.large_bold {
	font-size: 13px;
	font-weight:bold;
}
.large {
	font-size: 13px;
}
.half_line {
	font-size: 12px;
	line-height:1.6em;
}
/*****BUBBLE******/
div.bubble {
	position:relative;
    padding:7px 0;
    background-color:#1b2433;
    margin-bottom:15px;
	text-align: left;
	border: 1px solid #565656;
}
div.bubble div.top {
	text-align: center;
	background-color:#253549;
	padding:7px 15px;
    margin:-7px -0px 12px -0px;
}
div.bubble div.top h1{
	color: #1a1a1a;
}
i.tl, i.tr, i.bl, i.br {
	position:absolute;
    width:4px;
    height:4px;
    overflow:hidden;
    z-index:30;
}
i.tl {
    top:0;
    left:0;
}
i.tr {
    top:0;
    right:0;
}
i.bl {
    bottom:0;
    left:0;
}
i.br {
    bottom:0;
    right:0;
}
/*****BUBBLE END******/

#body_buttom {
	font:8pt Verdana,sans-serif;
	text-align: center;
	color:#000000;
}

.table_buttom {
    background: #253549;
    border: 1px solid #565656;

    width:100%;
    max-width:800px;

    height:100px;

    margin:0 auto;
}

.table_buttom_left {
	width: 6px;
}
.table_buttom_middle {
	width: 784px;
}
.table_buttom_right {
	width: 6px;
}

#body_buttom a:link, #body_buttom a:visited {
    color:#006b92;
    text-decoration:none;
}
#body_buttom a:hover, #body_buttom a:focus {
    text-decoration:underline;
} 
.logo_border {
	border: 1px solid #565656;
	background-color: #1b2433;
	padding: 6px;
}

.icon_border_0 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_0.png)
}

.icon_border_1 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_1.png)
}

.icon_border_2 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_2.png)
}

.icon_border_3 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_3.png)
}

.icon_border_4 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_4.png)
}

.icon_border_5 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_5.png)
}

.icon_border_6 {
	border: 0;
	padding: 6px;
	width: 32px;
	height: 32px;
	background: url(../../img/INV/icon_border_6.png)
}

/*** graphs and bars ***/
.bargraph {
	font:9pt Verdana,sans-serif;
	border-collapse: collapse;
	width: 720px;
}
.bargraph td {
	padding:0;
	margin:0;
	vertical-align:bottom;
	text-align:center;
	background: url(gridline.gif) 15px bottom;
}

a.graph_link:link, a.graph_link:visited{ color: #87cfff; text-decoration: none }
a.graph_link:hover, a.graph_link:focus{ color: #20b2f6; text-decoration: none }

.bargraph img{
	display:block;
	border: 1px solid #000;
}

table.stat_hidden {
	width: 720px;
	border-spacing: 2px;
	border-collapse: collapse;
	text-align: left;
}

.tot_bar {
	width: 730px;
	border:1px solid #000000;
	padding:10px;
	border-collapse: collapse;
	text-align: center;
	font-weight: bold;
}
.tot_bar a:link, .tot_bar a:visited{ color: #000; text-decoration: none }
.tot_bar a:hover, .tot_bar a:focus{ color: #87cfff; text-decoration: none }

tr td.bar{
	width: 385px;
	background-repeat: no-repeat;
	background-position: -385px;
	padding: 1px;
}
tr td.bar span{
	float: left;
	width:55%;
	text-align:right;
	margin-top: 3px;
	color: #fff !important;
}
tr td.skill_bar{
	background-image: url(../../img/bar_skill.png);
}

.faction-bar{border:1px solid black;width:100%;text-align:left;height:16px;background:url('../../img/bar_empty.gif') repeat-x;position:relative}
span.rep-data{position:absolute;width:100%;text-align:center;color:white;text-decoration:none !important;white-space:nowrap}
.bar-color{width:100%;height:16px}
.rep7 .bar-color{background:url('../../img/bar_exalted.gif') repeat-x}
.rep6 .bar-color{background:url('../../img/bar_revered.gif') repeat-x}
.rep5 .bar-color{background:url('../../img/bar_honored.gif') repeat-x}
.rep4 .bar-color{background:url('../../img/bar_friendly.gif') repeat-x}
.rep3 .bar-color{background:url('../../img/bar_neutral.gif') repeat-x}
.rep2 .bar-color{background:url('../../img/bar_unfriendly.gif') repeat-x}
.rep1 .bar-color{background:url('../../img/bar_hostile.gif') repeat-x}
.rep0 .bar-color{background:url('../../img/bar_hated.gif') repeat-x}
tr td.rep7 {color:cyan}
tr td.rep6 {color:#00ffcc}
tr td.rep5 {color:#00ff88}
tr td.rep4 {color:lime}
tr td.rep3 {color:yellow}
tr td.rep2 {color:#ee6622}
tr td.rep1 {color:red}
tr td.rep0 {color:#cc2222}


/*** link tabs ***/

/*** link tabs ***/

#tab ul {
    margin:0;
    padding:0 20px;
    list-style:none;
    overflow:hidden;
}

#tab li {
    float:left;
    list-style:none;
    margin-right:2px;

    border:1px solid #385475;
    border-bottom:none;
}

#tab a {

    display:block;

    background:#233347;

    color:#a8d7ff;

    padding:10px 18px;

    text-decoration:none;
}

#tab a:hover {

    background:#2e4762;

    color:#ffffff;
}

#tab #selected {

    border-color:#4e82be;
}

#tab #selected a {

    background:#365679;

    color:#ffffff;

    font-weight:bold;
}

#tab_content {

    clear:both;

    background:#1b2433;

    border:1px solid #365679;

    padding:15px;
}

/*** Java layer tabs ***/
.jtabs {
	margin: 0;
	padding: 0 0 0 30px;
	list-style: none;
}
.jtabs li {
	float: left;
}
.jtabs a.jtab-disabled:hover, .jtabs a.jtab-active {
	background: #484848;
	border-bottom-color: #484848;
}
.jtabs a.jtab-disabled {
	background: #383838;
	border: 1px solid #565656;
	border-bottom-width: 0;
}
.jtabs a  {
	position: relative;
	top: -25px;
	background: #484848;
	font-weight: bold;
	padding: 1em 1.3em;
	border: 1px solid #d4d4d4;
	text-decoration:none;
}
.jtab-container {
	border: 1px solid #d4d4d4;
	background: #484848;
	width: 760px;
	clear: both;
}
.jtab-panes { margin: 3px }

/*** item tooltips***/
.answerbox {
	font-size: 11px;
	color: #d4d4d4;
	border:1px solid #70c7f0;
	padding:10px;
	width:auto;
	background-color:#000;
	text-align:center;
	filter:alpha(opacity=85);
	-moz-opacity:.85;
	opacity:0.85;
}
.answerbox th {
	font:16pt Trebuchet MS,sans-serif;
    font-weight:bold;
	color:#000000;
	line-height:1.2em;
}
.answerbox td a {
	float:none;
	display: block;
}

/* ===========================
   ICECROWN DARK THEME
   =========================== */

#body_main,
fieldset,
table.flat,
table.hidden,
table.top_hidden,
table.lined,
div.bubble {

    background:#182433 !important;
    color:#e5f0ff !important;
}

/* entêtes */
table.lined tr th,
div.bubble div.top {

    background:#223247 !important;
    color:#8fc9ff !important;
}

/* cellules */
table.lined td {

    background:#1d2b3c !important;
    color:#e5f0ff !important;
}

/* cadre principal */
table.lined,
fieldset,
div.bubble {

    border:1px solid #365679 !important;
}

/* texte principal */

body {

    color:#e5f0ff !important;
}

/* liens */

a {

    color:#8fc9ff !important;
}

a:hover {

    color:#ffffff !important;
}

/* statut royaume */

.large,
.large_bold,
.bold,
h1 {

    color:#dfeeff !important;
}

/* masquer le vert d'origine */

font[color="green"] {

    color:#8fc9ff !important;
}

font[color="green"] {
    color: #8fc9ff !important;
}

font[color="lime"] {
    color: #8fc9ff !important;
}

font[color="#00ff00"] {
    color: #8fc9ff !important;
}

/* Realm status */

#body_main h1,
#body_main h2,
#body_main h3,
#body_main b,
#body_main strong {

    color:#dcecff !important;

    text-shadow:
        0 0 6px rgba(100,180,255,.5);
}

#body_main {

    background:#141c28 !important;

    color:#dcecff !important;

    border:1px solid #304861 !important;
}

input[type="submit"],
input[type="button"],
input[type="reset"],
a.button {

    display:inline-block;

    min-width:70px;

    height:30px;
    line-height:30px;

    padding:0 12px;

    text-align:center;

    vertical-align:middle;

    background:
        linear-gradient(
            #365679,
            #223247
        ) !important;

    border:1px solid #4f79a6;

    border-radius:4px;

    color:#e6f2ff !important;

    font-weight:bold;

    text-shadow:0 1px 2px #000;

    box-sizing:border-box;
}


#body_buttom a.button {
    display:none !important;
}

font[color],
font {

    color:#9fd4ff !important;
}


.realm-status {

    font-family:"Segoe UI", sans-serif;

    font-size:17px;

    font-weight:600;

    color:#dcecff;

    letter-spacing:0.5px;
}

.realm-status em {

    color:#7fc8ff;

    font-style:normal;

    font-weight:bold;
}

.realm-online {

    text-align:center;

    font-size:18px;

    font-weight:bold;

    color:#9fd4ff;

    margin:15px 0;
}

.realm-db {

    text-align:center;

    font-size:14px;

    color:#9fd4ff;

    margin-bottom:20px;
}

#body_main {
    position:relative !important;
    left:auto !important;
    margin:0 auto !important;
    top:0 !important;
}

/* Responsive mobile */

@media (max-width: 1024px) {

    .table_top,
    #body_main,
    .table_buttom,
    table.lined,
    table.flat,
    table.hidden {

        width:95% !important;
        max-width:95% !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    body {

        overflow-x:hidden;
    }
}

/* Mobile */

@media (max-width: 768px) {

    body {
        overflow-x: hidden;
    }

    #body_main,
    .table_top,
    .table_buttom,
    table.lined,
    table.hidden,
    table.flat {

        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box;
    }

    blockquote {
        margin: 10px !important;
    }

    table.lined {
        display: block;
        overflow-x: auto;
    }

@media screen and (max-width: 768px) {

    #body_main {
        width:98%;
        max-width:98%;
        padding:0 5px;
        box-sizing:border-box;
    }

    table.lined {
        width:100% !important;
        max-width:100% !important;
        display:block;
        overflow-x:auto;
        box-sizing:border-box;
    }

    blockquote {
        margin:10px;
        padding:0;
    }
}

blockquote img {
    max-width:100%;
    height:auto;
}

/* Centrage des images du MOTD */

blockquote {
    text-align:center;
}


@media screen and (max-width:768px) {

    blockquote {
        text-align:center !important;
    }

    blockquote img {

        display:block !important;

        max-width:100% !important;
        width:auto !important;
        height:auto !important;

        margin:10px auto !important;
    }
}

@media screen and (max-width:768px) {

    blockquote a {

        display:block;
        text-align:center;
    }

    blockquote a img {

        display:block !important;

        margin:10px auto !important;

        max-width:100% !important;
    }
}