@charset "utf-8";

/* "#0066FF" = Blue */

a:link    {color: #808080; font-size: .95em; font-weight: normal; font-style: italic; text-decoration: none; font-family: Verdana, Helvetica, sans-serif;}
a:visited {color: #808080; font-size: .95em; font-weight: normal; font-style: italic; text-decoration: none; font-family: Verdana, Helvetica, sans-serif;}
a:hover   {color: #C08000; font-size: .95em; font-weight: normal; font-style: italic; text-decoration: none; font-family: Verdana, Helvetica, sans-serif;}
a:active  {color: #C08000; font-size: .95em; font-weight: normal; font-style: italic; text-decoration: none; font-family: Verdana, Helvetica, sans-serif;}
a:focus   {color: #C08000; font-size: .95em; font-weight: normal; font-style: italic; text-decoration: none; font-family: Verdana, Helvetica, sans-serif;}

/* ### Site ### */

body {
  margin: 0;
  background: #101010;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
}

table {
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  padding: 0;
  border: 0;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
}

img {
  padding: 0;
  margin: 0;
  border: 0;
}

#tooltip {
  border: 1px solid #FB5605;
  background: #252525;
  color: #BBBBBB;
  padding: 10px;
  margin: 0;
  z-index: 10;
}

#export {
  border: 1px solid #FB5605;
  background: #252525;
  color: #BBBBBB;
  padding: 10px;
  margin: 0;
  z-index: 10;
}

/* ### Header ### */

#header {
  margin-left: auto;
  margin-right: auto;
  padding: 10px 0px 10px 0px;
  width: 1000px;
  text-align: center;
  margin-bottom: 5px;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  z-index: 1;
}

/* ### footer ### */
  
#footer {
  clear: both;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
  border-top: 1px solid #C0C0C0;
  width: 1000px;
  padding: 10px 0px;
  text-align: left;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  z-index: 1;
}

#footer .left{
  text-align: left;
  float: left;
}

#footer .right{
  text-align: right;
}

/* ### Navigation ### */

#navcontainer {
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
  height: 30px;
  background: #252525;
  border-bottom: 1px solid #C0C0C0;
  vertical-align: bottom;
  margin-bottom: 0;
  padding: 0;
}

#navcontainer .navi {
  position: relative;
  text-align: left;
  margin-bottom: 0px;
  padding: 0;
}

#navcontainer .navilist {
  margin: 0;
  padding: 0;
  list-style:none;
  display: block;
  vertical-align: bottom;
}

#navcontainer .navilist li {
  width: 90px;
  text-align: center;
  list-style: none;
  float: left;
  padding-right: 10px;
}

#navcontainer .navi a, .navilist li.extend {
  height: 100%;
  margin: 0px;
  display: block;
  border-bottom: 1px solid #C0C0C0;
  padding: 8px 10px 8px 10px;
  text-decoration: none;
  background: #252525;
  font: normal .8em verdana, serif;
}

#navcontainer .navi a:hover, #navcontainer .navi a.active {
  background:#252525 none repeat scroll 0%;
  border-color:#C0C0C0;
  border-bottom:#252525;
  border-style:solid;
  border-width:1px;
  color: #C08000;
  padding: 15px 9px 10px 9px;
  margin: -10px 0px 0px 0px;
}

#navcontainer .navi a.active {
  padding: 15px 9px 10px 9px;
  background: #252525;
  border-bottom: 1px solid #252525;
  font-weight: bold;
}

#second_navcontainer {
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
  height: 30px;
  text-align: right;
  vertical-align: top;
  margin-top: 0;
  padding: 0;
}

#second_navcontainer .navi {
  margin: 0;
  padding: 0;
  height: 30px;
  list-style:none;
  display: block;
  vertical-align: bottom;
}

#second_navcontainer .navi li {
  width: 94px;
  text-align: center;
  list-style: none;
  float: right;
  padding-left: 8px;
}

#second_navcontainer .navi .last {
  width: 100px;
  text-align: center;
  list-style: none;
  float: right;
  padding: 0;
  background: #252525;
}

#second_navcontainer a, #second_navcontainer .navi li.extend {
  height: 100%;
  margin-top: -1px;
  display: block;
  border: 1px solid #C0C0C0;
  border-top: 1px solid #252525;
  padding: 4px 10px 4px 10px;
  text-decoration: none;
  background: #252525;
  font: normal .8em verdana, serif;
}

