/* andreas01 - an open source xhtml/css website layout by Andreas Viklund (http://andreasviklund.com). Made for OSWD.org, free to use as-is for any purpose as long as the proper credits are given for the original design work. For design assistance and support, contact me through my website or through http://oswd.org/email.phtml?user=Andreas

Version: 1.0
(July 25, 2005)

Screen layout: */

body {
font: 76% Verdana,Tahoma,Arial,sans-serif;
background-color: #fdfbc4;
}

#wrap {
position:relative;
margin-left: auto;
margin-right: auto;
width: 940px;
color: #303030;
}


#avmenu {
z-index:1;
position:absolute;
top:168px;
left:0px;
width: 940px;
height:20px;
margin: 0 0 10px 0;
padding: 0;
font-size: 0.9em;
background-color: #fdee9b;

}


#avmenu a {
z-index:1;
position:relative;
top:3px;
font-weight: bold;
height: 20px;
width:150px;
text-decoration: none;
color: #505050;
padding: 0px 30px 3px 10px;
margin-left: 20px;

}	
	
#avmenu a:hover {
z-index:1;
color: #286ea0;

}

#extras {
position:absolute;
top:250px;
right:15px;
float: right;
width: 130px;
padding: 0;
font-size: 0.9em;
line-height: 1.5em;
}

#extras p {
margin: 0 0 1.5em 0;
}

#content {
position:absolute;
top:250px;
width:700px;
height:800px;
text-align: left;
}

#content h2 {
font-size: 1.5em;
margin: 0 0 0.5em 0;
}

#content img {
padding: 1px;
display:inline;
background: #cccccc;
border: 4px solid #f0f0f0;
}

h3 {
font-size: 14px;
margin: 0 0 10px 0;
}



a {
text-decoration: none;
color: #286ea0;
}

a:hover {
text-decoration: underline;
color: #286ea0;
}

a img {
border: 0;
}

#footer {
z-index:1;
clear: both;
padding: 10px 0 20px 0;
border-top: 4px solid #f0f0f0;
width: 760px;
text-align: center;
color: #808080;
font-size: 0.9em;
}

#footer a {
color: #808080;
text-decoration: none;
}

#footer a:hover {
text-decoration: underline;
}

.left {
margin: 10px 10px 5px 0;
float: left;
}

.right {
margin: 10px 0 5px 10px;
float: right;
}

.textright {
text-align: right;
}

.center {
text-align: center;
}

.small {
font-size: 0.8em;
}

.bold {
font-weight: bold;
}

.hide {
display: none;
}

#kamel {
position:absolute;
z-index:3;
top:10px; 
right:10px;
}
#tewestext
{
position:relative;
z-index:3;
top:5px;
right:-10px;
}



/* 

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.



Code: 

*/ 


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


/* 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 #990000;
}
.pright_b {
	float: right;
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom: 5px;
	vertical-align: text-bottom;
border: 1px solid #990000;
}
.pnormal_b {
	clear: both;
	border: 1px solid #990000;
}


/* JAOS Lightbox Style-Sheet
Einfaches Style-Sheet zur (X)HTML-validen Darstellung
der Thumbnails, ausgelegt auf eine Thumbnail-Grösse
von 60 x 80 Pixel.
Hoch- bzw. Querformat (ls/pt) wird vom Modul berechnet
und dem jeweiligen div's zugeordnet.
*/
div.jaosg_galerie{
text-align:left;
}
div.jaosg_thumbnail{
text-decoration: none;
	/*float: left;*/
	/*border: 0px solid;
	border-color: #AAA #444 #444 #AAA;*/
	margin: 30px 30px;
/*padding-right:30px;*/
}

div.jaosg_thumbnail img{
text-decoration: none;
	/*border: 0px solid;
	border-color: #444 #AAA #AAA #444;*/
}
/* ls=landscape-Format der Thumbs */
div.ls img{
text-decoration: none;
	/*height: 60px;
	width: 80px;
	margin: 0px 0px;*/
}
/* pt=portrait-Format der Thumbs */
div.pt img{
text-decoration: none;
	/*height: 80px;
	width: 60px;
	margin: 0px 0px;*/
}
/*footer schaltet float:left wieder aus */
div#jaosg_footer{
	clear: both;
	padding-top: 1em;
}


/*--------------------------*/
.menu {
  font-family: verdana, sans-serif; 
  width:950px;                    /*  (1)  */
  position:relative; 
  z-index:1;
font-weight: bold;
height: 25px;
top:165px;
text-decoration: none;
background:#fdee9b; 

}
.menu ul {                        /* UL Ebene 1 */
  padding:0; 
  margin:0;
  list-style-type: none;
}
.menu ul li {                     /* Listenelemente der Ebene 1 */
  float:left;
  position:relative;
}
.menu ul li a, 
.menu ul li a:visited {           /* Links der Listenelemente der Ebene 1 */
  display:block; 
  text-decoration:none; 
 
  width:139px;                    /* Breite von (.menu)/(Anzahl der Punkte)-(1Px)  --> (1) */
  height:25px;                    /*  (2)  */
  /*border:1px solid #000;           Border-color am besten = Hintergrundfarbe der Seite 
  border-width:1px 1px 0 0; */
  background:#fdee9b; 
  padding-left:10px; 
  line-height:25px;               /*  --> (2)  */
}
* html .menu ul li a, .menu ul li a:visited {
  width:149px;                    /* für 'normale' Browser */
  w\idth:139px;                   /* für IE */
}
.menu ul li ul {
  display: none;
}

table {
  margin:-1px; 
  border-collapse:collapse;

}

/* li:hover  für non-IE-Browser  ---  a:hover  für IE */
  .menu ul li:hover a,
  .menu ul li a:hover { 
  color: #aaaaaa;
  background:#fdee9b;
}

.menu ul li:hover ul,
.menu ul li a:hover ul {
  display:block; 
  position:absolute; 
  top:25px;                          /*  --> (2)  */
  margin-top:0px;
  left:0; 
  width:150px;
}
* html .menu ul li a:hover ul {
  margin-top:0;
  marg\in-top:1px;
}

.menu ul li:hover ul li ul,
.menu ul li a:hover ul li a ul {
  visibility:hidden; 
  position:absolute; 
  height:0; 
  width:0;
}

.menu ul li:hover ul li a,
.menu ul li a:hover ul li a {
  display:block; 
  background:#fdee9b;
  color: #286ea0;
  height:auto; 
  line-height:1.2em; 
  padding:5px 10px; 
  width:150px;;
}
* html .menu ul li a:hover ul li a {
  width:150px;
  w\idth:129px;
}

.menu ul li:hover ul li a.drop,       /* Ebene 2 mit  Subpunkten */
.menu ul li a:hover ul li a.drop {
  background:#aaa url(../../graphics/drop.gif) bottom right no-repeat;
}

.menu ul li:hover ul li a:hover,      /* Ebene 2 hover */
.menu ul li a:hover ul li a:hover {
  background:#fdee9b; 
}

.menu ul li:hover ul li:hover ul,     /* Ebene 3 */
.menu ul li a:hover ul li a:hover ul {
  visibility:visible; 
  position:absolute; 
  left:150px; 
  top:0;
  width:150px;
}

.menu ul li:hover ul li:hover ul.left,  /* Ebene 3  letztes Element */
.menu ul li a:hover ul li a:hover ul.left {
  left:-150px;
}