

/*
  StyleSheet	grundstruktur.screen.css
  Projekt: www.naju-bayern.de
  Medium:  Screen
  Autor:   Thomas Jahn <thomas.jahn@naju-bayern.de>
  Datum:   2007-09-17
*/

/*
  Wichtige Farben:
	Gelber Hintergrund:	#f7e75a
*/

html, body, div, p, h1, h2, h3, ul, ol, span, a, table, td, form, img, li {
   margin: 0;
   padding: 0;
   font-family: sans-serif;
   text-decoration:none;
}



body{
  /* POSITIONIERUNG UND GROESZE */
  /* Benutze den ganzen Bildschirm! */
  margin:0 auto;
  width:800px;

  /* HINTERGRUND */
  /* gelbe Hintergundsfarbe */
  background-color:#f7e75a;
  background-image:url("../../graphics/kirschblatt.jpg");

  /* SCHRIFT */
  /* Serifenlose Schrift zu Gunsten der Lesbarkeit */
  font-family:sans-serif;
}


#rightbannerbox{
position:absolute;
top:5px;
right:5px;

}

/* 1 - Menü oben */

#topmenu{
/* POSITIONIERUNG UND GROESZE */
  top:20px;
  margin:20px auto 0px;
  height:20px;  
  width:800px;
	padding:0px;
  z-index:1;

  /* HINTERGRUND */
  /* Der Hintergrund ist eine Grafikdatei. Kann diese nicht geladen werden, steht eine Ersatzfarbe bereit */
  background-color:navy;
 /*// background-image:url("../../graphics/bghaed.gif");*/

  /* SCHRIFT */  
  /* Ausrichtung der Schrift nach rechts */
  text-align:right;
}

#topmenu a{
  /* die einzelnen Links sollen etwas auseinandergerückt werden */
  margin-right:7px;
  padding-left:3px;
  padding-right:3px;

  /* Keine Unterstreichung! */
  text-decoration:none;

  /* SCHRIFT */
  font-family:sans-serif;
  color:black;
	
}

#topmenu a:link {
  border:solid 1px navy;
}
#topmenu a:visited{
  border:solid 1px navy;
}
#topmenu a:hover{
/*  // background-image:url("../../graphics/bghaed_inv.gif"); */
  border-bottom:solid 1px black;
  border-right:solid 1px black;
  border-left:solid 1px gray;
  border-top:solid 1px gray;
}
#topmenu a:active{
  color:#ffdf00;
/*   //background-image:url("../../graphics/bghaed_inv.gif"); */
  border-bottom:solid 1px black;
  border-right:solid 1px black;
  border-left:solid 1px gray;
  border-top:solid 1px gray;
}
#topmenu a:focus{
  color:#ffdf00;
/*   //background-image:url("../../graphics/bghaed_inv.gif"); */
  border-bottom:solid 1px black;
  border-right:solid 1px black;
  border-left:solid 1px gray;
  border-top:solid 1px gray;
}


/* 2 - Wolkenhimmel */

#head{
  /* POSITIONIERUNG UND GROESZE */
  top:20px;
  height:245px;  
  width:800px;
  z-index:-1;

  /* HINTERGRUND */
  /* Der Hintergrund ist eine Grafikdatei. */
/*   //background-image:url("../../graphics/oben-magnus1.jpg"); */
background-image:url("../../graphics/topgrafik.jpg");
}


/* 3 - Brotkrumennavigation */

#klickpfad{
  /* POSITIONIERUNG UND GROESZE */
  position:relative; 
  top:230px;
  left:210px;
/*   margin-top:20px; */

  /* SCHRIFT */
  color:gray;
  font-size:70%;
}


/* 4 - Hauptblock */

#body{
  /* POSITIONIERUNG UND GROESZE */
  position:absolute;
  margin:0px auto;
  width:800px;

  /* HINTERGRUND */
  background-color:#efefef;
  background-image:url('../../graphics/streifenlinks.gif');
  background-repeat:repeat-y;
  background-position:left;
}


/* 4.1 - Links */

#links{
  /* POSITIONIERUNG UND GROESZE */
  position:relative;
  width:200px;
  z-index:0;
  float:left;
  padding-bottom:50px;  
  margin-right:10px;
  padding-top:10px;

  /* HINTERGRUND */
  /* Der "Schwung" am unteren Ende */
  background-color:navy; 
  background-image:url('../../graphics/linkabschluss.gif');
  background-repeat:no-repeat;
  background-position:bottom;
}

#links .links-box{
  /* RAHMEN */
  border-top:#ffdf00 dashed 2px;

  /* POSITIONEN */
  padding-top:10px;
  margin-top:10px;
}


