/*******************************************************************************
Project: Redaxo Demo, Copyright: hundertmorgen, screen & function
*******************************************************************************/
/* auf null setzen */

:link,:visited { text-decoration:none; }
ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; font-weight:normal; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input, dl, dt, dd { margin:0; padding:0 }
img, a img,:link img,:visited img, fieldset { border:none }
img { margin:0; padding:0; vertical-align:bottom; }
address { font-style:normal }

table { border:none; padding:0px; margin:0px; border-spacing:0px; font-size:1em;}
tr { border:none; padding:0px; margin:0px; }
td { border:none; padding:0px; margin:0px; vertical-align:top; border-spacing:0px; }


legend { display:none; }

div, p, li, a {background-repeat:no-repeat; }

/* ### reset some basic style ################################################### */

dl       {margin: 0 0 0 0;}
dl dt    {margin: 0 0 0 0;}
dl dd+dt {margin-top: 0;}
dl dd    {margin: 0 0 0 0;}

ol       {list-style: none;}
ol li    {margin: 0 0 0 0;}
ol li ol {margin: 0 0 0 0;}
ol li ul {margin: 0 0 0 0;}

p        {margin-bottom: 0em;}

ul       {list-style: none;}
ul li    {margin: 0 0 0 0;}
ul li ul {margin: 0 0 0 0; list-style: none;}
ul li ol {margin: 0 0 0 0;}

pre      {font-size:1.2em; }

a:hover  {text-decoration:none; }
a:focus  {outline:none;}

/* ### HTML ###################################################################### */
html {
min-height: 99%;
margin-bottom: 1px;
}

/* ### BODY ###################################################################### */
body {
font-family: arial,helvetica,verdana,sans-serif;
font-size: x-small;
margin-top:0px;
margin:0 auto;
background:url(../files/dolpo-hilfe.jpg) no-repeat;
background-position:top center;
background-color:#632700;
}

/* \*/ * html body { font-size: xx-small; } /* *//* IE 5.5 Hack */

.clearer {
display:block;
clear:both;
line-height:0;
height:1px;
font-size:0;
visibility:hidden;
}

.clear {
clear:both;
}

img, div, a, input
{
behavior: url(iepngfix.htc);
}

.floatLeft { float:left; }
.floatRight { float:right; }

.warning { color:#f00; background: inherit; }

#header {
margin:0 auto;
display:block;
padding:0;
width:980px;
height:281px;
}

#logo a,
#logo a:link,
#logo a:visited {
position: absolute;
margin-left: 450px;
margin-top: 22px;
width:345px;
height:47px;
cursor:pointer;
}

#themenbild {
display:block;
position: absolute;
float:left;
margin-left: 285px;
margin-top: 71px;
width:707px;
height:169px;
}

/* ### Website Content - alle Inhalte  - Header to Footer  ######################## */
#webseite {
display:block;
margin:0 auto;
padding:0;
margin-top:0px; /* abstand von Header */
height:100%;
width:980px;
}

/* ### Teaser ##################################################################### */

#main-teaser {

}

/* ### Content #################################################################### */


#content {
display:block;
clear:both;
position:relative;
padding:0 0 0 0;
}

/* hide from IE/MAC \*/
* html #content, * html #main-content {
height:1px;
}
/* end hide */

#main {
float:left;
width:645px;
padding-bottom: 0px; /* Abstand zum Footer */
}

/* ### main-block => MainContent ################################################### */

#main-block-top {

text-align:left;
width:645px;
height: 17px;
background:url(../files/bg-content-top.png);
background-repeat:no-repeat;
}

#main-block {

text-align:left;
width:645px;
background:url(../files/bg-content-slices.png);
background-repeat:repeat-y;
}

#main-content-block { /* Rand links rechts innerhalb des Containers, gesamter Inhaltsbereich */
display:block;
padding-left: 60px;
padding-right: 40px;
padding-top: 15px;
padding-bottom: 20px; /* Abstand Inhalt zum Boxende */
/*
background-color:#333333;
border:1px solid #aaa;
*/
}


