@font-face {
	font-family: 'mutlu';
	src: url('../font/mutlu.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@media screen and (max-width:1024px) {
	nav #logo {
		float: left;
		display: inline-block;
		margin-left: 0;
		letter-spacing: 2px;
		padding: 16px 20px 20px 10px;
		line-height: 20px;
		vertical-align: middle;
	}
}

@media screen and (max-width:720px) {
    #logo1 {
		display: none;
	}
	#logo2 {
		display: block;
	}
	nav {
		width: 100%;
		height: 80px;
		background-color: #000;
		margin: 0;
		z-index: 100;
		text-align: center
	}
	nav #logo {
		padding: 20px 0 10px 0;
		width: 100%;
		text-align: center
	}
	.nav {
		padding: 0;
		text-align: center;
		margin: 0 auto
	}
	nav ul {
		width: 100%;
		text-align: center;
		margin-top: 0
	}
	nav ul {
		display: none
	}
	nav ul li a {
		margin: 5px 8px 0 8px;
		padding: 5px 0;
		font-size: 12px;
	}
}

@media screen and (max-width:520px) {
	#logo1 {
		display: none;
	}
	#logo2 {
		display: block;
	}    
	header {
		background-size: 400%
	}
	nav {
		height: 70px
	}
	nav ul {
		display: none
	}
	footer {
		font-size: 9px
	}
	#impressum {
		padding-bottom: 120px;
	}
}

@media only screen and (min-device-width :320px) and (max-device-width
	:480px) and (orientation :landscape) {
	header {
		height: 180px
	}
	#impressum {
		padding-bottom: 120px;
	}

	header h1 {
		margin-top: 50%;
		font-size: 30pt
	}
	#clip {
		position: absolute;
		top: 180px;
		width: 100%
	}
	#welcome {
		padding: 0px 0px 0px;
	}
	#opening .inner_section h2, #contact .inner_section h2{
		font: 20pt/1.5 'OpenSansRegular'
	}
	nav ul li a {
		margin: 5px 5px 0 5px;
		padding: 5px 0;
		font-size: 10px;
	}
	.swap-img {
		display: none;
	}
	nav #logo {
		margin-left: 0;
		padding: 5px
	}
	nav ul li a {
		font-size: 5pt;
	}
	nav {
		height: 60px;
	}
}

@media only screen and (max-device-width :480px) and (orientation
	:portrait) {
	body, html {
		background-size: initial;
	}
	header {
		height: 480px;
	}
	#impressum {
		background-size: initial;
		padding-bottom: 120px;
	}
	.openingListItem {
		vertical-align: top;
		width: 300px;
		height: 400px;
		display: inline-block;
	}
	#clip {
		position: absolute;
		top: 480px;
		width: 100%
	}
	header h1 {
		margin-top: 10%;
		font-size: 18pt
	}
	#opening .inner_section h2, #contact .inner_section h2{
		font: 20pt/1.5 'OpenSansRegular'
	}
	nav ul li a {
		margin: 5px 5px 0 5px;
		padding: 5px 0
	}
	nav ul li:last-child {
		display: none
	}
}

@media only screen and (max-device-width :620px) and (orientation
	:portrait) {
	#clip {
		top: 500px;
	}
}

@media only screen and (max-device-width :660px) and (orientation
	:portrait) {
	#clip {
		top: 590px;
	}
}


@media only screen and (max-device-width :700px) and (orientation
	:portrait) {
	#clip {
		top: 640px;
	}
}

@media only screen and (max-device-width :1024px) and (orientation
	:portrait) {
	#clip {
		top: 920px;
	}
}

@media only screen and (min-device-width :700px) and (max-device-width
	:768px) and (orientation :landscape) {
	header h1 {
		margin: 10% auto 0px auto;
	}
	nav ul li:last-child {
		display: none
	}
}

@media only screen and (min-device-width :768px) and (max-device-width
	:1024px) and (orientation :landscape) {
	header h1 {
		margin: 10% auto 0px auto;
	}
}

@media screen and (max-device-width :780px) and (orientation: landscape)
	{
	#welcome {
		padding: 0px 0px 0px;
	}
	#clip {
		position: absolute;
		top: 400px;
		width: 100%
	}
	header h1 {
		margin-top: 10%
	}
}

@media screen and (max-device-width :960px) and (orientation: landscape)
	{
	.swap-img {
		display: none;
	}
	}