body {
        background: #c0c0c0;
        background: repeat-y, url(/laynew/bg.png) repeat;
        background-attachment:fixed;
        background-position:absolute;
        font-family: 'palatino, serif';
        font-size: 12px;
        color: #fff;
        text-align: center;
        text-shadow: #000 1px 1px 1px;  }

#container {
        position: relative;
        margin: 20px auto 10px;
        width: 900px;
        margin-top: 5px;
        padding: 3px;
        background-color:#232323;
        border-radius: 10px;
        box-shadow: 0px 0px 15px #000000;
        overflow: hidden;

}

#header {
        width: 898px;
        height: 350px;
        position: relative;
        float: right;
        margin-top:0px;
        padding:0px;
        background-image: ;
        background-color:#000;
        border-radius: 10px;
        border-top: 1px solid #131313;
        border-right: 1px solid #131313;
        border-bottom: 1px solid #131313;
        border-left: 1px solid #131313;
        background: url('header.png');

}

#content {
        position:relative;
        float: right;
        margin-right:1px;
        width:650px;
        margin-bottom: 2px;
        margin-top:2px;
        padding:4px;
        min-height: 300px;
        background-color:#202020;
        border-radius: 10px;
        border:1px solid #131313;
        text-shadow: #000 1px 1px 1px;
}

#sidebar {
        position:relative;
        float: left;
        margin-left:0px;
        width:225px;
        margin-bottom:2px;
        margin-top:2px;
        padding:4px;
        background-color:#202020;
        border-radius: 10px;
        border-top: 1px solid #131313;
        border-right: 1px solid #131313;
        border-bottom: 1px solid #131313;
        border-left: 1px solid #131313;
}

#footer{
        clear:both;
        background:#232323;
        margin: 0px 5px;
        text-align: center;
        margin: 5px;
        padding: 0px 0px 0px;
}

a.nav:link, a.nav:active, a.nav:visited{
display: block;
margin: 1px;
font-size: 11px;
letter-spacing: 0px;
background: #e4cecd;
color: #02055A;
padding: 3px 0px;
text-align: center;
text-shadow: #fff 1px 1px 1px;
background: url('/laynew/navi.png');
}

a.nav:hover{
color: #253DA1;
background: #232323;
background: url('/laynew/bg.png');
letter-spacing: 3px;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}

