@font-face {font-family: 'GT-Haptik';src: url('webfonts/GT-Haptik-Regular.eot');src: url('webfonts/GT-Haptik-Regular.woff2') format('woff2'),url('webfonts/GT-Haptik-Regular.woff') format('woff'),url('webfonts/GT-Haptik-Regular.ttf') format('truetype');}

@font-face {font-family: 'InternColor';src: url('webfonts/InternColor-Bold-Back.otf');}

html, body {
	width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    font-family: GT-Haptik, sans-serif;
	font-feature-settings: "ss01" 1;
    background-color: #fff;
    color: #000;
}

h1 {
    line-height: 3.5vw;
	font-size: 3vw;
    font-style:normal;
    font-weight:normal;
    padding-left: 2vw;
    padding-right: 2vw;
}

h2 {
	font-family: InternColor, sans-serif;
    line-height: 1vw;
	font-size: 2vw;
    font-style:normal;
    font-weight:normal;
	text-transform: uppercase;
}

h3 {
    line-height: 2vw;
	font-size: 1.5vw;
    font-style:normal;
    font-weight:normal;
}

p, ul, ol {
    line-height: 2.5vw;
	font-size: 2vw;
    font-style:normal;
    font-weight:normal;
}

a:link { color:#ffffff; text-decoration: none; }
a:visited  {color:#ffffff; text-decoration: none; }
a:active { color:#ffffff; text-decoration: none; }
a:hover  {color:#ffffff; text-decoration: underline; }

a.orange:link { color:#ff8200; text-decoration: none; }
a.orange:visited  {color:#ff8200; text-decoration: none; }
a.orange:active { color:#ff8200; text-decoration: none; }
a.orange:hover  {color:#000; text-decoration: underline; }

a.blue:link { color:#5ab4ff; text-decoration: none; }
a.blue:visited  {color:#5ab4ff; text-decoration: none; }
a.blue:active { color:#5ab4ff; text-decoration: none; }
a.blue:hover  {color:#000; text-decoration: underline; }

a.darkblue:link { color:#0046eb; text-decoration: none; }
a.darkblue:visited  {color:#0046eb; text-decoration: none; }
a.darkblue:active { color:#0046eb; text-decoration: none; }
a.darkblue:hover  {color:#000; text-decoration: underline; }

a.black:link { color:#000; text-decoration: none; }
a.black:visited  {color:#000; text-decoration: none; }
a.black:active { color:#000; text-decoration: none; }
a.black:hover  {color:#ff8200; text-decoration: underline; }

a.blackWhite:link { color:#000; text-decoration: none; }
a.blackWhite:visited  {color:#000; text-decoration: none; }
a.blackWhite:active { color:#000; text-decoration: none; }
a.blackWhite:hover  {color:#fff; text-decoration: underline; }

a.act:link { color:#000; text-decoration: underline; }
a.act:visited  {color:#000; text-decoration: underline; }
a.act:active { color:#000; text-decoration: underline; }
a.act:hover  {color:#ff8200; text-decoration: underline; }


#msg{
    position: fixed;
    top:10px;
    left:10px;
    display: none;
	z-index: 1000;
	color: #000;
	background-color: #fff;
}

#main{
	position: fixed;
    top: 0px;
    left: 0px;
	width: 100%;
	height: auto;
}

#scrolling{
	height: calc((15 * 100vh) + (4 * 100vw)) ;
	width: calc(100% - 2px);
	border: 1px solid transparent;
}

.content{
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}

ol, ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

li { 
  padding-left: 2.5vw;
  margin-bottom: 2vw;
}

ul li:before {
  content: "→";
  position: relative;
  left: -2.5vw;
  margin-right: -1.9vw;
}

ol li:before {
  content: "";
  position: relative;
  left: -2.5vw;
  margin-right: -1.9vw;
}

ol{
	margin-top: 1.8vw;
}

#nav{
	position: fixed;
	top: 0;
	left: 0;
	height: 6vw;
	width: 100%;
	border: 1px solid #ff0000;
	display: none;
}


#mobileNav{
	display: none;
}

#hamburger{
	display: none;
}

.desktop{
	display: inline-block;
}


#mainNav{
	position: absolute;
	top: 2vw;
	right: 0;
	height: 3vw;
	width: auto;
	background-color: #fff;
	display: inline-block;
}

#mainNav a{
	margin-right: 2vw;
	line-height: 2vw;
	font-size: 1.5vw;
    font-style:normal;
    font-weight:normal;
}

#nav img{
	height: 6vw;
	width: auto;
}

.langSwitch{
	float: right;
	margin-left: 1vw;
	margin-right: 2vw;
}

#mainNav .langSwitch a{
	margin-left: 0.5vw;
	margin-right: 0.5vw;
	line-height: 2vw;
	font-size: 1.5vw;
    font-style:normal;
    font-weight:normal;
}

#home{
	background-color: #fff;
}
#home img{
	height: 5vw;
	width: auto;
	margin-left: 3vw;
	margin-top: 2vw;
	margin-right: 30vw;
}

#toTop{
	position: fixed;
	bottom: 0vw;
	right: 1vw;
	width: 2vw;
	height: 4vw;
	background-image: url(../images/pfeil_totop_w.svg);
	background-repeat: no-repeat;
	background-size: 75% auto;
	z-index: 5;
	cursor: pointer;
}

#toTop:hover{
	background-image: url(../images/pfeil_totop.svg);
}

#toTopFooter{
	position: absolute;
	bottom: 0vw;
	right: 1vw;
	width: 2vw;
	height: 4vw;
	background-image: url(../images/pfeil_totop.svg);
	background-repeat: no-repeat;
	background-size: 75% auto;
	z-index: 5;
	cursor: pointer;
}

#toTopFooter:hover{
	background-image: url(../images/pfeil_totop_w.svg);
}


.pfeil_tobottom{
	position: absolute;
	bottom: 1vw;
	left: 50%;
	margin-left: -1vw;
	width: 2vw;
	height: 4vw;
	background-image: url(../images/pfeil_tobottom.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	z-index: 5;
	opacity: 0;
	animation: move 3s ease-out infinite;
}

@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px);
  }
}

.teaserPic{
	float: left;
	width: 100%;
	height: calc(100vh - 8vw);
	background-image: url(../images/pagume_home_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	margin-left: 0vw;
	margin-top: 1vw;
}

.statement{
	position: absolute;
	bottom: 6.5vw;
	right: 5.2vw;
	float: right;
	margin-right: 7vw;
	width: 38vw;
	color: #fff;
}

.r50{
	width: calc(50% - 3vw);
	height: auto;
	float: left;
	padding-left: 3vw;
}

.r50:first-of-type{
	width: calc(50% - 3vw - 1px);
	height: 58vw;
	border-right: 1px solid #000;
}

.subtitel{
	width: 100%;
	height: auto;
}

.titelContainer{
	position: relative;
	top: 50%;
	left: 0;
	margin-top: -25vw;
	width: 100vw;
	height: 50vw;
}

#titel_angebot_01, #titel_vision_01, #titel_about_01, #titel_kunden_01, #titel_surprise_01{
	position: absolute;
	left: 0;
	top: 0px;
	z-index: 1;
}

#titel_angebot_02, #titel_vision_02, #titel_about_02, #titel_kunden_02, #titel_surprise_02{
	position: absolute;
	left: 0;
	top: 0px;
	z-index: 2;
}

#fullWidth{
	position: relative;
	left: 0;
	top: 0;
	width: calc(4 * 100vw);
	height: 100vh;
	overflow: hidden;
}

#offer_01 h3{
	color: #fff;
	margin-left: 2vw;
}
#offer_01{
	width: 100vw;
	height: 100vh;
	background-image: url(../images/pagume_angebot_04_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	float: left;
}

#offer_01 .contentBox{
	width: 54vw;
	height: 32vw;
	color: #fff;
	margin-top: -18vw;
	margin-left: -14vw;
	position: relative;
	top: 50%;
	left: 50%;
}

#offer_01 .contentBox h1{
	margin-left: -2vw;
}


#offer_02_de h3, #offer_02_en h3{
	color: #000;
	margin-left: 2vw;
}

#offer_02_de{
	width: 100vw;
	height: 100vh;
	background-image: url(../images/pagume_angebot_02.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	float: left;
	background-color: #efefef;
}

#offer_02_en{
	width: 100vw;
	height: 100vh;
	background-image: url(../images/pagume_services_02.svg);
	background-repeat: no-repeat;
	background-size: 100% auto;
	float: left;
	background-color: #efefef;
}

#offer_04 h3{
	color: #fff;
	margin-left: 2vw;
}

#offer_04{
	width: 100vw;
	height: 100vh;
	background-image: url(../images/pagume_angebot_05_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	float: left;
}

#offer_04 .contentBox{
	width: 50vw;
	height: auto;
	color: #fff;
	margin-top: 6vw;
	margin-left: 40vw;
}

#offer_04 ul li h3{
	padding: 0;
	margin: 0;
	margin-left: -2.3vw;
	margin-top: -5vw;
	margin-bottom: -2vw;
} 

