/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {line-height: 1.15; -webkit-text-size-adjust: 100%;}
body {margin: 0;}
main {display: block;}
h1 {font-size: 2em; margin: 0.67em 0;}
hr {box-sizing: content-box; height: 0; overflow: visible;}
pre {font-family: monospace, monospace; font-size: 1em;}
a {background-color: transparent;}
abbr[title] {border-bottom: none; text-decoration: underline; text-decoration: underline dotted;}
b, strong {font-weight: bolder;}
code, kbd, samp {font-family: monospace, monospace; font-size: 1em;}
small {font-size: 80%;}
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none;}
button, input, optgroup, select, textarea {font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0;}
button, input {overflow: visible;}
button, select {text-transform: none;}
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none; padding: 0;}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"], [type="radio"] {box-sizing: border-box; padding: 0;}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button; font: inherit;}
details {display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;}


/*#####################################
#########  FANCYBOX 3.1.25  ###########
#####################################*/
@charset "UTF-8";.fancybox-enabled{overflow:hidden}.fancybox-enabled body{overflow:visible;height:100%}.fancybox-is-hidden{position:absolute;top:-9999px;left:-9999px;visibility:hidden}.fancybox-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:99993;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0)}.fancybox-container~.fancybox-container{z-index:99992}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{position:absolute;top:0;right:0;bottom:0;left:0}.fancybox-outer{overflow-y:auto;-webkit-overflow-scrolling:touch}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption-wrap,.fancybox-infobar,.fancybox-toolbar{position:absolute;direction:ltr;z-index:99997;opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s;box-sizing:border-box}.fancybox-show-caption .fancybox-caption-wrap,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;visibility:visible;transition:opacity .25s,visibility 0s}.fancybox-infobar{top:0;left:50%;margin-left:-79px}.fancybox-infobar__body{display:inline-block;width:70px;line-height:44px;font-size:13px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;text-align:center;color:#ddd;background-color:rgba(30,30,30,.7);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:subpixel-antialiased}.fancybox-toolbar{top:0;right:0}.fancybox-stage{overflow:hidden;direction:ltr;z-index:99994;-webkit-transform:translateZ(0)}.fancybox-slide{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;overflow:auto;outline:none;white-space:normal;box-sizing:border-box;text-align:center;z-index:99994;-webkit-overflow-scrolling:touch;display:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.fancybox-slide:before{content:"";display:inline-block;vertical-align:middle;height:100%;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--image{overflow:visible}.fancybox-slide--image:before{display:none}.fancybox-slide--video .fancybox-content,.fancybox-slide--video iframe{background:#000}.fancybox-slide--map .fancybox-content,.fancybox-slide--map iframe{background:#e5e3df}.fancybox-slide--next{z-index:99995}.fancybox-slide>div{display:inline-block;position:relative;padding:24px;margin:44px 0;border-width:0;vertical-align:middle;text-align:left;background-color:#fff;overflow:auto;box-sizing:border-box}.fancybox-slide .fancybox-image-wrap{position:absolute;top:0;left:0;margin:0;padding:0;border:0;z-index:99995;background:transparent;cursor:default;overflow:visible;-webkit-transform-origin:top left;transform-origin:top left;background-size:100% 100%;background-repeat:no-repeat;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-can-zoomOut .fancybox-image-wrap{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-image-wrap{cursor:zoom-in}.fancybox-can-drag .fancybox-image-wrap{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-image-wrap{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-image,.fancybox-spaceball{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0;border:0;max-width:none;max-height:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-spaceball{z-index:1}.fancybox-slide--iframe .fancybox-content{padding:0;width:80%;height:80%;max-width:calc(100% - 100px);max-height:calc(100% - 88px);overflow:visible;background:#fff}.fancybox-iframe{display:block;padding:0;border:0;height:100%}.fancybox-error,.fancybox-iframe{margin:0;width:100%;background:#fff}.fancybox-error{padding:40px;max-width:380px;cursor:default}.fancybox-error p{margin:0;padding:0;color:#444;font:16px/20px Helvetica Neue,Helvetica,Arial,sans-serif}.fancybox-close-small{position:absolute;top:0;right:0;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:0;outline:none;background:transparent;z-index:10;cursor:pointer}.fancybox-close-small:after{content:"×";position:absolute;top:5px;right:5px;width:30px;height:30px;font:20px/30px Arial,Helvetica Neue,Helvetica,sans-serif;color:#888;font-weight:300;text-align:center;border-radius:50%;border-width:0;background:#fff;transition:background .25s;box-sizing:border-box;z-index:2}.fancybox-close-small:focus:after{outline:1px dotted #888}.fancybox-close-small:hover:after{color:#555;background:#eee}.fancybox-slide--iframe .fancybox-close-small{top:0;right:-44px}.fancybox-slide--iframe .fancybox-close-small:after{background:transparent;font-size:35px;color:#aaa}.fancybox-slide--iframe .fancybox-close-small:hover:after{color:#fff}.fancybox-caption-wrap{bottom:0;left:0;right:0;padding:60px 30px 0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8));pointer-events:none}.fancybox-caption{padding:30px 0;border-top:1px solid hsla(0,0%,100%,.4);font-size:14px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#fff;line-height:20px;-webkit-text-size-adjust:none}.fancybox-caption a,.fancybox-caption button,.fancybox-caption select{pointer-events:all}.fancybox-caption a{color:#fff;text-decoration:underline}.fancybox-button{display:inline-block;position:relative;margin:0;padding:0;border:0;width:44px;height:44px;line-height:44px;text-align:center;background:transparent;color:#ddd;border-radius:0;cursor:pointer;vertical-align:top;outline:none}.fancybox-button[disabled]{cursor:default;pointer-events:none}.fancybox-button,.fancybox-infobar__body{background:rgba(30,30,30,.6)}.fancybox-button:hover:not([disabled]){color:#fff;background:rgba(0,0,0,.8)}.fancybox-button:after,.fancybox-button:before{content:"";pointer-events:none;position:absolute;background-color:currentColor;color:currentColor;opacity:.9;box-sizing:border-box;display:inline-block}.fancybox-button[disabled]:after,.fancybox-button[disabled]:before{opacity:.3}.fancybox-button--left:after,.fancybox-button--right:after{top:18px;width:6px;height:6px;background:transparent;border-top:2px solid currentColor;border-right:2px solid currentColor}.fancybox-button--left:after{left:20px;-webkit-transform:rotate(-135deg);transform:rotate(-135deg)}.fancybox-button--right:after{right:20px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--left{border-bottom-left-radius:5px}.fancybox-button--right{border-bottom-right-radius:5px}.fancybox-button--close:after,.fancybox-button--close:before{content:"";display:inline-block;position:absolute;height:2px;width:16px;top:calc(50% - 1px);left:calc(50% - 8px)}.fancybox-button--close:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.fancybox-button--close:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.fancybox-arrow{position:absolute;top:50%;margin:-50px 0 0;height:100px;width:54px;padding:0;border:0;outline:none;background:none;cursor:pointer;z-index:99995;opacity:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:opacity .25s}.fancybox-arrow:after{content:"";position:absolute;top:28px;width:44px;height:44px;background-color:rgba(30,30,30,.8);background-image:url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI0OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgNGwtMS40MSAxLjQxTDE2LjE3IDExSDR2MmgxMi4xN2wtNS41OCA1LjU5TDEyIDIwbDgtOHoiLz48L3N2Zz4=);background-repeat:no-repeat;background-position:50%;background-size:24px 24px}.fancybox-arrow--right{right:0}.fancybox-arrow--left{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}.fancybox-arrow--left:after,.fancybox-arrow--right:after{left:0}.fancybox-show-nav .fancybox-arrow{opacity:.6}.fancybox-show-nav .fancybox-arrow[disabled]{opacity:.3}.fancybox-slide>.fancybox-loading{border:6px solid hsla(0,0%,39%,.4);border-top:6px solid hsla(0,0%,100%,.6);border-radius:100%;height:50px;width:50px;-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;position:absolute;top:50%;left:50%;margin-top:-25px;margin-left:-25px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}.fancybox-fx-slide.fancybox-slide--current{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--next{-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5);opacity:0}.fancybox-fx-zoom-in-out.fancybox-slide--current{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.fancybox-fx-rotate.fancybox-slide--previous{-webkit-transform:rotate(-1turn);transform:rotate(-1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--next{-webkit-transform:rotate(1turn);transform:rotate(1turn);opacity:0}.fancybox-fx-rotate.fancybox-slide--current{-webkit-transform:rotate(0deg);transform:rotate(0deg);opacity:1}.fancybox-fx-circular.fancybox-slide--previous{-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--next{-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0);opacity:0}.fancybox-fx-circular.fancybox-slide--current{-webkit-transform:scaleX(1) translateZ(0);transform:scaleX(1) translateZ(0);opacity:1}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}@media (max-width:800px){.fancybox-infobar{left:0;margin-left:0}.fancybox-button--left,.fancybox-button--right{display:none!important}.fancybox-caption{padding:20px 0;margin:0}}.fancybox-button--fullscreen:before{width:15px;height:11px;left:calc(50% - 7px);top:calc(50% - 6px);border:2px solid;background:none}.fancybox-button--pause:before,.fancybox-button--play:before{top:calc(50% - 6px);left:calc(50% - 4px);background:transparent}.fancybox-button--play:before{width:0;height:0;border-top:6px inset transparent;border-bottom:6px inset transparent;border-left:10px solid;border-radius:1px}.fancybox-button--pause:before{width:7px;height:11px;border-style:solid;border-width:0 2px}.fancybox-button--thumbs,.fancybox-thumbs{display:none}@media (min-width:800px){.fancybox-button--thumbs{display:inline-block}.fancybox-button--thumbs span{font-size:23px}.fancybox-button--thumbs:before{width:3px;height:3px;top:calc(50% - 2px);left:calc(50% - 2px);box-shadow:0 -4px 0,-4px -4px 0,4px -4px 0,inset 0 0 0 32px,-4px 0 0,4px 0 0,0 4px 0,-4px 4px 0,4px 4px 0}.fancybox-thumbs{position:absolute;top:0;right:0;bottom:0;left:auto;width:220px;margin:0;padding:5px 5px 0 0;background:#fff;word-break:normal;-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;box-sizing:border-box;z-index:99995}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:220px}.fancybox-thumbs>ul{list-style:none;position:absolute;position:relative;width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;overflow-y:auto;font-size:0}.fancybox-thumbs>ul>li{float:left;overflow:hidden;max-width:50%;padding:0;margin:0;width:105px;height:75px;position:relative;cursor:pointer;outline:none;border:5px solid transparent;border-top-width:0;border-right-width:0;-webkit-tap-highlight-color:transparent;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-sizing:border-box}li.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li>img{position:absolute;top:0;left:0;min-width:100%;min-height:100%;max-width:none;max-height:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-thumbs>ul>li:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:2px;border:4px solid #4ea7f9;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}.fancybox-thumbs>ul>li.fancybox-thumbs-active:before{opacity:1}}


/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/open-sans-v15-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Light'), local('OpenSans-Light'),
	   url('fonts/open-sans-v15-latin-300d41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/open-sans-v15-latin-300.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/open-sans-v15-latin-300.woff') format('woff'), /* Modern Browsers */
	   url('fonts/open-sans-v15-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/open-sans-v15-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* raleway-700 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/raleway-v12-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Raleway Bold'), local('Raleway-Bold'),
	   url('fonts/raleway-v12-latin-700d41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/raleway-v12-latin-700.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/raleway-v12-latin-700.woff') format('woff'), /* Modern Browsers */
	   url('fonts/raleway-v12-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/raleway-v12-latin-700.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* raleway-800 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/raleway-v12-latin-800.eot'); /* IE9 Compat Modes */
  src: local('Raleway ExtraBold'), local('Raleway-ExtraBold'),
	   url('fonts/raleway-v12-latin-800d41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/raleway-v12-latin-800.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/raleway-v12-latin-800.woff') format('woff'), /* Modern Browsers */
	   url('fonts/raleway-v12-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/raleway-v12-latin-800.svg#Raleway') format('svg'); /* Legacy iOS */
}