B, strong {color: #fff; font-family: verdana; text-transform:uppercase; text-shadow: #000 1px 1px 1px;}
U {color:#fff;text-decoration: none; border-bottom: 1px solid #f28683; text-decoration:none; text-shadow: #000 1px 1px 1px;}
I, em {letter-spacing: 2px; color: #fff; font-family: verdana; text-shadow: #f28683 1px 1px 1px; text-decoration: none;}

A {color:#f28683; text-decoration:none;text-shadow: #000 0px 0px 0px;-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;}
A:hover {color:#fff; text-decoration:none;text-shadow: #000 1px 1px 1px;-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;}

h1{
color: #fff;
font-size: 13pt;
background-color: #e9afa4;
background: url('/laynew/h1.png');
display:block;
text-transform: uppercase;
margin:0px; padding:2px;
letter-spacing: 5px;
font-family: 'Courier New';
}

h2 {
font-family: 'Alex Brush', cursive;
text-align: center;
font-size: 30px;
color: #fff;
text-shadow: 1px 1px 1px #02055A;
font-weight: bold;
line-height: 24px;
padding-left: 2px;
margin: 1px;
padding: 15px 5px 5px;
text-decoration: none;
}

h3 {
font-family: 'Courier New' ;
text-align: right;
font-size: 21px;
color: #fff;
text-shadow: 1px 1px 1px #f28683;
border-bottom: 1px solid #f28683;
font-weight: bold;
margin: 9px;
text-decoration: none;
line-height: 20px;
}
input, textarea, select
{border: 1px solid #131313;
background: #232323;
line-height: 10px;
padding: 5px;
text-align: justify;
color: #fff;
-webkit-box-shadow: 1px 1px 8x 0px rgba(0, 0, 0, 0.3); /* WebKit */
-moz-box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Firefox */
box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Standard */;
width: 250px;
height: 70px;
text-shadow: #000 1px 1px 1px;  }

blockquote
{border: 1px solid #131313;
background: #f7f3d5;
background: url('/laynew/bg.png');
line-height: 10px;
padding: 5px;
color: #fff;
width: 350px;
-webkit-box-shadow: 1px 1px 8x 0px rgba(0, 0, 0, 0.3); /* WebKit */
-moz-box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Firefox */
box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Standard */;
text-shadow: #000 1px 1px 1px;  }

.img, .web
{border: 1px solid #131313; background: url('/laynew/bg.png');padding: 7px;
-webkit-box-shadow: 1px 1px 8x 0px rgba(0, 0, 0, 0.3); /* WebKit */
        -moz-box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Firefox */
        box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Standard */;}

.img:hover, .web:hover
{border: 1px solid #131313; background: url('/laynew/bg.png');padding: 7px;
-webkit-box-shadow: 1px 1px 8x 0px rgba(0, 0, 0, 0.3); /* WebKit */
        -moz-box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Firefox */
        box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); /* Standard */;}

#imagelightbox{

 position: absolute;

 z-index: 99999;

}


///// CHARA STYLE /////

/* Tabelen */

.chara-haupttabele{
width:540px; /* Hier kannst du Tabellengröße ändern */
margin: auto;
background: url('/laynew/navi.png');/* Hier kannst du die Backgroundfarbe ändern oder Löschen */
font-family: 'Century Gothic', 'Scada', 'Tahoma', 'Helvetica', 'Arial, sans-serif'; /* Hier könnt ihr die Schriftart ändern */
text-align:left;
margin-top: 5px;
margin-bottom: 5px;
padding: 15px;
color: #ffffff; /* Hier kannst du die Schriftfarbe */}

.chara-avatartabele{
width:150px; /* Hier kannst du die größe jeh nach Avatargröße ändern */
margin: auto;
font-family: 'Century Gothic', 'Scada', 'Tahoma', 'Helvetica', 'Arial, sans-serif'; /* Hier könnt ihr die Schriftart ändern */
font-size: 12px;
text-align:left;
background: url('/laynew/bg.png');  /* Hier kannst du die Backgroundfarbe änder oder ganz weg machen */
padding: 10px;}

.chara-titeltabele{
margin: auto;
font-family: 'Century Gothic', 'Scada', 'Tahoma', 'Helvetica', 'Arial, sans-serif'; /* Hier könnt ihr die Schriftart ändern */
font-size: 11px;
text-align:left;
background: url('/laynew/navi.png');  /* Hier kannst du die Backgroundfarbe änder oder ganz weg machen */
padding: 5px;}

/* Profile */

.chara-profil{
background: url('/laynew/bg.png'); /* Hier kannst du die Backgroundfarbe ändern oder Löschen */
font-family: 'Century Gothic', 'Scada', 'Tahoma', 'Helvetica', 'Arial, sans-serif'; /* Hier könnt ihr die Schriftart ändern */
font-size: 11px;
text-align: left;
color:#ffffff; /* Hier kannst du die Schriftfarbe */
padding:7px;}


/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
display:none; }

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {}

.tabberlive {}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav{
text-align:center;
margin:0;
padding: 3px 0;}

ul.tabbernav li{
display: inline;}

ul.tabbernav li a{
padding: 5px;
background: url('/laynew/h1.png');
margin:10px;
border-bottom: none;
text-decoration: none;
font-family: verdana;
font-size: 11px;
text-transform: uppercase;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border: 1px #ffffff;
}

ul.tabbernav li a:link { color: #ffffff; }
ul.tabbernav li a:visited { color: #ffffff; }

ul.tabbernav li a:hover{
color: #ffffff;
background-color:#b1b69e;
text-decoration: none;
font-style:normal;
text-transform: uppercase;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border: 1px  #ffffff;
}

ul.tabbernav li.tabberactive a{
color: #485a45;
background-color:#cfd4be;
text-transform: uppercase;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border: 1px  #ffffff;
}

ul.tabbernav li.tabberactive a:hover{
color: #ffffff;
background-color:#b1b69e;
text-transform: uppercase;
border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border: 1px  #ffffff;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
border-top:3px solid #6670cf;
border-top:0; 

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
display:none;}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {}

.tabberlive#tab2 {}

.tabberlive#tab2 .tabbertab {
overflow:auto; 
}