@media only screen 
and (max-width : 1400px) {
	html, body{ -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
	img{max-width: 100%; height: auto;}
		
	[class^="boxes"] h2{font-size:2.8vw;letter-spacing:2px;}
	
	.boxes1::after {height:100%;top:0;}
	
	.boxes2 div span{width:100%;height:auto;}
	.boxes1 div span{width:53%;height:auto;}
}

@media only screen 
and (max-width : 1100px) {
	header{text-align:center;padding: 40px 0;}
	[class^="boxes"] h2{font-size:30px;}
	[class^="boxes"]{width:100%;margin:50px 0;}
	[class^="boxes"] div span{width:320px;}
	
	.boxes1::after {top:auto;bottom:-50px;width:100%;background:#79984B;height:2px;}
	
	#copyright{margin: 50px 10px 35px;}
}

@media only screen 
and (max-width : 768px) {
	.col3{column-count:2;-webkit-column-count:2;-moz-column-count:2;}
	.boxes2 div{width:100%;margin:25px 0;}
}

@media only screen 
and (max-width : 600px) {
	.container{position:static;}
	header p{font-size:25px;}
	header p span{margin:5px 0 0;}

	[class^="boxes"]{padding:0 25px;}
	[class^="boxes"] h2{font-size:25px;}
	
	.btop{display:block!important;}
	.btt{display:none;}
}

@media only screen 
and (max-width : 370px) {
	[class^="boxes"] div span{width:100%;}
}