/*** width ***/

body {
	text-align: left;
}

#container {
	height: auto;
}

#wrapper {
	width: 500px;
	height: auto;
	margin: 0 auto;
}

#main .inside {
	width: 500px;
	height: auto;
	box-shadow: inset 0 0 20px 5px #474f42;
	border-radius: 5px;
	background-color: #4c5646;
}

#main {
	width: 500px;
	height: auto;
	text-align: left;
	border-radius: 5px;
	-moz-box-shadow: 0px 1px 20px #111;
  	-webkit-box-shadow: 0px 1px 20px #111;
	-o-box-shadow: 0px 1px 20px #111;
	-ms-box-shadow: 0px 1px 20px #111;
  	box-shadow: 0px 1px 20px #111;
}

#footer {
	position: relative;
	width: 470px;
	text-align: left;
	margin: 15px;
}

/*** navi ***/

#navi .invisible {
	display: none;
	width: 0;
	height: 0;
}

#navi li.start,
.start #navi li.start {
	margin: 0 146px;
	width: 200px;
	height: 200px;
	float: none;
	background: url(../images/08_300logo.png) 0 -200px no-repeat;
	background-size: cover;
}

#navi li.page1 { background: url(../images/start_01_600limette.jpg) 0 0 no-repeat; }
#navi li.page2 { background: url(../images/start_04_600spaetzle.jpg) 0 0 no-repeat; }
#navi li.page3 { background: url(../images/start_03_gallery.jpg) 0 0 no-repeat; }
#navi li.page4 { background: url(../images/start_02_600eis.jpg) 0 0 no-repeat; }
.start #navi li.page1 { background: url(../images/start_01_600limette.jpg) 0 0 no-repeat; }
.start #navi li.page2 { background: url(../images/start_04_600spaetzle.jpg) 0 0 no-repeat; }
.start #navi li.page3 { background: url(../images/start_03_gallery.jpg) 0 0 no-repeat; }
.start #navi li.page4 { background: url(../images/start_02_600eis.jpg) 0 0 no-repeat; }

#navi li:hover,
.start #navi li:hover {
	background-position: 0 0;
}

#navi ul li.page1,
#navi ul li.page2,
#navi ul li.page3,
#navi ul li.page4,
.start #navi ul li.page1,
.start #navi ul li.page2,
.start #navi ul li.page3,
.start #navi ul li.page4 {
	background-position: 0 -125px;
	position: relative;
	top: 0;
	left: 0;
	background-size: cover;
}

#navi ul li.start:hover,
.start #navi ul li.start:hover {
	background-position: 0 -200px;
}

#navi ul li {
	display: block;
	width: 125px;
	height: 145px;
}

#navi a {
	position: absolute;
	top: 5px;
	left: 5px;
	color: #fff;
	width: 115px;
	height: 15px;
	padding-top: 120px;
	overflow: hidden;
	font-size: 14px;
	text-align: center;
	padding-top: 125px;
}

#navi a.start {
	position: relative;
	width: 200px;
	height: 200px;
	font-size: 0;
	padding: 0;
}

#navi span {
	width: 117px;
	margin: 4px;
	border: none;
	padding-top: 126px;
	height: 15px;
	background: url(../images/mobileSpanFrame.png) 10px 10px no-repeat;
}

.start #navi span {
	display: none;
}

#navi a,
#navi span {
	display: block;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
}

#navi a:hover {
	text-decoration: none;
	text-shadow: 0 0 2px #111;
}

#navi ul li.page2 {
	border-radius: 0 0 0 0;
}

#navi ul li.page4 {
	border-radius: 0 0 0 0;
}

/*** content ***/

h1 {
	font-size: 1.8em;
	line-height: 1.1em;
	text-transform: uppercase;
	margin-top: 0.95em;
	margin-bottom: 0.5em;
	font-weight: normal;
}

h2 {
	font-family: spinnaker;
	font-size: 1.4em;
	line-height: 1.1em;
	margin-bottom: 0.25em;		
}

p {
	font-size: 5mm;
	line-height: 1.25em;
	margin: 0 9px 1em 9px;
	color: #fff;
	padding-left: 20px;
}

a {
	font-size: 5mm;
	color: #fff;
	display: inline-block;
	text-decoration: underline;
	-webkit-transition: text-decoration 600ms ease;
	-moz-transition: text-decoration 600ms ease;
	-o-transition: text-decoration 600ms ease;
	-ms-transition: text-decoration 600ms ease;
	transition: text-decoration 600ms ease;
}

#navi a {
	text-decoration: none;
}

#content,
	.ce_text.block,
.mod_article.block,
.page1 #content_textbox,
.page2 #content_textbox,
.page1 #content_textbox_re {
	position: static;
	width: 450px;
	height: auto;
	padding: 0;
}

#content,
.mod_article.block {
	width: 500px;
}

.ce_videobox.block,
#video,
.mod_article.block {
	padding: 0;
}

.page2 .mod_article.block {
	padding: 0 25px;
	width: 450px;
}

.page1 #content_textbox,
.page1 #content_textbox_re {
	width: 450px;
	height: auto;
	padding: 0 25px;
}

#g_maps .dlh_googlemap.block {
	width: 470px;
	height: 450px;
}

.page4 #image {
	margin-top: 35px;
	height: 600px;
	border-radius: 5px 0px 0px 5px;
	overflow: hidden;
}

.page4 #content_textbox {
  	position: relative;
	padding: 0 25px;
	width: 250px;
}

.page3 .image_container {
	width: 450px;
	height: 300px;
}

.page3 .image_container img {
	opacity: 1;
	border-radius: 5px;
}

.page3 .mod_article.block {
	width: 500px;
	margin: 0;
	padding: 0;
}

.ce_gallery.block h1 {
	padding: 0 25px;
	width: 450px;
}

#imp {
	width: 450px;
	padding: 0 25px;
	overflow: hidden;
	height: auto;
}

#footer li:before {
	content: "Mobiles Layout";
	margin: 0 6px 0 220px;
}

#footer a {
	margin-left: 15px;
}

.page3 #m_gallery .image_container {
	width: 500px;
	height: 300px;
	padding: 0;
	margin-bottom: 25px;
	box-shadow: 1px 1px 3px #111;
}

.start .ce_videobox.ce_videobox.block {
	margin: 25px 0;
}

.ce_html5videojs {
	margin: 0;
	padding: 0;
	width: 500px;
	height: 500px;
}

.start .mod_article.block {
	top: 0;
	left: 0;
}

.start #vid {
	position: relative;
	margin: 25px 0;
}

.start .video-js-box,
#html5video1451 {
	width: 500px;
	height: 500px;
}

.start .video-js.vjs-playing,
.start .video-js.vjs-paused {
	margin: -50px 0 0 -50px;
}

.start .vjs-big-play-button,
.start .vjs-spinner {
	margin: -50px 0 0 -85px;
}