* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
@font-face {
  font-family: 'ng';
  src: url('font/n-gage-webfont.eot');
  src: url('font/n-gage-webfont.eot?#iefix') format('embedded-opentype'),
       url('font/n-gage-webfont.woff2') format('woff2'),
       url('font/n-gage-webfont.woff') format('woff'),
       url('font/n-gage-webfont.ttf') format('truetype'),
       url('font/n-gage-webfont.svg#n-gagemedium') format('svg');
  font-weight: normal;
  font-style: normal;
}
body {
  background: url('img/bg.png') repeat center;
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.4;
  color: rgb(74,42,14);
  padding: 0;
  margin: 0;
}
.container {
  max-width: 1024px;
  margin: 0 auto;
  background: url('img/bg_hell.png') repeat center;
  padding: 4.5em 1.5em;
  box-shadow: 0 0 30px rgba(0,0,0,0.75);
  min-height: 100%;
}
header {
  position: relative;
  text-align: center;
}
section {
  position: relative;
  text-align: center;
  margin: 2.5em 0;
}
#jobs > .secondary {
  text-align: center;
}
.boxes {
  margin: 0 -1.5em;
  height: 20em;
}
.box {
  display: inline-block;
  vertical-align: top;
  width: 30%;
  margin: 0 1%;
  padding: 0 1em;
  height: 100%;
}
.brown {
  background: rgb(74,42,14);
  color: #fff;
}
.brown a {
  color: #fff;
}
.brown a:hover {
  color: rgb(202,158,100); 
}
.beige {
  background: rgb(202,158,100);
}
.beige h2 {
  color: rgb(74,42,14);
}
.green {
  background: rgb(151,191,13);
  background: rgba(151,191,13,.75);
  color: #fff;
}
.green a {
  color: #fff;
}
.green a:hover {
  color: rgb(211, 255, 70);
}
a {
  color: rgb(74,42,14);
  text-decoration: none;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}
a:hover {
  text-decoration: underline;
}
a.no-line {
  text-decoration: none;
}

h1 {
  font-family: "ng";
  color: rgb(202,158,100);
  font-size: 1.1em;
  font-weight: 400;
  width: 550px;
  text-align: right;
  margin: .4em auto;
}
h2 {
  font-family: "ng";
  color: rgb(202,158,100);
  font-size: 2em;
  font-weight: 400;
  margin: 3em 0 1em;
}
h2.dark-bg {
  background: rgb(74,42,14);
  margin: 2em -.75em 0 -.75em;
  padding: 1em;
}
h3 {
  font-family: "ng";
  font-weight: 400;
}
.fb {
  position: absolute;
  top: -48px;
  right: 0;
  width: 36px;
  height: 36px;
}
nav {
  margin: 1em 0;
}
nav a::after,
nav a:hover::after {
  content: '|';
  display:  inline-block;
  padding: 0 .1em 0 .4em;
  color: rgb(74,42,14);
}
nav a:last-child::after {
  display: none;
}
nav a {
  color: rgb(74,42,14);
  text-transform: uppercase;
  font-size: .9375em;
}
nav a:hover {
  color: rgb(202,158,100);
  text-decoration: none;
}
.slick {
  margin: 0 -1.5em 4em -1.5em;
}
.slick-slide {
  height: inherit;
}
.slick + .secondary {
  margin-top: -4.05em;
}
.secondary {
  position: relative;
  text-align: left;
  margin: 0 -1.5em;
  padding: 1.5em
}
.secondary h2 {
  margin-top: 0;
}
.secondary h3 {
  margin: 0 10.26em 1em 10.26em;
}
.secondary p {
  margin: 0 12em 1em 12em;
}
p.small {
  font-size: .8em;
  margin: 3em 15em 0em 15em;
  color: #fff;
}
.logo-white {
  float: left;
}
.download-lnk {
  float: right;
  }
.download-lnk a {
  text-decoration: none;
  display: block;
  position: relative;
  margin-bottom: 1em;
}
.download-lnk a:hover {
  color: #fff;
  text-decoration: none;
}
.download-lnk a::before {
  content: '';
  background: url('../assets/img/download.png');
  background-size: 45px 22px;
  width: 45px;
  height: 22px;
  position: absolute;
  left: -50px;
  top: 5px;
}
iframe {
  margin: 0 -1.5em;
}
#aktionen a {
  position: relative;
  display: inline-block;
  margin-left: 30px;
}
#aktionen a::before {
  content: '';
  background: url('../assets/img/download.png');
  background-size: 45px 22px;
  background-position: -20px 0;
  width: 25px;
  height: 10px;
  position: absolute;
  left: -30px;
  top: 5px;
}

#contact {
  float: right;
  width: 40%;
  text-align: center;
}
fieldset {
  border: none;
  padding:0;
}
input {
}
label {
  position: absolute;
  padding: .3em 0 0 .675em;
  font-size: .8em;
  text-transform: uppercase;
  color: rgb(74,42,14);
}
label.error {
  position: relative;
  text-align: left;
  text-transform: none;
  color: rgb(200, 25, 50);
}
.third {
  width: 30%;
}

