/********************************************
   AUTHOR:  			Erwin Aligam 
   WEBSITE:   			http://www.styleshout.com/
	TEMPLATE NAME:		CoolWater
   TEMPLATE CODE: 	S-0019
   VERSION:          1.0     
	DATE:					November-07-2007     	
 *******************************************/
 
/********************************************
   HTML ELEMENTS
********************************************/ 

/* top elements */
* { margin: 0; padding: 0; outline: 0; }

body
{font: 70%/1.5em Verdana, Tahoma, arial, sans-serif; color: #777; text-align: center; margin: 15px 0;
background-image: url(http://www.der-talentschuppen.de/images/site_bg/background.png);}

/* links */
a, a:visited {text-decoration: none; background: inherit; color: #FB9233;}
a:hover {text-decoration: underline; background: inherit; color: #93C600;}

/* headers */
h1, h2, h3, h4 { font-family: 'Trebuchet MS', Tahoma, Sans-serif;  }
h1 {font-size: 150%; font-weight: normal; color: #555;}
h2 {font-size: 160%; font-weight: normal; color: #88ac0b;}
h3 {font-size: 135%; color: #666666;}
h4 {font-size: 500%; text-align: center; color: #D8E8FB;}

/* images */
img {border: 0px solid #E5E5E5; padding: 0px;}
img.float-right {margin: 5px 0px 10px 10px;}
img.float-left {margin: 5px 10px 10px 0px;}

h1, h2, h3, h4 p {margin: 10px 15px; padding: 0;}
ul, ol {margin: 5px 15px; padding: 0 25px;}

code {margin: 5px 0; padding: 15px; text-align: left; display: block; overflow: auto; font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  /* white-space: pre; */
  border: 1px solid #E5F0FB; background: #F4F8FD;}

acronym { cursor: help; border-bottom: 1px dotted #777;}

blockquote {margin: 10px 15px; padding: 0 0 0 25px; font: bold 1.3em/1.5em "Trebuchet MS", Tahoma, arial, Sans-serif; color: #2361BA;
  border: 1px solid #E5F0FB; background: #F4F8FD url(images/template/quote.jpg) no-repeat 8px 6px;}

/* start - table */
table {border-collapse: collapse; margin: 5px 15px;}

th strong {color: #fff;}
th {background: #306bc1 url(images/template/button-bg.jpg) repeat-x 0 0; height: 35px; padding-left: 2px; padding-right: 2px; color: #fff;
	text-align: left; border: 1px solid #306bc1; border-bottom-width: 2px;}
tr {height: 32px; background: #fff;}
td {padding-left: 2px; padding-right: 2px; border: 1px solid #E5F0FB;}
/* end - table */

/* form elements */
form {margin:15px 15px; padding: 10px 0; border: 1px solid #E5F0FB; background: #F4F8FD;}
fieldset {margin: 0; padding: 0; border: none;}
legend {display: none;}
label {display:block; font-weight:bold;	margin: 7px 0;}
input {padding:3px;	border: 1px solid #E5F0FB; font: normal 1em Verdana, sans-serif; color:#777;}
textarea {width:400px; padding:3px;	font: normal 1em Verdana, sans-serif; border: 1px solid #E5F0FB; height:100px; display:block;	color:#777;}

input.button {font: bold 12px Arial, Sans-serif; height: 28px; margin: 0; padding: 2px 3px; color: #fff; 
	background: #306bc1 url(images/template/button-bg.jpg) repeat-x 0 0; border: 1px solid #306bc1;}

/* search form */
.searchform {background-color: transparent;	border: none; margin: 0; padding: 5px 0 5px 0; width: 180px;}
.searchform p {margin: 0; padding: 0;}
.searchform input.textbox {width: 110px; color: #777; height: 20px; padding: 2px; border: 1px solid #D2E8F7; vertical-align: top;}
.searchform input.button {width: 55px; height: 26px; padding: 2px 5px; vertical-align: top;}

/********************************************
   LAYOUT
********************************************/ 
#wrap {width: 790px; background: #CCC url(images/template/content.jpg) repeat-y center top;	margin: 0 auto;	text-align: left;}
#content-wrap {clear: both;	width: 760px; margin: 5px auto;	padding: 0;}
#header {position: relative; height: 131px;	background: #caced1 url(images/template/header.jpg) no-repeat center top; padding: 0;	color: #fff;}

#header h1#logo-text a {position: absolute; margin: 0; padding: 0; font: bolder 55px 'Trebuchet MS', Arial, Sans-serif; letter-spacing: -3px;
	color: #fff; text-transform: none; text-decoration: none; background: transparent;	
	/* change the values of top and left to adjust the position of the logo*/
	top: 18px; left: 35px;}

#header p#slogan {position: absolute; margin: 0; padding: 0; font: bold 13px 'Trebuchet MS', Arial, Sans-serif; text-transform: none;
	color: #FFF;
	/* change the values of top and left to adjust the position of the slogan*/
	top: 80px; left: 50px;}

/* header links */
#header #header-links {position: absolute; color: #C6DDEE; font: bold 14px"Trebuchet MS", Arial, Tahoma, Sans-serif; top: 20px; right: 20px;}
#header #header-links a {color: #fff; text-decoration: none;}
#header #header-links a:hover {color: #D4FF55;}

/* navigation */
#menu {clear: both;	margin: 0 auto; padding: 0;	background: #81C524 url(images/template/menu.jpg) no-repeat;
	font: bold 16px/40px "trebuchet MS", Arial, Tahoma, Sans-serif; height: 40px; width: 790px;}
#menu ul {float: left; list-style: none; margin:0; padding: 0 0 0 10px;}
#menu ul li {display: inline;}
#menu ul li a {display: block; float: left; padding: 0 11px; color: #fff; text-decoration: none; background: url(images/template/sep.jpg) no-repeat 100% 100%;}
#menu ul li a:hover {color: #3b5e0b;}
#menu ul li#current a {color: #3b5e0b;}

/* Main Column */
#main {float: left; width: 555px; margin: 0; padding: 30px 0 0 0; display: inline; background: url(images/template/box.jpg) no-repeat;}
#main h2 {font: normal 180% 'Trebuchet MS', Tahoma, Arial, Sans-serif; padding: 0; 	margin-bottom: 0; color: #2666c3;}
#main h2 a {color: #2666c3; text-decoration: none;}

#main p, #main h1, #main h2, #main h3, #main ol, #main ul,
#main blockquote, #main table, #main form {margin-left: 20px; margin-right: 25px;}
#main ul li {list-style-image: url(images/template/bullet.gif);}

/* Sidebar */	
#sidebar {float: right; width: 195px; padding: 0; margin: 10px 0 0 0; color: #777;}	
#sidebar h2 {margin: 15px 5px 10px 5px; font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif; color: #555;}
#sidebar p {margin-left: 5px;}

#sidebar ul.sidemenu {list-style: none; text-align: left; margin: 7px 10px 8px 0; padding: 0; text-decoration: none; border-top: 1px solid #A9D4EF;}
#sidebar ul.sidemenu li {list-style: none; padding: 4px 0 4px 5px; margin: 0 2px; color: #777; border-bottom: 1px solid #D2E8F7;}

* html body #sidebar ul.sidemenu li {height: 1%;}

#sidebar ul.sidemenu li a {text-decoration: none; color: #1773BC;}
#sidebar ul.sidemenu li a:hover {text-decoration: underline; color: #1773BC;}
#sidebar ul.sidemenu ul {margin: 0 0 0 5px; padding: 0;}
#sidebar ul.sidemenu ul li {border: none;}

/* Footer */	
#footer {color: #C6DDEE; background: #caced1 url(images/template/footer.jpg) no-repeat center top; clear: both;
	width: 790px; height: 57px;	text-align: center;	font-size: 90%;}
#footer p {padding: 10px 0; margin: 0;}
#footer a {color: #fff;	text-decoration: none;}

/* post footer */
.post-footer {background: #F4F8FD; padding: 5px; margin: 20px 25px 0 25px; border: 1px solid #E5F0FB; font-size: 95%;}
.post-footer .date {padding-left: 0px; margin: 0 5px;}
.post-footer .comments {padding-left: 0px; margin: 0 5px;}
.post-footer .readmore {padding-left: 0px; margin: 0 5px;}
.post-by {font-size: .95em;	margin-top: 0;}

/* alignment classes */
.float-left  {float: left;}
.float-right {float: right; }
.align-left  {text-align: left;}
.align-right {text-align: right;}

/* display and additional classes */
.clear {clear: both;}


/* Lightbox */

#lightbox {position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}

#lightbox a img{border: none;}

#outerImageContainer{position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto;}

#imageContainer {padding: 10px;}

#loading{position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0;}

#hoverNav{ position: absolute; top: 0; left: 0;	height: 100%; width: 100%; z-index: 10;}
#imageContainer>#hoverNav {left: 0;}
#hoverNav a{outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%;
	background: transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;}

#prevLink {left: 0; float: left;}
#nextLink {right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover {background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat;}
#nextLink:hover, #nextLink:visited:hover {background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat;}


#imageDataContainer{font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em;}

#imageData {padding:0 10px; color: #666;}
#imageData #imageDetails {width: 70%; float: left; text-align: left;}	
#imageData #caption {font-weight: bold;}
#imageData #numberDisplay {display: block; clear: left; padding-bottom: 1.0em;}			
#imageData #bottomNavClose {width: 66px; float: right;  padding-bottom: 0.7em;}	
		
#overlay {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000;}
	
/* Min-Width */
.lbWidth { /* most browsers */
	position: absolute; top: 0px; left: 0px; width: 100%; min-width: 790px;}

* html .lbContent { /* IE6 */
	margin-left: -790px; position:relative;}

* html .lbMinWidth { /* IE6 */
	padding-left: 790px;}
	
	
/* Clearfix */	
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

</style>