/* Styles rania-zeriri-fans.de
 * Code anno 2008 by -seti-
 * SLD - Version - 02
 * Bitte diese Datei NICHT editieren!
 * EIN Fehler an der richtigen Stelle und das gesamte Sitelayout ist im Eimer.
 * Da reicht schon nen Semikolon !!
 * Update: 2008-06-09T10:38:00+0200
 */
* {
margin: 0;
padding: 0;
}
body {
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 100.01%;
background-color: #D9F0F0;
background-image:url(../img/Rania-Brett-Links-30-120.jpg);
background-repeat: repeat-y;
color: #000000;
}
p, li {
font-size: 80%;
}
/* --- Start Bilderdrehwurm --- */
#images{
    visibility:hidden;
}

/* dafür Sorge tragen das die Bilder horizontal angeordnet werden */
#images img{
    position:absolute;
    top:0px;
    border:none;
}

#loading_bar{
    margin-top:160px;
    margin-bottom:200px;
    text-align:center;
    width:100%;
}

#loading_bar img{
    margin-top:20px;
    position:relative;
}

#captions{
    font-weight:bold;
    position:relative;
    padding-top:20px;
    text-align:center;
    z-index:10000;
}

#scrollbar{
    visibility:hidden;
    position:relative;
    border-bottom:1px solid #906000;
    z-index:10001;
}

#slider{
    position:absolute;
    margin-top:-14px;
    margin-left:-14px;
    z-index:10002;
    background-image:url(../img/slider.png);
    background-repeat:no-repeat;
    width:28px;
    height:28px;
}
#imageflow{
    text-align:left;
}
/* --- End Bilderdrehwurm --- */

/* Kopp mit skalierendem BG wird hinter das Bild gezeichnet */
#header {
background-image: url(../img/Rania-Steine-Grau-800-120-0.jpg);
background-repeat: repeat-x;
position: absolute;
top: 0;
left: 0px;
width: 100%;
height: 120px;
color: #000000;
}

/* Ranias Bild links in den Kopp stellen */
#header a {
display: block;
background-image: url(../img/Rania-Zeriri-Fans-Banner800-00.png);
background-repeat: no-repeat;
position: absolute;
text-decoration:none;
top: 0;
left: 0;
width: 100%;
height: 120px;
}
#header h2 {
position: absolute;
font-size: 200%;
left: 220px;
top: 0px;
background-color: transparent;
color: #003080;
}

/* Woohoo Überschrift */
#woohoo {
display: block;
background-image: url(../img/anim/woohoo.gif);
background-repeat: no-repeat;
background-position: left center;
padding-left: 45px;
background-color: transparent;
}
#woohooinvis {
display: block;
padding-left: 45px;
background-color: transparent;
}

#wrapper {
margin: 150px 0px 0px 20px;
background-image: url(../img/Rania-Steine-Grau-800-240-0.jpg);
background-repeat: repeat-x repeat-y;
background-color:  #D9F0F0;
color: #000000;
}

#content {
margin: 0px 220px 0px 0px;
padding: 1em 20px 1em 20px;
background-color: #F4FFF8;
color: #000;
border-right: 1px solid #005090;
border-left: 1px solid #005090;
}

#rania-map {
text-align: center;
width: 100%;
height: 600px;
border: 1px solid #209090;
}

#content .news{
background-color: #007070;
}


#hrm {
float:left;
position:absolute;
top:120px;
width:100%;
background:#206090 url("../img/hrm-bg20-45-7.gif") repeat-x bottom;
font-size:93%;
line-height:normal;
}

#hrm ul {
margin:0;
padding:10px 10px 0px 20px;
list-style:none;
}

#hrm li {
float:left;
background:url("../img/rania-hrm-9-links-00.gif") no-repeat left top;
margin:0;
padding:0 0 0 9px;
}

#hrm a {
display:block;
background:url("../img/rania-hrm-360-rechts-00.gif") no-repeat right top;
padding:5px 15px 4px 6px;
border:none;
text-decoration:none;
font-weight:bold;
color:#806050;
}