/* raleway-900 - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/raleway-v12-latin-900.eot'); /* IE9 Compat Modes */
  src: local('Raleway Black'), local('Raleway-Black'),
	   url('fonts/raleway-v12-latin-900d41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/raleway-v12-latin-900.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/raleway-v12-latin-900.woff') format('woff'), /* Modern Browsers */
	   url('fonts/raleway-v12-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/raleway-v12-latin-900.svg#Raleway') format('svg'); /* Legacy iOS */
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-condensed-v16-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'),
	   url('fonts/roboto-condensed-v16-latin-300d41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/roboto-condensed-v16-latin-300.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/roboto-condensed-v16-latin-300.woff') format('woff'), /* Modern Browsers */
	   url('fonts/roboto-condensed-v16-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/roboto-condensed-v16-latin-300.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}

/* roboto-condensed-regular - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-condensed-v16-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'),
	   url('fonts/roboto-condensed-v16-latin-regulard41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/roboto-condensed-v16-latin-regular.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/roboto-condensed-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
	   url('fonts/roboto-condensed-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/roboto-condensed-v16-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}
/* grus-regular */
@font-face {
  font-family: 'grus';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/grus.eot'); /* IE9 Compat Modes */
  src: local('grus'), local('grus'),
	   url('fonts/grus.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/grus.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/grus.woff') format('woff'), /* Modern Browsers */
	   url('fonts/grus.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/grus.svg#grus') format('svg'); /* Legacy iOS */
}

/* indie-flower-regular - latin */
@font-face {
  font-family: 'Indie Flower';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/indie-flower-v9-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Indie Flower'), local('IndieFlower'),
	   url('fonts/indie-flower-v9-latin-regulard41d.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	   url('fonts/indie-flower-v9-latin-regular.html') format('woff2'), /* Super Modern Browsers */
	   url('fonts/indie-flower-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
	   url('fonts/indie-flower-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
	   url('fonts/indie-flower-v9-latin-regular.svg#IndieFlower') format('svg'); /* Legacy iOS */
}

@charset "utf-8";
a.menu-link {display: none;}
.js #toolbar {max-height: none;}

html {
	height: 100%;
/*	overflow: -moz-scrollbars-vertical;
	overflow: scroll; */
}

body {
	background-color: #111111;
	color: #777;
	font-size: 14px;
/*	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; */
	height: 100%;
	line-height: 20px;
	margin: 0;
	padding:0; 
	text-align: justify;
	width: 100%;
}




/* Fonts############################################################################################################################################ */

body,
.answer,
h4,
#topmenu .menu a,
input,
textarea,
#footer ul.menu li.level_1,
.result-title,
.dex-number {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 600;
}

h2,
#testimonials h3,
.footerbox h3,
.portfolio .portfolio-info h3,
.intro-link a,
#loadingtext p,
#loadedtext p,
#thank-you {
	font-family: 'Raleway', sans-serif;
	font-weight: 900;
}

h1, h3, h4,
.werbung-link a,
.stats p,
.client-name,
.online-link a,
.dex-toptext {
	font-family: 'Raleway', sans-serif;
	font-weight: 700;
}

.send-form,
.dex-bottomtext {
	font-family: 'Raleway', sans-serif;
	font-weight: 800;
}

.dex-number {
	font-family: Impact, Charcoal, sans-serif;
}




/* Global HTML############################################################################################################################################ */

#preloader {
	background-color: #fff;
	bottom: 0;
	height: 100%;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 9999;
}

.clear {
	clear: both;
}

h1, h2, h3, h4 {
	border: none;
	text-transform: uppercase;
}

h1, h2 {
	margin: 0 0 10px 0;
}

h1 {
	font-size: 20px;
	letter-spacing: 1px;
}

h2 {
	padding: 40px 0 0 0;
}

h3 {
	color: #777;
	font-size: 14px;
	letter-spacing: 1px;
	margin: 15px 0 5px 0;
	text-align: center;
}

h4 {
	font-size: 14px;
	letter-spacing: 1px;
	margin-bottom: 10px;
	text-align: left;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
	text-decoration: none;
}

p {
	margin: 0 0 10px 0;
	padding: 0;
	text-align: justify;
}

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

img {
	border: 0;
}



/* Navigation */

#nav {
	display: none;
	height: 100vh;
	position: fixed;
	right: 0;
	top: 0;
	width: 80px;
	z-index: 9970;
}

#nav-symbol {
	opacity: 1;
	position: absolute;
	top: 20px;
	text-align: center;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
	z-index: 20;
}

#nav-symbol p {
	text-align: center;
}

#nav-home {
	background: transparent url("../../images/agentur-ingolstadt.png") no-repeat scroll center top;
	height: 50px;
	opacity: 0;
	position: absolute;
	top: 20px;
	text-align: center;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
	z-index: 20;
}

#nav-home:hover {
	background-position: center -50px;
}

#nav-home p, #nav-home a {
	display: inline-block;
	height: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	text-decoration: none;
	width: 100%;
}

#nav-impressum {
	bottom: 10px;
	height: 20px;
	margin: 0;
	opacity: 0;
	position: absolute;
	text-align: center;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	-webkit-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	width: 100%;
	z-index: 20;
}

#nav-impressum a {
	bottom: 15px;
	color: #777;
	display: inline-block;
	font-size: 10px;
	height: 20px;
	text-align: center;
	text-decoration: none;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
}

#nav-impressum a:hover {
	color: #fff;
}

#nav-inner {
	background-color: rgba(0,0,0,0.8);
	height: 100%;
	left: 80px;
	position: absolute;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
	z-index: 10;
}

#nav-dots {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	z-index: 20;
}

#nav-dots ul {
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	-webkit-transform: scale(0.25);
	-moz-transform: scale(0.25);
	-ms-transform: scale(0.25);
	-o-transform: scale(0.25);
	transform: scale(0.25);
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 20px;
}

#nav-dots li {
	clear: both;
	display: inline-block;
	height: 20px;
	margin: 10px auto 30px auto;
	padding: 15px 0;
	position: relative;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 20px;
}

#nav-dots li p {
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

#nav-real {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	z-index: 20;
}

#nav-real ul {
	list-style-type: none;
	margin: 0;
	opacity: 0;
	padding: 0;
	text-align: center;
	-webkit-transform: scale(0.25);
	-moz-transform: scale(0.25);
	-ms-transform: scale(0.25);
	-o-transform: scale(0.25);
	transform: scale(0.25);
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#nav-real ul li {
	background: transparent url("../../images/werbeagentur.png") no-repeat;
	height: 55px;
	opacity: 0.7;
	text-align: center;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
}

#nav-real #ni1 {background-position: center 0px;}
#nav-real #ni2 {background-position: center -100px;}
#nav-real #ni3 {background-position: center -200px;}
#nav-real #ni4 {background-position: center -300px;}
#nav-real #ni5 {background-position: center -400px;}
#nav-real #ni6 {background-position: center -500px;}
#nav-real #ni7 {background-position: center -600px;}
#nav-real #ni8 {background-position: center -700px;}

#nav-real li a {
	color: #fff;
	display: block;
	font-size: 12px;
	letter-spacing: 0.5px;
	line-height: 16px;
	padding: 30px 0 10px 0;
	text-decoration: none;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#nav-real ul:hover li {
	opacity: 0.4;
}

#nav-real ul li:hover {
	opacity: 1;
}



/* Hover */

#nav:hover #nav-symbol {
	opacity: 0;
}

#nav:hover #nav-home {
	opacity: 1;
}

#nav:hover #nav-impressum {
	opacity: 1;
}

#nav:hover #nav-inner {
	left: 0;
}

#nav:hover #nav-dots li {
	padding: 0;
}

#nav:hover #nav-dots ul {
	opacity: 0;
	-webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
	-ms-transform: scale(1.0);
	-o-transform: scale(1.0);
	transform: scale(1.0);
}

#nav:hover #nav-real ul {
	opacity: 1;
	-webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
	-ms-transform: scale(1.0);
	-o-transform: scale(1.0);
	transform: scale(1.0);
}


/* NavLaunch */

#nav-symbol, #nav-dots ul {
	display: none;
}


.navlaunch #nav-symbol {
	opacity: 0;
}

.navlaunch #nav-home {
	display: none;
}

.navlaunch #nav-impressum {
	opacity: 1;
}

.navlaunch #nav-inner {
	left: 0;
}

.navlaunch #nav-dots ul {
	opacity: 0;
}

.navlaunch #nav-real ul {
	opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

#maininfo {
	background-color: #fff;
	left: 10%;
	margin: 0;
	max-width: 1300px;
	padding: 50px 0;
	position: relative;
	width: 80%;
}

.home #maininfo {
	padding: 0;
}



/* Content ################################################################################################################################################################################# */

.section {
	clear: both;
	display: block;
	height: 1000px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	position: relative;
	width: 100%;
	z-index: 10;
}

.holder {
	height: 100%;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 25px;
	position: relative;
	z-index: 5;
}

.content {
	position: relative;
}



/* Intro ####################### */

#intro {
	background-color: #fff;
	height: 40vh;
	margin: 0;
	overflow: hidden;
	padding: 0;
	position: relative;
	width: 100%;
	z-index: 9500;
}

.home #intro {
	-webkit-box-shadow: 0px 0px 25px 15px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 25px 15px rgba(0,0,0,0.5);
	-ms-box-shadow: 0px 0px 25px 15px rgba(0,0,0,0.5);
	-o-box-shadow: 0px 0px 25px 15px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 25px 15px rgba(0,0,0,0.5);
	height: 100vh;
	margin: 0;
	position: fixed;
}


/* Video */

#video-container {
	bottom: 0;
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 1;
}

#video {
	bottom: -25%;
	left: 0px;
	margin: 0 auto;
	min-width: 100%;
	min-height: 100%;
	overflow: hidden;
	position: absolute;
	right: 0px;
	top: auto;
	width: 100%;
	z-index: -1000;
}

.home #video {
	bottom: auto;
	height: 100%;
	top: 0;
}

@media (min-aspect-ratio: 16/9) {
	.home #video {height: 300%; top: -100%;}
}
@media (max-aspect-ratio: 16/9) {
	.home #video {width: 300%; left: -100%;}
}

#video-mobile {
	background: #fff url("../../images/werbeagentur-ingolstadt/responsive-webdesign-ingolstadt.jpg") no-repeat scroll center top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	bottom: 0;
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
}




/* ##### Home ##### */

#home {
	height: 55%;
	left: 10%;
	max-width: 1200px;
	position: absolute;
	top: 40%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	z-index: 100;
}

.home #home {
	max-height: 550px;
	min-height: 450px;
}

.mobile #home {
	max-height: 550px;
	top: 5%;
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;
	transform: none;
}



#logo-anni {
  border: 0;
  display: none;
  height: auto;
  left: -4px;
  margin: 0 auto;
  padding: 0;
  position: absolute;
  top: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-100%);
  width: 70px;
}



/* Logo */

#logo {
	display: none;
	height: 60px;
	left: 0;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
}

#logo-clear, #logo-blur {
	left: 0;
	margin: 0 auto;
	position: absolute;
	top: 0;
	width: 100%;
}

#logo-blur {
	display: none;
	height: 60px;
	left: -25px;
	width: 300px;
}

#logo li {
	float: left;
	opacity: 0;
	padding: 0;
	-webkit-transition: all 2s ease-out 0s;
	-moz-transition: all 2s ease-out 0s;
	-ms-transition: all 2s ease-out 0s;
	-o-transition: all 2s ease-out 0s;
	transition: all 2s ease-out 0s;
}

#logo li.active {
	opacity: 1;
	padding: 0;
}


/* Claim */

#claim {
	display: none;
	height: 25px;
	left: 7px;
	position: absolute;
	top: 60px;
}

#claim p {
	color: #777;
	font-size: 10px;
	letter-spacing: 3px;
	text-align: left;
}



/* Home Sprachen */

#sprachen {
	display: none;
	height: 50px;
	left: -10px;
	padding: 0;
	position: absolute;
	top: 100px;
}

#sprachen .menu {
	margin: 0;
	padding: 0;
	text-align: center;
}

