/*
## Info:
## CSS-Datei für www.veggie-street-day.de
## begonnen am 09.12.2009 für die Tierfreunde e. V. 
## Screen-Version
*/

/*
## CSS-Konventionen: 
## - bis zu drei Anweisungen in einer Zeile, sonst untereinander
## - Zusammenfassende Anweisungen wo möglich
## - Farben in Hex, falls möglich mit nur drei Zeichen
## - Alphabetische Sortierung der Argumente
## - Verwendung von Leerzeichen zum schaffen einer ansprechenden Optik
## - Reihenfolge beachten:   :link, :visited, :hover, :focus, :active
*/


/*
## Wichtige Daten: 
## - Farben (Farbbezeichnung - Hex-Code): 
##  orange: #e81;
##  grün: #ad6;
##  link-grün: #6a2;
##  navi-rand-grün: #9c5;
*/


/*
Ablage:


- Autofahrtauskunft mit direkter Auswahl der Städte - alles andere automatisch eingeben. 
- genaue Adresse irgendwo ausgeben lassen - sinnvollerweise bei der Anfahrt
- Template für 2010 richtig machen. Evtl. schick mit JQuery, so, dass man sich einblenden lassen kann, was einen grade interessiert (slide out - aber nach rechts bzw. links. 
- Erst mittig geteilt - dann so, dass man jeweils nur eine Stadt seit. 



*/



/* Reset */

.clear {
clear:both;
}

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd,  a, th, td {
	margin: 0;
	border: 0;
	outline: none;
	padding: 0;
	}

body {
	line-height: 1.1;
	}
	
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	padding: .6em 0;
	margin: 0 15px;
	}

ul, ol, li {
	list-style-type: circle;
	}  


/* allgemeine Definitionen */

/* ## Hauptbestandteile ## */
body {
	background-image: url(../images/grafiken/wave.jpg);
	background-position:top;
	background-attachment:fixed;
	font-family: Arial, Verdana, sans-serif;
	font-size:0.8em;
	line-height:150%;
	margin-left: 0px;
	margin-top: 0px;
}

input, textarea {
border: #aaa 1px solid;
margin-top:5px;
margin-bottom:5px; }

p {
	margin-bottom:10px;
}

li {
	list-style-type: circle;	
	}
/* rausgenommen display:inline; */


#page {
background-image:url(../images/grafiken/veg.jpg);
background-repeat:no-repeat;
background-position:left top;
width:1055px;
height:800px;
margin-left:auto;
margin-right:auto;
}	
	
#wrapper {	
	color: #555;
	margin: 0px auto; 
	text-align: left;
	width: 800px;
	}


/* Links */
a, a:link { 
	color: #6a2; 
	text-decoration:none;
	}
	
a:visited {
	}
	
a:hover {
	color:#0a8f00;
	text-decoration:underline;
	}	
	
a:active {color: #0a8f00;
	}
	


/* Überschriften */

h1 {	margin:25px 0 10px 0; clear:both;
	}

h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover, h2 a:active {
	color: #30b0e6;
	font-size: 22px; 
	font-weight: regular;
	line-height: 1;
	margin: 15px 0 10px 0; 
	padding-bottom:4px;
	border-bottom:1px solid #30b0e6;
	text-align:left;
	}

h3, h3 a, h3 a:link, h3 a:visited,  h3 a:hover, h3 a:active {
	color: #333;
	font-size: 15px; 
	font-weight: bold;
	margin:10px 0 5px 0; 
	}
	
h4, h4 a, h4 a:link, h4 a:visited , h4 a:hover, h4 a:active{
	color: #333;
	font-size: 16px;
	font-weight: bold;
	margin: 5px 0 5px 0;
	}

	h2 a, h2 a:link, h2 a:visited, h2 a:hover, h2 a:active,
	h3 a, h3 a:link, h3 a:visited, h3 a:hover, h3 a:active ,
	h4 a, h4 a:link, h4 a:visited, h4 a:hover, h4 a:active 
	{
	border-bottom: #333 dotted 1px;
	}