#main-teaser {
/* background:url(main_teaser.jpg) no-repeat; */
}

/* ### headlines ############################################################ */

#main-block h1 {
color:#5f0101;
font-size: 14pt; /*1.7em;*/
font-weight:bold;
line-height:1.3em;
/* font-family: "Lucida Sans Unicode",georgia,verdana; */
font-family: georgia,verdana;
padding-bottom: 23px;
padding-left: 32px;
text-transform:uppercase;
background:url(../files/bg_h1.png);
background-repeat:no-repeat;
}

#main-block h2 {
color:#7b4c00;
font-size: 9pt; /*1.7em;*/
font-weight:bold;
line-height:1.3em;
font-family: georgia,verdana;
padding-bottom: 11px;
letter-spacing: 0px;
text-transform:uppercase;
letter-spacing: 1px;
}

#main-block h3 {
color:#3f98d4;
font-size: 9pt; /*1.7em;*/
font-weight:bold;
line-height:1.3em;
font-family: tahoma,arial, verdana;
padding-top: 3px;
padding-bottom: 8px;
letter-spacing: 1px;
}

/* ### Images ############################################################ */

#main-block img {
display:block;
margin:2px 0;
}

#main-block img.floatLeft {
float:left;
margin:4px 10px 4px 0;
}

#main-block img.floatRight {
float:right;
margin:4px 0 4px 10px;
}

/* ### Standard Hyperlinks Content ################################################### */

#main-block a,
#main-block a:link {
color:#5f0101;
background: inherit;
text-decoration:none;
background-color:#f6f6d7;
}

#main-block a:hover {
color:#FFFFFF;
background-color: #c5c597;
text-decoration: none;
}

#main-block a.artikelliste,
#main-block a:link.artikelliste {
font-size: 8pt;
color:#3f98d4;
text-decoration:underline;
text-transform:none;
line-height: 1.5em;
}

#main-block a:visited.artikelliste {
color:#3f98d4;
}
#main-block a:hover.artikelliste {
color:#8c8c8c;
text-decoration:none;
}

/* ### Paragraphs ########################################################## */

#main-block p,
#main-block td {
margin-bottom: 8px; /*0.6em; Alle Texte im Content-Bereich */
font-family: georgia,tahoma,arial,verdana;
font-size: 9pt; /*1.4em;*/
line-height:1.5em;
color: #282c2e;
text-align: justify;
}

/* ### Tables ############################################################## */

#main-block table {
font-size:1.2em;
line-height:1.6em;
}

#main-block td {
padding:0 0 0 0;
}

/* ### Blockquotes ########################################################## */

#main-block blockquote {
margin:0 0 0 20px;
}

/* ### Lists ################################################################ */

#main-block ul,
#main-block ol {
font-family: georgia,tahoma,arial,verdana;
color: #282c2e;
margin-bottom:1.2em;
font-size: 9pt; /*1.4em;*/
line-height:1.5em;
overflow: hidden; /* gegen überlappung bei Bilderumfliessen */
}

#main-block ol li {
margin:0 0 0 30px;
list-style-type:decimal-leading-zero;
}
#main-block ul li {
margin:0 0 0 30px;
list-style-type:square;
}

/* ### Module ################################################################ */

#main-content-block div.floatLeft img {
float:left;
margin:8px 40px 4px 0;
}

#main-content-block div.floatRight img {
float:right;
margin:4px 0px 4px 40px;
}

#main-content-block a.more {
clear:left;
position: relative;
left: 120px;
}

/*        Images im Textile
------------------------------------------------------------------------------*/

.flLeft  { float:left; }
.flRight { float:right; }

#main-content-block div.mytext {
margin-top: 0px;
margin-left: 0px;
}

#main-content-block div.mytext p { /* Spezielle Texteinstellung für Textile
font-size:1.1em; /* 9pt */
}

#main-content-block div.mytext div.image {
margin-bottom: 1.1em;
margin-top: 0.2em; /* Bild neben text und Oberkante gleich */
}