#sprachen ul.menu li {
	border-right: 1px solid rgba(0, 0, 0, 0.3);
	display: inline-block;
	line-height: 14px;
	margin: 0;
}

#sprachen ul.menu li.nav3 {
	border: none;
}

#sprachen .menu li a {
	color: rgba(0,0,0,0.5);
	font-size: 12px;
	letter-spacing: 1px;
	padding: 0 18px 6px 18px;
	text-decoration: none;
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

#sprachen .menu li a.active {
	background: transparent url("../../images/werbeagentur-ingolstadt/sprache-active.png") no-repeat center bottom;
}

#sprachen .menu li a:hover {
	color: #c00;
}



/* Intro Nav */

#intronav {
	bottom: 0;
	display: none;
	list-style-type: none;
	height: 590px;
	left: 0;
	margin: 0 auto;
	max-width: 1275px;
	position: absolute;
	right: 0;
	text-align: center;
}

#intronav li {
	position: absolute;
	text-align: center;
	width: 100%;
}

.intro-link a {
	color: rgb(0 0 0 / 20%);
	display: none;
	font-size: 100px;
	height: 83px;
	left: 0;
	letter-spacing: 0px;
	line-height: 74px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	text-align: left;
	text-decoration: none;
	text-transform: uppercase;
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: black;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

.intro-link a:hover {
	background: linear-gradient(90deg, rgba(81,40,137,1) 0%, rgba(163,89,214,1) 6%, rgba(238,91,206,1) 13%, rgba(255,92,204,1) 21%, rgba(66,117,254,1) 31%, rgba(10,201,213,1) 41%, rgba(9,246,247,1) 49%, rgba(92,255,116,1) 61%, rgba(238,255,92,1) 69%, rgba(245,191,97,1) 85%, rgba(241,24,24,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
	padding: 0 0 0 15px;
}	

}

#intro1 {top: 0;}
#intro2 {top: 80px;}
#intro3 {top: 160px;}
#intro4 {top: 240px;}
#intro5 {top: 320px;}



/* Loadwheel */

#loadwheel {
	-webkit-animation: loadwheel 1s linear infinite;
	-moz-animation: loadwheel 1s linear infinite;
	-o-animation: loadwheel 1s linear infinite;
	animation: loadwheel 1s linear infinite;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	border-top: 5px solid rgba(0,0,0,0.25);
	border-right: 5px solid transparent;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	height: 50px;
	left: 20%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 50%;
	width: 50px;
}

@-webkit-keyframes loadwheel {
	to {transform: rotate(360deg);}
}

@-moz-keyframes loadwheel {
	to {transform: rotate(360deg);}
}

@keyframes loadwheel {
	to {transform: rotate(360deg);}
}

#loading p {
	animation: loading 0.5s infinite;
	color: #3e6c2b;
	float: right;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 2px;
	margin: 0;
	padding: 5px 5px 0 10px;
	text-align: center;
	text-transform: uppercase;
}

@-webkit-keyframes loading {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}

@-moz-keyframes loading {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}

@-ms-keyframes loading {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}

@-o-keyframes loading {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes loading {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}





/* BDG IHK */

#bdg-ihk {
	bottom: 50px;
	display: none;
	left: 10%;
	max-width: 1300px;
	padding: 0;
	position: absolute;
	z-index: 40;
}

.mobile #bdg-ihk {
	bottom: 70px;
}

#bdg-ihk .menu {
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}

#bdg-ihk ul.menu li {
	display: inline-block;
	margin: 0 3px;
}



/* DownLink */

.downlink {
	display: none;
	height: 100vh;
	left: 50%;
	margin: 0 0 0 -25px;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 70px;
	z-index: 3500;
}

.downlink a {
	bottom: 10px;
	height: 50px;
	opacity: 0.5;
	position: absolute;
	text-decoration: none;
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
	width: 70px;
}

.downlink a:hover {
	opacity: 1;
}




/* Werbung ####################### */

#werbung {
	height: 100vh;
	overflow: hidden;
	width: 100%;
}

.mobile #werbung {
	background: #fff url("../../images/grafikdesign/werbung.jpg") no-repeat scroll center center;
}

#heaven, #heaven-bg {
	bottom: 50vh;
	height: 50vh;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;

}

#hell, #hell-bg {
	bottom: 0;
	height: 50vh;
	left: 0;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 50vh;
	width: 100%;
}

#heaven {
	z-index: 4;
}

#hell {
	z-index: 3;
}

#hell h3 {
	color: #fff;
}

#glass1, #glass2 {
	height: 100%;
	left: 45%;
	margin: 0;
	position: absolute;
	top: 0;
	width: 55%;
}

#glass1 {
	background: transparent url("../../images/grafikdesign/glass1.png") no-repeat scroll left top;
	z-index: 7;
}

#glass2 {
	background: transparent url("../../images/grafikdesign/glass2.png") no-repeat scroll left top;
	z-index: 6;
}

.mobile #glass2 {
	display: none;
}

#heaven-bg {
	background: #fff url("../../images/grafikdesign/bg-heaven.jpg") no-repeat fixed center center;
	z-index: 2;
}

.mobile #heaven-bg {
	background: none;
}

#hell-bg {
	background: #000 url("../../images/grafikdesign/bg-hell.jpg") no-repeat fixed center center;
	z-index: 1;
}

.mobile #hell-bg {
	background: none;
}

#werbung .holder {
	height: 100%;
	z-index: 50;
}

#heaven .content {
	bottom: 0;
	color: #555;
	height: 335px;
	left: 25px;
	overflow: hidden;
	position: absolute;
	width: 450px;
}

#hell .content {
	color: #fff;
	left: 25px;
	overflow: hidden;
	position: absolute;
	top: 15px;
	width: 450px;
}

#werbung h2 {
	color: #c00;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-transform: uppercase;
	text-shadow: 0 8px 8px rgba(0,0,0,0.5), 0 -2px 1px #eee;
}

#werbung h2 span {
	color: #9bd;
	display: block;
	font-size: 38px;
	letter-spacing: 0px;
	line-height: 40px;
	padding-top: 5px;
	position: relative;
	text-shadow: 0 8px 8px rgba(0,0,0,0.30), 0 -2px 1px #eee;
	text-transform: uppercase;
}

	
	
	
#heaven .content h2 {
	padding: 20px 0 0 0
}

#hell .content h2 {
	padding: 20px 0 0 0
}

#hell .content h2 span {
	color: #e30;
	font-size: 32px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-transform: uppercase;
	font-weight: 700;
	padding-top: 5px;
	text-shadow: 0 8px 8px rgb(186 63 63 / 50%), 0 -2px 1px #df6b6b;
}

#hell .content p {
	color: rgba(255,255,255,0.7);
}

.reklama-link {
	display: inline-block;
	height: 70px;
	margin-top: 5px;
	width: 100%;
}

.reklama-link a {
	display: inline-block;
	font-size: 22px;
	padding: 24px 0 0 45px;
	text-decoration: none;
	text-transform: uppercase;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

.reklama-link a:hover {
	padding: 24px 0 0 55px;
}

#heaven .reklama-link {
	background: transparent url("../../images/grafikdesign/angel-icon.png") no-repeat scroll left top;
}

#hell .reklama-link {
	background: transparent url("../../images/grafikdesign/devil-icon.png") no-repeat scroll left top;
}

#heaven .reklama-link a {
	color: #9bd;
	text-shadow: 0 8px 8px rgb(0 0 0 / 24%), 0 -2px 1px #eee;
}

#hell .reklama-link a {
	color: #e30;
	text-shadow: 2px 2px 2px rgb(15 15 15 / 55%), 4px 4px 11px #e38;
}




/* Agentur ####################### */

#agentur {
	background: #000 url("../../images/agentur/bg-agentur.jpg") no-repeat scroll center top;
	z-index: 100;
}

#agentur-head {
	background: transparent url("../../images/agentur/agentur-head.png") no-repeat scroll center bottom;
	bottom: 0;
	height: 30px;
	position: absolute;
	width: 100%;
	z-index: 500;
}

#agentur h1, #agentur h3 {
	font-weight: 400;
}

#agentur .anibox {
	margin: 0 120px 0 0;
	position: absolute;
	right: 50%;
	z-index: 3;
}

#agentur .anibox.animate {
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
}

.device {
	position: relative;
	z-index: 20;
}

#agentur #xray {
	height: 220px;
	overflow: hidden;
	position: absolute;
	right: 63px;
	top: 15px;
	width: 400px;
	z-index: 10;
}

#organs {
	background: #fff url("../../images/agentur/xray.jpg") no-repeat scroll left 0;
	height: 1000px;
	margin: -15px 0 0 0;
	display: none;
	position: absolute;
	right: 0;
	width: 100%;
}

#organs.animate {
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
}

#organs-overlay {
	background: transparent url("../../images/agentur/xray.png") no-repeat scroll left 0;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 500;
}

#heart {
	position: absolute;
	right: 40px;
	top: 490px;
}

#heart img {
	height: auto;
	width: 100%;
}

#heart.animate {
	-ms-animation: heartbeat 1.5s ease-in-out infinite;
	-webkit-animation: heartbeat 1.5s ease-in-out infinite;
	-moz-animation: heartbeat 1.5s ease-in-out infinite;
	-o-animation: heartbeat 1.5s ease-in-out infinite;
	animation: heartbeat 1.5s ease-in-out infinite;
}

@keyframes heartbeat {
0% {
	-ms-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
}
20% {
	-ms-transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
40% {
	-ms-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
}
60% {
	-ms-transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
80% {
	-ms-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
}
100% {
	-ms-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
}
}

#brain {
	position: absolute;
	right: 0px;
	top: 130px;
}

.cog {
	position: absolute;
}

#cog1 {right: 205px; top: 82px; z-index: 30;}
#cog2 {right: 140px; top: 65px; z-index: 20;}
#cog3 {right: 75px; top: 90px; z-index: 10;}

#cog1.animate {
	-ms-animation: rotation1 7s linear infinite;
	-webkit-animation: rotation1 7s linear infinite;
	-moz-animation: rotation1 7s linear infinite;
	-o-animation: rotation1 7s linear infinite;
	animation: rotation1 7s linear infinite;
}

#cog2.animate {
	-ms-animation: rotation2 15s linear infinite;
	-webkit-animation: rotation2 15s linear infinite;
	-moz-animation: rotation2 15s linear infinite;
	-o-animation: rotation2 15s linear infinite;
	animation: rotation2 15s linear infinite;
}

#cog3.animate {
	-ms-animation: rotation1 5s linear infinite;
	-webkit-animation: rotation1 5s linear infinite;
	-moz-animation: rotation1 5s linear infinite;
	-o-animation: rotation1 5s linear infinite;
	animation: rotation1 5s linear infinite;
}