#offer_04 ul li {
	margin-bottom: 4vw;
}

#offer_04Content{
	position: relative;
	top: 0px;
	left: 0px;
}

#angebot_between, #vision_between, #about_between, #tools_between, #customers_between, #surprise_between{
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	float: left;
}

#vision_between{
	background-color: #ff8200;
}

#about_between{
	background-color: #0046eb;
}

#customers_between{
	background-color: #5ab4ff;
}

#tools_between{
	background-color: #fff;
}

#surprise_between{
	background-color: #ff8200;
}

#tools_between .teaserPic{
	width: 100%;
	height: 100vh;
	background-image: url(../images/pagume_eagle_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	margin-top: 0vw;
}

#tools_between .teaserPic .statement{
	float: right;
	width: 55vw;
	color: #fff;
	text-align: right;
	position: absolute;
	bottom: 4vw;
	right: 1vw;
}

#tools{
	background-color: #efefef;
	z-index: 2;
}


#vision{
	background-color: #fff;
}

#vision .r50:first-of-type h3{
	padding-right: 10vw;
}

#vision .r50:first-of-type p{
	padding-right: 10vw;
}

#offer{
	overflow: hidden;
}

#metaNav04{
	color: #0046eb;
}

#about{
	background-color: #fff;
	min-height: 110vh;
}
#about .r50:first-of-type, #customers .r50:first-of-type{
	border: 0px;
}

