@media(max-width: 1100px){
	.container, .container2{
		width: 100%;
		padding: 0 25px;
	}
}



@media(max-width: 900px){
	.menu{
		padding: 0 0 0 0;
	}
	a.showmenu{
		display: block;
		position: fixed;
		right: 10px; top: 10px;
		width: 42px; height: 42px; line-height: 34px;
		background: #fff;
		text-align:center;
		color:#111;
		font-size:24px;
		margin:0 0 0 0;
		z-index: 9;
		border: 4px solid rgba(0,0,0,0.8);
	}
	a.hidemenu{
		display: none;
		position: fixed;
		right: 10px; top: 10px;
		width: 42px; height: 42px; line-height: 42px;
		text-align:center;
		color:#fff;
		font-size:24px;
		margin:0 0 0 0;
		z-index: 11;
	}
	nav{
		display: none;
		float: none;
		position: fixed;
		width: 100%; height: 100%;
		left: 0; top: 0;
		overflow-y: auto;
		z-index: 10;
		background: rgba(0,0,0,0.9);
		padding: 100px 40px;
	}
	nav ul{
		float: none;
		width: 180px;
		display: table;
		flex-wrap: none;
		justify-content:none;
		margin: 0 auto 0 auto;
	}
	nav ul li{
		float: left;
		width: 100%;
		margin-bottom: 20px;
	}
	nav ul li a{
		float: left;
		width: 100%;
		text-align:center;
		color:#fff;
	}
	nav ul li.active a, nav ul li:hover a{
		border-bottom:none;
	}
	/* BREAK */






	.headertop a.logo{
		width: 100px;
		margin: 0 auto 40px auto;
		padding: 7px;
	}
	.headertop h2{
		font-size:24px; line-height: 130%;
		letter-spacing: -1px;
	}
	/* BREAK */





	.about{
		padding: 40px 0;
	}
	.about h2{
		font-size:21px;
		margin:0 0 20px 0;
	}
	.about p{
		font-size:12px;
	}
	/* BREAK */



	.portfolioitems{
		gap: 5%;
	}
	.portfolioitems .item{
		float: left;
		width: 30%;
		margin: 0 0 40px 0;
	}
	/* BREAK */






	.contact{
		margin:20px 0 60px 0;
	}
	.contactbox{
		padding:20px;
	}
	.contactbox .text1{
		float:left;
		width:100%;
	}
	.contactbox .text1 h2{
		text-align:center;
		font-size:21px;
		margin-bottom: 20px;
	}
	.contactbox .text2{
		float:left;
		width:100%;
	}
	.contactbox .text2 p{
		text-align:center;
	}
	/* BREAK */




	footer .copyright{
		float: left;
		width: 100%;
		margin-bottom: 20px;
	}
	footer .social{
		float:left;
		width:100%;
	}
	footer .social a{
		float: left;
		margin-left: 0;
		margin-right: 5px;
	}
	/* BREAK */
}



	


@media(max-width: 500px){


	.portfolioitems{
		gap: 6%;
	}
	.portfolioitems .item{
		float: left;
		width: 47%;
		margin: 0 0 40px 0;
	}
	/* BREAK */



}