@-webkit-keyframes rotation1 /* Safari and Chrome */ {
	from {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	to {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
}

@keyframes rotation1 {
	from {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	to {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
}

@-webkit-keyframes rotation2 /* Safari and Chrome */ {
	from {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	to {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
}

@keyframes rotation2 {
	from {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	to {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
}

#clock {
	height: 130px;
	list-style: none;
	position: absolute;
	right: 180px;
	top: 591px;
	width: 130px;
	z-index: 10;
}

.seconds, .minutes, .hours {
	height: 130px;
	left: 53px;
	position: absolute;
	top: 0px;
	width: 24px;
	-ms-transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.seconds {background: url("../../images/agentur/clock-seconds.png") no-repeat; z-index: 3;}
.minutes {background: url("../../images/agentur/clock-minutes.png") no-repeat; z-index: 2;}
.hours {background: url("../../images/agentur/clock-hours.png") no-repeat; z-index: 1;}

#butterfly {
	height: 100px;
	position: absolute;
	right: 0px;
	top: 630px;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	transform: rotate(-30deg);
	width: 200px;
}

#butterfly-body {
	background: transparent url("../../images/agentur/butterfly-body.png") no-repeat scroll center center;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 20;
}

.butterfly-wing {
	height: 100%;
	position: absolute;
	top:0px;
	width: 50%;
	z-index: 10;
}

.butterfly-wing img {
	height: 100px;
	width: 100%;
}

#butterfly-leftwing {
right: 50%;
-ms-transform-origin: 100% 50%;
-webkit-transform-origin: 100% 50%;
-moz-transform-origin: 100% 50%;
-o-transform-origin: 100% 50%;
transform-origin: 100% 50%;
}

#butterfly-rightwing {
left: 50%;
-ms-transform-origin: 0% 50%;
-webkit-transform-origin: 0% 50%;
-moz-transform-origin: 0% 50%;
-o-transform-origin: 0% 50%;
transform-origin: 0% 50%;
}

#butterfly-leftwing.animate {
  -ms-animation: leftwing ease-in-out 7s infinite;
  -webkit-animation: leftwing ease-in-out 7s infinite;
  -moz-animation: leftwing ease-in-out 7s infinite;
  -o-animation: leftwing ease-in-out 7s infinite;
  animation: leftwing ease-in-out 7s infinite;
}

#butterfly-rightwing.animate {
  -ms-animation: rightwing ease-in-out 7s infinite;
  -webkit-animation: rightwing ease-in-out 7s infinite;
  -moz-animation: rightwing ease-in-out 7s infinite;
  -o-animation: rightwing ease-in-out 7s infinite;
  animation: rightwing ease-in-out 7s infinite;
}

@keyframes leftwing {
	from {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	5% {
	-ms-transform: scaleX(0.2);
	-webkit-transform: scaleX(0.2);
	-moz-transform: scaleX(0.2);
	-o-transform: scaleX(0.2);
	transform: scaleX(0.2);
	}
	10% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	15% {
	-ms-transform: scaleX(0.4);
	-webkit-transform: scaleX(0.4);
	-moz-transform: scaleX(0.4);
	-o-transform: scaleX(0.4);
	transform: scaleX(0.4);
	}
	25% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	40% {
	-ms-transform: scaleX(0.6);
	-webkit-transform: scaleX(0.6);
	-moz-transform: scaleX(0.6);
	-o-transform: scaleX(0.6);
	transform: scaleX(0.6);
	}
	50% {
	-ms-transform: scaleX(0.8);
	-webkit-transform: scaleX(0.8);
	-moz-transform: scaleX(0.8);
	-o-transform: scaleX(0.8);
	transform: scaleX(0.8);
	}
	60% {
	-ms-transform: scaleX(0.6);
	-webkit-transform: scaleX(0.6);
	-moz-transform: scaleX(0.6);
	-o-transform: scaleX(0.6);
	transform: scaleX(0.6);
	}
	70% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	98% {
	-ms-transform: scaleX(0.5);
	-webkit-transform: scaleX(0.5);
	-moz-transform: scaleX(0.5);
	-o-transform: scaleX(0.5);
	transform: scaleX(0.5);
	}
	to {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
}

@keyframes rightwing {
	from {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	5% {
	-ms-transform: scaleX(0.2);
	-webkit-transform: scaleX(0.2);
	-moz-transform: scaleX(0.2);
	-o-transform: scaleX(0.2);
	transform: scaleX(0.2);
	}
	10% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	15% {
	-ms-transform: scaleX(0.4);
	-webkit-transform: scaleX(0.4);
	-moz-transform: scaleX(0.4);
	-o-transform: scaleX(0.4);
	transform: scaleX(0.4);
	}
	25% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	40% {
	-ms-transform: scaleX(0.6);
	-webkit-transform: scaleX(0.6);
	-moz-transform: scaleX(0.6);
	-o-transform: scaleX(0.6);
	transform: scaleX(0.6);
	}
	50% {
	-ms-transform: scaleX(0.8);
	-webkit-transform: scaleX(0.8);
	-moz-transform: scaleX(0.8);
	-o-transform: scaleX(0.8);
	transform: scaleX(0.8);
	}
	60% {
	-ms-transform: scaleX(0.6);
	-webkit-transform: scaleX(0.6);
	-moz-transform: scaleX(0.6);
	-o-transform: scaleX(0.6);
	transform: scaleX(0.6);
	}
	70% {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
	98% {
	-ms-transform: scaleX(0.5);
	-webkit-transform: scaleX(0.5);
	-moz-transform: scaleX(0.5);
	-o-transform: scaleX(0.5);
	transform: scaleX(0.5);
	}
	to {
	-ms-transform: scaleX(1);
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
	}
}

#agentur h2 {
	color: #9f4026;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-transform: uppercase;
	font-weight: 700;
	padding-top: 5px;
	text-shadow: 
		1px 1px 1px #d9eceb,
        1px 2px 1px #d9eceb,
        1px 3px 2px #d9eceb,
        1px 4px 3px #d9eceb,	
    1px 18px 6px rgba(16,16,16,0.4),
    1px 22px 10px rgba(16,16,16,0.2),
    1px 25px 35px rgba(16,16,16,0.2),
    1px 30px 60px rgba(16,16,16,0.4);
}

#agentur h2 span {
	color: #e6a096;
	position: Relative;
	text-transform: uppercase;
	font-size: 60px;
	letter-spacing: 0px;
	line-height: 60px;
	font-weight: 700;
	padding-top: 5px;
	text-shadow: 
		1px 1px 1px #FFF,
        1px 2px 1px #FAFAFA,
        1px 3px 1px #f5f5f5,
        1px 4px 1px #eeeeee,
        1px 5px 2px #e0e0e0,
        1px 6px 3px #e0e0e0,
        1px 7px 3px #e0e0e0,
        1px 8px 3px #e0e0e0,
        1px 9px 1px #bdbdbd,
        1px 10px 1px #424242,
		1px 11px 1px #212121,
    1px 18px 6px rgba(16,16,16,0.4),
    1px 22px 10px rgba(16,16,16,0.2),
    1px 25px 35px rgba(16,16,16,0.2),
    1px 30px 60px rgba(16,16,16,0.4);
}

#agentur .content {
	left: 50%;
	margin: 15px 0 0 -60px;
	position: absolute;
	top: 150px;
	width: 50%;
}

#agentur h1 {
	color: #fff;
	font-size: 18px;
}

#agentur h3 {
	color: #fff;
	font-size: 18px;
	margin: 0 0 10px 0;
}

#agentur .content p {
	color: #fff;
}

#agentur-links {
	display: inline-block;
	left: 50%;
	margin: 0 0 0 50px;
	position: absolute;
	top: 465px;
}

#agentur-links ul {
	display: inline-block;
	margin: 20px 0 0 0;
}

#agentur-links h4 {
	color: #e6a096;
	font-size: 16px;
	left: 0;
	margin: 0;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
}

#agentur-links li {
	float: left;
	height: 200px;
	text-align: center;
	-ms-transform-origin: 50% 20%;
	-webkit-transform-origin: 50% 20%;
	-moz-transform-origin: 50% 20%;
	-o-transform-origin: 50% 20%;
	transform-origin: 50% 20%;
	width: 150px;
}

#agentur-links li.heart {
	-webkit-animation: swinging 4.5s ease-in-out forwards infinite;
	-moz-animation: swinging 4.5s ease-in-out forwards infinite;
	-ms-animation: swinging 4.5s ease-in-out forwards infinite;
	-o-animation: swinging 4.5s ease-in-out forwards infinite;
	animation: swinging 4.5s ease-in-out forwards infinite;
	margin: 0;
}

#agentur-links li.mind {
	-webkit-animation: swinging 3.5s ease-in-out forwards infinite;
	-moz-animation: swinging 3.5s ease-in-out forwards infinite;
	-ms-animation: swinging 3.5s ease-in-out forwards infinite;
	-o-animation: swinging 3.5s ease-in-out forwards infinite;
	animation: swinging 3.5s ease-in-out forwards infinite;
	margin: 10px 0 0 0;
}

#agentur-links li.soul {
	-webkit-animation: swinging 4.0s ease-in-out forwards infinite;
	-moz-animation: swinging 4.0s ease-in-out forwards infinite;
	-ms-animation: swinging 4.0s ease-in-out forwards infinite;
	-o-animation: swinging 4.0s ease-in-out forwards infinite;
	animation: swinging 4.0s ease-in-out forwards infinite;
	margin: 3px 0 0 0;
}

@keyframes swinging {
	0% {
	-ms-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	transform: rotate(10deg);
	}
	50% {
	-ms-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
	-o-transform: rotate(-5deg);
	transform: rotate(-5deg);
	}
	100% {
	-ms-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	transform: rotate(10deg);
	}
}

#agentur .togglebox-hinweis {
	margin-top: 15px;
	padding-bottom: 5px;
}

.agenturlink {
	cursor: pointer;
	float: left;
}

.agenturlink img {
	margin-top: 0;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

.agenturlink:hover img {
	margin-top: 6px;
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.agentur_text {
	display: none;
	width: 100% !important;
}



/* Stats ####################### */

#werbeagentur {
	background: #fff url("../../images/werbeagentur-ingolstadt/bg-werbeagentur.jpg") no-repeat scroll center top;
	height: 100vh;
	overflow: hidden;
	z-index: 200;
}

#werbeagentur .holder {
	height: 100vh;
}

#werbeagentur .content {
	margin: 0 auto;
	max-width: 1000px;
	top: 40%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 500 !important;
}

#werbeagentur h2 {
	color: #fff;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	margin: 0 0 40px 0;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	text-shadow: 0 8px 8px rgba(0,0,0,0.5), 0 -2px 1px #eee;
}

#werbeagentur h2 span {
	color: #cde;
	display: block;
	font-size: 60px;
	letter-spacing: 0px;
	line-height: 60px;
	padding-top: 10px;
	position: relative;
	text-shadow: 0 8px 8px rgba(0,0,0,0.25), 0 -2px 1px #eee;
	text-transform: uppercase;
}

#counters {
	background: rgba(255,255,255,0.7);
	border: 1px solid #fff;
}

.stats {
	border-right: 1px solid #f2f2f2;
	display: inline-block;
	width: 19%;
}

.stats.last {
	border: none;
}

.stats p {
	color: #82a0c8;
	font-size: 12px;
	letter-spacing: 0;
	line-height: 16px;
	margin: 0;
	padding: 10px 0 15px 0;
	text-align: center;
}

.stats span {
	font-size: 32px;
	letter-spacing: 1px;
	line-height: 55px;
}



/* Design ####################### */

#design {
	background: #000 url("../../images/webdesign-ingolstadt/bg-webdesign.jpg") no-repeat scroll center top;
	background-color: #fff;
	color: #333;
	padding: 0;
	z-index: 100;
}

#design .anibox {
	height: 100%;
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	z-index: 3;
}

#design #door {
	height: 100%;
	left: 50%;
	margin: 0 0 0 -100px;
	position: absolute;
	top: 0;
	width: 800px;
}

#design #rays1 {
	background: transparent url("../../images/webdesign-ingolstadt/rays-left.png") no-repeat scroll right center;
	height: 200%;
	margin: -50% 0 0 0;
	position: absolute;
	right: 50%;
	top: 0;
	-webkit-transform: skewY(-67deg);
	-moz-transform: skewY(-67deg);
	-ms-transform: skewY(-67deg);
	-o-transform: skewY(-67deg);
	transform: skewY(-67deg);
	width: 400px;
}

#design #rays2 {
	background: transparent url("../../images/webdesign-ingolstadt/rays-right.png") no-repeat scroll left center;
	height: 200%;
	left: 50%;
	margin: -50% 0 0 0;
	position: absolute;
	top: 0;
	-webkit-transform: skewY(67deg);
	-moz-transform: skewY(67deg);
	-ms-transform: skewY(67deg);
	-o-transform: skewY(67deg);
	transform: skewY(67deg);
	width: 400px;
}

#design #barn-front {
	height: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 20;
}

#design #bulb {
	height: 500px;
	left: 0;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	right: 0;
	top: -200px;
	-webkit-transform-origin: 50% -100%;
	-moz-transform-origin: 50% -100%;
	-ms-transform-origin: 50% -100%;
	-o-transform-origin: 50% -100%;
	transform-origin: 50% -100%;
	-webkit-animation: bulb 4.0s ease-in-out forwards infinite;
	-moz-animation: bulb 4.0s ease-in-out forwards infinite;
	-ms-animation: bulb 4.0s ease-in-out forwards infinite;
	-o-animation: bulb 4.0s ease-in-out forwards infinite;
	animation: bulb 4.0s ease-in-out forwards infinite;
	width: 180px;
}

