/* 
   Reset
------------------------------------------------------------------- */

html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, input, select {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: "gesta-1","gesta-2" sans-serif; vertical-align: baseline;}
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
table, td, th {vertical-align: middle;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: none;}
:focus {outline: 0;}



/* 
   General 
------------------------------------------------------------------- */

html {
	height: 100%;
	padding-bottom: 1px; /* force scrollbars */
}

body {
	background: #ffffff;
	color: #444;
	font-family:"gesta-1","gesta-2";
	line-height: 1.5;
	font-size: 14px;
}



/* 
   Typography 
------------------------------------------------------------------- */

/* Headings */

h1; h2,h3,h4,h5,h6 {
	color: #444;
	line-height: 1;
	margin-bottom: 0.5em;
}

h1 {font-size: 20px;
	margin-bottom: 25px;}
h2 {font-size: 16px;
	margin-bottom: 10px;}
h3 {font-size: 1.5em;}
h4 {font-size: 1.25em;}
h5 {font-size: 1.1em;}
h6 {font-size: 1em;}

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;}



/* Links */

a:focus,a:hover {color: #334e4c;}
a {
	color: #61A8C4;
	text-decoration: none;
}

a.feed {
	background: url('img/icon-feed.gif') no-repeat left center;
	padding-left: 18px;
}
a.more {
	color: #579;
	font-weight: bold;
}
a.more:hover {color: #234;}

/* Links rounds */

a.rounds	{
	margin-right:1px;
	display:block;
	text-decoration:none;
	text-align:center;
	font-size:8px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:25px;
	width:30px;
	height:30px;
	line-height:30px;
	float:left;
	background-color:#222;
	color:#fff;
	-webkit-transition:all 300ms ease-in;
}

a.rounds:hover{
	background:#eee;
	color:#222;
}

a.rounds:active{
	background:red;
	color:#fff;
	-webkit-transition:all 0ms ease-in;
	}



/* Text elements */

p {margin-bottom: 1em;}

abbr, acronym {border-bottom: 1px dotted #666;}
address {margin-bottom: 1.5em;}
blockquote {margin: 1.5em;}
del, blockquote { color:#666; }
em, dfn, blockquote, address {font-style: italic;}
strong, dfn {font-weight: bold;}
sup, sub {line-height: 0;}

pre {
	margin: 1.5em 0;
	white-space: pre;
}
pre,code,tt {
	font: 1em monospace;
	line-height: 1.5;
}

/* General */

.center,.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}



/* Images */

img.bordered,img.alignleft,img.alignright,img.aligncenter {
	background-color: #FFF;
	border: none;
	padding: 3px;
}
img.alignleft, img.left {margin: 0 1.5em 1em 0;}
img.alignright, img.right {margin: 0 0 1em 1.5em;}



/* Floats */   

.left,.alignleft {float: left;}
.right,.alignright {float: right;}

.clear,.clearer {clear: both;}
.clearer {
	display: block;
	font-size: 0;
	line-height: 0;
	height: 0;
}



/* 
   Layout 
------------------------------------------------------------------- */



/* Wrapper */
#site-wrapper {
	margin-left: 60px;
	width: 920px;
   

}



/* Header */
#header {padding-top: 24px;
		
}

/* Top */
#top { 
			height: 135px;
			margin-right: 0px;
			border-bottom: 1px dotted #5c3807; 

}



/* Logo */
#logo {	
	
	margin-left: -8px;
	padding-top: 44px;
	

}
#logo img {}

/* Splash */
#splash {			padding-top: 50px;
					width: 920px;
}



/* Main navigation */
.nav-round {		width: 56px;
					height: 56px;
					float: right;
					margin-left: 10px;
					}

#main-nav {			float:right;
					height: 56px;
					width: 205px;
					margin-top: 58px;
					font-family: gesta-1; gesta-2;

}

a.main-nav {		margin-right:1px;
	display:block;
	text-decoration:none;
	text-align:center;
	font-size:12px;
	-moz-border-radius:28px;
	-webkit-border-radius:28px;
	border-radius:28px;
	width:56px;
	height:56px;
	line-height:56px;
	float:left;
	background-color:#5c3807;
	color:#fff;
	-webkit-transition:all 300ms ease-in;
	}



 a.main-nav:active { background:red;
					color:#fff;
					-webkit-transition:all 0ms ease-in;   
					}

 a.main-nav:hover	{background:#eee;
				color:#222;
			}



/* Columns */

/* Columns * - 2/3 */

.small_1-3 { 	width: 250px;
        		margin:3px;
        		float:left;
        		font-size: 14px;
        		}
        		
.big_2-3 { 		width: 606px;
                padding-left: 20px;
        		margin-top: 3px;
        		margin-bottom: 5px;
        		text-align:justify;
				float:right;
				font-size: 14px;
        		}
        
/*Design Columns */

.design_left { 	width:410px;
				margin-left: 30px;
				margin-top: 10px;
        		margin-bottom: 10px;
        		float:left;
        		border: 1px dotted #5c3807;
  				}
  		