#main-content-block div.mytext div.image p { /* Bildunterschrift */
float: right;
margin:0;
color: #fbf9e3;
padding: 0px 3px 0px 3px;
font-size:1.1em;
background-color: #9c9762;
}
#main-content-block div.mytext div.flLeft {
margin-right:14px;
}
#main-content-block div.mytext div.flRight {
margin-left:14px;
}
#main-content-block div.mytext img {
border:1px solid #756312; /* Rahmen um Bilder */
border-top:5px solid #756312; /* Rahmen um Bilder */
border-bottom:5px solid #756312; /* Rahmen um Bilder */
}

/* wichtiger Hinweis Textile Modul 016*/

#main-block div.hinweis {
margin-top: 5px;
margin-bottom: 0px;
background-color:#a8a871;
padding: 3px 5px 2px 5px;
/* border-left:5px solid #3f98d4; */
}
#main-block div.hinweis p {
color:#f4f5d4;
}

/*           TINYMCE Editor
*******************************************************************************/

#main-content-block .my_wysiwyg {
font-size: 8pt; /*1.4em;*/
margin-bottom: 15px;
}

#main-content-block .my_wysiwyg p,
#main-content-block .my_wysiwyg td  {
margin-bottom: 6px;
font-family: tahoma, arial, helvetica, sans-serif;
font-size: 8pt; /*1.4em;*/
line-height:1.4em;
color: #000000;
text-align: left;
}

#main-content-block .my_wysiwyg table
{
color: #253b54;
font-size: 9pt;
}

#main-content-block .my_wysiwyg td {
border-bottom:1px solid #d0d0d0;
padding: 2px 3px 2px 0px;
background-color: #f8f8f3;
padding-left:7px;
}

/* ------------ Zweispalter mit Textile ----------------------------------------------*/

div.zweispalter {
font-size: 10pt;
width: 600px;
}

.zweispalter_1 {
width: 280px;
}

.zweispalter_2 {
width: 280px;
margin-left: 20px;
}

.zweispalter_1,
.zweispalter_2 {
float: left;
}

/* ############### Bild mit Text nicht umfließen ah ############################################ */

.flLeft  { float:left; }
.flRight { float:right; }

#main-content-block div.ah {
display: block;
padding-top: 0px;
margin-top: 0px;
margin-left: 0px;
width: 550px;
}

#main-content-block div.ah div.bild {
display: block;
float: left;
width: 230px;
}

#main-content-block div.ah div.bild div.zoom  a img,
#main-content-block div.ah div.bild div.zoom  a:link img { /* zoom schalter mit lightbox, liegt im div .bild, kein rahmen */
display: block;
float: left;
border:0px solid #d1d1d0;
}

#main-content-block div.ah div.text { /* text-part rechts vom Bild */
display: block;
float: left;
width: 315px;
}

#main-content-block div.ah p { /* Spezielle Texteinstellung für Textile */
line-height:1.6em;
}

#main-content-block div.ah div.image {
margin-bottom: 10px;
margin-top: 0px; /* Bild neben text und Oberkante gleich */
padding: 2px 2px 2px 2px;
border:0px solid #e4e4e4; /* Rahmen um Bilder */
}

#main-content-block div.ah div.image p { /* Bildunterschrift */
margin:0;
color: #3f98d4;
font-size:8pt;
}
#main-content-block div.ah div.flLeft {
margin-right:14px;
}
#main-content-block div.ah div.flRight {
margin-left:14px;
}

#main-content-block div.ah div.text a, /*schaltfläche im Textcontainer */
#main-content-block div.ah div.text a:link,
#main-content-block div.ah div.text a:visited
{
padding: 1px 4px 1px 4px;
background-color: #f1f1f1;
text-decoration: none;
color: #000000;
}
#main-content-block div.ah div.text a:hover {
background-color: #f7a817;
color: #000000;
}


/* ------------ TERMINE Dreispalter mit Textile ----------------------------------------------*/

div.dreispalter {
display: block;
float: left;
width: 630px;
background:url(../files/bg_dreier.jpg);
background-repeat:no-repeat;
}

