/* */
/* ---------------------------------------------------------------------------------------------------------------------------
 FONTS
Generated by Font Squirrel (http://www.fontsquirrel.com) on February 16, 2014
--------------------------------------------------------------------------------------------------------------------------- */
@font-face {
  font-family: 'verlagextra_light';
  src: url('fonts/verlag_xlight-webfont.eot');
  src: url('fonts/verlag_xlight-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/verlag_xlight-webfont.woff') format('woff'), url('fonts/verlag_xlight-webfont.ttf') format('truetype'), url('fonts/verlag_xlight-webfont.svg#verlagextra_light') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'verlagblack';
  src: url('fonts/verlag-black-webfont.eot');
  src: url('fonts/verlag-black-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/verlag-black-webfont.woff') format('woff'), url('fonts/verlag-black-webfont.ttf') format('truetype'), url('fonts/verlag-black-webfont.svg#verlagblack') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'verlagbook';
  src: url('fonts/verlag-book-webfont.eot');
  src: url('fonts/verlag-book-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/verlag-book-webfont.woff') format('woff'), url('fonts/verlag-book-webfont.ttf') format('truetype'), url('fonts/verlag-book-webfont.svg#verlagbook') format('svg');
  font-weight: 100;
  font-style: normal;
}
/* ---------------------------------------------------------------------------------------------------------------------------
MIXINS
--------------------------------------------------------------------------------------------------------------------------- */
/* z. B. .mix-translate-x-y(0%, 5%)  */
/* z. B. .mix-translate-x(-40%)  */
/* z. B. .mix-translate-prozent(70%); */
/* z. B. .mix-rotate-translate-prozent(45deg,70%); */
/* z. B. .mix-rotate(45deg); */
/* z. B. .mix-scale(1.07); */
/* corners are rounded with individual sizes => @radius4Corners e.g. "5px 2px 7px 8px" */
/* z.B. .mix-box-shadow(10px 10px 5px #888888); */
/* @max-breite enthält Breite der Spalte, z.B. "20em", @breite-gap ist Breite der Spalte dazwischen */
/* @anzahl-spalten enthält maximale Anzahl der Spalten, z.B. "3" */
/* für Elemente, die sich über alle Spalten erstrecken sollen, z.B. Überschriften
@anzahl-spalten enthält Angabe, über wie viele Spalten sich etwas erstrecken soll, z.B. "3" oder "all" */
/* ---------------------------------------------------------------------------------------------------------------------------
GRADIENTS
--------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------- 	*/
/* GRADIENT-VARIABLES:                                                         	*/
/* @direction = degrees or top/bottom/left/right or combinations				*/
/* @beginColor2InPercent = percent, where the second color begins				*/
/* @ms-direction = for old IE: 0 is vertical, 1 is horizontal					*/
/* Attention: explorer-filters have to be escaped in order to work with less! 	*/
/* --------------------------------------------------------------------------- 	*/
/* GRADIENT WITH 2 COLORS */
/* ****************************************************** */
/* GRADIENT WITH 3 COLORS */
/* ****************************************************** */
/* Allgemeine Styles */
html,
body {
  padding: 0;
  margin: 0;
  font-family: "verlagbook", Helvetica, Arial, Sans-Serif;
  color: #271907;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  height: 100%;
}
body {
  background: #FDA630;
  background-image: radial-gradient(center bottom, circle farthest-side, #FDA630 0%, #F58030 100%);
  background-image: -webkit-gradient(radial, center bottom, 0, center bottom, 554, color-stop(0, #FDA630), color-stop(1, #F58030));
  background-image: radial-gradient(circle farthest-side at center bottom, #FDA630 0%, #F58030 100%);
  background-attachment: fixed;
  overflow-y: hidden;
  position: relative;
  top: 0;
  left: 0;
  /* ALLGEMEINER HORIZONTALER SCROLLBALKEN UNTEN
	
	// fuer Safari und Crhome
	&::-webkit-scrollbar {  z-index:8; } // gesamte Scrolleiste
	//&::-webkit-scrollbar { height:10px; } // gesamte Scrolleiste
	&::-webkit-scrollbar-button {  } // Pfeil-Buttons
	&::-webkit-scrollbar-track { background-color:rgba(255,204,153,0.5);} // Bereich für den Schieberegler
	&::-webkit-scrollbar-thumb { .mix-rounded-corners (3px); background-color:rgba(55,55,55,0.7);} // Schieberegler
	&::-webkit-scrollbar-corner { border:1px dotted #271907; } // Größenregler (bei TEXTAREA sichtbar)
	
	// fuer IE
	scrollbar-face-color:rgba(55,55,55,0.7); // Schieberegler
   	scrollbar-track-color:rgba(255,204,153,0.5); // Flaeche
	*/
  /* TYPO ALLGEMEIN
	--------------------------------------- */
  /*
	::-webkit-scrollbar { border:1px dotted #271907; z-index:10; } // gesamte Scrolleiste
	::-webkit-scrollbar-button {  } // Pfeil-Buttons
	::-webkit-scrollbar-track { background-color: rgba(255,255,255,0.3); } // Bereich für den Schieberegler
	//::-webkit-scrollbar-thumb { background-color:#271907;} // Schieberegler
	//::-webkit-scrollbar-corner { border:1px dotted #271907; } // Größenregler (bei TEXTAREA sichtbar)
	*/
}
body h3 {
  font-family: "verlagblack";
  text-transform: uppercase;
  font-size: 19px;
  font-weight: normal;
  margin: 0;
  margin-bottom: -14px;
}
body p {
  font-family: "verlagbook", Helvetica, Arial, Sans-Serif;
  color: rgba(0, 0, 0, 0.5);
  font-weight: normal !important;
  font-size: 17px;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  line-height: 22px;
}
body ul {
  font-family: "verlagbook", Helvetica, Arial, Sans-Serif !important;
  color: rgba(0, 0, 0, 0.5) !important;
  list-style-position: inside;
  list-style-type: circle;
}
body .textblock {
  width: 240px;
  position: absolute;
}
body .inprogress {
  color: yellow;
  font-weight: bold;
}
body a:link,
body a:visited {
  color: inherit;
  text-decoration: none;
}
body a:hover {
  text-decoration: underline;
}
ul#sprungmarken_anker {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 20200px;
  height: 5px;
  list-style: none;
  margin: 0;
  padding: 0;
}
ul#sprungmarken_anker li {
  /* Sprungmarken-Infos zum Testen
			bei Normalgebrauch auskommentieren
			@background-1:white;
			@background-2:green;
			@info:attr(id); */
  height: 100%;
  display: inline-block;
}
ul#sprungmarken_anker li:before {
  content: ;
  color: white;
}
ul#sprungmarken_anker li#spr_anfang {
  background-color: transparent;
  width: 200px;
}
ul#sprungmarken_anker li#spr_intro {
  background-color: transparent;
  width: 2100px;
  width: 2200px;
}
ul#sprungmarken_anker li#spr_steckbrief {
  background-color: transparent;
  width: 1100px;
}
ul#sprungmarken_anker li#spr_demo {
  background-color: transparent;
  width: 1800px;
  width: 1900px;
}
ul#sprungmarken_anker li#spr_kunden {
  background-color: transparent;
  width: 2900px;
}
ul#sprungmarken_anker li#spr_stuecke {
  background-color: transparent;
  width: 3050px;
}
ul#sprungmarken_anker li#spr_vita {
  background-color: transparent;
  width: 2800px;
}
ul#sprungmarken_anker li#spr_kontakt {
  background-color: transparent;
  width: 3700px;
}
ul#sprungmarken_anker li#spr_unknown {
  background-color: transparent;
  width: 800px;
  width: 600px;
}
ul#sprungmarken_anker li#spr_impressum {
  background-color: transparent;
  width: 1700px;
}
/* Audio-Play Button
-------------------- */
.btn_play {
  position: absolute;
  -moz-transition: 0.1s all ease-out;
  -o-transition: 0.1s all ease-out;
  -webkit-transition: 0.1s all ease-out;
  transition: 0.1s all ease-out;
  cursor: pointer;
  /* Play-Pfeil */
}
.btn_play .button {
  display: block;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #352209;
  background: image / svg xml;
  background: radial-gradient(center, ellipse cover, #352209 0%, #1b1105 100%);
  background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0%, #352209), color-stop(100%, #1b1105));
  background: radial-gradient(ellipse at center, #352209 0%, #1b1105 100%);
  -moz-box-shadow: 0 0 50px rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.15);
}
.btn_play .icon {
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent transparent transparent #FDA630;
  position: absolute;
}
.btn_play .icon_pause {
  display: block;
  border-style: solid;
  border-color: #FDA630;
  position: absolute;
  border-color: #ffc752;
}
.btn_play:hover {
  -webkit-transform: scale(1.07);
  -moz-transform: scale(1.07);
  -o-transform: scale(1.07);
  -ms-transform: scale(1.07);
  transform: scale(1.07);
}
.pause {
  display: none !important;
  color: #ffc752 !important;
}
.playing .pause {
  display: block !important;
}
.playing .play {
  display: none !important;
}
/* in #content_wrap sind nach der #noten_timeline auch alle sections
hier aber, um das Style einfach zu halten, nicht in #content_wrap verschachtelt 
darüber ist #navbar, darunter #bottomlayer */
#content_wrap {
  /*
    height: 90%;
	min-height:1000px;
	*/
  position: absolute;
  height: 800px;
  width: 20200px;
  left: 0;
  top: 0;
  display: inline-block;
  padding: 0;
  border-top: 40px solid transparent !important;
}
#content_wrap #noten_timeline {
  white-space: nowrap;
  display: inline-block;
  height: 100%;
}
#content_wrap #noten_timeline img {
  height: 100%;
  width: auto;
  margin: 0 -2px;
  display: inline-block;
}
/*	
@media only screen and (max-height: 720px) { 
	#content_wrap{
    	height: 100%;
     	-webkit-transform: translate(0%, 0%);
     	-moz-transform: translate(0%, 0%);
		}
	}
*/
/* NAVBAR (Navigation / Sprungmarken)
BOTTOM LAYER (Adresse)
--------------------------------------- */
#navbar {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
}
#navbar ul#sprungmarken {
  list-style: none;
  padding: 0;
  position: relative;
  width: 100%;
  text-align: center;
  font-family: "verlagbook", Helvetica, Arial, Sans-Serif;
  font-weight: normal;
  font-size: 18px;
}
#navbar ul#sprungmarken li {
  display: inline-block;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  /* Highlight Sprungmarken */
}
#navbar ul#sprungmarken li:last-child {
  border: none;
}
#navbar ul#sprungmarken li a:link,
#navbar ul#sprungmarken li a:visited {
  opacity: 0.6;
  display: block;
  padding: 1px 10px 3px 10px;
  margin: 0 5px;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: rgba(0, 0, 0, 0.6);
}
#navbar ul#sprungmarken li a:active,
#navbar ul#sprungmarken li a:hover,
#navbar ul#sprungmarken li.active a {
  text-decoration: none;
  border-bottom: 3px solid rgba(0, 0, 0, 0.6);
}
#navbar ul#sprungmarken li#nav_anfang.active.active a {
  -webkit-box-shadow: 0 0 0 transparent;
  -moz-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
  border-bottom: none;
}
#bottomlayer {
  bottom: 0;
  position: fixed;
  left: 0;
  width: 100%;
  z-index: 100;
  background: #FDA630;
  background-image: radial-gradient(center bottom, circle farthest-side, #FDA630 0%, #F58030 100%);
  background-image: -webkit-gradient(radial, center bottom, 0, center bottom, 554, color-stop(0, #FDA630), color-stop(1, #F58030));
  background-image: radial-gradient(circle farthest-side at center bottom, #FDA630 0%, #F58030 100%);
  background-attachment: fixed;
  /* MP3 Player
		---------- */
}
#bottomlayer ul#vika {
  list-style: none;
  padding: 0;
  position: relative;
  width: 100%;
  text-align: center;
  font-family: "verlagbook", Helvetica, Arial, Sans-Serif;
  font-weight: normal;
  font-size: 18px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
  opacity: 0.7;
}
#bottomlayer ul#vika img {
  margin-bottom: -3px;
  padding-right: 10px;
}
#bottomlayer ul#vika li {
  display: inline-block;
  margin: 0 50px;
}
#bottomlayer #audioplayer {
  width: 100%;
}
#bottomlayer .audiojs {
  display: none;
}
/* ---------------------------------------
SECTIONS
--------------------------------------- */
.section {
  position: absolute;
  top: 0;
  height: 800px;
}
/* SECTION ANFANG (ersetzt padding nach links)
--------------------------------------- */
#sec_anfang {
  width: 200px;
}
/* SECTION INTRO
--------------------------------------- */
#sec_intro {
  padding-left: 220px;
  left: 200px;
}
#sec_intro a.scrollpfeil {
  position: absolute;
  z-index: 10;
  top: 550px;
  left: 200px;
  font-size: 35px;
  display: block;
  white-space: nowrap;
  opacity: 0.5;
  font-family: 'verlagextra_light';
  text-transform: uppercase;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#sec_intro a.scrollpfeil:hover {
  opacity: 1.0;
  text-decoration: none;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}
