@charset "UTF-8";



/* ----------------- Reset all styles ----------------- */
*{
	margin: auto 35;
	padding: 0;
	border: 0;
}

/* ----------------- Website background and general text colour ----------------- */
/*body{
	background-image:url(../fotosweb/slideshow/backgroundtexture.png);
	background-color:#f9f9f9;
	color:#2d2d2d;
} */


/* ----------------- Wrapper - keeps all content in the center of page ----------------- */ 
.wrapper{
	margin:0 auto;
	width:90%;
	height:auto;
}


/* The rest is pretty self explanatory - it appears in the order that it occurs on the HTML document */

	
#slideshow{
	width:100%;
	
	max-width: 1200px;
	margin: 0.1em auto;
}


/* - - - - - - - - - - - - - - -  Slider START  - - - - - - - - - - - - - - - */

.html_carousel {
}
.html_carousel div.slide {
	position: relative;
}	
.html_carousel div.slide img {
	width: 100%;
	height: auto;
	-webkit-box-shadow: 0 1px 1px #c1c1c1;
    -moz-box-shadow: 0 1px 1px #c1c1c1;
    box-shadow: 0 1px 1px #c1c1c1;
	border-radius:15px;
}

.clearfix {
	float: none;
	clear: both;
}

/* - - - - - - - - - - - - - - -  Slider END  - - - - - - - - - - - - - - - */




/* ---------------------- RESPONSIVE STUFF - ONLY TOUCH IF YOUR'E CONFIDENT WITH CSS ---------------------- */


@media only screen and (max-width: 1279px) {
	.wrapper{
		width:90%;
	}
	
}

@media only screen and (max-width: 1105px) {
	
	#work{
		width:900px;
}

	.item{
		width:164px;
		height:170px;
		margin:8px;
	}


}	
@media only screen and (max-width: 999px) {
	
	#work{
		width:750px;	
}

	.item{
		width:136px;
		height:144px;
		margin:7px;
	}
	
	.item h3{
		font-size:90%;
	}
	
	.item p{
		font-size:60%;
	}


}
	
@media only screen and (max-width: 835px) {
	
	#work{
		width:650px;	
}

	.item{
		width:116px;
		height:121px;
		margin:7px;
	}
	
	.item h3{
		font-size:75%;
	}
	
	.item p{
		font-size:40%;
	}


}

@media only screen and (max-width: 720px) {
	
	
	
	#work{
		width:460px;	
}

	.item{
		width:210px;
		height:215px;
		margin:10px;
	}
	
}
	.wrapper{
		width:90%;
	}
	
@media only screen and (max-width: 481px) {
	
	#work{
		width:300px;	
	}

	.item{
		width:136px;
		height:140px;
		margin:7px;
	}
	
	.item h3{
		font-size:75%;
	}
	
	.item p{
		font-size:40%;
	}
		.wrapper{
		width:100%;
	}
	
}


	
	