#second_navcontainer a:hover, #second_navcontainer a.active {
  background: #252525;
  border-color: #C0C0C0;
  border-top: #252525;
  border-style: solid;
  border-width: 1px;
  color: #C08000;
  padding: 9px 9px 8px 9px;
  margin: -1px 0px -10px 0px;
}

#second_navcontainer a.active {
  padding: 9px 9px 8px 9px;
  background: #252525;
  border-top: 1px solid #252525;
  font-weight: bold;
}

#welcome {
  position: relative;
  float: right;
  margin-top: 0px;
  padding-top: 5px;
  padding-right: 5px;
}

#navigationimg {
  position: relative;
  float: right;
  border: 0px none;
  vertical-align: bottom;
  padding-top: 3px;
  padding-right: 5px;
}

#navigationimg img {
  width: 25px;
  height: 25px;
  border: 0px none;
  vertical-align: bottom;
}

.user {
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #0066FF;
  font-family: Verdana, Helvetica, sans-serif;
}

/* ### main ### */

#main {
  margin: 50px  auto 50px auto;
  padding: 10px 0px 10px 0px;
  width: 1000px;
  text-align: left;
  border-width: 1px;
  border-style: none;
  border-color: black;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  z-index: 1;
}

.window {
  margin: 5px  auto 5px auto;
  padding: 30px 30px 30px 30px;
  width: 800px;
  height: 100%;
  color: #BBBBBB;
  background: #252525;
}

.window_large {
  margin: 5px  auto 5px auto;
  padding: 30px 30px 30px 30px;
  width: 940px;
  height: 100%;
  color: #BBBBBB;
  text-align: center;
  background: #252525;
}

.window_large p {
  text-align: justify;
}

.window hr{
  margin: 0;
  padding: 0;
  text-align: left;
  width: 550px;
  color: #BBBBBB;
}

h1{
  padding-top: 10px;
  font-size: 1.2em;
  font-weight: bold;
  font-family: Verdana, Helvetica, sans-serif;
}

h2 {
  height: 40px;
  padding-top: 17px;
  font-size: 1.1em;
  font-weight: bold;
  font-family: Verdana, Helvetica, sans-serif;
  background-repeat: no-repeat;
  background-position: center;
}

h3 {
  font-size: 1.1em;
  font-weight: normal;
  font-family: Verdana, Helvetica, sans-serif;
}

/* ### Members ### */

.clearFloat {
  clear: both;
}

.classes {
  width: 940px;
  text-align: center;
}

.subClass {
  float: left;
  padding: 6px;
  width: 170px;
  text-align: center;
}

.subClass img{
  margin: -4px;
}

.subClass h2{
  text-align: right;
  padding-right: 10px;
}

#warrior h2 {
  background-image: url("../images/icons/classes/warrior.gif");
  background-position: 10px;
}

#deathknight h2 {
  background-image: url("../images/icons/classes/deathknight.gif");
  background-position: 10px;
}

#paladin h2 {
  background-image: url("../images/icons/classes/paladin.gif");
  background-position: 10px;
}

#priest h2 {
  background-image: url("../images/icons/classes/priest.gif");
  background-position: 10px;
}

#shaman h2 {
  background-image: url("../images/icons/classes/shaman.gif");
  background-position: 10px;
}

#druid h2 {
  background-image: url("../images/icons/classes/druid.gif");
  background-position: 10px;
}

#rogue h2 {
  background-image: url("../images/icons/classes/rogue.gif");
  background-position: 10px;
}

#mage h2 {
  background-image: url("../images/icons/classes/mage.gif");
  background-position: 10px;
}

#warlock h2 {
  background-image: url("../images/icons/classes/warlock.gif");
  background-position: 10px;
}

#hunter h2 {
  background-image: url("../images/icons/classes/hunter.gif");
  background-position: 10px;
}

.subClass .rowHead {
  margin-top: 10px;
  width: 167px;
}

.subClass .rowError {
  width: 167px;
}

.subClass .row1 {
  width: 167px;
}

.subClass .row2 {
  width: 167px;
}

.subClass span.col {
  width: 167px;
  padding-top: 10px;
}

.subClass span.colTrial {
  display:block;
  text-align: left;
  padding-left: 10px;
  width: 157px;
}

.subClass .rowHead span.col1 {
  width: 167px;
}
.subClass span.col1 {
  width: 101px;
}

.subClass span.col2 {
  width: 33px;
  padding-top: 2px;
}
.subClass span.col3 {
  width: 33px;
  padding-top: 2px;
}


/* ### By Role ### */

#memberRole .subClass {
  float: left;
  padding: 6px;
  width: 223px;
  text-align: center;
}