@keyframes bulb {
	0% {
	-ms-transform: rotate(3deg);
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	transform: rotate(3deg);
	}
	50% {
	-ms-transform: rotate(-3deg);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	transform: rotate(-3deg);
	}
	100% {
	-ms-transform: rotate(3deg);
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	transform: rotate(3deg);
	}
}


#design #mint {
	height: 1300px;
	left: 0;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	right: 0;
	top: 400px;
	width: 300px;
}

#design #mint-head {
	height: 300px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

#design #mint-body {
	height: 1000px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 300px;
	width: 100%;
}

#design #mint-shadow {
	height: 350px;
	left: 0;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	right: 0;
	top: 135px;
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	-o-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-animation: mint 4.0s ease-in-out forwards infinite;
	-moz-animation: mint 4.0s ease-in-out forwards infinite;
	-ms-animation: mint 4.0s ease-in-out forwards infinite;
	-o-animation: mint 4.0s ease-in-out forwards infinite;
	animation: mint 4.0s ease-in-out forwards infinite;
	width: 175px;
	z-index: 100;
}

@keyframes mint {
	0% {
	-ms-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	transform: rotate(-10deg);
	}
	50% {
	-ms-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	transform: rotate(10deg);
	}
	100% {
	-ms-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	transform: rotate(-10deg);
	}
}

#design .content {
	color: #fff;
	max-width: 540px;
}

#design h2 {
	color: #fff;
	font-size: 22px;
	letter-spacing: 1px;
	line-height: 33px;
	margin: 0 0 20px 0;
	padding: 40px 0 0 0;
	position: relative;
	text-transform: uppercase;
	text-shadow: 0 8px 8px rgba(0,0,0,0.5);
}

#design h2 span {
	color: #c96;
	display: block;
	font-size: 52px;
	letter-spacing: 0px;
	line-height: 60px;
	padding-top: 5px;
	position: relative;
	text-transform: uppercase;
	position: Relative;
	text-transform: uppercase;
	font-weight: 700;
	padding-top: 5px;
	text-shadow: 
		1px 1px 1px #FFF,
        1px 2px 1px #FAFAFA,
        1px 3px 1px #f5f5f5,
        1px 4px 1px #eeeeee,
        1px 5px 2px #e0e0e0,
        1px 6px 3px #e0e0e0,
        1px 7px 3px #e0e0e0,
        1px 8px 3px #e0e0e0,
        1px 9px 1px #bdbdbd,
        1px 10px 1px #424242,
		1px 11px 1px #212121,
    1px 18px 6px rgb(248 247 247 / 40%),
    1px 22px 10px rgb(255 255 255 / 20%);
	
}




/* Design Links */

#design .togglebox-hinweis {
	color: #c96;
	letter-spacing: 0.5px;
	margin-top: 15px;
	padding-bottom: 5px;
}

#design-links {
	display: inline-block;
	margin: 0;
	position: relative;
	text-align: center;
	width: 100%;
}

#design-links h4 {
	color: #fff;
	font-size: 12px;
	letter-spacing: 0.5px;
	margin: 0;
	opacity: 0.5;
	padding-bottom: 12px;
}

#design-links ul {
	clear: both;
	display: inline-block;
	margin: 0 0 10px 0;
	width: 100%;
}

#design-links li {
	cursor: pointer;
	float: left;
	height: 42px;
	margin: 0 5% 0 0;
	overflow: hidden;
	position: relative;
	text-align: left;
	text-decoration: none;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
	width: 30%;
}

#design-links a {
	bottom: 0;
	height: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: auto;
}

.dex-number,
.dex-toptext,
.dex-bottomtext,
.dex-arrow {
	color: #c96;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

.dex-toptext,
.dex-bottomtext {
	letter-spacing: 1px;
	text-transform: uppercase;
}

.dex-number {
	font-size: 42px;
	left: 0;
	line-height: 42px;
	opacity: 0.5;
	position: absolute;
	top: 0;
}

.dex-toptext {
	font-size: 14px;
	left: 27px;
	line-height: 14px;
	opacity: 0.5;
	position: absolute;
	top: 0;
}

.dex-bottomtext {
	float: left;
	font-size: 26px;
	line-height: 26px;
	margin: 15px 0 0 26px;
	position: relative;
}

.dex-arrow {
	float: left;
	font-size: 14px;
	margin: 20px 0 0 0;
	opacity: 0.5;
	padding: 0 0 0 5px;
	position: relative;
}

#design-3 {
	margin: 0 !important;
}

#design-links li:hover {
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

#design-links li:hover .dex-number,
#design-links li:hover .dex-toptext,
#design-links li:hover .dex-bottomtext,
#design-links li:hover .dex-arrow {
	color: #fff;
	opacity: 1;
}

.design_text {
	display: none;
	width: 100% !important;
}

.design_text h3 {
	color: #c96;
}




/* Kunden ####################### */

#kunden {
	background: #000 url("../../images/kunden/bg-kunden.jpg") no-repeat fixed center center;
	border-color: #000;
	color: #fff;
}

.mobile #kunden {
	background-attachment: scroll;
}

#kunden .anibox {
	height: 100%;
	position: absolute;
	width: 100%;
}

#kunden h2 {
	color: #202020;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-transform: uppercase;
}

#kunden h2 span {
	color: #f4e9df;
	display: block;
	font-size: 60px;
	letter-spacing: 0px;
	line-height: 60px;
	padding-top: 5px;
	position: relative;
	text-shadow: 0 8px 8px rgba(0,0,0,0.5), 0 -2px 1px #fff;
	text-transform: uppercase;
}

#kunden h3 {
	color: #fcff00;
    text-align: center;
}

#kunden .holder {
	z-index: 20;
}

#kunden .content {
	color: #fff;
	float: right;
	width: 500px;
}

#kunden-logos {
	display: inline-block;
	text-align: center;
	width: 100%;
}

#kunden-logos a {
	cursor: pointer;
	display: inline-block;
	height: auto;
	margin: 3px 2%;
	padding: 0;
	vertical-align: middle;
	width: 21.5%;
}

#kunden-logos a:nth-child(4n-3) {
	margin-left: 0;
}

#kunden-logos a:nth-child(4n) {
	margin-right: 0;
}

#kunden-logos a img {
	display: block;
	height: auto;
	margin: 0;
	padding: 0;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
}

#kunden-logos a img:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

#lab-floor {
	background: #fff url("../../images/kunden/bg-lab-floor.jpg") no-repeat scroll center top;
	height: 325px;
	position: absolute;
	top: 700px;
	width: 100%;
	z-index: 10;
}

.chem {
	overflow: hidden;
	position: absolute;
	right: 50%;
}

.chem-symbol {
	background: transparent url("../../images/kunden/chemistry.html") no-repeat scroll 0 0;
	height: 100%;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 20;
}

#chem-1 {
	height: 150px;
	margin: 0 500px 0 0;
	width: 130px;
	z-index: 30;
}

#chem-1 .chem-symbol {
	background-position: 0 0;
}

#chem-2 {
	height: 240px;
	margin: 0 300px 0 0;
	width: 220px;
	z-index: 50;
}

#chem-2 .chem-symbol {
	background-position: -130px 0;
}

#chem-3 {
	height: 108px;
	margin: 0 250px 0 0;
	width: 99px;
	z-index: 10;
}

#chem-3 .chem-symbol {
	background-position: -350px 0;
}

#instruments {
	background: transparent url("../../images/kunden/instruments.png") no-repeat scroll center top;
	height: 375px;
	position: absolute;
	top: 325px;
	width: 100%;
	z-index: 15;
}

#chem-4 {
	height: 150px;
	margin: 0 130px 0 0;
	width: 130px;
	z-index: 20;
}

#chem-4 .chem-symbol {
	background-position: -449px 0;
}

#chem-5 {
	height: 204px;
	margin: 0 -50px 0 0;
	width: 187px;
	z-index: 40;
}

#chem-5 .chem-symbol {
	background-position: -579px 0;
}

#bubbles {
	width: 100%;
}




/* Arbeit ####################### */

#arbeit {
	background-color: #000;
	color: #666;
	height: auto;
	overflow: visible;
	z-index: 250;
}

#arbeitintro {
	height: 55px;
	opacity: 0.5;
	position: absolute;
	text-align: center;
	top: -70px;
	width: 100%;
}

#arbeitintro h3 {
	color: #202020;
	font-size: 16px;
	letter-spacing: 1px;
	line-height: 33px;
	margin: 15px 0 0 0;
	padding: 0;
	text-align: center;
	text-transform: uppercase;
}

#arbeitintro img {
	bottom: 0;
	height: 6px;
	left: 0;
	margin: 0 auto;
	position: absolute;
	right: 0;
	width: 12px;
}

#arbeit h2 {
	color: #202020;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-align: center;
	text-transform: uppercase;
}

#arbeit h2 span {
	color: #f5f0eb;
	display: block;
	font-size: 60px;
	letter-spacing: 0px;
	line-height: 60px;
	padding-top: 5px;
	position: relative;
	text-shadow: 0 8px 8px #d7c8b9, 0 -2px 1px #fff;
	text-transform: uppercase;
}

#portfolio_thumbs {
	clear: both;
	display: inline-block;
	position: relative;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	width: 100%;
}

#portfolio_thumbs.stay {
	width: 70%;
}

#portfolio_thumbs li {
	cursor: pointer;
	float: left;
	line-height: 0;
	overflow: hidden;
	position: relative;
	width: 20%;
}

#portfolio_thumbs.stay li {
	width: 25%;
}

#portfolio_thumbs li p.temp-title {
	font-size: 20px;
	left: 0;
	line-height: 40px;
	margin: 0 auto;
	position: absolute;
	right: 0;
	text-align: center;
	top: 10%;
	z-index: 200;
}

#portfolio_thumbs li p.temp-title span {
	font-size: 40px;
	text-transform: uppercase;
}

#portfolio_thumbs li a {
	bottom: 0;
	height: 100%;
	left: 0;
	display: block;
	margin: 0;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 500;
}

#portfolio_thumbs li .pfimg {
	height: auto;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
	z-index: 10;
}

#portfolio_thumbs li:hover .pfimg {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

.portfolio-flag {
	border: 2px solid #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	display: inline-block;
	height: 25px;
	margin: 0 auto 15px auto;
	overflow: hidden;
	width: 25px;
}

.portfolio-flag img {
	border: 0;
	height: auto;
	padding: 0;
	margin: 0;
	width: 100%;
}

.portfolio-logo {
	display: block;
}

.portfolio-logo img {
	margin: 0 auto;
	max-width: 200px;
	width: 60%;
}

#portfolio_thumbs li .portfolio-overlay {
	left: 0;
	margin: 0;
	opacity: 0.35;
	padding: 0;
	position: relative;
	top: 0;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	z-index: 20;
}

#portfolio_thumbs li:hover .portfolio-overlay {
	opacity: 0.75;
}

#portfolio_thumbs li .portfolio-overlay img {
	height: auto;
	margin: 0;
	padding: 0;
	position: relative;
	width: 100%;
}

#portfolio_thumbs li .portfolio-info {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 30;
}

.portfolio-content {
	position: absolute;
	text-align: center;
	top: 50%;
	-webkit-transform: translateY(-45%);
	-moz-transform: translateY(-45%);
	-ms-transform: translateY(-45%);
	-o-transform: translateY(-45%);
	transform: translateY(-45%);
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
}

#portfolio_thumbs li:hover .portfolio-content {
	-webkit-transform: translateY(-55%);
	-moz-transform: translateY(-55%);
	-ms-transform: translateY(-55%);
	-o-transform: translateY(-55%);
	transform: translateY(-55%);
}