h2 a:hover, h3 a:hover, h4 a:hover {
	border-bottom: #e81 dotted 1px;
	}

/* Formulare */
input[type="text"]:focus, textarea:focus {
  color: #444;
  background-color: #efe;
}



/* Felder in denen der content oben und unten ausgegeben wird */
#unten {
	border-left:1px solid #e5e5e5;
	border-right:1px solid #e5e5e5;
	border-bottom:1px solid #e5e5e5;
	height:auto;
	background-color:#ffffff;
	}
	
.textfeld-unten {
	margin-top:40px;	
	padding-bottom:20px;
	padding-right:35px;
	padding-left:35px;
	}
	
	.column-left {
	width:460px;
	float:left;
	margin-right:10px;
	}
	
		.cal {	
		background-color:#ededed;
		margin-top:20px;
		padding:10px;
		margin-bottom:20px;
		}
		
			.vorankuendingung {
				font-size:13px;
				font-weight:bold;
				color:#30b0e6;
				margin-bottom:0px;
				padding:2px;
				margin-top:0px;
				margin-left:10px;
			}
	
	.column-right {
	float:right;
	width:240px;	
	margin-left:0px;	
	}
	
	.btn_stuttgart {
	background-image:url(../images/grafiken/btn_stuttgart.jpg);
	background-repeat:no-repeat;
	width:200px;
	height:50px;	
	font-weight:bold;
	font-size:0pt;
	}
	
	.scroller {
	margin-top:50px;
	}
	
	.social {
	height:50px;
	margin-bottom:5px;
	}
	
	.social img{
	margin-right:10px;
	float:left;
	}
	
	.box {
	width:350px;
	padding:10px;
	float:right;
	border:1px solid #e5e5e5;
	background-image:url(../images/grafiken/verlauf_silber.jpg);
	margin:20px;
	margin-top:0px;
	font-size:12px;
	}
	
		.box h3 {
		font-size:1em;
		font-weight:bold;
		margin-bottom:5px;
		margin-top:0px;
		font-size:13px;
		}
		
		
		.box ul  li{	
		list-style-type:circle;			
		list-style-position:outside;	
		line-height:180%;
		margin-left:5px;
		}	
	
	#unten .textfeld-unten ul li {
	list-style-position:inside;
	
	}
	
	#unten .textfeld-unten .img-content {
	margin:5px;
	}
	
#footer {
  background-color:#ffffff;
	border:1px solid #e5e5e5;	
  clear: both;
	padding-top:25px;
	padding-bottom:5px;
	padding-right:35px;
	padding-left:35px;
	margin-top:30px;
}

	.sponsoring-box {
	margin-top:10px;
	height:120px;	
	}
		.sponsoring {
		width:350px;
		height:104px;
		margin-right:5px;
		float:left;
		}

/* Menü */
.navi {
	background-color: #ad6;
	border-top: 3px #9c5 solid;
	color: #fff;
	display:block;
	font-weight:bold;
	float: left;
	width: 800px;
	z-index: 100;
	
		}
.navi > ul { 
	border: 0;
	display: block; 
	padding-left:40px; 
    margin: 0;
	outline: none;
	line-height: 1.7;
	}
.navi ul li { 
	float: left;
	list-style: none;
	padding: 0 10px; 
	position: relative; 
	text-align: center; 
	width: 100px;
	}
.navi ul li ul {display: none;
line-height: 140%;
	}
.navi ul li:hover ul {
	display: block;
	left:0;
	padding: 0; 
	position: absolute;
	border-bottom: #ad6 1px dotted;
	border-right: #ad6 1px dotted;
	border-left: #ad6 1px dotted;
	}
.navi ul li:hover ul li {background-color: #fff; color: #ad6; display: block; 
	}