#about .r50:last-of-type, #customers .r50:last-of-type{
	width: calc(50%);
	height: 110vh;
	padding-left: 0vw;
	padding-top: 0vw;
	position: relative;
	overflow: hidden;
	
}
#about_00{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110vh;
	background-color: #ff0000;
	z-index: 2;
	background-image: url(../images/pagume_team_02_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	overflow: hidden;
}

#about_01{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110vh;
	background-color: #ff8200;
	z-index: 1;
}

#about_02{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110vh;
	background-color: #5ab4ff;
	z-index: 1;
}

#about_03{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 110vh;
	background-color: #0046eb;
	z-index: 1;
}
#about_03 h2{
	margin-left: 3vw;
	margin-top: 5vw;
	line-height: 2.5vw;
	color: #fff;
}

#about_01 .person{
	margin: auto;
	margin-top: 3vw;
	width: calc(100vw * 0.44);
	height: calc(51vw * 0.44);
	background-image: url(../images/christoph_schmoker_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	
}

#about_02 .person{
	margin: auto;
	margin-top: 3vw;
	width: calc(100vw * 0.44);
	height: calc(51vw * 0.44);
	background-image: url(../images/samy_darwish_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	
}
#about_03 ul, #about_01 ul, #about_01 ol, #about_01 p, #about_02 ul, #about_02 ol, #about_02 p{
	line-height: 2.2vw;
	font-size: 1.5vw;
	width: 90%;
	color: #fff;
	margin-left: 3vw;
}

#about_01 ul, #about_02 ul{
	margin-top: 2vw;
}

#about_01 li, #about_02 li{
	margin-bottom: 0vw;
}

#about_03 ul{
	line-height: 2.5vw;
	font-size: 2vw;
}

#metaNavAbout, #metaNavCustomers{
	margin-top: 7vw;
}


#surprise{
	background-color: #fff;
	min-height: 140vh;
}
#surprise .r50:first-of-type{
	border: 0px;
}

#surprise .r50:last-of-type{
	width: calc(50%);
	height: 140vh;
	padding-left: 0vw;
	padding-top: 0vw;
	position: relative;
	overflow: hidden;
	
}

#surprise_01 img, #surprise_02 img{
	width: 80%;
	height: auto;
	padding-left: 10%;
	padding-top: 10%;
}