.portfolio-link {
	border: 2px solid #fff;
	color: #fff;
	display: inline-block;
	letter-spacing: 1px;
	line-height: 24px;
	margin-top: 20px !important;
	opacity: 0;
	padding: 5px 15px;
	text-transform: uppercase;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#portfolio_thumbs li:hover .portfolio-link {
	opacity: 1;
}

.portfolio-link:hover, .portfolio-link:active {
	background: #fff none repeat scroll 0 0;
	color: #000;
}




/* Doors ##### */

#doors {
	bottom: 0;
	height: 100vh;
	left: 0;
	margin: 0;
	padding: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;
	z-index: -1;
}

#left-door, #right-door {
	height: 100vh;
	margin:  0;
	position: fixed;
	top: 0;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	z-index: -1;
}

#left-door {
	background: #fff url("../../images/werbeagentur-ingolstadt/beckett-werbeagentur-ingolstadt.jpg") no-repeat scroll center center;
	border-right: 1px solid #444;
	display: table;
	left: -70%;
	width: 70%;

}

#left-door {
	background: #fff url("../../images/werbeagentur-ingolstadt/beckett-werbeagentur-ingolstadt.jpg") no-repeat scroll center center;
	border-right: 1px solid #444;
	display: table;
	left: -70%;
	width: 70%;

}

#left-door.in {
	left: 0;
}

#left-door.stay {
	left: -70% !important;
}

#right-door {
	background-color: #fff;
	right: -30%;
	width: 30%;
}

#right-door.in {
	right: 0;
}

#right-door .inner, #left-door .inner {
	bottom: 0;
	left: 0;
	min-height: 300px;
	position: relative;
	right: 0;
	top:0;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#left-door .inner {
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#left-door .inner .imgText {
	color: #fff;
	font-size: 3rem
}

.reference {
	left: 0;
	opacity: 0;
	padding: 30px 5% 0 5%;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	width: 90%;
	z-index: 1;
}

.reference.show {
	opacity: 1;
	position: relative;
	z-index: 10;
}

.reference .reflogo {
	border: none;
	height: auto;
	max-width: 250px;
	padding-bottom: 20px;
	width: 100%;
}

.reference h4 {
	color: #bbb;
	font-size: 12px;
	letter-spacing: 0.5px;
	margin: 0;
	padding: 5px 0;
	text-align: left;
	text-transform: uppercase;
}

.reference p {
	color: #999;
	font-size: 13px;
	line-height: 20px;
	text-align: justify;
}

.reference .client-name {
	color: #777;
	font-size: 14px;
	margin: 0;
	text-transform: uppercase;
}

.reference .anschrift {
	color: #555;
	margin: 5px 0 10px 0;
	padding: 2px 0 0 30px;
	position: relative;
}

.reference .anschrift img {
	border: 1px solid #eee;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	height: 22px;
	left: 0;
	margin: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 22px;
}

.ref-gallery {
	clear: both;
	display: inline-block;
	margin: 0 0 15px 0;
}

.ref-gallery img {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	height: auto;
	margin: 1%;
	padding: 1%;
	position: relative;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 18%;
}

.ref-gallery img:hover {
	background: rgba(255, 0, 0, 0.25);
}

.ref-gallery img.active {
	border: 1px solid #c00;
}

.reference ul.leistungen {
	display: inline-block;
	margin: 0 0 10px 10px;
}

.reference ul.leistungen li {
	background: transparent url("../../images/werbeagentur-ingolstadt/leistung.png") no-repeat scroll 0 6px;
	margin: 2px 0;
	padding: 0 0 0 18px;
}

.reference ul.leistungen li span {
	font-size: 90%;
	font-style: italic;
}

.reference .online {
	height: 45px;
	margin: 10px 0 0 30px;
}

.reference .online-responsive {
	float: left;
	width: 80px;
}

.reference .online-responsive img {
	float: left;
	height: auto;
}

.reference .online-grafix {
	height: 43px;
	float: left;
	position: relative;
	margin: 0;
	width: 150px;
}

.reference ul.online-flags {
	padding: 3px 0 0 0;
}

.reference ul.online-flags li {
	float: left;
	height: 15px;
	margin: 0 5px 5px 0;
	overflow: hidden;
	width: 20px;
}

.reference ul.online-flags li img {
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

.reference .online-link {
	bottom: 0;
	clear: both;
	position: absolute;
	white-space: nowrap;
}

.reference .online-link p {
	margin: 0;
	padding: 0;
}

.reference .online-link a {
	color: #777;
	padding: 0;
	text-decoration: none;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

.reference .online-link a:hover {
	color: #c00;
	padding: 0 0 0 5px;
}

.reference .online-link.noweb {
	margin: 12px 0 0 0;
}

.close-doors {
	cursor: pointer;
	height: 40px;
	position: absolute;
	right: 20px;
	top: 20px;
	width: 40px;
	z-index: 500;
}

.close-doors img {
	position: absolute;
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

.close-doors img.a {
	opacity: 1;
}

.close-doors img.b {
	opacity: 0;
}

.close-doors:hover img.a {
	opacity: 0;
}

.close-doors:hover img.b {
	opacity: 1;
}

.refgrid {
	bottom: 0;
	display: none;
	height: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 1;
}

.reflineh {
	background-color: #fff0;
	height: 6px;
	left: 0;
	margin: -3px 0 0 0;
	position: absolute;
	top: 50%;
	width: 100%;
	z-index: 100;
}

.reflinev {
	background-color: #fff0;
	height: 50%;
	left: 35%;
	margin: 0 0 0 -3px;
	position: absolute;
	top: 50%;
	width: 6px;
	z-index: 100;
}

.refbild {
	background-color: #fff0;
	margin: 0;
	overflow: hidden;
	padding: 0;
	position: absolute;
}

.refbildbg {
	background-attachment: scroll;
	background-color: transparent;
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-ms-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	bottom: 0;
	height: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 100%;
	z-index: 1;
}


.refbild img {
	height: 100%;
	left: 50%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 50%;
	-webkit-transform: scale(1) translate(-50%, -50%);
	-moz-transform: scale(1) translate(-50%, -50%);
	-ms-transform: scale(1) translate(-50%, -50%);
	-o-transform: scale(1) translate(-50%, -50%);
	transform: scale(1) translate(-50%, -50%);
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-ms-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: auto;
	z-index: 20;
}

.refbildbg:hover {
	-webkit-transform: scale(1.1) translate(-45%, -45%);
	-moz-transform: scale(1.1) translate(-45%, -45%);
	-ms-transform: scale(1.1) translate(-45%, -45%);
	-o-transform: scale(1.1) translate(-45%, -45%);
	transform: scale(1.1);
}

/* refgrid1 */
.refgrid1 .refbild1 {height: 100%; left: 0; top: 0; width: 100%;}
.refgrid1 .reflineh {display: none;}
.refgrid1 .reflinev {display: none;}

/* refgridq2 */
.refgridq2 .refbild1 {height: 50%; left: 0; top: 0; width: 100%;}
.refgridq2 .refbild2 {height: 50%; left: 0; top: 50%; width: 100%;}
.refgridq2 .reflineh {left: 0; top: 50%; width: 100%;}
.refgridq2 .reflinev {display: none;}


/* refgridh2 */
.refgridh2 .refbild1 {height: 100%; left: 0; top: 0; width: 50%;}
.refgridh2 .refbild2 {height: 100%; left: 50%; top: 0; width: 50%;}
.refgridh2 .reflineh {display: none;}
.refgridh2 .reflinev {height: 100%; left: 50%; top: 0;}


/* refgridqt3 */
.refgridqt3 .refbild1 {height: 50%; left: 0; top: 0; width: 100%;}
.refgridqt3 .refbild2 {height: 50%; left: 0; top: 50%; width: 50%;}
.refgridqt3 .refbild3 {height: 50%; left: 50%; top: 50%; width: 50%;}
.refgridqt3 .reflineh {left: 0; top: 50%; width: 100%;}
.refgridqt3 .reflinev {height: 50%; left: 50%; top: 50%;}


/* refgridqb3 */
.refgridqb3 .refbild1 {height: 50%; left: 0; top: 0; width: 50%;}
.refgridqb3 .refbild2 {height: 50%; left: 50%; top: 0; width: 50%;}
.refgridqb3 .refbild3 {height: 50%; left: 0; top: 50%; width: 100%;}
.refgridqb3 .reflineh {left: 0; top: 50%; width: 100%;}
.refgridqb3 .reflinev {height: 50%; left: 50%; top: 0;}


/* refgridhl3 */
.refgridhl3 .refbild1 {height: 100%; left: 0; top: 0; width: 50%;}
.refgridhl3 .refbild2 {height: 50%; left: 50%; top: 0; width: 50%;}
.refgridhl3 .refbild3 {height: 50%; left: 50%; top: 50%; width: 50%;}
.refgridhl3 .reflineh {left: 50%; top: 50%; width: 50%;}
.refgridhl3 .reflinev {height: 100%; left: 50%; top: 0;}


/* refgridhr3 */
.refgridhr3 .refbild1 {height: 50%; left: 0; top: 0; width: 50%;}
.refgridhr3 .refbild2 {height: 50%; left: 0; top: 50%; width: 50%;}
.refgridhr3 .refbild3 {height: 100%; left: 50%; top: 0; width: 50%;}
.refgridhr3 .reflineh {left: 0; top: 50%; width: 50%;}
.refgridhr3 .reflinev {height: 100%; left: 50%; top: 0;}


/* refgrid4 */
.refgrid4 .refbild1 {height: 50%; left: 0; top: 0; width: 50%;}
.refgrid4 .refbild2 {height: 50%; left: 50%; top: 0; width: 50%;}
.refgrid4 .refbild3 {height: 50%; left: 0; top: 50%; width: 50%;}
.refgrid4 .refbild4 {height: 50%; left: 50%; top: 50%; width: 50%;}
.refgrid4 .reflineh {left: 0; top: 50%; width: 100%;}
.refgrid4 .reflinev {height: 100%; left: 50%; top: 0;}


.refgrid a {
	bottom: 0;
	height: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 50;
}

.ref-nav {
	border-top: 1px solid #ccc;
	clear: both;
	height: 40px;
	margin: 20px 0 0 0;
	padding: 20px 0 0 0;
	position: relative;
	text-align: center;
	width: 100%;
}

p.more-refs {
	display: inline-block;
	font-size: 12px;
	letter-spacing: 2px;
	margin: 0;
	padding: 0 30px;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	vertical-align: top;
}

p.more-refs span {
	display: inline-block;
	margin-top: 10px;
	position: relative;
	vertical-align: middle;
}

.door-nav {
	cursor: pointer;
	display: inline-block;
	padding: 0;
	position: relative;
	z-index: 100;
}

.door-nav img {
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

.door-nav img.a {
	opacity: 1;
	position: relative;
}

.door-nav img.b {
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
}

.door-nav:hover img.a {
	opacity: 0;
}

.door-nav:hover img.b {
	opacity: 1;
}

.refprev {
}

.refnext {
}






/* Testimonials ####################### */

#testimonials {
	background: #fff url("../../images/testimonials/bg-testimonials.jpg") no-repeat scroll center center;
	height: 100vh;
	z-index: 200;
}

#danke-head {
	background: transparent url("../../images/testimonials/danke-head.png") repeat-x scroll center top;
	height: 75px;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 9;
}

#danke-foot {
	background: transparent url("../../images/testimonials/danke-foot.png") repeat-x scroll center top;
	bottom: 0;
	height: 75px;
	position: absolute;
	width: 100%;
	z-index: 9;
}

#testimonials #thanks {
	margin: -300px 155px 0 0;
	position: absolute;
	right: 50%;
	top: 50%;
}

#testimonials .holder {
	padding: 0;
}

#testimonials .content {
	height: 100%;
	margin: 0 auto;
	position: relative;
	text-align: center;
	width: 100%;
}

#testimonials h3 {
	border: 2px solid #000;
	color: #000;
	display: inline-block;
	font-size: 30px;
	letter-spacing: 4px;
	line-height: inherit;
	margin: 15px auto 35px auto;
	padding: 15px 20px;
	text-align: center;
	text-transform: uppercase;
}

