/* CSS fuer Skin 8 Firebox */

html,body,div,p,h1,h2,h3,h4,h5,ul,ol,span,form,img,li, input, select {
	font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif;
	border:0;
	margin:0;
	padding:0;
	*color: #343; /* die Schriftfarbe fuer alle Texte, kann fuer jedes Element individuell ueberschrieben werden */
}


html {
height: 100%;
background-color: #fff;
background-image:url(img/chat_bg8.jpg);
background-repeat:repeat-x;
background-position: bottom;
background-attachment:fixed;
}


body {
	width: 95%;
	height: 99%;
    max-width:63em;
    margin: 0 auto;
	font-size:100.01%;
}



h1 {
	font-size:1.4em;
	color:#373;		/* dies ist ein Beispiel fuer eine spezielle Schriftfarbe fuer die Ueberschrift */
	line-height:125%;
	position: relative; top: .5em;
}
h1 span {color:#373}

h2 {
	font-size: 1em;
	color:#676;
	line-height:125%;
        margin: 7px 0 4px 3px;
}
h2 a, h2 a span {color:#676;}

h3, h4, h5 {
	font-size:.8em;
	margin: 1em 0 .5em;
	line-height:125%;
}

p, ol li, #uo, #help tr  {
	font-size:.8em;
	/* margin-bottom: 2px; */
	/*line-height:1.4em;*/
}


#farben ul li {
	display:inline;
	margin:0;
}

#addsmileys {
	margin: 3px 0 0 3px;
}

#addsmileys ul li {
display:inline;
padding: 0 1px;
margin: 0;
}

#addsmileys ul li a span {vertical-align:20%;}
#addsmileys ul li a:visited span {color:#f1f1f1}
#addsmileys ul li a:hover span{color: #555; background:#f1f1f1;}


ul {
	font-size:.8em;
	list-style-type: none;
}


li {
	margin: 0 1em 0 0;
}



fieldset {
	clear: right;
	background: #f1f1f1;		/* die Hintergrundfarbe fuer das Chatfenster */
	margin: 0;
        padding: 8px 10px;
        border:solid 3px #ddd;
        border-radius:18px;
        -moz-border-radius:18px;
        -khtml-border-radius:18px;
        /* min-width: 8em; */
}


fieldset fieldset {
         background: #fafafa;	/* die Hintergrundfarbe fuer die Optionsfelder */
	 /* padding: 2px 4px 4px 3px; */
	 margin-bottom: 3px;
	 font-size:92%;
}


fieldset fieldset, #wall {
         padding: 5px;
         border:solid 2px #ccc;
         border-radius:6px;
         -moz-border-radius:6px;
         -khtml-border-radius:6px;
}

* html fieldset fieldset {
         margin: 0 0 0 0;
         float:right;
         width:20%;
}


.datum, .uhrzeit, .dt, .uz, .tr {
	font-size: .7em;
	color: #888;
}

.klein {
	font-size: .7em;
	margin: 0 0 .3em .3em;
}

#talk {
	margin: 0 6px 0 0;
	height: 100%;
}

#wrapper {height: 85%;}

#wall {
	height: 25em;
	height: 68%;
	overflow: auto;
	margin: 0 0 5px 0;
	line-height: 1.1em;
	background-image:url(img/_nina1024x768.jpg);
	background-position: 100% 0;
	background-repeat:no-repeat;
	background-color: #fefefd;	/* die Hintergrundfarbe fuer das Nachrichtenfenster */	
}
/*
* html #wall { height: 26.25em; }
*/

#wall p {
        /* die beiden folgenden Zeilen bestimmen die Einrueckung */
	padding:  0 .5em 0 3.8em;
	text-indent: -3.4em;
	margin-bottom: 2px;
	outline:none;
}

#wall .nick, #wall .nk {
	font-weight:900;
}

#line {
	width: 72%;
}


#op {margin:3px 0}

#ton {
	width: 0;
	height: 0;
}

#uo {
      border:solid 2px #ccc;
      -moz-border-radius:4px;
      -khtml-border-radius:4px;
      border-radius:4px;
      background:#fff;
      padding: 5px;
	display: inline;
	margin-top: .3em;
	display:block; height: 14em; overflow-y:auto; overflow-x:hidden}

html:first-child>b\ody #uo { /* Opera Hack */
      overflow: auto;
}

#uo a, #user_pro_room a {color:#343;text-decoration:none}

#uo ul, #uo ul li {
	display: inline;
	display:block;padding:0 .1em;	font-size:100%;
	margin: 0;
}
#uo ul {
	padding: .2em 0 .5em .0em;
      line-height:1.3em;
      margin-top:4px;
}





#user_pro_room {
      padding: 5px;
      margin-top:3px;
      background: #fff;
      border:solid 2px #ccc;
      line-height: 1em;
      -moz-border-radius:4px;
      -khtml-border-radius:4px;
      border-radius:4px;
	display: inline;
	display:block; height: 5em; overflow-y:auto; overflow-x:hidden;
}

html:first-child>b\ody #user_pro_room { /* Opera Hack */
      overflow: auto;
}

#user_pro_room em {
	font-weight: bold;
	font-style: normal;
	color: red;
	/*  position:relative; top:.15em; hm? */
}

/* das Folgende geht natuerlich im IE erst ab V. 8 */
/*
#user_pro_room em:after { 
	content:"\00A0\221A";
}
*/
#user_pro_room em:before {
	content:"* ";
}