#hrm a:hover {
color:#303030;
}

#hrm #aktiv {
background-image:url("../img/rania-hrm-9-links-on-02.gif");
}

#hrm #aktiv a {
background-image:url("../img/rania-hrm-360-rechts-on-02.gif");
color:#303030;
padding-bottom:5px;
}

#hrm ul a span {
display: none;
background-color: #F0FFFF;
/*background-image: url(../img/hrm-menu-hover-bg160T0.gif);
background-repeat: repeat-y; */
color: #000000;
border: 1px solid #005090;
font-weight:normal;
}

#hrm ul a:hover span {
display: block;
position: absolute;
top: 40px;
width: 148px;
padding: 46px 6px 6px 6px;
}

#hrm ul a:hover span.raniabase {
background-image: url(../img/rania-home-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:40px;
}
#hrm ul a:hover span.raniaa {
background-image: url(../img/rania-news-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:100px;
}

#hrm ul a:hover span.raniab {
background-image: url(../img/rania-forum-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:110px;
/*ori left:170px; */
}
#hrm ul a:hover span.raniabio {
background-image: url(../img/rania-bio-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:170px;
/*ori left:240px; */
}
#hrm ul a:hover span.raniaf {
background-image: url(../img/rania-gast-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:290px;
}

#hrm ul a:hover span.raniachat {
background-image: url(../img/rania-chat-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:360px;
}

#hrm ul a:hover span.raniac {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:420px;
}
#hrm ul a:hover span.raniad {
background-image: url(../img/rania-video-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:480px;
}
#hrm ul a:hover span.raniae {
background-image: url(../img/rania-musik-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:440px;
}

#hrm ul a:hover span.ranialnk {
background-image: url(../img/rania-links-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:500px;
}
#hrm ul a:hover span.raniaimp {
background-image: url(../img/rania-impressum-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:230px;
/* ori left:580px;*/
}


#hrm p.counter {
position: absolute;
right: 0;
width:200px;
background-color: transparent;
border-left: 1px solid #909000;
padding: 3px 10px 2px 10px;
font-weight:bold;
}

/*---------------------------
*/
#foto {
float:left;
position:absolute;
top:120px;
width:100%;
background:#909090 url("../img/hrm-bg20-45-4.gif") repeat-x bottom;
font-size:93%;
line-height:normal;
}

#foto ul {
margin:0;
padding:10px 10px 0px 20px;
list-style:none;
}

#foto li {
float:left;
background:url("../img/rania-hrm-9-links-01.gif") no-repeat left top;
margin:0;
padding:0 0 0 9px;
}

#foto a {
display:block;
background:url("../img/rania-hrm-360-rechts-01.gif") no-repeat right top;
padding:5px 15px 4px 6px;
border:none;
text-decoration:none;
font-weight:bold;
color:#10A080;
}

#foto a:hover {
color:#006020;
}

#foto #aktiv {
background-image:url("../img/rania-hrm-9-links-on-01.gif");
}

#foto #aktiv a {
background-image:url("../img/rania-hrm-360-rechts-on-01.gif");
color:#006020;
padding-bottom:5px;
}

#foto ul a span {
display: none;
background-color: #f4e9d0;
color: #000000;
border: 1px solid #207070;
font-weight:normal;
}

#foto ul a:hover span {
display: block;
position: absolute;
top: 40px;
width: 148px;
padding: 46px 6px 6px 6px;
}

#foto ul a:hover span.raniabase {
background-image: url(../img/rania-home-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:35px;
}
#foto ul a:hover span.raniac {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:100px;
}
#foto ul a:hover span.raniafa1 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:160px;
}
#foto ul a:hover span.raniafa2 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:245px;
}
#foto ul a:hover span.raniafa3 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:330px;
}
#foto ul a:hover span.raniafa4 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:410px;
}
#foto ul a:hover span.raniafa5 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:495px;
}
#foto ul a:hover span.raniafa6 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:475px;
}
#foto ul a:hover span.raniafo2 {
background-image: url(../img/rania-foto-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:550px;
}