div.dreispalter_1 {
display: block;
float: left;
padding: 0px 0px 0px 0px;
width: 185px;
/* background:url(../files/termine_datum.jpg); */
/* background:url(../files/termine_ort.jpg); */
}

div.dreispalter_2 {
display: block;
float: left;
padding: 0px 0px 0px 30px;
width: 185px;
/* background:url(../files/termine_datum.jpg); */
/* background:url(../files/termine_ort.jpg); */
}

div.dreispalter_3 {
display: block;
float: left;
padding: 0px 0px 0px 30px;
width: 185px;
/* background:url(../files/termine_datum.jpg); */
/* background:url(../files/termine_ort.jpg); */
}

#main-content-block div.dreispalter_1 img,
#main-content-block div.dreispalter_2 img,
#main-content-block div.dreispalter_3 img {
float: left;
padding-bottom: 10px;
padding: 2px 2px 2px 2px;
border:1px solid #e4e4e4; /* Rahmen um Bilder */
margin-bottom: 10px;
}

#main-content-block div.dreispalter_1 p,
#main-content-block div.dreispalter_2 p,
#main-content-block div.dreispalter_3 p {
color: #4b4d4d;
text-align: justify;
}

/*           Contentbereich - download
*******************************************************************************/

#main-content-block div.download {
float: left;
/* width:510px; */
height: 24px;
margin:0px;
/* border:1px solid #f6f5f5; */
background-image:url(../files/bg-download.gif);
background-position: left top;
background-repeat:no-repeat;
margin-bottom: 10px;

}

#main-content-block div.download p {
text-align: left;
font-weight:normal;
color:#e1e1b7;
padding-left:38px;
padding-top: 3px;
padding-right: 3px;
padding-bottom: 5px;
}

#main-content-block .download img {
padding-right: 7px;
padding-top: 0px;
padding-left: 0px;
}

#main-content-block div.download a,
#main-content-block div.download a:link,
#main-content-block div.download a:visited
{
padding: 0px 5px 0px 5px;
font-weight:normal;
background-color: #c9c35d;
color:#000000;
text-decoration: none;
}


#main-content-block div.download a:hover
{
padding: 0px 5px 0px 5px;
font-weight:normal;
background-color: #FFFFFF;
color:#517088;
text-decoration: none;
}

#main-content-block div.download-without-desc {
margin-bottom: 8px;
/*
border-top:1px solid #DFB07A;
*/
}


/* Bannerbild im Content */

#main-content-block div.bannerbild-inhalt img {
border:5px solid #eae9e9; /* Rahmen um Bilder */
}
/* ### Bildergalerie - JAOS Gallery ###################################################### */

#joasg {

clear: both;
text-align:center;
margin:0 auto;
width: 610px;
}
.jaosg_galerie{
margin:0 auto;
text-align:center;
vertical-align:middle;
padding:5px;
font-size: 30pt;
}

.jaosg_thumbnail {
margin:0 auto;
float: left;
margin:5px;
height: 90px;
width: 80px;
text-align: center;
vertical-align:middle;
}

#joasg .jaosg_thumbnail img {
padding: 1px; /* Rahmen mit feinem Abstand */
border:1px solid #c0d391;
}

#joasg .jaosg_bild img {
padding: 0px;
margin-top: 30px;
padding: 1px; /* Rahmen mit feinem Abstand */
border:1px solid #c0d391;
}

#joasg .jaosg_bildbeschreibung {
font-weight: normal;
font-size: 1.1em;
}

#joasg .joasg_zahl  { /* gilt für Bilderzaehler */
margin:0 auto;
text-align: center;
color:#FFFFFF;
font-weight:bold;
padding-left: 30px; /* link bzw. rechts vom Linktext */
padding-right: 30px;
background-color: #D18707;
text-decoration: none;
font-size:1.0em;
}

.jaosg_link  { /* gilt für alle Linkeigenschaften, active, link, visited */
margin:0 auto;
text-align: center;
color:#999999;
font-weight:normal;
padding-left: 30px; /* link bzw. rechts vom Linktext */
padding-right: 30px;
border:  1px solid #c0d391;
background-color: #F7F7ED;
text-decoration: none;
font-size:1.1em;
}