#sec_intro a.scrollpfeil:before {
  content: "";
  position: absolute;
  left: -35px;
  top: 14px;
  border: 0 solid transparent;
  transform: rotate(-45deg);
  width: 18px;
  height: 18px;
  border-right: 2px solid black;
  border-bottom: 2px solid black;
}
#sec_intro #intro_raute {
  width: 86px;
  height: 86px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #271907;
  position: absolute;
  top: 50%;
  left: 0%;
  margin-top: -42px;
}
#sec_intro #intro_raute img {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 34%;
  left: 17.5%;
}
#sec_intro .bgraute {
  background: rgba(0, 0, 0, 0.1);
}
#sec_intro h1 {
  font-family: "verlagblack";
  text-transform: uppercase;
  font-size: 130px;
  font-weight: normal;
  letter-spacing: -7px;
  white-space: nowrap;
  margin-bottom: -55px;
}
#sec_intro h2 {
  font-family: "verlagextra_light";
  font-weight: normal;
  font-size: 36px;
  white-space: nowrap;
  margin-top: -4px;
  margin-left: 300px;
}
#sec_intro .mask_upper {
  position: absolute;
  overflow: hidden;
  bottom: 50%;
  padding: 0;
  margin-left: -100px;
  padding-left: 100px;
  padding-right: 300px;
}
#sec_intro .mask_upper .bgraute {
  position: absolute;
  bottom: 0;
  -moz-transform: rotate(45deg) translate(70%);
  -ms-transform: rotate(45deg) translate(70%);
  -o-transform: rotate(45deg) translate(70%);
  -webkit-transform: rotate(45deg) translate(70%);
  transform: rotate(45deg) translate(70%);
}
#sec_intro .mask_lower {
  position: absolute;
  overflow: hidden;
  top: 50%;
  height: 50%;
  padding-right: 300px;
}
#sec_intro .mask_lower .bgraute {
  position: absolute;
  top: 0;
  -moz-transform: rotate(45deg) translate(-70%);
  -ms-transform: rotate(45deg) translate(-70%);
  -o-transform: rotate(45deg) translate(-70%);
  -webkit-transform: rotate(45deg) translate(-70%);
  transform: rotate(45deg) translate(-70%);
}
/* SECTION STECKBRIEF
--------------------------------------- */
#sec_steckbrief {
  left: 2610px;
  left: 2540px;
}
#sec_steckbrief img {
  height: 360px;
  width: auto;
  margin-top: 82px;
}
#sec_steckbrief .textblock {
  left: 300px;
  top: 131px;
}
/* SECTION MAIN REEL
--------------------------------------- */
#sec_main_reel {
  z-index: 1;
  left: 3900px;
  left: 3825px;
  width: 100px;
  /* Hanschrift "90Sekunden" */
  /* Allgemeine Definitionen für alle Play-Buttons sind ganz
	oben im Style definiert */
}
#sec_main_reel img {
  position: absolute;
  left: 180px;
  margin-top: 150px;
}
#sec_main_reel .btn_play {
  top: 220px;
  left: 0;
  /* Play-Pfeil */
}
#sec_main_reel .btn_play .button {
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  width: 200px;
  height: 200px;
}
#sec_main_reel .btn_play .icon {
  border-width: 30px 0 30px 54px;
  left: 40%;
  top: 25%;
}
#sec_main_reel .btn_play .icon_pause {
  width: 20px;
  height: 56px;
  border-width: 0 16px;
  left: 38%;
  top: 25%;
}
#sec_main_reel .btn_play h6 {
  font-family: "verlagblack";
  color: #FDA630;
  width: 100%;
  text-align: center;
  position: absolute;
  font-size: 28px;
  top: 26%;
}
/* SECTION PARTNERS IN CRIME
--------------------------------------- */
#sec_kunden {
  left: 5465px;
}
#sec_kunden img {
  height: 360px;
  width: auto;
  margin-top: 274px;
}
#sec_kunden .textblock {
  left: 700px;
  top: 369px;
}
/* SECTION REEL AUSWAHL
--------------------------------------- */
ul#sec_reels01,
ul#sec_reels02 {
  position: absolute;
  left: 8400px;
  display: table;
  width: 1710px;
  height: 98px;
  list-style: none;
  padding: 0;
}
ul#sec_reels01 li,
ul#sec_reels02 li {
  display: table-cell;
  padding: 0 60px 0 0;
  width: 33.333%;
  /* Allgemeine Definitionen für alle Play-Buttons sind ganz
		oben im Style definiert */
}
ul#sec_reels01 li .btn_play,
ul#sec_reels02 li .btn_play {
  float: left;
  margin-top: 16px;
  z-index: 100;
  /* Play-Pfeil */
}
ul#sec_reels01 li .btn_play .button,
ul#sec_reels02 li .btn_play .button {
  width: 50px;
  height: 50px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  position: relative;
}
ul#sec_reels01 li .btn_play img,
ul#sec_reels02 li .btn_play img {
  height: 50px;
  width: 50px;
  float: left;
  margin-top: 5px;
  background: #000000;
}
ul#sec_reels01 li .btn_play .icon,
ul#sec_reels02 li .btn_play .icon {
  border-width: 12px 0 12px 22px;
  left: 37%;
  top: 25%;
}
ul#sec_reels01 li .btn_play .icon_pause,
ul#sec_reels02 li .btn_play .icon_pause {
  border-width: 0 6px;
  width: 6px;
  height: 22px;
  left: 33%;
  top: 25%;
}
ul#sec_reels01 li .textblock,
ul#sec_reels02 li .textblock {
  position: relative;
  padding-left: 80px;
  width: auto;
}
ul#sec_reels01 li .textblock h3,
ul#sec_reels02 li .textblock h3 {
  white-space: nowrap;
}
ul#sec_reels01 li .textblock h3 span,
ul#sec_reels02 li .textblock h3 span {
  font-family: "verlagextra_light";
  color: black;
  margin-left: 6px;
}
ul#sec_reels01 {
  top: 280px;
}
ul#sec_reels02 {
  top: 411px;
}
/* SECTION VITA
--------------------------------------- */
#sec_vita {
  left: 11500px;
  width: 2280px;
}
#sec_vita .note {
  border-left: 1px solid rgba(39, 25, 7, 0.5);
  padding-left: 12px;
  position: absolute;
  /*  EINZELNOTEN */
  /* bei der Höhenberechnung ursprüngliche Prozentangaben mit 8 (1% v0n 800px Gesamthöhe) multiplizieren */
  /* noch nicht verwendet
			&#note08 {
    			left:2310px;
				bottom:475px;
    			height: 300px;
    			}

			&#note09 {
    			left:2640px;
				bottom:475px;
    			height: 300px;
    			}

			&#note10 {
    			left:2970px;
				bottom:475px;
    			height: 300px;
    			}
			*/
}
#sec_vita .note img {
  position: absolute;
  bottom: -10px;
  left: -23px;
}
#sec_vita .note .textblock {
  position: relative;
  top: -13px;
  width: 260px;
}
#sec_vita .note .textblock h3 {
  font-size: 24px;
}
#sec_vita .note#note01 {
  bottom: 248px;
  height: 444px;
}
#sec_vita .note#note02 {
  left: 330px;
  bottom: 274px;
  height: 280px;
}
#sec_vita .note#note02 #notensymbol02 {
  font-size: 40px;
  font-family: "verlagextra_light";
  position: absolute;
  left: -45px;
  bottom: -20px;
}
#sec_vita .note#note03 {
  left: 660px;
  bottom: 348px;
  height: 370px;
}
#sec_vita .note#note04 {
  left: 990px;
  bottom: 365px;
  height: 320px;
}
#sec_vita .note#note04 #notensymbol04 {
  font-size: 40px;
  font-family: "verlagextra_light";
  position: absolute;
  left: -45px;
  bottom: -20px;
}
#sec_vita .note#note05 {
  left: 1320px;
  bottom: 440px;
  height: 210px;
}
#sec_vita .note#note05 .textblock {
  width: 270px;
}
#sec_vita .note#note06 {
  left: 1650px;
  bottom: 447px;
  height: 290px;
}
#sec_vita .note#note07 {
  left: 1980px;
  bottom: 543px;
  height: 180px;
}
/* SECTION KONTAKT
--------------------------------------- */
#sec_contact {
  font-family: monospace;
  left: 14242px;
  top: 148px;
  position: absolute;
  /* urspruengliche Position auf rechtem Zettel
		#werksliste {
			
    		position: absolute;
			left: 1060px;
    		top: 195px;
			height: 270px;
    		width: 340px;
			padding-right:20px; // damit Text auf Papier aber scrollbalken ausserhalb ist
    		overflow-y: scroll;
			
			h4 {
    			text-transform: uppercase;
    			color: rgba(0, 0, 0, 0.7);
    			font-size: 16px;
    			font-weight: normal;
    			text-align: center;
    			letter-spacing: 1px;
    			margin: 0;
				text-align:left;
    			}

			h5 {
    			font-size: 13px;
    			margin-bottom: 0
    			}
				
			p {
    			font-family: inherit !important;
    			color: rgba(0, 0, 0, 0.7);
    			font-size: 13px;
    			line-height: 1.4;
    			margin-top: 4px;
    			margin-bottom: 24px
    			}
			
    		} // Ende #werksliste
			*/
}
#sec_contact h6 {
  position: absolute;
  top: 103px;
  left: 363px;
  font-size: 15px;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.2);
}
#sec_contact img {
  display: block;
  width: auto;
  height: 619px;
  position: relativ;
}
#sec_contact form#contact {
  position: absolute;
  width: 35.5%;
  top: 168px;
  left: 360px;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.2);
  color: #000000;
  padding: 25px 0;
  height: 303px;
}
#sec_contact form#contact input,
#sec_contact form#contact textarea {
  width: 100%;
  background: none;
  border: none;
  outline: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  resize: none;
  font-size: 20px;
  padding: 0 0 3px 0;
  font-family: inherit;
  color: #271907;
  color: rgba(0, 0, 0, 0.6);
  margin: 12px 0 0 0;
}
#sec_contact form#contact textarea {
  border: 1px solid rgba(0, 0, 0, 0.5);
  height: 50%;
}
#sec_contact form#contact input#send {
  width: auto !important;
  font-size: 15px !important;
  position: absolute;
  right: 0;
  bottom: 0;
}
#sec_contact div#ajax_feedback {
  font-size: 20px;
  line-height: 1.5;
  text-align: center;
  position: absolute;
  top: 280px;
  left: 460px;
}
#sec_contact div#ajax_feedback p {
  display: none;
}
#sec_contact div#ajax_feedback p img {
  display: inline-block;
  margin-top: -280px;
  margin-left: -150px;
  -webkit-transform: scale(0.3);
  -moz-transform: scale(0.3);
  -o-transform: scale(0.3);
  -ms-transform: scale(0.3);
  transform: scale(0.3);
}
#sec_contact #werksliste {
  position: absolute;
  left: 348px;
  top: 175px;
  height: 330px;
  width: 500px;
  padding: 0 13px;
  overflow-y: scroll;
  background-color: rgba(255, 151, 79, 0.5);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 4px 7px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0 4px 7px rgba(0, 0, 0, 0.4);
  box-shadow: 0 4px 7px rgba(0, 0, 0, 0.4);
  /*
			// fuer IE
			scrollbar-face-color:rgba(55,55,55,0.7); // Schieberegler
   			scrollbar-track-color:rgba(255,151,79,0.4); // Flaeche
			*/
}
#sec_contact #werksliste::-webkit-scrollbar {
  z-index: 10;
}
#sec_contact #werksliste::-webkit-scrollbar-track {
  background-color: rgba(255, 151, 79, 0.4);
}
#sec_contact #werksliste::-webkit-scrollbar-thumb {
  -webkit-border-radius: 3px !important;
  -moz-border-radius: 3px !important;
  border-radius: 3px !important;
  background-color: rgba(55, 55, 55, 0.7);
  border: 2px solid #eb8949;
}
#sec_contact #werksliste::-webkit-scrollbar-corner {
  border: 1px dotted #271907;
}
#sec_contact #werksliste h4 {
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.7);
  font-size: 16px;
  font-weight: normal;
  text-align: center;
  letter-spacing: 1px;
  margin: 0;
  text-align: left;
}
#sec_contact #werksliste h5 {
  font-size: 13px;
  margin-bottom: 0;
}
#sec_contact #werksliste p {
  font-family: inherit !important;
  color: rgba(0, 0, 0, 0.7);
  font-size: 13px;
  line-height: 1.4;
  margin-top: 4px;
  margin-bottom: 24px;
}
/* SECTION UNKNOWN LANDS
--------------------------------------- */
#sec_unknown {
  position: absolute;
  left: 18150px;
  /* ueber Javascript erzeugter Film */
}
#sec_unknown #video_btn {
  position: absolute;
  width: 100px;
  height: 100px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  top: 420px;
  left: 0;
  background: rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -moz-transition: all ease-in-out 0.4s;
  -o-transition: all ease-in-out 0.4s;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
  background: url(../img/bg_video_btn.png);
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: -60px 0;
  cursor: pointer;
  -moz-box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.3);
  margin-top: -70px;
  margin-left: -10px;
}
#sec_unknown #video_btn video {
  width: 100px;
  height: 100px;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