.design_right { width: 410px;
        		margin-top: 10px;
        		margin-bottom: 10px;
        		margin-right: 40px;
        		float:right;
        		border: 1px dotted #5c3807;
  		}
  
/* Projektgalerie */

.imgteaser {
overflow: hidden;
	position: relative;
		}
	
.imgteaser a {
	text-decoration: none;
	float: left;
		}
		
.imgteaser a:hover {
	cursor: pointer;
		}

		
.imgteaser a:hover .desc{
	display: block;
	background: #ffffff;
	filter:alpha(opacity=80);
	opacity:.90;	
	position: absolute;
	bottom: -1px;
	left: -1px;
	height: 101px;
	}
	
.imgteaser a .desc {	display: none;
padding: 25px;
font-size: 14px;
color: black;
	}
 
.imgteaser a:hover .more { visibility: hidden;
margin: 15px;
	}



/*Projekt*/

.screenshot { 	width: 700px; 
				padding-left: 110px; 
				padding-top: 20px; 
				padding-bottom: 30px;
				}
				
.infos { 		width: 280px;
        		margin:3px;
        		float:left;

  				}
  		
.desc { 		float:left;
				width: 606px;
				height: 330px;
				padding-left: 20px;
				font-size: 14px;
				text-align: justify;
				}
				



.infos ul {		list-style-type: none;
				font-size: 12px;
				padding-top: 40px;
				padding-bottom: 20px;
				}
				
.infos li {		height: 54px;
				width: 250px;
				line-height: 12px;				
				border-bottom: 1px dotted #5c3807;
				}
				

				
.infos p {		padding-top: 10px;
				}

/* Start Columns */

.col4 {	width: 840px;
		text-align:justify;
		}



.col3 { width: 280px;
        margin:3px;
        float:left;
        border-width:1px;
  		border-style:solid;
  		border-color:grey;}
.col2 { width: 606px;
        margin:3px;
        float:left;
        border-width:1px;
  		border-style:solid;
  		border-color:grey;}
.col1 { width:454px;
        margin-top: 5px;
        margin-bottom: 5px;
        margin-right: -15px;
        float:left;
        border-width:1px;
  		border-style:solid;
  		border-color:grey;}



/* Footer */

#footer {
	border-top: 1px dotted #5c3807;
	color: #5c3807;
	padding: 5px 0 4px;
	width: 920px;
	font-size: 12px;
}
#footer p {margin-bottom: 0.4em;}
#footer .text-separator {
	padding: 0 3px;
	color: #BBB;
}
#footer a:hover {color: #000;}



/* 
   IE Fixes (zzz)
------------------------------------------------------------------- */

* html .navigation, * html #footer, * html #splash, * html .comment ul {height: 0.01%;}
* html #footer-left {width: 500px;}
.navigation, #splash, .comment ul {min-height: 0.01%;}



/* 
   Slides (zzz)
------------------------------------------------------------------- */

#slider {
	margin-left: 170px;
	margin-top: 30px;
	margin-bottom: 60px;
}

#slider-stage{
	width:600px; 
	overflow:auto; 
	overflow-x:hidden; 
	overflow-y:hidden; 
	height:400px; 
	margin:10 auto;
}

#slider-buttons{
	width:900px;
	margin-left:1px;
	margin-bottom:-1px;
	font-size:12px; 
	font-family:"gesta-1";
}
	
#slider-list{
	width:4000px; 
	border:0; 
	margin:0; 
	padding:0; 
	left:400px;
}
	
#slider-list li{
	list-style:none; 
	margin:0; 
	padding:0; 
	border:0; 
	margin-right:4px;
	padding:4px; 
	background:#ffffff;
	float:left;
	width:600px;
	height:400px;
	
}



/* forms and buttons */

.button1 {
	padding:0;
	margin:0;
	width: 70px;
	height: 16px;
	font-size:10px;
	background-color: #f6f6f6;
	color:#444;
	-webkit-transition:all 300ms ease-in;
	}
	
.button1:hover{
	width: 70px;
	height: 16px;
	font-size:10px;
	background-color: #a5a5a5;
	color:#FFFFFF;
	}
	
button1.active { 
	background-color:#d1d1d1;
    color:white;
    -webkit-transition:all 0ms ease-in;
    }    
    	

/* jquery */

.clicklist {
  	list-style-type: none;
	}

.clicklist li {
  	clear: both;
	}

.clickhead{
 	width: 250px;
 	height: 20px;
 	cursor: pointer;
 	background-color: #ffffff;
 	color: #444;
	}

.clickhead:hover {
 	background-color: none;
 	color: #444;
	}



.clickbody{
  	width: 250px;
	}

.clickbody p{
  	text-align: justify;
  	text-decoration: none;
  	line-height: 10px;
	}
	
/* jquery 2 */	
	
.clicklist_foto
{
  list-style-type:none;
  }



.clicklist_foto li
{
  clear:both;
}

.clickhead_foto
{
 width:300px;
 height:15px;
 cursor:pointer;
 padding-bottom: 15px;
 font-size: 20px;
 color: #61A8C4;
 font-weight: bold;
 -webkit-transition:all 500ms ease-in;



}

.clickhead_foto:hover {
  color: #5c3807;
}