#surprise_00{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 140vh;
	background-color: #ff0000;
	z-index: 2;
	background-image: url(../images/pagume_surprise_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	overflow: hidden;
}

#surprise_01{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 140vh;
	background-color: #0046eb;
	z-index: 1;
}

#surprise_02{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 140vh;
	background-color: #ff8200;
	z-index: 1;
}

#surprise_01 ul, #surprise_02 ul, #surprise_01 h3, #surprise_02 h3{
    line-height: 2.5vw;
	font-size: 2vw;
	width: 80%;
	color: #fff;
	margin-left: 10%;
}


#CopyPhotographer{
		position: absolute; 
		bottom: 2vw; 
		left: 33vw;
		line-height: 1.5vw;
		font-size: 1.1vw;
		font-style:normal;
		font-weight:normal;
		color: #fff;
	}


#CopyPhotographer_02{
		position: absolute; 
		top: 2vw; 
		left: 2vw;
		color: #fff;
		line-height: 1.5vw;
		font-size: 1.1vw;
		font-style:normal;
		font-weight:normal;
	}


#surprise ul{
	width: calc(100% - 4vw);
	line-height: 2vw;
	font-size: 1.5vw;
    font-style:normal;
    font-weight:normal;
	margin-top: 2vw;
	margin-left: -2.5vw;
}

#surprise ul li{
	width: 100%;
	float: left;
	margin-left: 5vw;
}

#surprise ul li:before{
	margin-left: 0.5vw;
}

#surprise_01 p, #surprise_02 p{
    line-height: 2vw;
	font-size: 1.5vw;
	width: 80%;
	color: #fff;
	margin-left: 10%;
}

#customers{
	background-color: #fff;
	z-index: 2;
}

#customers_01{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: #0046eb;
	z-index: 2;
}

#customers_02{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: #ff8200;
	z-index: 1;
}

#customers_03{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: #5ab4ff;
	z-index: 1;
}
#customers_01 ul, #customers_02 ul, #customers_03 ul{
	margin-top: 7vw;
	margin-left: 3vw;
	font-size: 2vw;
	line-height: 2.6vw;
	color: #fff;
}

#customers_01 li, #customers_02 li, #customers_03 li{
	margin-bottom: 1vw;
}

#principles{
	width: 100%;
	height: 100vh;
	background-color: #ff0000;
	z-index: 2;
	background-image: url(../images/pagume_grundsaetze_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}

#principles h3{
	position: absolute;
	top: 2vw;
	left: 2vw;
	color: #fff;
}

#principlesContent{
	position: relative;
	left: 0;
	top: 50%;
	margin-top: -12vw;
	margin-left: 10vw;
	width: 250vw;
	height: 30vw;
}

#principles_01, #principles_02, #principles_03, #principles_04, #principles_05{
	width: 30vw;
	height: auto;
	float: left;
	color: #fff;
	margin-left: 4vw;
	display: inline;
	margin-top: 2vw;
}

#principles_04{
	width: 70vw;
}

#principles_04 p{
	float: left;
	width: 22vw;
}
#principles_04 ul{
	width: 32vw;
	float: left;
	line-height: 2vw;
	font-size: 1.5vw;
    font-style:normal;
    font-weight:normal;
	margin-top: 2vw;
}

#principles_04 ul li{
	width: 22vw;
	float: left;
	margin-left: 5vw;
}

#principles_05{
	width: 40vw;
}

.number{
	width: 7vw;
	height: auto;
	float: left;
	margin-right: 1vw;
	margin-top: -3.5vw;
}
.metaNav{
	width: calc(100% - 3vw);
  display: flex;
  justify-content: space-between;
  padding-top: 0.2vw;
  padding-bottom: 0.2vw;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  cursor: pointer;
  font-size: 2vw;
  margin-bottom: -1px;
}

input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

#contact{
	height: 52vw;
	background-color: #fff;
	z-index: 2;
}

#contact .teaserPic{
	margin-top: -1vw;
	width: 100%;
	height: 52vw;
	background-image: url(../images/pagume_instrumente_03_3x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

#contact .teaserPic .statement{
	float: left;
	margin-top: 22vw;
	margin-left: 7vw;
	width: 34vw;
	color: #000;
}