/* #f .button, */
dfn, .dot {
	position:absolute;
	left:-1000px;
	top:-1000px;
	width:0;
	height:0;
	overflow:hidden;
	display:inline;
}

#switch {
	position:absolute;
	left:-1000px;
	top:-1000px;
}

/* all modern browsers, including IE9 */
.bg {background-color: rgba(240,240,240,0.5); border-radius: 8px; -moz-border-radius: 8px; -khtml-border-radius: 8px;}  /* der Hintergrund fuer den Admin */


/* for oldIE ( ≤ IE 8 ) Danke http://grochtdreis.de/weblog/2012/03/29/rgba-auch-fuer-den-ie6/ */
.bg {
  filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#0d000000,endColorStr=#0d000000);
  /* if you want to, add this especially for IE8 */
  -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr=#0d000000,endColorStr=#0d000000)";
  /* sometimes you must trigger hasLayout for the color to be seen */
  zoom: 1;
}


label,
select,
input {
cursor: pointer;
}


label {margin:0 0 0 3px}


#line, #handle, #room {
       background:#fff;
       cursor:text;
		font-size: 100%;
}


input, select {
      background:#fff;
      margin: 0 0 0 0;
      padding: 4px;
      padding: 0 3px 3px 3px;
      border:solid 2px #ccc;
      border-radius:6px;
      -moz-border-radius:6px;
      -khtml-border-radius:6px;
}
select {
      padding: 0 0 0 3px;
      border-top-right-radius: 0;
      border-bottom-right-radius:0;
      -moz-border-radius-topright: 0;
      -moz-border-radius-bottomright: 0;
      -webkit-border-top-right-radius: 0;
      -webkit-border-bottom-right-radius: 0;
}
.button {
      margin-left: 3px;
      color: #fff;
      font-weight:normal;
      text-shadow: 0 1px 1px rgba(0,0,0,.6);
      border:solid 2px #bbb;

      border-radius:2em;
      -moz-border-radius:2em;
      -khtml-border-radius:2em;
      
      background: #999;
      background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#444));
      background: -moz-linear-gradient(top,  #ccc,  #444);
}

* html .button {padding:0;}
*+html .button {padding:0;}

.button::-moz-focus-inner {border: 1px dotted transparent;}


/* input.button {border-radius:0;} */

#datum, #uhr, #sound, #nickfarben,#nickfarben2, #time_online, #time_real {
      border: 0;
      background: transparent;
}

#menu1, #menu2, #room {width:50%}
* html #menu1, * html #menu2 {width:48%}

#menu2 {margin-bottom: .3em;}



#opt2 {clear:left; padding-top: 5px}
.opt {
/*     display:block;
     float:left;
*/
     margin: 0 0 2px 0;
     padding: 0;
}
* html .opt {margin: 0 0 -4px 0;}
*+html .opt {margin: 0 0 -4px 0;}   /* oh je, der erste IE7 Hack */


.uolist {display:none;}
#upload {
	clear:left;
	margin:5px 5px 3px 0; 
	background: #f1f1f1;
}


#upload_2 {padding: 2px; width: 15em;}



.helplinks{margin:10px;}
.helplinks p a{margin-bottom: 5px;}

#logout a:link, 
#logout a:visited, 
.logout a:link,
.logout a:visited {
   zoom: 1; /* ie7 hack  */
   
   margin: 5px 0;
   text-align:center;
   padding: 2px 0 4px 0;
   border:solid 2px #ccc !important;
   border-radius:2em;
   -moz-border-radius:2em;
   -khtml-border-radius:2em;
   border:solid 1px #bbb;
   
   background: #999;
   background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#444));
   background: -moz-linear-gradient(top,  #ccc,  #444);
   
   color:#fff;
   display:block;
   text-decoration:none;
   font-weight:normal !important;
   text-shadow: 0 1px 1px rgba(0,0,0,.6);
}


#logout a:hover,
#logout a:focus,
#logout a:active, 
.logout a:hover,
.logout a:focus,
.logout a:active,
.button:hover, 
.button:focus,
.button:active {
  background: #ccc;
  background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#eee)) !important;
  background: -moz-linear-gradient(top,  #888,  #eee) !important;
  color:#333 !important;
  text-shadow: 0 1px 1px rgba(255,255,255,.6) !important;
  outline:none;
}


#Uhr_Anzeige2 {margin-left: .2em;}

/* falls nur 1 Raum, folgende Zeile entkommentieren: */
/* #user_pro_room {display:none} */

#file {margin-top: 5px;}

#ton, #mp3 {clear:left; width: 80%; font-size: .8em; color:red;}

/* #wall a {outline:none;} */

wbr {
  width: 0 !important;
  display: inline-block !important;
  overflow: hidden !important;
}

a.mp3 {
text-decoration: none;
padding-left: 20px;
background-image:url(img/audio.gif) !important;
background-repeat:no-repeat !important;
background-position: 0 50% !important ;
}
.hello {color: #888; font-size: 80%; font-weight:bold; font-style:italic;}

fieldset #upload #file{border:0 none !important;} /* fuer Chrome */

.ip {font-size: .8em; color: #aaa;}
.ip:before {	content:" - IP:";}

a.stop {
color:#fff;
background: #888 !important;
text-decoration:none;
font-size: 80%;
padding: 0 7px;
border-radius: 2em;
}

.rooms {padding:2px 5px;}
.rooms p {margin: 0 3px}

#radio {text-align:center;}
#talk #player_0 embed{float:right; outline:0;} 
.rooms #player_0 embed {outline:0;}