/*********/
/* 750px */
/*********/

@media screen and (max-width: 750px) {
	
	/**********/
	/* Common */
	/**********/

	h3 {
	    margin-top: 20px;    
	}

	nav li {
		padding: 0 15px 0;
	}
	
	/**********/
	/* Header */
	/**********/

	header #logo {
	    margin: 5px 0 0 20px;
	    width: 250px;
	}

	/********/
	/* Main */
	/********/

	main #content {
		width:90%;
	}
	
	/**********/
	/* Footer */
	/**********/
	
	footer #content {
		padding-left:20px;
	}

}

/*********/
/* 650px */
/*********/

@media screen and (max-width: 650px) {

	.introimage {
	    min-height: 0px;
	    max-height: 300px;
	}

	/**********/
	/* Header */
	/**********/

	header #contact {
		text-align:left;
		margin-left:20px;
	}

	header nav {
		float:right;
		margin: 5px 30px 0 0;
	}

	header nav li {
		float:none;
	}

	header nav li.active {
	/* background-color: none; */
	    border-bottom: none
	}

	header nav ul {
		opacity:0;
		position:absolute;
		top:-225px;
		left:0;
		width:100%;
		z-index:10;
		background-color:rgba(255, 255, 255, 0.8);
		padding:0;
	}

	header nav ul li {
		font-size:1em;
		padding: 15px 0;
		border-bottom: 2px dashed rgb(107, 181, 245);
	}

	header #mobilemenutrigger {
	    display:block;
	}

	/**********/
	/* Footer */
	/**********/
	
	footer #content {
		width:100%;
		text-align:center;
		padding:0;
	}

	footer nav {
		width:100%;
		margin: 5px 0;
	}	

	footer nav ul {
		padding:0;
	}	
	
	footer nav ul li {
		float:none;
	}	

}

/*********/
/* 350px */
/*********/

@media screen and (max-width: 350px) {

	/**********/
	/* Header */
	/**********/

	header #logo {
	    width: 200px;
	}

	header #mobilemenutrigger {
	    height:37px;
	    width:33px;
	}


}