#memberRole .subClass img{
  margin: -4px;
}

#memberRole .subClass h2{
  text-align: right;
  padding-right: 50px;
}

#tank h2 {
  background-image: url("../images/icons/role/tank.png");
  background-position: 30px;
}

#heal h2 {
  background-image: url("../images/icons/role/heal.png");
  background-position: 30px;
}

#melee h2 {
  background-image: url("../images/icons/role/melee.png");
  background-position: 5px;
}

#range h2 {
  background-image: url("../images/icons/role/range.png");
  background-position: 5px;
}

#memberRole .subClass .rowHead {
  margin-top: 10px;
  width: 220px;
}

#memberRole .subClass .rowError {
  width: 220px;
}

#memberRole .subClass .row1 {
  width: 220px;
}

#memberRole .subClass .row2 {
  width: 220px;
}

#memberRole .subClass span.col {
  width: 220px;
  padding-top: 10px;
}

#memberRole .subClass span.colTrial {
  display:block;
  text-align: left;
  padding-left: 10px;
  width: 210px;
}

#memberRole .subClass .rowHead span.col1 {
  width: 120px;
}

#memberRole .subClass .rowHead span.col2 {
  width: 50px;
}

#memberRole .subClass .rowHead span.col3 {
  width: 50px;
}

#memberRole .subClass span.col1 {
  width: 150px;
}

#memberRole .subClass span.col2 {
  width: 35px;
  padding-top: 2px;
}

#memberRole .subClass span.col3 {
  width: 35px;
  padding-top: 2px;
}

/* Member Twink tooltip */

.twink {
  margin: 0;
  padding: 0;
  width: 370px;
  text-align: center;
}

.twink .rowHead {
  margin-top: 10px;
  width: 355px;
}

.twink .rowError {
  width: 355px;
}

.twink .row1 {
  width: 355px;
}

.twink .row2 {
  width: 355px;
}

.twink span.col {
  width: 355px;
  padding-top: 20px;
}

.twink span.col1 {
  width: 120px;
}

.twink span.col2 {
  width: 55px;
}

.twink span.col3 {
  width: 55px;
}

.twink span.col4 {
  width: 55px;
}

.twink span.col5 {
  width: 70px;
}
/* ### Character Overview ### */

.rowHead {
  clear: both;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  padding-top: 6px;
  margin-bottom: -6px;
  width: 950px;
  height: 30px;
  background: #222222;
  font-weight: bold;
}

.rowError {
  clear: both;
  padding: 0;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4px;
  width: 950px;
  height: 54px;
  background: #333333;
}

.row1 {
  clear: both;
  padding: 0;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4px;
  width: 950px;
  height: 25px;
  background: #333333;
}

.row2 {
  clear: both;
  padding: 0;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  padding-top: 4px;
  width: 950px;
  height: 25px;
  background: #2B2B2B;
}

span.col {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 950px;
  height: 54px;
  text-align: center;
}

span.col0 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col1 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col2 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 200px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col3 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 150px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col4 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 150px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col5 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 100px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col6 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 100px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col7 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 100px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.col8 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col9 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col10 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col11 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col12 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col13 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col14 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col15 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col16 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col17 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col18 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col19 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.col20 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.cola0 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
}

span.cola1 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 50px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.cola2 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 200px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

span.cola3 {
  margin: 0;
  padding: 0;
  display: block;
  float: left;
  width: 150px;
  height: 20px;
  text-align: center;
  cursor: pointer;
}

/* ### Forms ### */

fieldset {
  padding: 0;
  margin: 0;
  border: 0;
}

label{
  float: left;
  width: 220px;
}


.required label {
  font-weight: bold;
}

input, textarea {
  padding: 1px 0px 1px 5px;
  background-color:#141414;
  color:#BBBBBB;
  border:1px solid #C0C0C0;
  width: 175px;
  margin-bottom: 5px;
  font-family: Verdana, Helvetica, sans-serif;
}

select{
  padding: 1px 0px 1px 5px;
  background-color:#141414;
  color:#BBBBBB;
  border:1px solid #C0C0C0;
  width: 182px;
  margin-bottom: 5px;
  font-family: Verdana, Helvetica, sans-serif;
}

#instance {
  width: 370px;
}

#inviteHour{
  width: 50px;
}

#inviteMinute{
  width: 50px;
}

#startHour{
  width: 50px;
}

#startMinute{
  width: 50px;
}

#addRaid textarea{
  width: 363px;
  height: 150px;
}

