/* Body */

div.toolbar div {
  display: inline;
}

div.widget, div.widget div {
  display: block !important;
  background-color: white;
  z-index: 100;
}

body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
}

a {
  text-decoration: none;
  color: black;
}

a:visited {
  color: #555;
}

a:active {
  color: white;
  background-color: black;
}

div#permalink {
  float: right;
}

div#about {
  position: absolute;
  top: 8px;
  right: 0;
  text-align: right;
  background-color: white;
  /*z-index: 10;*/
}

div#about > button:hover, div#about > button {
  padding: 0px;
  border: none;
}

div#about > button:active {
  color: white;
  background-color: black;
}

/* Administration */

img.thumbnail {
  width: auto;
  height: 70px;
}

div.widget.strip-editor div.episodes {
  max-height: 15em;
  overflow: auto;
}

div.widget.admin {
  position: fixed;
  left: 2em;
  right: 2em;
  top: 2em;
  bottom: 2em;
  text-align: left;
}

div.widget.comments div.contents {
  overflow: auto;
  max-height: 20em;
  text-align: left;
}

div.widget.comments {
  position: fixed;
  left: 4em;
  top: 4em;
  width: 100ex;
  /*bottom: 4em;*/
  /*max-height: 75%;*/
  text-align: left;
}

div#comments-button {
  position: absolute;
  top: 405px;
  left: 50%;
  width: 30ex;
  margin-left: -15ex;
  text-align: center;
  margin-top: 5em;
}

div.widget.comments ul {
  list-style: none;
  margin: 1em 0 0 0;
  padding: 0;
}

div.widget.comments li {
  margin: 0 0 1em 0;
  padding: 0;
}

span.comment-info {
  color: #bbb;
}

div.widget.admin iframe {
  width: 100%;
  height: 100%;
}

div.widget.strip-editor {
  position: fixed;
  left: 8em;
  width: auto;
  top: 8em;
  max-height: 70%;
  text-align: left;
}

div.widget.users {
  position: fixed;
  top: 2em;
  right: 2em;
  width: 30em;
  height: 90%;
  text-align: left;
}

div.widget.users ul {
  overflow: auto;
  height: 90%
}

div.widget.user {
  position: fixed;
  left: 25%;
  top: 25%;
  width: 20em;
  text-align: left;
}


/* Outlinks */

div.widget.about {
  position: absolute;
  top: 2em;
  right: 2em;
  width: 30em;
  text-align: left;
}

div.widget.outlinks {
  /* position: absolute; FF Cursor Bug */
  position: absolute;
  top: 2em;
  right: 2em;
  width: 20em;
  text-align: left;
}

div.widget.outlinks ul {
  list-style: none;
  margin: 0;
  border: 0;
  padding: 0;
}

/* Tags */

span.situation {
  font-size: 0.8em;
}

span.tags button:hover, span.tags button {
  padding: 0px;
  border: none;
}

span.tags button:hover span, .tag:hover {
  text-decoration: underline;
}

span.tags button span {
  font-weight: normal;
  font-size: 0.8em;
}

span.tags button span.tag.active, .tag.active, .tag.active:visited {
  background-color: #d1e9ff;
  color: black;
}

span.tags button:active span.tag.active, .tag.active:active {
  background-color: black;
  color: #d1e9ff;
}

span.tags button:active span.tag, .tag:active {
  background-color: black;
  color: #d6ffb2;
}

span.tags button span.tag, .tag, .tag:visited {
  background-color: #d6ffb2;
  color: black;
}

/* Title */

div#title {
  position: absolute;
  width: 773px;
  height: 75px;
  /*z-index: 1;*/
  left: -2px;
  top: -4px;
}

div#title img {
  border: none;
}

div#title a, div#title a:hover, div#title a:active {
  background-color: transparent;
  border: none;
}

/* Strip view */

div#strips {
  position: absolute;
  left: 0;
  right: 0;
  top: 80px;
  height: 450px;
  /*z-index: 1;*/
}

div.middle {
  width: 100%;
  text-align: center;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}

div#strips div.navig {
}

div.close {
  position: absolute;
  right: 0px;
  top: 0px;
  background: transparent !important;
}

div#strip-header h1 {
  font-size: 1.5em;
  display: inline;
  margin: 0;
}

div#strip {
  /*max-width: 1000px;*/
  /*height: 350px;*/
  margin-top: 10px;
  text-align: center;
}

div#strip-header {
  height: 2.5em;
  /*z-index: 2;*/
}

div#tools div.toolbar {
  position: absolute;
  left: 0;
  bottom: 0;
  /*z-index: 2;*/
}

img.suxorz {
  display: none;
  width: 0px;
  height: 0px;
}

/* */

div#tools {
  /*position: absolute;
  bottom: 0;
  left: 0;*/
  /*z-index: 2;*/
}

div#tools span.user-name {
  padding-bottom: 12px;
}

img {
  background-color: white;
  border: none;
  outline: none;
}

img[src="/static/stop.png"] {
  background-color: transparent;
}

div#login-button {
  position: absolute;
  right: 0;
  bottom: 0;
  /*z-index: 30;*/
}

div#tools {
  font-size: 8pt;
  left: 0;
  right: 0;
}

form > div {
  position: fixed;
  left: 8px;
  right: 8px;
  top: 8px;
  bottom: 4px;
  /*overflow: auto !important;*/
  padding: 0;
  margin: 0;
  border: none;
}

