a {
	text-decoration: none;
	font-size: 18px;
	font-weight: 300;
	text-transform: uppercase;
	color: #000;
}
a:hover {
	/*font-weight: 400;*/
}

/*footer a {
	text-transform: none !important;
}*/

body {
	/*background: #efefef;*/
}

#container {
	overflow-y: scroll;
	overflow-x:hidden;
	-webkit-overflow-scrolling: touch;
}

header {
	position: fixed;
	max-width: 1280px;
	z-index: 9000;
}
#rucksackLogoLarge {
	position: absolute;
	max-width: 650px;
	max-height: 100%;
	/*max-width: 100%;*/
	/*margin-left: -325px;*/
	left: 0;
	/*top: 50%;*/
	/*margin-left: -400px;*/
	bottom: 0;
}

#navigationPresenter {
	clear: both;
	position: relative;
	width: 750px;
	top: 10px;
	margin-left: -375px;
	left: 50%;	
	z-index: 1005;
}

footer {
	position: fixed;
	max-width: 1280px;
	z-index: 9000;
	bottom: 0;
}

#navigationPresenter li:last-child {
	margin-right: 0;
}

section.firstIntro {
	/*margin-bottom: 0;*/
	margin-top: 180px;
}

section {
	color: #4c4c4c;
	margin: 0 auto 150px;
	width: 800px;
}

section h2 {
	font-size: 28px;
	font-weight: 300;
	margin-bottom: 15px;
}

section h3 {
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 15px;
}
section h3 span {
	font-weight: 300;
	font-size: 14px;
}
section h3.show span {
	position: relative;
	right: 0;
}

.expand {
	cursor: pointer;
}
.expand img {
	margin-left: 10px;
	-webkit-transition: all 1s ease-in;
	   -moz-transition: all 1s ease-in;
	    -ms-transition: all 1s ease-in;
	     -o-transition: all 1s ease-in;
	        transition: all 1s ease-in;
}
.expand img.show {
	-webkit-transform: rotateZ(180deg);
	   -moz-transform: rotateZ(180deg);
		-ms-transform: rotateZ(180deg);
		 -o-transform: rotateZ(180deg);
		    transform: rotateZ(180deg);	
	-webkit-transition: all 0.7s ease-in;
	   -moz-transition: all 0.7s ease-in;
	    -ms-transition: all 0.7s ease-in;
	     -o-transition: all 0.7s ease-in;
	        transition: all 0.7s ease-in;
}

section p {
	clear: both;
	font-size: 18px;
	line-height: 22px;
	font-weight: 300;
	margin-bottom: 15px;
	max-height: 500px;
	opacity: 1;
	-webkit-transition: all 1s linear;
	   -moz-transition: all 1s linear;
	    -ms-transition: all 1s linear;
	     -o-transition: all 1s linear;
	        transition: all 1s linear;
}

section p.hide {
	max-height: 0;
	opacity: 0;
	/*overflow: hidden;*/
}
#AboutRechner {
	margin-top: -120px;
}

#previewScreenContainer {
	margin-bottom: 40px;
}
#previewScreenContainer.fixed {
	position: fixed;
	top: 13px;
	left: 0;
	right: 0;	
}

.arrowTipp {
	font-size: 14px;
	font-weight: 300;
}
.arrowTipp h3 {
	/*font-size: 14px;*/
	text-transform: uppercase;
	margin-bottom: 3px;
}

#introNavigationTipp, #introPaperStackTipp, #introPolaroidTipp {
	-webkit-transition: all 1.5s linear;
	   -moz-transition: all 1.5s linear;
	    -ms-transition: all 1.5s linear;
	     -o-transition: all 1.5s linear;
	        transition: all 1.5s linear;
}
#introPaperStackTipp {
	-webkit-transition-delay: 0.5s;
	   -moz-transition-delay: 0.5s;
	    -ms-transition-delay: 0.5s;
	     -o-transition-delay: 0.5s;
	        transition-delay: 0.5s;
}
#introPolaroidTipp {
	-webkit-transition-delay: 1.5s;
	   -moz-transition-delay: 1.5s;
	    -ms-transition-delay: 1.5s;
	     -o-transition-delay: 1.5s;
	        transition-delay: 1.5s;
}


#introNavigationTipp {
	position: relative;
	width: 285px;
	left: 50%;
	margin-left: -165px;
	opacity: 1;
	top: 165px;
}
#introNavigationTipp.show, #introPaperStackTipp.show, #introPolaroidTipp.show {
	opacity: 1;
}
#introNavigationTipp img {
	float: left;
  	margin: -8px 10px 25px 0;
}

#infoStack {
	position: relative;
	top: 220px;
	clear: both;
}

