/*******************************************************************************
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; }

/* ### HTML ###################################################################### */
html {
min-height: 99%;
margin-bottom: 1px;
scrollbar-DarkShadow-Color:#efefef;
scrollbar-Track-Color:#e9e9e9;
scrollbar-Face-Color:#cbcbcb;
scrollbar-Shadow-Color:#efefef;
scrollbar-Highlight-Color:#efefef;
scrollbar-3dLight-Color:#efefef;
scrollbar-Arrow-Color:#efefef;
}

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

/* \*/ * 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:994px;
height:236px;
}

#logo {
display:block;
float:left;
width:218px;
height:236px;
background:url(../files/logo_radtouristik.gif);
background-repeat:no-repeat;
cursor:pointer;
}

#themenbild {
display:block;
float:left;
width:776px;
height:236px;
}

#themenbild #s_specials {
position: absolute;
margin-left: 544px;
margin-top: 154px;
width:232px;
height:33px;
background:url(../files/s_sonderangebote.png);
background-repeat:no-repeat;
cursor:pointer;
}

#themenbild #s_touren {
position: absolute;
margin-left: 544px;
margin-top: 181px;
width:232px;
height:33px;
background:url(../files/s_touren.png);
background-repeat:no-repeat;
cursor:pointer;
}

#themenbild #s_kontakt {
position: absolute;
margin-left: 544px;
margin-top: 208px;
width:232px;
height:33px;
background:url(../files/s_kontakt.png);
background-repeat:no-repeat;
cursor:pointer;
}

/*############## Breadcrumb ####################*/
#bg_breadcrumb {
display:block;
margin:0 auto;
width:994px;
height:34px;
background:url(../files/bg_breadcrumb.jpg);
background-repeat:no-repeat;
}

#bread {
padding-top: 10px;
padding-left: 247px;
}

#breadcrumb .bcTitle,
#breadcrumb .bcActive,
#breadcrumb a,
#breadcrumb a:link
{
width:994px;
height:34px;
margin-top: 10px;
color: #76868b;
text-transform: uppercase;
}

/* ### Website Content - alle Inhalte  - Header to Footer  ######################## */
#webseite {
display:block;
margin:0 auto;
padding:0;
margin-top: 0px; /* abstand Browserleiste */
height:100%;
width:994px;
background-color:#FFFFFF;
/*
background:url(../files/aethiopien-bg-bread.jpg);
background-repeat:no-repeat;
*/
}

/* ### 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_muster {
float:left;
width:572px; /* 542px  */
background:url(../files/bg_content_muster.png);
background-repeat:no-repeat;
}

#main {
float:left;
width:572px; /* 542px  */
padding-bottom: 0px; /* Abstand zum Footer */
background:url(../files/bg_content_slices.png);
background-repeat:repeat-y;
}

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

#main-block {
color: #000000;
text-align:left;
/* background-color:#FFFFFF; */
}

#main-content-block { /* Rand links rechts innerhalb des Containers, gesamter Inhaltsbereich */
display:block;
padding-left: 49px;
padding-right: 43px;
padding-top: 15px;
padding-bottom: 25px; /* 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:#006180;
font-size: 11pt; /*1.7em;*/
font-weight:bold;
line-height:1.3em;
font-family: arial, verdana;
padding-bottom: 15px;
letter-spacing: 2px;
text-transform:uppercase;
}

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

#main-block h3 {
color:#005e7d;
font-size: 10pt; /*1.7em;*/
font-weight:bold;
line-height:1.3em;
font-family: arial, verdana;
padding-bottom: 8px;
}

/* ### 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:#0c6c8c;
background: inherit;
text-decoration:underline;
}

#main-block a:hover {
color:#b2cf00;
background: inherit;
text-decoration: none;
}

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

#main-block a:visited.artikelliste {
color:#0c6c8c;
}
#main-block a:hover.artikelliste {
color:#0c6c8c;
text-decoration:none;
}

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

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

/* ### 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: tahoma,arial,verdana;
color: #282c2e;
margin-bottom:1.2em;
font-size: 8pt; /*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 */
margin:0;
color: #aeb983;
font-size:1.1em;
}
#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 {
padding: 2px 2px 2px 2px;
border:1px solid #d1d1d0; /* Rahmen um Bilder */
}


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