#foto ul a:hover span.raniaa {
background-image: url(../img/rania-news-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:100px;
}
#foto ul a:hover span.raniab {
background-image: url(../img/rania-forum-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:170px;
}
#foto ul a:hover span.raniabio {
background-image: url(../img/rania-bio-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:240px;
}
#foto ul a:hover span.raniaf {
background-image: url(../img/rania-gast-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:290px;
}
#foto ul a:hover span.raniachat {
background-image: url(../img/rania-chat-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:360px;
}
#foto ul a:hover span.raniad {
background-image: url(../img/rania-video-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:480px;
}
#foto ul a:hover span.raniae {
background-image: url(../img/rania-musik-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:440px;
}
#foto ul a:hover span.ranialnk {
background-image: url(../img/rania-links-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:500px;
}
#foto ul a:hover span.raniaimp {
background-image: url(../img/rania-impressum-menue-ho-blau.jpg);
background-repeat: no-repeat;
left:580px;
}
#foto p.counter {
position: absolute;
right: 0;
width:200px;
background-color: transparent;
border-left: 1px solid #909000;
padding: 3px 10px 2px 10px;
font-weight:bold;
}

/*
#left {
position: absolute;
top: 400px;
left: 10px;
width: 160px;
}
*/

.neubrief a {
display: block;
width:160px;
height:40px;
text-decoration: none;
background-image: url(../img/rania-zeriri-newsletter-btn-blau.jpg);
background-repeat: no-repeat;
border:0px;
}
.neubrief a:hover {
background-image: url(../img/rania-zeriri-newsletter-ho.jpg);
background-repeat: no-repeat;
border:0px;
}

#rechts {
position: absolute;
top: 160px;
right: 0;
width: 220px;
margin-top: 1em;
}

#footer {
height: 40px;
background-color: #208070;
background-image: url(../img/rania-footer-BG2044-0.gif);
background-repeat: repeat-x;
color: #FFFFFF;
border-top: 1px solid #005090;
clear: both;
}

/* Kopfzeilen */
h1,h2,h3,h4 {
background-color: transparent;
color: #204050;
letter-spacing: 1pt;
padding: 18px 0px 16px 0px;
}
h1 {
font-size: 150%;
}
h2 {
font-size: 130%;
}
h3 {
font-size: 115%;
}
h4 {
font-size: 100%;
}
#content p, #content ul {
max-width: 92%;
padding: 10px 0px 10px 0px;
line-height: 140%;
margin: 0 auto;
}
#content ul {
padding-left: 30px;
}

#footer p {
text-align: center;
padding-top: 10px;
}

/* teaser */
#rechts .tsbanner{
margin: 10px 10px 0px 10px;
background-color: #F0FFFF;
/*border: 1px solid #207070;*/
color: #000;
}

#rechts .teaser {
margin: 10px 10px 0px 10px;
background-color: #F0FFFF; /*#ebd7ab;*/
border: 1px solid #207070;
color: #000;
}
#rechts .teaser h4 {
font-size: 80%;
margin: 0 0 5px 0;
padding: 4px;
background-color: #207070;
color: #fff;
}
#rechts .teaser p {
font-size: 75%;
line-height: 130%;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
}

/* links */
a {
text-decoration: none;
border-bottom: 1px solid #004080;
}
a:link {
background-color: transparent;
color: #004080;
}
a:visited {
background-color: transparent;
color: #005090;
}
a:hover {
background-color: transparent;
color: #60A000;
border-bottom: 1px solid #F0D000;
}
a:active {
background-color: transparent;
color: #60A000;
}
a:focus {
background-color: transparent;
color: #60A000;
}

/* externe Links */
.extern {
background-image: url(../images/extern.gif);
background-repeat: no-repeat;
background-position: right center;
padding-right: 15px;
}

/* others */
.invis, hr {
display: none;
}
img {
border: 0 none;
}

code {
font-size: 120%;
background-color: transparent;
color: #c0c;
}