@charset "utf-8";

/*

	Standard layout (screen resolutions above 1200px wide)
	____________________________________________________________________________________________________________________________________________________________________
	
*/

	/* link style */
	a{
		-webkit-tap-highlight-color: rgba(0,0,0,0); /* touch overlay entfernen */
	}
	
	.hidden-links{ display:none; }
	
	
	
	/* navi */
	#navCollapser{ display: none; color:#333; font-size:1em; -webkit-tap-highlight-color: rgba(0,0,0,0); /* touch overlay entfernen */ }
	#nav{
	float: right;
	padding-top: 15px;
	}
	
	#nav .navItem{
		display: inline;
		float: left;
		padding: 0px 5px;
		border-right: solid 1px #ccc;
		
		}
		
	#nav .lastChild{
		border-right: none;
		padding-right: 0px
		}

	#navCollapser{
		display: none;
	}
	
	.navTip{
		display: none;
	}
	
	
	/* portfolio */
	.portfolioItem{
		float: left;
		width: 255px;
		height:200px;
		padding-right: 30px;
		text-align: left;
		padding-bottom: 40px;
		display:none;
	}
	
	.portfolioItem.last{
		padding-right: 0px;
	}

	.portfolioItem img{
		border: solid 0px #333;
		width: 255px;
		margin-bottom: 15px;
	}
	
	
	

/*

	Screen resolutions below 1200px wide
	Suitable for tablets in landscape mode (i.e. iPad 1 & 2, Blackberry Playbook) and netbooks (i.e. HP Mini, Acer Aspire One)
	____________________________________________________________________________________________________________________________________________________________________
	
*/

@media only screen and (max-width: 1200px){
	/* portfolio */
	.portfolioItem{
		float: left;
		width: 210px;
		padding-right: 20px;
		text-align: left;
		padding-bottom: 30px;
		}
		
	.portfolioItem.last{
		padding-right: 0px;
		}
	
	.portfolioItem img{
		border: solid 0px #333;
		width: 210px;
		margin-bottom: 15px;
		}
		
	

}




/*

	Screen resolutions below 960px wide
	Suitable for tablets in portrait mode (i.e. iPad 1 & 2, Blackberry Playbook, Motorola Xoom) and large res smartphones (i.e. Motorola Atrix in landscape mode)
	____________________________________________________________________________________________________________________________________________________________________
	
*/

@media only screen and (max-width: 960px){
	/* portfolio */
	.portfolioItem{
		float: left;
		width: 167px;
		padding-right: 10px;
		text-align: left;
		padding-bottom: 20px;
	}
		
	.portfolioItem.last{
		padding-right: 0px;
	}
	
	.portfolioItem img{
		border: solid 0px #333;
		width: 167px;
		margin-bottom: 15px;
	}
	
	#nav{
		position:relative;
		left:4px;
	}
	
	

		
}

/*

	Screen resolutions below 728px wide
	Suitable for mobile devices (i.e. iPhone, Motorola Atrix, Blackberry)
	____________________________________________________________________________________________________________________________________________________________________

*/

@media only screen and (max-width: 728px){	

	/* link style */
	a{
		color:#333;
		text-decoration:none;
	}

	/* navi */
	#nav{
		float: none;
		margin-top: 30px;
		position:relative;
		z-index:3;
		}
		
	#nav .navItem{
		float: none;
		padding: 15px 0px;
		text-align: center;
		border-right: none;
	}
		
	#nav .lastChild{
		border-right: none;
		padding-right: 0px;
		border-bottom: none;
	}
		
	#nav.collapsible{

		position: absolute;
		top: 0px;
		left: 0px; 
		width: 100%;
		background: #f2f2f2;
		border-bottom:1px solid #ccc;
	}
		
	#navCollapser{
		position:relative;
		z-index:5;
		cursor: pointer;
		width: 100%;
		padding: 15px 0px;
		text-align: center;
		background: #fff;
		border-bottom: solid 1px #ccc;
	}
	
	/* portfolio */
	.portfolioItem{
		float: none;
		width: 100%;
		padding-right: 0px;
		text-align: center;
		padding-bottom: 45px;
	}
		
	.portfolioItem.last{
		padding-right: 0px;
	}
	
	.portfolioItem img{
		border: solid 0px #333;
		width: 100%;
		max-width: 255px;
		margin-bottom: 15px;
	}

}