/* /////////////////////////////////////////////////////////////////////////////////////////////////////// *
/* ////// Für Galerie Content, CSS für 03.68 - Bildergalerie - JAOS Lightbox Content  /////////////////// */
/* ////// Für Galerie Content, sowie No Javascript statisch /////////////////// */

#light_joas_content {
clear: both;
text-align: center;
margin:0 auto;
width: 610px; /* auch in 100% bei IE 6 Bugbreite für Bildergalrie */
/* background-color: #d1c9ac; */
/*background:url(tansania_bg_galerie.jpg) repeat-y;*/
margin-bottom: 0px;
padding-left: 4px;
margin-top: -5px;
/* border:  1px solid #a19a82; */
}

#light_joas_content .content {
margin:0 auto;
text-align: center;
vertical-align:middle;
padding:0px;
font-size: 12pt;
}


#light_joasg_content h1 {
text-align: left;
}

#light_joas_content .jaosg_thumbnail_content{

float: left;
margin-left: 0px;
/*  Abstände zwischen den Thumb-Bilder
background-image:url(bg_lightbox_content.gif);
background-repeat:no-repeat;
*/
color: #000000;
font-size: 9pt;
}

/* ls=landscape-Format der Thumbs */

#light_joas_content .ls_content {
text-align: center;
vertical-align:middle;
/*
width:  100px; /* bug Firefox 80 px breite + 18 px = 98 px aus div.ls img */
/* height: 80px; /* 100 - padding-top  */
margin-right: 5px;
margin-bottom: 10px; /* Abstand von Box zu Box */
}

#light_joas_content .ls_content img {

padding: 2px 2px 2px 2px;
margin-left: 1px;
border:1px solid #9c8d47;
/* Rahmen um Bilder */
/* Wenn Thumb durch Modul vergeben wird
height: 53px;
width: 80px;
*/
}

#light_joas_content .ls_content img:hover {
border:1px dashed #d1d1d0;
}

/* pt=portrait-Format der Thumbs */

#light_joas_content .pt_content {
text-align: center;
vertical-align:middle;
width: 100px; /* bug Firefox 80 px breite + 18 px = 98 px aus div.ls img */
height: 90px; /* 100 - padding-top */
padding: 10px 0px 0px 0px;
margin-bottom: 10px; /* Abstand von Box zu Box */
margin-left: 1px;
margin-right: 2px;
/* border: 1px solid #f00c0c; */
}

#light_joas_content .pt_content img {
padding: 2px 2px 2px 2px;
border:1px solid #d1d1d0; /* Rahmen um Bilder */
/* Wenn Thumb durch Modul vergeben wird Anpassen auf Seitenverhältnis, wichtige Einstellung
height: 77px;
width: 50px;
*/
}

#light_joas_content .jaosg_bildbeschreibung {
/* wenn kein javascript, Bilduntertitel */
font-style: italic;
/* border-bottom: 1px solid #666666; */
font-size: 10pt;
}

#light_joas_content .jaosg_bild img {
/* Bilderrahmen für Grossanzeige bei no javascript */
border-top: 1px solid #c0d391;
border-left: 1px solid #c0d391;
border-right: 1px solid #c0d391;
border-bottom: 1px solid #c0d391;
}

#light_joas_content .jaosg_nav a,
#light_joas_content .jaosg_nav a:link
{
/* wenn kein javascript, Links vor zurück zur übersicht */
margin:0 auto;
text-align: center;
color:#FFFFFF;
font-weight:normal;
padding-left: 35px; /* link bzw. rechts vom Linktext */
padding-right: 35px;
padding-top: 3px;
padding-bottom: 3px;
border-bottom:  1px solid #000000;
background-color: #999999;
text-decoration: none;
font-size:1.1em;
/* background-image:url(bg_navig_joas.jpg); */
background-repeat:repeat-x;
}

/*footer schaltet float:left wieder aus */
#light_joas_content .jaosg_footer{
clear: both;
padding-top: 1.0em;
}