#links .navi1{
  padding-left:5px;  
  width:100%;
  font-size:85%;
  line-height:150%;
  margin-top:10px;

/* background-color:red; */
}
#links .navi2{
  margin-left:30px;
  font-size:85%;
  display:list-item;
}
#links .navi3{
  font-size:85%;
  margin-left:50px;
  display:list-item;
}

#links div a{
  text-decoration:none;
  padding:2px;
/* font-weight:bold; */
}
#links div a:link{ 
  color:#ffdf00;
}         
#links div a:visited{
  color:#ffdf00;
}        
#links  div a:hover{
/*   color:#dd0000; */
	color:#ffdf00;
  background-color:#2222cc;
 
}
#links  div a:active{
  color:#dd0000;
}
#links  div a:focus{
  color:#dd0000;
}
#links h1{
  font-size:85%;
  text-align:center;
  font-style:italic;
/*   margin-left:30px; */
}
#links h2{
  font-size:85%;
  text-align:center;
  font-style:italic;
/*   margin-left:30px; */
}

#inhaltlinks{
width:100%;
position:relative;
padding:0px;
margin:0px;
float:left;
}
#inhaltlinks .contentbox{
  /*/* Der "Schwung" am oberen Ende *
  background-color:navy;
  background-image:url('../../graphics/linktrennung.gif');
  background-repeat:no-repeat;
  background-position:top;*/
  padding-top:30px;
}
#inhaltlinks .contentbox .csc-section{

  margin-left:10px;
  width:180px;
  font-size:85%;
  line-height:150%;
  margin-top:10px;
  list-style:none;
  list-style-position:outside;
}


/* 4.2 - Inhalt */
#text .contentbox{

}
#text{
  /* POSITIONIERUNG UND GROESZE */
  position:relative;
  padding:10px;
  margin-left:200px;

  /* HINTERGRUND */
  background-color:#efefef;	
}

#text h1{
  /* SCHRIFT */
  font-size:160%;
/*   line-height:110%; */
  font-family:sans-serif;
  font-weight:normal;
  color:#dd0000;

  /* POSITION */
/*   margin-top:10px; */
}
#text h2{
  /* SCHRIFT */
  font-size:120%;
  margin-bottom:0px;
  font-family:sans-serif;
  font-weight:normal;
  color:#dd0000;

  /* POSITION */
  margin-top:25px;
}
#text h3{
  /* H3 wird eigentlich nicht benutzt, aber man kann ja nie wissen ... */

  /* SCHRIFT */
  font-size:120%;
  line-height:150%;
  font-family:sans-serif;
  font-weight:bold;
  color:#dd0000;
  bottom:0px;

  /* POSITION */
  margin-top:10px;
}

#text p{
  /* POSITION */
  margin-top:0px;
  line-height:140%;
}

#text ul{
  /* POSITION */
  margin-top:10px;
  
  line-height:140%;
}

#text li{
  /* POSITION */
  margin-left:30px;
  /* SCHRIFT */
  
}

#text a:link {
  color:navy;
  text-decoration:none;
}
#text a:visited{
 color:blue;
 text-decoration:none;
}
#text a:hover{
 color:#dd0000;
 text-decoration:underline; 
}
#text a:active{
 color:#dd0000;
}
#text a:focus{
 color:#dd0000;
}

/* Countdown z.B. auf Camp-Seiten */
.countdownbox{
  border:1pt solid red;
  text-align:center;
  background-image:url("../../graphics/kirschblatt.jpg");
  margin:15px;
  padding:15px;
  font-weight:bold;
}
.countdownbox .countdown{
  color:red;
  font-size:120%;
}



/* 5 - Streifen */

#streifen{
  /* POSITIONIERUNG UND GROESZE */
  clear:left;
  position:relative;
  bottom:0;
  width:800px;
  height:39px;
  z-index:1;
  
  /* HINTERGRUND */
  background-image:url("../../graphics/streifen.gif");
}
#ecke{
/* POSITIONIERUNG UND GROESZE */
  clear:left;
  position:relative;
  bottom:0;
  width:39px;
  height:39px;
  z-index:2;
  /* HINTERGRUND */
  background-image:url("../../graphics/streifenecke.gif");
}
#close{
	height:0px;
}

.clearbox{
clear:both;
}
.clearboxleft{
clear:right;
}


/* Hacks */
DIV.csc-textpic DIV.csc-textpic-imagewrap {
position:relative;
}

.jm-gallery-album-entry{
position:relative;
}
.jm-gallery-image-entry{
position:relative;
}