#sec_unknown #video_btn span {
  position: absolute;
  top: 0;
  right: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -moz-transition: all 0.4s ease-out;
  -o-transition: all 0.4s ease-out;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
  width: 100%;
  height: 100%;
  text-align: right;
}
#sec_unknown h3 {
  position: relative;
  top: 54%;
  left: 110px;
}
#sec_unknown .video_play {
  -moz-transform: rotate(0deg) !important;
  -ms-transform: rotate(0deg) !important;
  -o-transform: rotate(0deg) !important;
  -webkit-transform: rotate(0deg) !important;
  transform: rotate(0deg) !important;
  width: 533px !important;
  height: 300px !important;
  background-color: #000 !important;
  background-position: 0 !important;
  -moz-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.4) !important;
  -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.4) !important;
  box-shadow: 0 3px 20px rgba(0, 0, 0, 0.4) !important;
  margin-top: -170px !important;
  margin-left: -300px !important;
}
#sec_unknown .video_play video {
  width: 533px !important;
  height: 300px !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
  filter: alpha(opacity=100) !important;
  opacity: 1 !important;
}
#sec_unknown .video_play span {
  top: -30px !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
  filter: alpha(opacity=100) !important;
  opacity: 1 !important;
  height: auto !important;
}
/* SECTION IMPRESSUM & DATENSCHUTZ
--------------------------------------- */
#sec_impressum {
  background: rgba(39, 25, 7, 0.1);
  border-left: 1px solid;
  border-right: 1px solid;
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 40px;
  background-color: transparent;
  /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=@ms-direction,startColorstr='transparent',endColorstr='rgba(39, 25, 7, 0.1)');
  /* for IE6 - IE9 */
  /* filter: progid:DXImageTransform.Microsoft.gradient(GradientType=@ms-direction,startColorstr='@color1',endColorstr='@color2'); */
  background-image: -ms-linear-gradient(180deg, transparent 0%, rgba(39, 25, 7, 0.1) 30%, transparent 80%);
  /* for IE10 */
  background-image: -moz-linear-gradient(180deg, transparent 0%, rgba(39, 25, 7, 0.1) 30%, transparent 80%);
  /* for older Firefox */
  background-image: linear-gradient(180deg, transparent 0%, rgba(39, 25, 7, 0.1) 30%, transparent 80%);
  height: 670px;
  overflow: auto;
  padding: 0 115px 50px 115px;
  font-size: 17px;
  text-align: left;
  white-space: normal;
  width: 1000px;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  -webkit-column-width: 310px;
  -moz-column-width: 310px;
  column-width: 310px;
  -webkit-column-gap: 100px;
  -moz-column-gap: 100px;
  column-gap: 100px;
  -webkit-column-count: 2;
  -moz-column-count: 2;
  column-count: 2;
  /*
	column-rule-style: solid; 
	column-rule-width: 1px;
	column-rule-color: blue;
	*/
}
#sec_impressum h2 {
  text-transform: uppercase;
  font-weight: normal;
  font-family: "verlagextra_light";
  font-size: 40px;
  -webkit-column-span: all;
  -moz-column-span: all;
  column-span: all;
}
#sec_impressum b {
  display: block;
  font-weight: normal;
  font-family: "verlagblack";
  margin-bottom: 10px;
}
#sec_impressum b:first-child {
  margin-top: 0;
}
#sec_impressum p {
  margin: 0  0 10px 0;
  orphans: 3;
  widows: 3;
}
#sec_impressum ul {
  margin: 0;
  padding: 0;
  list-style-position: inside;
  list-style-type: circle;
}
#sec_impressum {
  left: 18800px;
}
#sec_datenschutz {
  left: 19450px;
}
#topalert {
  position: fixed;
  width: 100%;
  top: 10px;
  left: 0;
  z-index: 200;
  text-align: center;
  color: #000;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  opacity: 0.5;
  font-size: 18px;
}
.audiojs {
  width: 100%;
  height: 42px;
  overflow: hidden;
  font-family: monospace;
  font-size: 12px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  background: rgba(0, 0, 0, 0.1);
  position: absolute;
  z-index: 1000;
  bottom: 60px;
  background-color: #ff9e1f;
  background-color: #ffa934;
  -webkit-box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
}
.audiojs p {
  display: none;
  width: 25px;
  height: 40px;
  margin: 0px;
  cursor: pointer;
}
.audiojs audio {
  position: absolute;
  left: -1px;
}
.audiojs .play {
  display: block;
}
.audiojs .play-pause {
  width: 25px;
  height: 42px;
  padding: 6px 6px;
  margin: 0px;
  float: left;
  overflow: hidden;
}
.audiojs .scrubber {
  position: relative;
  float: left;
  width: 89%;
  background: rgba(0, 0, 0, 0.1);
  height: 6px;
  margin: 18px 10px;
  border-left: 0px;
  border-bottom: 0px;
  overflow: hidden;
  cursor: pointer;
}
.audiojs .progress {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 4px;
  width: 0px;
  background: #271907;
  z-index: 1;
}
.audiojs .loaded {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 4px;
  width: 0px;
  background: rgba(0, 0, 0, 0.1);
}
.audiojs .time {
  float: left;
  height: 36px;
  line-height: 36px;
  margin: 0px 0px 0px 6px;
  padding: 0px 6px 0px 12px;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.2);
  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.3);
}
.audiojs .time em {
  padding: 0px 2px 0px 0px;
  color: #271907;
  font-style: normal;
}
.audiojs .time strong {
  padding: 0px 0px 0px 2px;
  font-weight: normal;
}
.audiojs .error-message {
  float: left;
  display: none;
  margin: 0px 10px;
  height: 36px;
  width: 400px;
  overflow: hidden;
  line-height: 36px;
  white-space: nowrap;
  color: #fff;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  -icab-text-overflow: ellipsis;
  -khtml-text-overflow: ellipsis;
  -moz-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
}
.audiojs .error-message a {
  color: #eee;
  text-decoration: none;
  padding-bottom: 1px;
  border-bottom: 1px solid #999;
  white-space: wrap;
}
.audiojs .play {
  background: url("player-graphics.gif") -2px -1px no-repeat;
}
.audiojs .loading {
  background: url("player-graphics.gif") -2px -31px no-repeat;
}
.audiojs .error {
  background: url("player-graphics.gif") -2px -61px no-repeat;
}
.audiojs .pause {
  background: url("player-graphics.gif") -2px -91px no-repeat;
}
.playing .play,
.playing .loading,
.playing .error {
  display: none;
}
.playing .pause {
  display: block;
}
.loading .play,
.loading .pause,
.loading .error {
  display: none;
}
.loading .loading {
  display: block;
}
.error .time,
.error .play,
.error .pause,
.error .scrubber,
.error .loading {
  display: none;
}
.error .error {
  display: block;
}
.error .play-pause p {
  cursor: auto;
}
.error .error-message {
  display: block;
}