#jobs-form {
  position: relative;
  display: inline-block;
  max-width: 550px;
}
form div {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
}
input#submit {
  float: none;
  margin-top: 2em;
}
.required {
    color:#e9266d
}
#success, #error {
    position: absolute;
    right: 0;
    top: 5em;
    width: 43%;
    display:none
}
#success span, #error span {
    display:block;
    position:absolute;
    top:0;
    width:100%;
    background: none;
    text-align: center;
}
#success span {
    color: rgb(87, 111, 8);
}
#error span {
    color:#c0392b
}   
.left,
.right {
  width: 45%;
}
.right {
  float: right;
}
.left p,
.right p {
  margin: 0 0 1em 0;
}
.right p {
  font-style: italic;
}

#galerie .slick,
#galerie {
  margin-bottom: 0;
}

.md-overlay,
.md-modal {
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

.md-overlay {
  position: fixed;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(36, 21, 7, 0);
  z-index: -99;
}
.md-overlay.md-show {
  background: rgba(36, 21, 7, 0.8);
  z-index: 99;
}
.md-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  opacity: 0;
  visibility: hidden;
  z-index:-999;
}
.md-modal.md-show {
  visibility: visible;
  opacity: 1;
  z-index:999;
}
.quandoo {
  width: 312px;
  height: 372px;
  margin: -186px 0 0 -156px;
}
.modal-button {
  font-family: inherit;
  cursor: pointer;
  display: inline-block;

  text-transform: uppercase;
  letter-spacing: 1px;
  outline: none;
  position: relative;

  box-shadow: 0 6px #000;  
  border-radius: 5px;

  border: none;
  padding: 1em 1.5em;
  font-size: 1em;
  background: rgb(74,42,14);
  color: #fff;

  float: right;
}
.modal-button:hover {
  box-shadow: 0 4px #000;
  top: 2px;
}
.modal-button:active {
  box-shadow: 0 0 #000;
  top: 6px;
}

form {
  position: relative;
}
form label {
  display: block;
  margin-bottom:.2em;
}
form label.error {
  margin-top:-.5em;
  margin-bottom:1em;
  color:#c0392b
}
form input[type="text"], form input[type="password"], form input[type="date"], form input[type="datetime"], form input[type="datetime-local"], form input[type="month"], form input[type="week"], form input[type="email"], form input[type="number"], form input[type="search"], form input[type="tel"], form input[type="time"], form input[type="url"], form textarea {
  margin-bottom:1.25em;
  box-shadow:none;
  -moz-box-shadow:none;
  -webkit-box-shadow:none;
  border:1px solid #ccc;
  -moz-border-radius:0.2em 0.2em 0.2em 0.2em;
  -webkit-border-radius:0.2em 0.2em 0.2em 0.2em;
  border-radius:0.2em 0.2em 0.2em 0.2em;
  color: #fff;
  background: rgba(255,255,255,0.25);

  width: 100%;
  font-family: 'Nunito', sans-serif;
  font-size: 1.4em;
  padding: 1rem 0 0 .4rem;
}
form input[type="text"]:focus, form input[type="password"]:focus, form input[type="date"]:focus, form input[type="datetime"]:focus, form input[type="datetime-local"]:focus, form input[type="month"]:focus, form input[type="week"]:focus, form input[type="email"]:focus, form input[type="number"]:focus, form input[type="search"]:focus, form input[type="tel"]:focus, form input[type="time"]:focus, form input[type="url"]:focus, form textarea:focus {
  border-color:#aaa;
  box-shadow:none;
  -moz-box-shadow:none;
  -webkit-box-shadow:none;
  background: rgba(255,255,255,0.75);
  color: #000;
}
form input[type="text"][disabled], form input[type="password"][disabled], form input[type="date"][disabled], form input[type="datetime"][disabled], form input[type="datetime-local"][disabled], form input[type="month"][disabled], form input[type="week"][disabled], form input[type="email"][disabled], form input[type="number"][disabled], form input[type="search"][disabled], form input[type="tel"][disabled], form input[type="time"][disabled], form input[type="url"][disabled], form textarea[disabled] {
  background:#fff
}
form input[type="text"].error, form input[type="password"].error, form input[type="date"].error, form input[type="datetime"].error, form input[type="datetime-local"].error, form input[type="month"].error, form input[type="week"].error, form input[type="email"].error, form input[type="number"].error, form input[type="search"].error, form input[type="tel"].error, form input[type="time"].error, form input[type="url"].error, form textarea.error {
  border-color:#c0392b
}
input#file {
  padding-top: 2rem;
}
textarea#message {
  height: 6em;
}
fieldset {
  border:0px;
  margin:0;
  padding:0;
  text-align: left;
}
.required {
  color:#e9266d
}
.form-success , .form-error {
  display:none
}
.form-success span, .form-error span {
  display:block;
  position:absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}
.form-success span p, .form-error span p {
  margin-top:6em
}
.form-success span p {
}
.form-error span p {
  color:#c0392b
}

.responsive-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}
.responsive-video {
  position: relative;
  padding-bottom: 59%;
  padding-top: 0px;
  height: 0;
  overflow: hidden;
  margin: 0 -1.5em;
}

@media (max-width: 1024px) {
  .box {
    width: 100%;
    margin: 20px 0;
    box-shadow: none;
  }
  h2 {
    min-height: 1em;
    margin-bottom: 1.5em;
  }
  .logo {
    max-width: 100%;
  }
  .container {
    box-shadow: none;
  }
}