.testimonial {
	left: 0;
	margin: 0 auto;
	opacity: 0;
	position: absolute;
	right: 0;
	text-align: center;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	-ms-transition: all 0.5s ease-in-out 0s;
	-webkit-transition: all 0.5s ease-in-out 0s;
	-moz-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
}

.testimonial.show {
	opacity: 1;
}

.testimonial p {
	margin: 0;
	padding: 0;
	text-align: center;
}

.testimonial .quote {
	clear: both;
	display: inline-block;
	max-width: 780px;
	text-align: center;
}

.testimonial p.quote-text {
	color: #07b;
	float: left;
	font-family: 'Indie Flower', cursive;
	font-size: 18px;
	line-height: 24px;
	margin: 0 0 20px 0;
	max-width: 630px;
	text-align: center;
	width: 100%;
}

.testimonial p.quote-start {
	float: left;
	padding-top: 5px;
}

.testimonial p.quote-end {
	float: right;
	padding-top: 5px;
}

.testimonial p.testimonial-logo img {
	height: 60px;
	margin: 0 0 15px 0;
	opacity: 0.5;
	width: auto;
}

.testimonial p.testimonial-name {
	color: #777;
	font-size: 16px;
	margin: 0;
	text-transform: uppercase;
}

.testimonial p.testimonial-firma {
	color: #999;
	font-size: 12px;
	font-style: italic;
}

#testimonials-nav {
	height: 20px;
	left: 0;
	margin: 120px auto 0 auto;
	position: absolute;
	right: 0;
	top: 50%;
	width: 200px;
	z-index: 1000;
}

#testimonials-last {
	cursor: pointer;
	left: 5px;
	position: absolute;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#testimonials-last:hover {
	left: 0;
}

#testimonials-next {
	cursor: pointer;
	position: absolute;
	right: 5px;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#testimonials-next:hover {
	right: 0;
}


/* Coffee */

#coffee {
	position: absolute;
	left: 50%;
	margin: -330px 0 0 300px;
	top: 50%;
	z-index: 5;
}

#ripple {
	background: url("../../images/testimonials/coffee.jpg");
	margin: 5px 0 0 5px;
	width: 235px;
	height: 230px;
}

#ripple-overlay {
	background: url("../../images/testimonials/coffee.png");
	position: absolute;
	left: 0;
	top: 0;
	width: 245px;
	height: 240px;
	z-index: 20;
}




/* Planets */


#planets-wrapper {
	height: 700px;
	position: absolute;
	right: 50%;
	top: 50%;
	width: 700px;
	z-index: 7;
}

#planets {
	height: 700px;
	margin: -100px 150px 0 0px;
	position: absolute;
	right: 0;
	top: 0;
	width: 700px;
	z-index: 20;
}

.planet {
	height: 700px;
	position: absolute;
	width: 700px;
}


.pbar {
	height: 10px;
	margin-top: -5px;
	position: absolute;
	top: 50%;
	z-index: 3;
}

.pball {
	position: absolute;
	top: 50%;
	z-index: 4;
}

.ptop {

}

#planets-shadow {
	height: 700px;
	margin: -75px 150px 0 0px;
	position: absolute;
	right: 0;
	top: 0;
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	-ms-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	transform: rotate(10deg);
	width: 700px;
	z-index: 10;
}

.planet-shadow {
	background: transparent url("../../images/testimonials/planets-shadow.png") no-repeat;
	display: none;
	height: 700px;
	position: absolute;
	width: 700px;
}



/* Sun */

#sun {
	background-position: center 0;
	display: block;
	z-index: 10;
}

#sun .pball {
	height: 120px;
	left: 50%;
	margin: -60px 0 0 -60px;
	width: 120px;
}




/* Mercury */

.mercury .pbar {
	right: 50%;
	width: 95px;
}

.mercury .pball {
	height: 46px;
	left: 230px;
	margin-top: -23px;
	width: 46px;
}

.mercury.animate {
	background-position: center -700px;
	display: block;
	-ms-animation: planet 3s linear infinite;
	-webkit-animation: planet 3s linear infinite;
	-moz-animation: planet 3s linear infinite;
	-o-animation: planet 3s linear infinite;
	animation: planet 3s linear infinite;
	z-index: 5;
}

.mercury .pball.animate {
	display: block;
	-ms-animation: planet-stay 3s linear 100ms infinite;
	-webkit-animation: planet-stay 3s linear 100ms infinite;
	-moz-animation: planet-stay 3s linear 100ms infinite;
	-o-animation: planet-stay 3s linear 100ms infinite;
	animation: planet-stay 3s linear 100ms infinite;
}



/* Venus */

.venus .pbar {
	left: 50%;
	width: 120px;
}

.venus .pball {
	height: 60px;
	margin-top: -30px;
	right: 200px;
	width: 60px;
}

.venus.animate {
	background-position: center -1400px;
	display: block;
	-ms-animation: planet 5s linear infinite;
	-webkit-animation: planet 5s linear infinite;
	-moz-animation: planet 5s linear infinite;
	-o-animation: planet 5s linear infinite;
	animation: planet 5s linear infinite;
	z-index: 6;
}

.venus .pball.animate {
	display: block;
	-ms-animation: planet-stay 5s linear 100ms infinite;
	-webkit-animation: planet-stay 5s linear 100ms infinite;
	-moz-animation: planet-stay 5s linear 100ms infinite;
	-o-animation: planet-stay 5s linear 100ms infinite;
	animation: planet-stay 5s linear 100ms infinite;
}




/* Earth */

.earth .pbar {
	right: 50%;
	width: 135px;
}

.earth .pball {
	height: 60px;
	left: 185px;
	margin-top: -30px;
	width: 60px;
}

.earth.animate {
	background-position: center -2100px;
	display: block;
	-ms-animation: planet 7s linear infinite;
	-webkit-animation: planet 7s linear infinite;
	-moz-animation: planet 7s linear infinite;
	-o-animation: planet 7s linear infinite;
	animation: planet 7s linear infinite;
	z-index: 5;
}

.earth .pball.animate {
	display: block;
	-ms-animation: planet-stay 7s linear 100ms infinite;
	-webkit-animation: planet-stay 7s linear 100ms infinite;
	-moz-animation: planet-stay 7s linear 100ms infinite;
	-o-animation: planet-stay 7s linear 100ms infinite;
	animation: planet-stay 7s linear 100ms infinite;
}



/* Mars */

.mars .pbar {
	left: 50%;
	width: 165px;
}

.mars .pball {
	height: 50px;
	margin-top: -25px;
	right: 160px;
	width: 50px;
}

.mars.animate {
	background-position: center -2800px;
	display: block;
	-ms-animation: planet 15s linear infinite;
	-webkit-animation: planet 15s linear infinite;
	-moz-animation: planet 15s linear infinite;
	-o-animation: planet 15s linear infinite;
	animation: planet 15s linear infinite;
	z-index: 4;
}

.mars .pball.animate {
	display: block;
	-ms-animation: planet-stay 15s linear 100ms infinite;
	-webkit-animation: planet-stay 15s linear 100ms infinite;
	-moz-animation: planet-stay 15s linear 100ms infinite;
	-o-animation: planet-stay 15s linear 100ms infinite;
	animation: planet-stay 15s linear 100ms infinite;
}


/* Jupiter */

.jupiter .pbar {
	right: 50%;
	width: 180px;
}

.jupiter .pball {
	height: 90px;
	left: 120px;
	margin-top: -45px;
	width: 90px;
}

.jupiter.animate {
	background-position: center -3500px;
	display: block;
	-ms-animation: planet 25s linear infinite;
	-webkit-animation: planet 25s linear infinite;
	-moz-animation: planet 25s linear infinite;
	-o-animation: planet 25s linear infinite;
	animation: planet 25s linear infinite;
	z-index: 5;
}

.jupiter .pball.animate {
	display: block;
	-ms-animation: planet-stay 25s linear 100ms infinite;
	-webkit-animation: planet-stay 25s linear 100ms infinite;
	-moz-animation: planet-stay 25s linear 100ms infinite;
	-o-animation: planet-stay 25s linear 100ms infinite;
	animation: planet-stay 25s linear 100ms infinite;
}



/* Saturn */

.saturn .pbar {
	left: 50%;
	width: 225px;
}

.saturn .pball {
	height: 80px;
	margin-top: -40px;
	right: 85px;
	width: 80px;
}

.saturn-rings {
	height: 130px;
	margin-top: -65px;
	position: absolute;
	right: 60px;
	top: 50%;
	width: 130px;
	z-index: 5;
}

.saturn.animate {
	background-position: center -4200px;
	display: block;
	-ms-animation: planet 40s linear infinite;
	-webkit-animation: planet 40s linear infinite;
	-moz-animation: planet 40s linear infinite;
	-o-animation: planet 40s linear infinite;
	animation: planet 40s linear infinite;
	z-index: 4;
}

.saturn .pball.animate {
	display: block;
	-ms-animation: planet-stay 40s linear 100ms infinite;
	-webkit-animation: planet-stay 40s linear 100ms infinite;
	-moz-animation: planet-stay 40s linear 100ms infinite;
	-o-animation: planet-stay 40s linear 100ms infinite;
	animation: planet-stay 40s linear 100ms infinite;
}



/* Uranus */

.uranus .pbar {
	right: 50%;
	width: 260px;
}

.uranus .pball {
	height: 60px;
	left: 60px;
	margin-top: -30px;
	width: 60px;
}

.uranus.animate {
	background-position: center -4900px;
	display: block;
	-ms-animation: planet 60s linear infinite;
	-webkit-animation: planet 60s linear infinite;
	-moz-animation: planet 60s linear infinite;
	-o-animation: planet 60s linear infinite;
	animation: planet 60s linear infinite;
	z-index: 5;
}

.uranus .pball.animate {
	display: block;
	-ms-animation: planet-stay 60s linear 100ms infinite;
	-webkit-animation: planet-stay 60s linear 100ms infinite;
	-moz-animation: planet-stay 60s linear 100ms infinite;
	-o-animation: planet-stay 60s linear 100ms infinite;
	animation: planet-stay 60s linear 100ms infinite;
}



/* Neptune */

.neptune .pbar {
	left: 50%;
	width: 275px;
}

.neptune .pball {
	height: 70px;
	margin-top: -35px;
	right: 40px;
	width: 70px;
}

.neptune.animate {
	background-position: center -5600px;
	display: block;
	-ms-animation: planet 80s linear infinite;
	-webkit-animation: planet 80s linear infinite;
	-moz-animation: planet 80s linear infinite;
	-o-animation: planet 80s linear infinite;
	animation: planet 80s linear infinite;
	z-index: 4;
}

.neptune .pball.animate {
	display: block;
	-ms-animation: planet-stay 80s linear 100ms infinite;
	-webkit-animation: planet-stay 80s linear 100ms infinite;
	-moz-animation: planet-stay 80s linear 100ms infinite;
	-o-animation: planet-stay 80s linear 100ms infinite;
	animation: planet-stay 80s linear 100ms infinite;
}


/* Pluto */

.pluto .pbar {
	right: 50%;
	width: 310px;
}

.pluto .pball {
	height: 50px;
	left: 15px;
	margin-top: -25px;
	width: 50px;
}

.pluto.animate {
	background-position: center -6300px;
	display: block;
	-ms-animation: planet 100s linear infinite;
	-webkit-animation: planet 100s linear infinite;
	-moz-animation: planet 100s linear infinite;
	-o-animation: planet 100s linear infinite;
	animation: planet 100s linear infinite;
	z-index: 5;
}

.pluto .pball.animate {
	display: block;
	-ms-animation: planet-stay 100s linear 100ms infinite;
	-webkit-animation: planet-stay 100s linear 100ms infinite;
	-moz-animation: planet-stay 100s linear 100ms infinite;
	-o-animation: planet-stay 100s linear 100ms infinite;
	animation: planet-stay 100s linear 100ms infinite;
}