#footer{
	height: 35vw;
	background-color: #fff;
	z-index: 2;
}

#footer h3{
	color: #000;
	margin-left: 2vw;
}

#footer .contentBox{
	width: 98vw;
	min-height: 20vw;
	color: #000;
	margin-top: 2vw;
	margin-left: 2vw;
}

.contactBox{
	width: 33%;
	float: left;
	margin-top: 4vw;
	text-align: left;
}

#footer .contactBox h3{
	margin-left: 0vw;
}

.contactBox h2{
	margin-bottom: -0.5vw;
}

#footer #copy{
	line-height: 1.5vw;
	font-size: 1.1vw;
    font-style:normal;
    font-weight:normal;
	margin-left: 2vw;
	margin-top: 5vw;
}

#Impressum{
	padding-left: 2vw;
	cursor: pointer;
}

#Impressum:hover{
	color: #ff8200;
}

#ImpressumContent{
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
	height: 40vw;
	width: 100%;
	background-color: #ff8200;
	
}

#ImpressumContent .contentBox{
		margin-left: 2vw;
}

#closeButton{
	position: absolute;
	top: 2vw;
	right: 2vw;
	z-index: 3;
	color: #000;
	width: 1.5vw;
	height: 1.5vw;
	background-image: url(../images/close.svg);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	cursor: pointer;
	
}

#closeButton:hover{
	background-image: url(../images/close_w.svg);
}

/* Accordion styles */
.accordion {
  background-color: #fff;
  cursor: pointer;
  width: calc(100% - 3vw);
  border: none;
  text-align: left;
  outline: none;
  transition: 0.4s;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  margin-bottom: -0.5vw;
}

.active, .accordion:hover {
  background-color: #fff;
}

.accordion:after {
  content: '\002B';
  color: #000;
  font-weight: bold;
  float: right;
  margin-top: -4vw;
  margin-right: 0.5vw;
  font-size: 2.5vw;
}

.active:after {
  content: "\2212";
}

.panel {
  width: calc(100% - 3vw);
  padding: 0 0px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}