/* ### BILD MIT AUSGABE ALS LIGHTBOX oder EINFACH  //////////////////////////// */
/*
Das Modul nutzt 6  Klassen zur Ausrichtung der Bilder.
.pleft , .pright und .pnormal

.pleft für links ausgerichtete Bilder
.pright für rechts ausgerichte Bilder
.pnormal kann zur Definition einer Normalanzeige verwendet werden.

.pleft_b, .pright_b und .pnormal_b definieren die Anzeige der Bilder für den 2. Stil.
z.B. Anzeige mit Rahmen
Viel Spass beim weiteren basteln.
/* Definition der Klassen ohne Rahmen*/

.pleft {
float: left;
margin-top: 5px;
margin-right: 5px;
margin-bottom: 5px;
vertical-align: text-bottom;
border: none;
}
.pright {
float: right;
margin-top: 5px;
margin-left: 5px;
margin-bottom: 5px;
vertical-align: text-bottom;
border: none;
}
.pnormal {
clear: both;
padding: 2px 2px 2px 2px;
border:0px solid #d1d1d0; /* Rahmen um Bilder */
}

/* Definition der KLassen mit  Rahmen (2.Stil) */

.pleft_b {
float: left;
margin-top: 5px;
margin-right: 5px;
margin-bottom: 5px;
vertical-align: text-bottom;
border: 1px solid #FFFFFF;
}
.pright_b {
float: right;
margin-top: 5px;
margin-left: 5px;
margin-bottom: 5px;
vertical-align: text-bottom;
border: 1px solid #FFFFFF;
}

/* bei Ausrichtung normal */

.pnormal_b,
.pnormal_b a img ,
.pnormal_b img a:link img  {
clear: both;
padding: 2px 2px 2px 2px;
border:1px solid #d1d1d0; /* Rahmen um Bilder */
}

/* ### Artikelliste links  ////////////////////////////////////////////// */

#artikelliste a,
#artikelliste a:link
{
color:#3a6c8e;
font-weight:bold;
text-decoration:underline;
}

/* ### HAARLINIE  ////////////////////////////////////////////////////// */

hr
{
border-style: dashed;
border-color:#FFFFFF;
height: 1px;
width:100%;
margin-top: 2px;
margin-bottom: 10px;
}

/* ### Footer ###################################################################### */

#footer {
display:block;
margin:0 auto;
width:980px;
height:50px;
margin-bottom: 35px;
background:url(../files/footer.png) no-repeat;
}

#footer #footer_text {
font-family: georgia,tahoma,arial,verdana;
padding-top: 11px;
padding-left: 100px;
font-size:7pt;
color:#4e4e1c;
}

#footer p a,
#footer p a:link,
#footer p a:visited {
color: #5a0101;
text-decoration: none;
}

#footer p a:hover {
color: #000000;
text-decoration: none;
}

#ende { height:20px;
}

/* ### Externe Links ################################################################ */

/*
.extern {
padding-left:15px;
background-image:url(extern.gif);
background-repeat:no-repeat;
}
*/

hr
{
border-style: dashed;
border-color:#8d8771;
height: 1px;
width:100%;
margin-top:  0.8em;
margin-bottom: 1.2em;
}

/* ///// VIDEO STREAM ////////////////////////////////////////////////*/

#video_stream {
}

#video_stream div.film {
text-align: center;
/* border: 5px solid #d8d2b2; */
}
.video_content {
}

/* ///// SCHALTER LOGIN ////////////////////////////////////////////////*/

#main-content-block .schalter { /* Schalter */
font-size: 8pt;
width: 140px;
height: 23px;
background:url(../files/bg_schalter_form.jpg);
padding: 0px 1px 0px 1px;
border: 0px solid #a99fc1;
background-color: #008f9b;
font-weight: bold;
margin-left: 0px;
color: #FFFFFF;
font-family: tahoma,verdana, arial, helvetica, sans-serif;
text-align: center;
cursor: pointer;
}

#main-content-block .warning { /* Schalter */
font-size: 8pt;
font-weight: bold;
color: #d02a2a;
}