@-webkit-keyframes planet /* Safari and Chrome */ {
	from {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	to {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
}

@keyframes planet {
	from {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	to {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
}

@-webkit-keyframes planet-stay /* Safari and Chrome */ {
	from {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	to {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
}

@keyframes planet-stay {
	from {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	}
	to {
	-ms-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	}
}



/* Kontakt ####################### */

#kontakt {
	background: #fff url("../../images/kontakt/bg-kontakt.jpg") no-repeat scroll center top;
	color: #555;
}

#kontakt-head {
	background: transparent url("../../images/kontakt/kontakt-head.png") no-repeat scroll center bottom;
	bottom: 0;
	height: 15px;
	position: absolute;
	width: 100%;
	z-index: 650;
}

#kontakt #cube {
	left: 50%;
	margin: 0 0 0 25px;
	position: absolute;
	top: 100px;
	z-index: 500;
}

.virtualcube .button-toolbar {
  display: none;
}

#kontakt #spiel {
	left: 50%;
	margin: 0;
	position: absolute;
	top: 130px;
	z-index: 400;
}

#kontakt .content {
	color: #333;
	width: 550px;
}

#kontakt h2 {
	color: #202020;
	font-size: 22px;
	letter-spacing: 0px;
	line-height: 33px;
	position: relative;
	text-transform: uppercase;
}

#kontakt h2 span {
	color: #f3f3f3;
	display: block;
	font-size: 60px;
	letter-spacing: 0px;
	line-height: 60px;
	padding-top: 5px;
	position: relative;
	text-shadow: 0 8px 8px #bbb, 0 -2px 1px #fff;
	text-transform: uppercase;
}

#kontakt a {
	color: #555;
	text-decoration: none;
}


/* Formular */

#formular-wrapper {
	padding-top: 5px;
}

#kontakt-form h4 {
	float: left;
	width: 100px;
	margin: 0;
	line-height: 32px;
	padding: 0 5px;
	margin-right: 10px;
	white-space: nowrap;
}

.kontakt-input, .kontakt-area {
	clear: both;
	display: inline-block;
	margin-bottom: 10px;
	width: 100%;
}

.kontakt-input-titel, .kontakt-input-titel-area {
	float: left;
	height: 40px;
	text-align: center;
	width: 10%;
}

#kontakt-form-name .kontakt-input-titel {background-color: #fc0;}
#kontakt-form-email .kontakt-input-titel {background-color: #c00;}
#kontakt-form-telefon .kontakt-input-titel {background-color: #0cf;}
#kontakt-form-message .kontakt-input-titel {background-color: #0c0;}
#kontakt-form-message .kontakt-input-titel-area {background-color: #0c0;}

.kontakt-input-titel-area {
	width: 89%;
}

.kontakt-input-titel img {
	margin: 0 auto;
	padding: 5px 0 0 0;
}

#kontakt-form input[type=text] {
	background-color: rgba(255,255,255,0.75);
	border: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	color: #555 !important;
	float: left;
	height: 40px;
	font-size: 17px  !important;
	outline: none;
	padding: 0 2.5%;
	width: 89%;
}

#kontakt-form-message h4 {
	float: none;
	margin-bottom: 5px;
}

#kontakt-form textarea {
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	color: #555 !important;
	font-size: 17px  !important;
	height: 120px;
	outline: none;
	padding: 10px 2.5%;
	width: 99%;
}

#kontakt-form .form-dsgvo {
	clear: both;
	position: relative;
}

#kontakt-form .form-dsgvo input {
	float: left;
	margin: 4px 5px 0 0;
	padding: 0;
	position: relative;
	width: 20px;
}

#kontakt-form .form-dsgvo p {
	font-size: 12px;
	letter-spacing: 0;
	line-height: 16px;
	max-width: 100%;
	overflow: hidden;
	padding: 0;
	position: static;
	text-align: justify;
}

#kontakt-form .send-form {
	background: none;
	border: none;
	color: #777;
	cursor: pointer;
	font-size: 20px;
	float: right;
	letter-spacing: 0.5px;
	margin: 5px 5px 10px 0;
	text-align: right;
	text-decoration: none;
	text-transform: uppercase;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
}

#kontakt-form .send-form:hover{
	color: #090;
}

#kontakt-form label.form-error, #kontakt-form label.error {
	color: #990000;
	display: none;
}

#thank-you {
	display: none;
	color: #aaa;
	font-size: 18px;
	letter-spacing: 0.5px;
	margin-top: 120px;
	text-transform: uppercase;
}

#thank-you h3::before {
	display: none;
}

.form-phone {
	display: none;
}


/* Captcha */

.captcha-container {
	display: inline-block;
	margin: 10px 0;
	position: relative;
	width: 100%;
}

.captcha-container div.captcha-hinweis {
	height: 20px;
	margin: 0 !important;
}

.captcha-container div.captcha-hinweis p {
	display: inline-block;
	font-size: 12px;
	font-style: italic;
	line-height: 18px;
}

#captcha {
	margin: 0 !important;
}

#captcha div {
	float: right;
	max-width: 200px;
	width: 35%;
}

#captcha canvas {
	float: right;
	text-align: center;
	width: 100%;
}

#captcha div.controls {
	float: left;
	max-width: 100%;
	padding: 8px 0 0 0;
	width: 60%;
}

#captcha div.controls img {
	border: none;
	height: 25px;
	width: auto;
}

#captcha div.controls .captcha-feld {
	float: left;
	max-width: 100%;
	width: 80%;
}

#captcha div.controls input {
	height: 35px;
	padding: 0;
	text-align: center;
	width: 100%;
}

#captcha div.controls button {
	float: right;
	height: 35px;
	padding: 0;
	width: 15%;
}

p.wrong {
	clear: both;
	display: none;
	width: 100%;
}

p.wrong.shake {
	display: block;
}

p.wrong.shake {
	animation: shake .4s cubic-bezier(.36, .07, .19, .97) both;
	backface-visibility: hidden;
	perspective: 1000px;
	transform: translate3d(0, 0, 0);
}

@keyframes shake {
10%, 90% {transform: translate3d(-1px, 0, 0);}
20%, 80% {transform: translate3d(1px, 0, 0);}
30%, 50%, 70% {transform: translate3d(-2px, 0, 0);}
40%, 60% {transform: translate3d(2px, 0, 0);}
}

/* ##### FORMULAR END ##### */




/* Footer############################################################################################################################################ */

#footer {
	height: auto;
	overflow: visible;
	position: relative;
}

#footer-header {
	background: transparent url("../../images/impressum/footer-header.png") repeat-x scroll center center;
	height: 50px;
	position: absolute;
	top: -50px;
	width: 100%;
}

#footer-wrapper {
	background: #111 url("../../images/impressum/footer.jpg") repeat scroll center center;
	position: relative;
	width: 100%
}

footer {
	margin: 0 auto;
	max-width: 1300px;
	padding: 50px 0 75px 0;
	position: relative;
}


/* Footerboxes */

.footerbox {
	display: inline-block;
	height: 100%;
	padding: 0;
	position: relative;
	vertical-align: top;
	width: 29%;
}

#footerbox1 {margin: 0 3% 0 1%;}
#footerbox2 {margin: 0 1.5%;}
#footerbox3 {margin: 0 1% 0 4%;}

.footerbox h3, .footerbox h4 {
	color: #e9e0c4;
	padding: 0;
	text-align: left;
}

.footerbox h3 {
	color: #555;
	font-size: 24px;
	letter-spacing: 0;
	margin: 0 0 10px 0;
	text-transform: uppercase;
}

.footerbox h4 {
	font-size: 12px;
	margin: 20px 0 0 0;
}

.footerbox p {
	color: #bbb;
	line-height: 22px;
	text-align: justify;
}

.footerbox p b, .footerbox p strong {
	color: #fff;
}

.footerbox a {
	color: #ccc;
	text-decoration: none;
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

.footerbox a:hover {
	color: #fff;
	padding-right: 5px;
}

#footerbox3 .cells p {
	margin: 0;
}

#footerbox3.footerbox a:hover {
	padding: 0;
}

.footerbox .cells {
	width: 100%;
}

.footerbox .cell {
	border-bottom: 1px dashed #ccc;
	height: 20px;
	padding: 20px 0;
	width: 100%;
}

.footerbox .left {
	float: left;
	letter-spacing: 1px;
	margin: 0;
	padding: 0;
	text-transform: uppercase;
}

.footerbox .right {
	float: right;
	margin: 0;
	padding: 0;
}

.footerbox .impressum p {
	font-size: 12px;
	line-height: 17px;
}

.legal {
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

.legal:hover {
	color: #fff;
	cursor: pointer;
}

.agb {
	padding: 0 0 0 10px;
}

#footerbox3 .impressum .cells .agb:hover {
	padding: 0 0 0 10px;
}

#datenschutz {
	clear: both;
	color: #aaa;
	display: none;
	margin: 50px auto 0 auto;
	padding: 0 2.5%;
	width: 95%;
}

#datenschutz span {
	color: #fff;
}

#datenschutz a {
	color: #aaa;
	text-decoration: none;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

#datenschutz a:hover {
	color: #fff;
}

#datenschutz-page {
	margin: 0 auto;
	max-width: 900px;
	padding: 50px 20px 50px 20px
}

#charity {
	clear: both;
	left: 0;
	margin: 70px auto 0 auto;
	max-width: 1300px;
	position: relative;
	right: 0;
	text-align: center;
	width: 100%;
}

#charity p {
	color: #777;
	font-size: 11px;
	letter-spacing: 1px;
	padding-bottom: 5px;
	text-align: center;
}

#charity ul {
	text-align: center;
}

#charity ul li {
	display: inline-block;
	margin: 0 0 15px 0;
	max-width: 110px;
	opacity: 0.5;
	text-decoration: none;
	-ms-transition: all 0.35s ease-in-out 0s;
	-webkit-transition: all 0.35s ease-in-out 0s;
	-moz-transition: all 0.35s ease-in-out 0s;
	-o-transition: all 0.35s ease-in-out 0s;
	transition: all 0.35s ease-in-out 0s;
	width: 9%;
}

#charity ul li:hover {
	opacity: 1;
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}

#charity ul li a {
	display: block;
	position: relative;
	width: 100%;
}

#charity ul li a img {
	height: auto;
	max-height: 100%;
	max-width: 100%;
	vertical-align: middle;
}




/* Copyright */

#copyright {
	clear: both;
	line-height: 20px;
	margin: 0 auto;
	padding: 30px 0 0 0;
	text-align: center;
}

#copyright p, #copyright a {
	color: #ffffff;
	font-size: 14px;
	line-height: 20px;
	padding: 2px 0;
	text-align: center;
	text-decoration: none;
	text-shadow: 0px 0px 15px;
}


#copyright a {
	border-bottom: 1px dashed transparent;
	border-top: 1px dashed transparent;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}

#copyright a:hover {
	border-bottom: 1px dashed #555;
	border-top: 1px dashed #555;
}



/* Google Map */

.apcmap {
	height: 600px;
	position: relative;
	width: 100%;
}




/* Toplink */

#toplink {
	bottom: 0;
	height: 50px;
	left: 50%;
	margin: 0 0 0 -25px;
	overflow: hidden;
	position: absolute;
	width: 70px;
	z-index: 10;
}


#toplink a {
	bottom: 10px;
	height: 50px;
	opacity: 0.5;
	position: absolute;
	text-decoration: none;
	-ms-transition: all 0.25s ease-in-out 0s;
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
	width: 50px;
}

#toplink a:hover {
	opacity: 1;
}





/* CUBE CSS */

@charset "UTF-8";
/*
 * @(#)virtualcube.css  1.0  2014-01-13
 *
 * Copyright (c) 2013 Werner Randelshofer, Switzerland.
 * You may not use, copy or modify this file, except in compliance with the
 * accompanying license terms.
 */
.virtualcube {
  display:inline-block;
  width:550px;
  height:274px;
}
.virtualcube .cube-canvas {
  width:550px;
  height:550px;
  object-fit:contain; 
}
.virtualcube .button-toolbar {
}
.virtualcube .button-toolbar button {
}
.virtualcube .button-toolbar button:active {
}
.virtualcube .button-toolbar .reset-button {
}
.virtualcube .button-toolbar .undo-button {
}
.virtualcube .button-toolbar .redo-button {
}
.virtualcube .button-toolbar .scramble-button {
}