/* for 480px or less */
@media screen and (max-width: 480px) {
   
	h1 {
		line-height: calc(3.5vw * 2.5);
		font-size: calc(3vw * 2.5);
		font-style:normal;
		font-weight:normal;
		padding-left: calc(2vw * 2.5);
		padding-right: calc(2vw * 2.5);
	}

	h2 {
		font-family: InternColor, sans-serif;
		line-height: calc(1vw * 2.5);
		font-size: calc(2vw * 2.5);
		font-style:normal;
		font-weight:normal;
		text-transform: uppercase;
	}

	h3 {
		line-height: calc(2vw * 2.5);
		font-size: calc(1.5vw * 2.5);
		font-style:normal;
		font-weight:normal;
	}

	p, ul, ol {
		line-height: calc(2.5vw * 2.5);
		font-size: calc(2vw * 2.5);
		font-style:normal;
		font-weight:normal;
	}
	
	li { 
	  padding-left: 35px;
	  margin-bottom: 22px;
	}

	ul li:before {
	  content: "→";
	  position: relative;
	  left: -35px;
	  margin-right: -20px;
	}

	ol li:before {
	  content: "";
	  position: relative;
	  left: -35px;
	  margin-right: -20px;
	}
	
	.desktop{
		display: none;
	}
	
	
	#mainNav{
		display: none;
	}
	
	#hamburger{
		position: fixed;
		right: 4vw;
		top: 4vw;
		display: inline-block;
		width: 12vw;
		height: 12vw;		
		background-image: url(../images/hamburger.svg);
		background-repeat: no-repeat;
		background-size: auto 90%;
		cursor: pointer;
		z-index: 99;
	}
	
	#mobileNav{
		position: fixed;
		top: 0;
		right: 0;
		height: 100vh;
		width: 100vw;
		background-color: #fff;
		padding-top: 2vw;
		z-index: 100;
		display: block;
	}
	
	#mobileNav img{
		height: 18vw;
		width: auto;
		margin-left: 3vw;
		margin-top: 0vw;
		margin-right: 30vw;
		margin-bottom: 10vw;
	}

	#mobileNav a{
		margin-right: 3vw;
		margin-left: 3vw;
		line-height: calc(2.5vw * 3);
		font-size: calc(2vw * 3);
		font-style:normal;
		font-weight:normal;
		float: left;
		width: 94vw;
		padding-top: 3vw;
		padding-bottom: 3vw;
		border-top: 2px solid #000;
		border-bottom: 2px solid #000;
		margin-top: -2px;
	}
	
	.langSwitch{
		float: left;
		margin-top: 15vw;
		width: 94vw;
		margin-right: 2vw;
		margin-left: 2vw;
		line-height: calc(2.5vw * 3);
		font-size: calc(2vw * 3);
		font-style:normal;
		font-weight:normal;
	}

	#mobileNav .langSwitch a, #mobileNav .langSwitch p{
		display: inline-block;
		margin-right: 2vw;
		margin-left: 2vw;
		margin-top: 0;
		padding-top: 0vw;
		padding-bottom: 0vw;
		border-top: 0px solid #000;
		border-bottom: 0px solid #000;
		width: auto;
		float: left;
	}
	
	#mobileNav .langSwitch p{
		margin-top: 1vw;
	}
	
	#NavContact{
		position: absolute;
		left: 4vw;
		bottom: 2vw;
	}
	
	#scrolling{
		height: calc((15.9 * 100vh) + (3.8 * 100vw)) ;
		width: calc(100% - 2px);
		border: 1px solid transparent;
	}
	
	#home img{
		height: 18vw;
		width: auto;
		margin-left: 3vw;
		margin-top: 2vw;
		margin-right: 30vw;
	}
	
	#toTop{
		position: fixed;
		bottom: 0vw;
		right: 4vw;
		width: 6vw;
		height: 12vw;
		background-image: url(../images/pfeil_totop_w.svg);
		background-repeat: no-repeat;
		background-size: 75% auto;
		z-index: 5;
		cursor: pointer;
	}
	
	
	#toTopFooter{
		position: absolute;
		bottom: 0vw;
		right: 4vw;
		width: 6vw;
		height: 12vw;
		background-image: url(../images/pfeil_totop.svg);
		background-repeat: no-repeat;
		background-size: 75% auto;
		z-index: 5;
		cursor: pointer;
	}
	
	
	
	.pfeil_tobottom{
		position: absolute;
		bottom: 5vw;
		left: 50%;
		margin-left: -3vw;
		width: 6vw;
		height: 12vw;
	}
	
	.statement{
		position: absolute;
		bottom: 20vw;
		right: 5.2vw;
		float: right;
		margin-right: 7vw;
		width: 65vw;
		color: #fff;
	}

	.r50{
		width: calc(100% - 0vw);
		height: auto;
		float: left;
		padding-left: 3vw;
	}

	.r50:first-of-type{
		width: calc(100% - 0vw - 0px);
		height: 58vw;
		border-right: 0px solid #000;
	}
	
	#angebot_between, #vision_between, #about_between, #tools_between, #customers_between, #surprise_between{
		position: relative;
		width: 100%;
		height: 50vh;
		overflow: hidden;
		float: left;
	}
	
	#fullWidth{
		position: relative;
		left: 0;
		top: 0;
		width: calc(6 * 100vw);
		height: 100vh;
		overflow: hidden;
	}
	
	#offer_01 h3{
		color: #000;
		margin-left: 5vw;
	}
	
	#offer_01 .contentBox{
		width: 90vw;
		height: 70vh;
		color: #fff;
		margin-top: -35vh;
		margin-left: -45vw;
		position: relative;
		top: 50%;
		left: 50%;
	}

	#offer_01 .contentBox h1{
		margin-left: -2vw;
	}


	#offer_02_de h3, #offer_02_en h3{
		color: #000;
		margin-left: 5vw;
		max-width: 70vw;
	}
	
	#offer_02_de{
		width: 300vw;
		height: 100vh;
		background-image: url(../images/pagume_angebot_02.svg);
		background-repeat: no-repeat;
		background-size: auto 75%;
		background-position: 10%;
		float: left;
		background-color: #efefef;
	}
	
	#offer_02_en{
		width: 300vw;
		height: 100vh;
		background-image: url(../images/pagume_services_02.svg);
		background-repeat: no-repeat;
		background-size: auto 75%;
		background-position: 10%;
		float: left;
		background-color: #efefef;
	}

	#offer_04 h3{
		color: #fff;
		margin-left: 5vw;
	}

	#offer_04 .contentBox{
		width: 90vw;
		height: auto;
		color: #fff;
		margin-top: 6vw;
		margin-left: 5vw;
	}

	#offer_04 ul li h3{
		padding: 0;
		margin: 0;
		margin-left: 0.5vw;
		margin-top: -5.3vw;
		margin-bottom: -5vw;
	} 

	#offer_04 ul li {
		margin-bottom: 4vw;
	}
	
	#vision{
		min-height: 120vh;
	}
	
	#about .r50:last-of-type, #customers .r50:last-of-type{
		width: calc(100%);
		height: 100vh;
		padding-left: 0vw;
		padding-top: 0vw;
		position: relative;

	}
	
	#about_00{
		position: absolute;
		top: 0;
		left: 0;
		width: 100vw;
		height: 165vw;
		z-index: 2;
		background-image: url(../images/pagume_team_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: -17vw;
	}

	#about_03 h2{
		margin-left: 3vw;
		margin-top: 5vw;
		line-height: calc(2.5vw * 2.5);
		color: #fff;
	}

	#about_01 .person{
		margin: auto;
		margin-top: 5vw;
		width: calc(100vw * 0.9);
		height: calc(51vw * 0.9);
		background-image: url(../images/christoph_schmoker_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;

	}

	#about_02 .person{
		margin: auto;
		margin-top: 5vw;
		width: calc(100vw * 0.9);
		height: calc(51vw * 0.9);
		background-image: url(../images/samy_darwish_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;

	}
	#about_03 ul, #about_01 ul, #about_01 ol, #about_01 p, #about_02 ul, #about_02 ol, #about_02 p{
		line-height: calc(2.2vw * 2.2);
		font-size: calc(1.5vw * 2.2);
		width: 90%;
		color: #fff;
		margin-left: 5vw;
	}

	#about_01 ul, #about_02 ul{
		margin-top: 2vw;
	}

	#about_01 li, #about_02 li{
		margin-bottom: 0vw;
	}

	#about_03 ul{
		line-height: calc(2.5vw * 2.5);
		font-size: calc(2vw * 2.5);
	}
	
	#principles{
		width: 100%;
		height: 100vh;
		background-color: #ff0000;
		z-index: 2;
		background-image: url(../images/pagume_grundsaetze_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: -30vw;
		overflow: hidden;
	}
	
	#principles h3{
		position: absolute;
		top: 2vw;
		left: 5vw;
		color: #fff;
	}

	#principlesContent{
		position: relative;
		left: 0;
		top: 25%;
		margin-top: -12vw;
		margin-left: 10vw;
		width: 425vw;
		height: 30vw;
	}

	#principles_01, #principles_02, #principles_03, #principles_04, #principles_05{
		width: 70vw;
		height: auto;
		float: left;
		color: #fff;
		margin-left: 15vw;
		display: inline;
		margin-top: 2vw;
	}

	#principles_04{
		width: 70vw;
	}

	#principles_04 p{
		float: left;
		width: 45vw;
	}
	#principles_04 ul{
		width: 45vw;
		float: left;
		line-height: calc(2vw * 3);
		font-size: calc(1.5vw * 3);
		font-style:normal;
		font-weight:normal;
		margin-top: 5vw;
	}

	#principles_04 ul li{
		width: 60vw;
		float: left;
		margin-left: -10.5vw;
		margin-bottom: 5vw;
	}

	#principles_05{
		width: 70vw;
	}

	.number{
		width: 20vw;
		height: auto;
		float: left;
		margin-right: 1vw;
		margin-top: -3.5vw;
	}
	
	#tools_between{
		background-color: #fff;
		height: 50vh;
	}

	#tools_between .teaserPic{
		width: 100%;
		height: 50vh;
		background-image: url(../images/pagume_eagle_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top center;
		margin-top: 0vw;
	}

	#tools_between .teaserPic .statement{
		float: right;
		width: 55vw;
		color: #fff;
		text-align: right;
		position: absolute;
		bottom: 4vw;
		right: 1vw;
	}
	
	#surprise .r50:last-of-type{
		width: calc(100% - 12vw);
		padding-left: calc(2vw * 3.3);
		padding-right: calc(2vw * 3.3);
		padding-top: 0vw;
		position: relative;
		overflow: hidden;

	}

	#surprise h2{
		line-height: calc(2.5vw * 3.3);

	}
	
	
	#CopyPhotographer{
		position: absolute; 
		top: 88vw; 
		left: 55vw;
		color: #fff;
		line-height: calc(1.5vw * 3.3);
		font-size: calc(1.3vw * 2.5);
		font-style:normal;
		font-weight:normal;
		height: 20px;
		width: 50vw;
	}


	#CopyPhotographer_02{
		position: absolute; 
		top: 3vw; 
		left: 4vw;
		color: #fff;
		line-height: calc(1.5vw * 3.3);
		font-size: calc(1.3vw * 2.5);
		font-style:normal;
		font-weight:normal;
		height: 20px;
		width: 50vw;
	}

	.surpriseContent p{
		line-height: calc(2vw * 3.3);
		font-size: calc(1.5vw * 2.5);
		font-style:normal;
		font-weight:normal;
	}

	#surprise ul{
		width: calc(90% - 4vw);
		line-height: calc(2vw * 3.3);
		font-size: calc(1.5vw * 2.5);
		font-style:normal;
		font-weight:normal;
		margin-top: 5vw;
		margin-left: -6vw;
	}
	
	#surprise ul li:before{
		margin-left: 1.5vw;
	}
	
	#customers_01 ul, #customers_02 ul, #customers_03 ul{
		margin-top: 5vw;
		margin-left: 5vw;
		font-size: calc(2vw * 2.5);
		line-height: calc(2.6vw * 3.3);
		color: #fff;
	}
	
	#contact{
		height: 75vw;
		background-color: #fff;
		z-index: 2;
	}

	#contact .teaserPic{
		margin-top: -1vw;
		width: 100%;
		height: 75vw;
		background-image: url(../images/pagume_instrumente_03_3x.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: top center;
	}

	#contact .teaserPic .statement{
		float: left;
		margin-top: 30vw;
		margin-left: 7vw;
		width: 80vw;
		color: #000;
	}
	
	#footer{
		height: 130vw;
		background-color: #fff;
		z-index: 2;
	}

	#footer h3{
		color: #000;
		margin-left: 5vw;
	}

	#footer .contentBox{
		width: 80vw;
		min-height: 100vw;
		color: #000;
		margin-top: 2vw;
		margin-left: 5vw;
	}

	.contactBox{
		width: 100%;
		float: left;
		margin-top: 4vw;
		text-align: left;
	}

	#footer .contactBox h3{
		margin-left: 0vw;
	}

	.contactBox h2{
		margin-bottom: -0.5vw;
	}

	#footer #copy{
		line-height: calc(1.5vw * 2.5);
		font-size: calc(1.1vw * 2.5);
		font-style: normal;
		font-weight: normal;
		margin-left: 5vw;
		margin-top: 5vw;
		float: left;
	}

	#Impressum{
		padding-left: 2vw;
		cursor: pointer;
	}

	#Impressum:hover{
		color: #ff8200;
	}

	#ImpressumContent{
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 2;
		height: 220vw;
		width: 100%;
		background-color: #ff8200;

	}
	
	#ImpressumContent .contentBox{
		margin-left: 5vw;
	}

	#closeButton{
		position: absolute;
		bottom: inherit;
		top: 5vw;
		right: 5vw;
		z-index: 3;
		color: #000;
		width: 4.5vw;
		height: 4.5vw;
		background-image: url(../images/close.svg);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		cursor: pointer;

	}
	
	
	.accordion {
	  background-color: #fff;
	  cursor: pointer;
	  width: calc(100% - 7vw);
	  border: none;
	  text-align: left;
	  outline: none;
	  transition: 0.4s;
	  border-top: 1px solid #000;
	  border-bottom: 1px solid #000;
	  margin-bottom: -3px;
	}
	
	.accordion:after {
	  content: '\002B';
	  color: #000;
	  font-weight: bold;
	  float: right;
	  margin-top: -8.5vw;
	  margin-right: 0vw;
	  font-size: 5vw;
	}
	
	.active:after {
	  content: "\2212";
	}

	.panel {
	  width: calc(100% - 14vw);
	  padding: 0 7px;
	  max-height: 0;
	  overflow: hidden;
	  transition: max-height 0.2s ease-out;
	}



       
}