.navi  a{border-bottom: none; color: #fff;
	}
.navi  a:hover{border-bottom: none; color: #e81; text-decoration:none;
	}
.navi ul li ul a{border-bottom: none; color: #ad6;
	}
	
/* sonstige Classes */
.bg-bild {
	background-repeat:no-repeat;
	}
	

/* der Rest */

/* ## Jot ## */
.jot-err {
	border: 1px solid red; 
	color: red; 
	font-weight: bold; 
	padding: 5px; 
	margin-bottom: 10px;
	}
.jot-cfm {
	border: 1px solid green; 
	color: green; 
	font-weight: bold;
	padding: 5px; 
	margin-bottom: 10px;
	}
.jot-row {
	background-color: #e9e9e9;
	border: 1px solid #CCCCCC; 
	margin-bottom: 10px;
	}
.jot-row-alt {
	background-color: #f9f9f9;
	}
.jot-row-author {
	background-color: #FFFFE1;} /*gibt es so nicht - wir sind Autor*/
.jot-row-me {
	background-color: #FFDDDD;
	}
.jot-row-up {
	border: 1px dotted red;
	}
.jot-row-new {
	border: 1px dotted green;
	}
.jot-comment {
	padding: 3px;
	}
.jot-comment hr {
	border: 0px; 
	border-bottom: 1px solid #cccccc;
	}
.jot-posticon {
	float: right;
	width: 20px;
	height: 20px;
	padding-top: 8px;
	padding-right: 3px;
	}
.jot-posticon img {
	border: 0px;
	}
.jot-mod {float: right;width: 100px;text-align: right;color: #666666;font-weight: bold;}
.jot-mod img {border: 0px;}
.jot-mod a {float: right;padding: 1px;padding-left: 2px;padding-right: 2px;}
.jot-mod a:hover {background-color: #666666;color: #666666;}
.jot-subject {font-weight: bold;font-size: 1.1em;}
.jot-message {padding: 2px;overflow: auto;}
.jot-poster {padding: 0px;text-align: left;font-size: 10px;}
.jot-nav {padding: 0px;text-align: center;margin: 10px;}
.jot-list ul {padding: 0px;text-align: left;margin-bottom: 10px;list-style-position: inside;}
.jot-subscribe {margin-bottom: 10px;}
.jot-form {margin-bottom: 10px;}
.jot-form fieldset {border: 0px;}
.jot-form label {display: block;}
.jot-user {width: 80px; }
.jot-content {margin-left: 12px;}
.jot-extra {text-align: right;}
.jot-editby {font-size: 10px;color: #666666;font-style: italic;}


#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider, #slider li{ 
		/* 
			define width and height of container element and list item (slide)
			list items must be the same size as the slider area
		*/ 
		width:730px;
		height:241px;
		overflow:hidden; 
		margin-left:0px;
		}

#imageslide ul, #imageslide li{
		margin:0;
		padding:0;
		list-style:none;
		margin-left:0px;
		}
	#imageslide, #imageslide li{ 
		/* 
			define width and height of container element and list item (slide)
			list items must be the same size as the slider area
		*/ 
		width:730px;
		height:134px;
		overflow:hidden; 
		margin-left:0px;
		}
	
	span#prevBtn{
	float:left;
	margin-left:340px;	
	height:20px;
	margin-top:10px;
	margin-bottom:20px;
	}
	
		#prevBtn a {		
		padding-top:5px;
		padding-bottom:5px;
		}
	
	span#nextBtn{
	float: right;
	margin-right:340px;		
	height:20px;
	margin-top:10px;
	margin-bottom:20px;
	}
	
		#nextBtn a {		
		padding-top:5px;
		padding-bottom:5px;
		}
		
.thumbscontainer ul  li  {
width:165px;
height:165px;
overflow:hidden;
margin-right:10px;
margin-bottom:10px;
}