textarea{
  width: 250px;
  height: 150px;
}

.boxes {
  border: 0;
  vertical-align: top;
  width: 1em;
}

#submitbutton {
  background-color:#141414;
  color:#BBBBBB;
  border:1px solid #C0C0C0;
  width: 182px;
  padding: 0;
  margin-left: 220px;
  margin-top: 20px;
  font-family: Verdana, Helvetica, sans-serif;
}

br{
  clear: left;
}
/* ### Site Error ### */

.site_error {
  clear: both;
  margin: 20px auto;
  padding: 10px 10px 20px 20px;
  width: 750px;
  text-align: left;
  border-width: 1px;
  border-style: solid;
  border-color: #FF0000;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  visibility: visible;
  z-index: 3;
}

.site_error_window {
  clear: both;
  width: 500px;
  margin: 20px auto;
  text-align: left;
  padding: 10px 10px 20px 20px;
  border-width: 1px;
  border-style: solid;
  border-color: red;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  visibility: visible;
  z-index: 3;
}

.error_body {
  padding: 0px 20px;
  font-size: .95em;
  font-style: italic;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
}

.site_error h1, .site_error_window h1 {
  font-size: 1.2em;
  font-weight: bold;
  color: red;
  font-family: Verdana, Helvetica, sans-serif;
}

.red {
  color: red;
}

.characterDelete {
  float: left;
  width: 370px;
  margin: auto;
}

/* ### Success Message ### */

.success_message {
  margin: 20px auto;
  padding: 10px 10px 20px 20px;
  width: 750px;
  text-align: left;
  border-width: 1px;
  border-style: solid;
  border-color: blue;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  visibility: visible;
  z-index: 3;
}

.success_message_window {
  width: 500px;
  text-align: left;
  padding: 10px 10px 20px 20px;
  margin: 20px auto;
  border-width: 1px;
  border-style: solid;
  border-color: blue;
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
  font-size: .95em;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
  visibility: visible;
  z-index: 3;
}

.success_body {
  padding: 0px 20px;
  font-size: .95em;
  font-style: italic;
  color: #BBBBBB;
  font-family: Verdana, Helvetica, sans-serif;
}

.success_message h1, .success_message_window h1 {
  font-size: 1.2em;
  font-weight: bold;
  color: blue;
  font-family: Verdana, Helvetica, sans-serif;
}

pre {
  padding-left: 20px;
}

#changeParticipaton fieldset {
  padding-left: 100px;
}

#changeParticipaton select, textarea {
  width: 286px;
}

#changeParticipaton textarea {
  width: 280px;
}

#manageAccount fieldset {
  padding-left: 130px;
}

#addCharakter fieldset {
  padding: 30px 0px 30px 160px;
}

#editCharakter fieldset {
  padding: 30px 0px 30px 160px;
}

#login fieldset {
  padding: 20px 0px 20px 160px;
}

#register fieldset {
  padding: 20px 0px 20px 160px;
}

.white {
  color: white;
}

#confirmParticipation label {
  float:left;
  width:200px;
  padding-left: 310px;
  text-align:right;
}

#confirmParticipation #sAll {
  float:left;
}

#confirmParticipation #dsAll {
  float:left;
}

#calendarMassParticipation label {
  float:left;
  width:200px;
  padding-left: 310px;
  padding-right: 20px;
  text-align:right;
}

#calendarMassParticipation #sAll {
  float:left;
  width: 10px;
}

#calendarMassParticipation #dsAll {
  float:left;
  width: 10px;
}

.warrior {
  color: #C79C6E;
}

.deathknight {
  color: #C41F3B;
}

.paladin {
  color: #F58CBA;
}

.priest {
  color: #FFFFFF;
}

.shaman {
  color: #2459FF;
}

.druid {
  color: #FF7D0A;
}

.rogue {
  color: #FFF569;
}

.mage {
  color: #69CCF0;
}

.warlock {
  color: #9482CA;
}

.hunter {
  color: #ABD473;
}

.day .checkbox {
  width: 10px;
}

#editBuffs fieldset {
  padding: 30px 0px 30px 160px;
}

#editBuffs label {
  float: left;
  width: 60px;
}

#editBuffs input {
  float: left;
  width: auto;
  margin-top: 10px;
  margin-left: 25px;
  margin-right: 25px;
}

#editBuffs .head {
  margin-left: 60px;
  width: 65px;
  text-align: center;
  float: left;
}

#editBuffs .head1 {
  width: 65px;
  text-align: center;
  float: left;
}