#main-content-block .my_wysiwyg {
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: #282c2e;
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: #f4edd3; */
}

/* ------------ 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: 475px;
}

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

#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: 290px;
}

#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 */
}

#main-content-block div.ah div.image p { /* Bildunterschrift */
margin:0;
color: #e8eae8;
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 img {
padding: 2px 2px 2px 2px;
border:1px solid #d1d1d0; /* Rahmen um Bilder */
}
#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: #005e7d;
text-decoration: none;
color: #FFFFFF;
}
#main-content-block div.ah div.text a:hover {
background-color: #b2cf00;
color: #000000;
}


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

div.dreispalter {
width: 600px;
text-align:left;
}
/* Datum */
#main-content-block div.dreispalter_1 p {
  float: left;
  text-align:left;
  padding: 5px 5px 4px 12px;
  width: 142px;
  /* background:url(../files/termine_datum.jpg); */
  background:url(../files/termine_ort.jpg);
  background-position:top left;
  /* color: #000000; */
  color:#d4e68d;
  font-weight:bold;
  line-height: 1.5em;
}
/* Was */
#main-content-block div.dreispalter_2 p {
  float: left;
  text-align:left;
  padding: 5px 5px 4px 10px;
  width: 230px;
  margin-left: 17px;
  background:url(../files/termine_was.jpg);
  background-position:top left;
  color: #000000;
  font-weight:bold;
  line-height: 1.5em;
}
/* Ort */
#main-content-block div.dreispalter_3 p {
  float: left;
  text-align: left;
  padding: 5px 5px 4px 10px;
  width: 130px;
  margin-left: 17px;
  background:url(../files/termine_ort.jpg);
  color: #96b4d0;
  font-weight:bold;
  line-height: 1.5em;
}

div.dreispalter_1
div.dreispalter_2,
div.dreispalter_3, {

  float: left;
}

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

#main-content-block div.download {
float: left;
margin:0px;
margin-left:1px;
text-align: left;
background-color: #a4a3a3;
border-left:8px solid #700000;
}

#main-content-block div.download p {
font-family: tahoma, helvetica, sans-serif;
font-size: 8pt;
color:#385c7f;
}

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

#main-content-block .download a,
#main-content-block .download a:link,
#main-content-block .download a:hover
{
font-family: tahoma, helvetica, sans-serif;
font-size: 8pt;
font-weight:normal;
color:#FFFFFF;
text-decoration: none;
padding: 0px 10px 0px 0px;
}

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

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

/* ### Bildergalerie - JAOS Gallery ###################################################### */

#joasg {

clear: both;
text-align:center;
margin:0 auto;
width: 670px;

}
.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: 475px; /* 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  */

padding: 10px 8px 0px 0px;
margin-left: 1px;
margin-right: 2px;
margin-bottom: 10px; /* Abstand von Box zu Box */
}

#light_joas_content .ls_content img {
padding: 2px 2px 2px 2px;
border:1px solid #d1d1d0; /* Rahmen um Bilder */
/* Wenn Thumb durch Modul vergeben wird
height: 53px;
width: 80px;
*/

}
/* 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:1px 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:994px;
height:50px;
background:url(../files/footer.png) no-repeat;
margin-bottom: 35px;
}

#footer #footer_text,
#footer #footer_text p {
display:block;
font-family: arial, helvetica, sans-serif;
font-size: 8pt; /* 1.3em */
line-height:1.3em;
color: #9e9d9d;
font-weight:normal;
padding-top: 25px;
margin-left: 175px;
letter-spacing: 0px;
}

#footer p a,
#footer p a:link,
#footer p a:visited {
color: #9e9d9d;
text-decoration: underline;
}

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

#ende { height:40px;
}

/* ### 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 {
}

#main-content-block div.reiseliste a img,
#main-content-block div.reiseliste a:link img {
float:left;
margin-left:8px;
}

#main-content-block div.buchung a,
#main-content-block div.buchung a:link {
padding:2px 10px 2px 10px;
background-color: #cbec02;
text-decoration: none;
font-size: 8pt;
color: #1c59ac;
font-weight: bold;
border: 1px solid #FFFFFF;
margin-bottom: 7px;
/* background:url(../files/bg_schalter_form.jpg); */
}

#main-content-block div.buchung a:hover {
background-color: #005e7d;
color: #FFFFFF;
}