div.widget.profile {
  position: absolute;
  bottom: 2em;
  left: 2em;
  width: 40em;
}

div.widget.login {
  width: auto;
  position: absolute;
  bottom: 12px;
  right: 12px;
  left: 50%;
}

div#main {
  position: absolute;
  left: 20px;
  top: 160px;
  width: 90%;
  padding: 10pt;
  margin-left: auto;
  margin-right: auto;
}

/* Form elements */

button, input {
  border: none;
  padding: 2px;
  /*text-size: 12pt;*/
  color: black;
  margin: 0;
  background-color: transparent;
  cursor: pointer;
}

button span {
  /*text-decoration: underline;*/
  /*font-style: italic;*/
  font-weight: bold;
  color: black;
}

input:hover {
  background-color: #666;
}

input[type="text"], input[type="password"] {
  background-color: #eee;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
  border-color: #444;
  cursor: text;
}

input[type="text"]:focus, input[type="password"]:focus {
  background-color: #ddd;
  -moz-outline: inherit;
  -moz-outline-offset: inherit;
}

.hidden {
  display: none;
}

span.vote.secret {
  color: white;
}

span.user-name {
  position: relative;
  top: -10px;
}

div.confirmation {
  /*position: fixed;*/
  margin: auto;
  background-color: white;
  /*width: 50%;
  height: 50%;
  top: 25%;
  left: 25%;*/
  width: 50%;
  border: 2px solid red;
  padding: 0.5em;
  margin: 0.5em;
}

div.widget {
  margin: auto;
  margin-bottom: 1em;
  padding: 0.5em;
  /*border: dashed 1px #888;*/
  padding: 16px;
  background-color: white;
  border: solid black 2px;
}

div.problem {
  border: 2px solid red;
  padding: 0.5em;
}

div.widget.registration {
  background-color: white;
  position:fixed;
  /*position:expression("absolute");*/
  /*position: absolute;*/
  /*z-index: 20;*/
  width: auto;
  height: auto;
  top: 220px;
  left: 10%;
  right: 10%;
}

div#register {
  position: absolute;
  width: 395px;
  left: 0;
  bottom: 0;
  background-color: white;
  /*z-index: 20;*/
}

div.strip-footer {
  /*position: absolute;*/
  margin-left: 2px;
  width: 100%;
}

/* Strip list */

div * div.shower, div.inline {
  display: inline !important;
}

div.align-right {
  text-align: right;
  right: 0;
}

div.widget.strip-viewer {
  background-color: white;
  padding: 1em;
  width: 70em;
  height: auto;
  /*z-index: 20;*/

  position: fixed;
  top: 10%;
  left: 5%;
  /*right: 10%;
  bottom: 10%:*/
}

div.strip-list {
  height: 23em;
  overflow: auto;
}

div.strip-list span.date {
  color: #bbb;
}

img.disconnected {
  opacity: 0.50;
  filter: alpha(opacity=50);
  -khtml-opacity: 0.50;
}

span.vote {
  display: block;
  position: absolute;
  left: 50%;
  width: 2em;
  margin-top: 0px;
}

span.vote.left
{
  margin-left: -3.5em;
}

span.vote.right
{
  margin-left: +1.5em;
}

a.image img {
  position: relative;
  top: 2px;
  background-color: transparent;
}

/*a.image:hover,*/ button:hover {
  border: dashed 2px #ccc;
  padding: 0px;
}

/*a.image:active,*/ button:active {
  border: solid 2px #bbb;
  padding: 0px;
}

/*a.image,*/ button {
  padding: 2px;
}

div.close button:hover, div.close button:active {
  border: none;
  padding: 2px;
}

div.titlebar {
  left: 0;
  right: 0;
  position: relative;
  background-color: #ccc !important;
  padding: 0.2em;
  margin-bottom: 1em;
  height: 15px;
}

div.titlebar span.title {
  font-size: 10px;
  font-weight: bold;
}

div.titlebar.minimized {
  border-style: solid;
  border-color: #794d00;
  border-width: 0 0 1px 0;
  margin-bottom: 0.25em;
}

a.image:active {
  background-color: transparent;
} 

/* Remove fucking outlines */

input[type="image"]:focus {
  outline: none;
}

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
  border: none;
}

abbr:focus, acronym:focus, address:focus, applet:focus, b:focus, 
base:focus, big:focus, blockquote:focus, br:focus, canvas:focus, caption:focus,
center:focus, cite:focus, code:focus, col:focus, colgroup:focus, dd:focus,
del:focus, dfn:focus, dir:focus, div:focus, dl:focus, dt:focus, em:focus,
fieldset:focus, font:focus, form:focus, h1:focus, h2:focus, h3:focus, h4:focus,
h5:focus, h6:focus, hr:focus, i:focus, img:focus, ins:focus, 
kbd:focus, label:focus, legend:focus, li:focus, link:focus, menu:focus, 
object:focus, ol:focus, p:focus, pre:focus, q:focus, s:focus, samp:focus, 
small:focus, span:focus, strike:focus, strong:focus, sub:focus, sup:focus, 
table:focus, tbody:focus, td:focus, tfoot:focus, th:focus, thead:focus, 
tr:focus, tt:focus, u:focus, ul:focus, var:focus {
  outline: none;
}

/**|*:-moz-any-link:focus {*/
*:-moz-any-link:focus {
  outline: none;
}

div.help {
  position: absolute;
  bottom: 0;
  left: 40%;
  right: 40%;
  z-index: 100;
}

div.help * {
  color: #888;
}