#introPaperStackTipp {
	position: relative;
	width: 125px;
	left: 50%;
	margin-left: -360px;
	top: 70px;
	opacity: 1;	
}
#introPaperStackTipp img {
	float: left;
	margin: -40px 0 0 -58px;
}

#polaroidImage {
	width: 272px;
	height: 332px;
	position: relative;
	background: #fff;
	padding: 10px;
	left: 50%;
	top: -85px;
	margin-left: -146px;	
	text-align: center;
	-webkit-transform: rotateZ(-2.6deg);
	   -moz-transform: rotateZ(-2.6deg);
	    -ms-transform: rotateZ(-2.6deg);
	     -o-transform: rotateZ(-2.6deg);
	        transform: rotateZ(-2.6deg);
}

#polaroidImage img {
	margin-bottom: 22px;
}

#introPolaroidTipp {
	position: absolute;
	text-align: left;
	width: 167px;
	left: 0;
	margin-left: 362px;
	top: 77px;
	opacity: 1;
}
#introPolaroidTipp img {
	float: left;
	margin: 7px 0 0 -57px;
}

#fillScreen {
	position: static;
	clear: both;
	height: 1000px;
}

.centerOffRight {
	position: relative;
	left: 50%;
	margin: -115px 0 40px 140px;
	display: block;	
}

#footerClose.show, #footerClose {
	opacity: 1;
	-webkit-transition-delay: 0s;
	   -moz-transition-delay: 0s;
	    -ms-transition-delay: 0s;
	     -o-transition-delay: 0s;
	        transition-delay: 0s;
}

footer {
	-webkit-transition: none;
	   -moz-transition: none;
	    -ms-transition: none;
	     -o-transition: none;
	        transition: none;
}
@media screen and (max-width: 800px), screen and (max-height: 800px) {
	header {
		top: 0 !important;
	}
	footer {
		position: relative;
	}	

}

@media screen (max-height: 800px){
	footer {
		position: relative;
	}
	footer.expand {
		position: fixed;
		top: 0px;
		height: 100%;
	}
}

@media screen and (max-width: 800px), screen and (max-height: 799px) {
	section {
		width: 80%;
	}
	section.firstIntro {
		margin-top: 120px;
	}
	.centerOffRight {
		margin: -115px 0 40px -60px;
	}
	#navigationPresenter {
  width: 550px;
  margin-left: -275px;
  left: 50%;
	}
	#infoStack {
		top: 50px;
		margin-left: -350px;
	}
	#polaroidImage {
		top: 0px;
	}
	#previewScreenContainer {
		/*margin-bottom: 250px;		*/
		margin-bottom: 80px;		
	}
	#container {
		height: 100%;
	}
	header, footer {
		z-index: 9000;
		position: absolute;
	}
	footer {
		position: relative;
		bottom: 0;
	}
	footer.expand {
		position: fixed;
		top: 0px;
		height: 100%;
	}
	#footerClose {
		top: 25px;
	}
	#introNavigationTipp {
		margin-left: -120px;
		top: 145px;
	}
	#introPaperStackTipp {
		left: 50%;
  		margin-left: -225px;
  		top: -100px;
  		opacity: 1;
	}
	#introPolaroidTipp {
		right: 20px;
  		margin-left: 0;
  		top: -95px;
  		left: auto;
  		opacity: 1;
	}
	#introPolaroidTipp img {
		display: none;
  		opacity: 1;
	}
}


@media screen and (max-width: 800px) {
	section {
		width: 80%;
	}
	section.firstIntro {
		margin-top: 80px;
	}
	.centerOffRight {
		margin: -115px 0 40px -60px;
	}
	#navigationPresenter {
		width: 90%;
  		margin-left: 0;
  		left: 5%;
	}
	#infoStack {
		top: 120px;
		margin-left: 0px;
	}
	#polaroidImage {
		top: 245px;
	}
	#previewScreenContainer {
		margin-bottom: 290px;		
	}
	#container {
		height: 100%;
	}
	header, footer {
		z-index: 9000;
		position: absolute;
	}
	footer {
		position: relative;
		bottom: 0;
	}
	footer.expand {
		position: fixed;
		top: 0px;
		height: 100%;
	}
	#introNavigationTipp {
		margin-left: -120px;
		top: 125px;
	}
	#introPaperStackTipp {
		left: 0;
  		margin-left: 132px;
  		top: 115px;
  		opacity: 1;
	}
	#introPolaroidTipp {
		right: 70px;
  		margin-left: 0;
  		top: -95px;
  		left: auto;
  		opacity: 1;
	}
	#introPolaroidTipp img {
		display: none;
  		opacity: 1;
	}
}