body {
  margin: 0;
  padding: 0; }


.headerimage {
   }

.header, .artists, .logo {
  background: #000; }

.intro, .footer {
  color: #ed677a; }

.black .headerimage { }

.black .header, .black .artists, .black .logo {
  background: #000000; }
  
  

.black .intro, .black .footer {
  color: #000000; }

.navbar {
  position: fixed;
  top: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0 60px;
  z-index: 999; }
  @media (max-width: 960px) {
    .navbar {
      padding: 0 40px; } }
  @media (max-width: 480px) {
    .navbar {
      padding: 0 20px; } }
  .navbar .logo {
    width: 100px;
    display: block;
    margin-top: 30px;
    padding: 12px 12px 8px; }
    @media (max-width: 480px) {
      .navbar .logo {
        width: 80px; } }
    .navbar .logo img {
      width: 100%;
      height: auto; }
  .navbar .burger {
    width: 60px;
    height: 55px;
    position: absolute;
    right: 20px;
    top: 30px; }
 

.header {
  width: 100%;
  height: 100vh;
  position: relative;
  top: 0; }
  .header .headerimage {
    margin: 0 auto;
    width: 100%;
    height: 100%;
    max-width: 1200px;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center; }
  .header .headertext {
    position: absolute;
    
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
    width: 100%;
    display: block;
    margin: 0 auto;
    text-align: center;
    box-sizing: border-box;
    padding: 0 60px; }
    
    .header .headerlogo{
	    position: relative;
	    width: 400px;
	    margin: 0 auto;
    }
    
    .header .headerlogo img{
	    width: 100%;
	    height: auto;
	    display: block
	    
    }
    @media (max-width: 1040px) {
      }
    @media (max-width: 480px) {
	    
	     .header .headerlogo{
	    width: 230px;
    }
    }
    .header .headertext h1 {
      font-family: 'Trenda-Heavy', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
      font-size: 10.166674351707rem;
      line-height: 0.8em;
      letter-spacing: 0px;
      max-width: 900px;
      margin: 0 auto 30px; }
      @media (max-width: 960px) {
        .header .headertext h1 {
          font-size: 4em; } }
      @media (max-width: 480px) {
        .header .headertext h1 {
          font-size: 4em; } }
    .header .headertext h2 {
      font-size: 2.8em;
      font-family: 'Trenda-Regular', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
      max-width: 1200px;
      margin: auto; 
      color: #545454;
      letter-spacing: 4px;
      margin-bottom: 30px;}
      @media (max-width: 960px) {
        .header .headertext h2 {
          font-size: 1.6em; } }
          
          
          
          .intro.dark,
          .black .intro.dark{
	          background: #000000;
	          color: #fff
          }
          
      @media (max-width: 600px) {
	      
	      .header .headertext h1{
		      font-size: 3em;margin-bottom: 15px;
	      }
	      .header .headertext h2{
		      margin-bottom: 15px;
	      }
	      
        .header .headertext h2 {
          font-size: 1.2em; } }
          
          
          .intro b, .intro strong{
	          font-family: 'Trenda-Heavy', Helvetica, Arial, Sans-Serif;
	          font-weight: normal;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';

          }
          
           .container h3{
	          font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
			  font-size: 3.8rem;
	          font-weight: normal;
	          letter-spacing: 2px;

          }
          
          .intro p:last-of-type{
	          margin-bottom: 0;
          }

.intro {
  padding: 100px 0 100px;
      font-family: 'Trenda-Regular', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';  font-size: 1.2em; }
  @media (max-width: 960px) {
    .intro {
      font-size: 1.1em; } }
  @media (max-width: 480px) {
	
	  
	  
	  .container h2{
		  font-size: 3rem;	  } }

.artists {
  padding: 100px 0 100px;

  color: #fff; }
  
  
  
  
  .artists h3 a{
	  color: #fff;
	  text-decoration: none;
      font-family: 'Trenda-Regular', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
  }
  .artists .item .fit-image{
	  margin-bottom: 20px;
  }
  
   .artists .item a{
	   display: block;
   }
  .artists .item {
	  width: 49%;
	  margin-right: 2%;
	  float: left;
    margin-top: 40px; }
    
    
    
    @media(max-width: 660px){
	    .artists .item {
    width: 100%;
    margin-right: 0%;
    float: none;
}
    }
    
    
     .artists .item.full {
	  
    margin: 0;
    width: 100%; }
    
    
    
      .artists .item.image {
	  
    margin-top: 2%; }
    
    .artists .item.lst{
	    margin-right: 0;
    }
    .artists .item h4 {
	          font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';

      font-size: 2.25em;
      letter-spacing: 1px;
      line-height: 1em; }
      
      
      .artists .item h4 span{
	        font-family: 'Trenda-Regular', Helvetica, Arial, Sans-Serif;
	
      }
      @media (max-width: 480px) {
        .artists .item h4 {
          font-size: 3em; } }
    .artists .item a {
      color: #fff;
      margin: 0 6px; }
      .artists .item a.mail {
        text-decoration: none; }
    .artists .item p {
      margin-bottom: 10px; }
      .artists .item p .name {
        font-weight: 400; }
    .artists .item img {
      width: 100%;
      height: auto; }
      
      
      .container h2{
	      margin-bottom: 3.5rem;
      font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
	letter-spacing: 4px;
      }
      
      #kontakt p a{
	      color: red;
	      text-decoration: none;
      }

.footer {
  padding: 100px 0 80px;
  font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0'; }
	
	.footer p span{
		font-family: 'Trenda-Regular', Helvetica, Arial, Sans-Serif;
	-moz-font-feature-settings:'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
	}
	
	
	.footer p{
		font-size: 1.05em;
	}
	
	.footer .lbl{
		display: inline-block;
		width: 70px;
	}
	
	.footer p.primary{
		color: #e69400;
	}
  .footer iframe {
    width: 100%;
    height: 500px; }
.fit-image img{
	width: 100%;
	height: auto;
	display: block;
}
.imprint {
  text-align: center;
  padding: 40px 0 40px;
  letter-spacing: 2px;
  color: #b7b7b7; }
  .imprint a {
    text-decoration: none;
    color: #b7b7b7; }

.max1400 {
  max-width: 1400px !important; }

#nav-icon3 {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer; }

#nav-icon3 span {
  display: block;
  position: absolute;
  height: 4px;
  width: 70%;
  background: #fff;
  opacity: 1;
  left: 15%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out; }
  
  
  .headline{
	  background: #e69400;
	  padding: 70px  0 300px 0;
	  color: #fff;
  }
   @media (max-width: 480px) {
	 
	  
	  .headline{
		  padding: 40px 0 70px 0;
	  }
	  
	  .container h3{
		  font-size: 3rem;
	  }
	   }
  .content{
	  padding: 60px 0;
  }
  
  
  .content{
	  font-size: 1.2em;
  }
  
  .content .container h3 {
    font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;
    -moz-font-feature-settings: 'aalt=0,c2sc=0,case=0,frac=0,liga=0,locl=0,ordn=0,salt=0,smcp=0,ss01=0,sups=0';
    font-size: 2.3rem;
    font-weight: normal;
    letter-spacing: 2px;
    margin-top: 40px;
    text-transform: uppercase;
}
  
  
    .mainnav ul{
	  opacity: 0;
    transition: transform ease .3s .2s,opacity ease .3s .2s;  }
  
   .mopen  .mainnav ul{
	  opacity: 1;
    transform: translateY(-50%) scale(1);
    transition-delay: .3s;
  }
  
  .mainnav{
	  position: fixed;
	  top: 0;
	  left: 0;
    transition: all ease .3s .2s,opacity ease .3s .2s;
    opacity: 0;
	  width: 100%;
	  height: 100%;
	  z-index: -1;
	  background: #000000;
  }
  
  .mopen .mainnav{
	  opacity: 1;
    z-index: 10;
  }
  .mainnav ul{
	  position: relative;
	  top: 50%;
	  transform: translateY(-50%) scale(1.2);
	  list-style: none;
	  margin: 0;
	  padding: 0;
	  text-align: center;
  }
  
  
  .mainnav ul li{
	  list-style: none;
	  padding: 0;
	  margin: 0;
	  display: inline-block;
  }
  
  
  .mainnav ul li a{
	  padding: 0 40px; 
	  display: inline-block;
    transition: color ease .3s .2s,opacity ease .3s .2s;
	  color: #fff;
	  font-size: 4.5rem;
	  text-decoration: none;font-family: 'Trenda-Bold', Helvetica, Arial, Sans-Serif;
  }
  
  .mainnav ul li a:hover{
	  color: #ffa800
  }

  
@media(max-width: 600px){
	 .mainnav ul li{
		 display: block;
	 }
}
/* Icon 3 */
#nav-icon3 span:nth-child(1) {
  top: 12px; }

#nav-icon3 span:nth-child(2), #nav-icon3 span:nth-child(3) {
  top: 24px; }

#nav-icon3 span:nth-child(4) {
  top: 36px; }

#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%; }

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); }

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg); }

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%; }
  
  
  
  
  
  /*
animate
*/
.animate {
  animation-fill-mode: both;
  animation-duration: 0.5s; }

.animate-reverse {
  animation-direction: reverse; }

.animate-fast {
  animation-duration: 0.3s; }

.animate-no-delay {
  animation-delay: 0s !important; }

@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0); }
  to {
    transform: translate3d(0, 0, 0); } }

.slideInLeft {
  animation-name: slideInLeft; }

@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0); }
  to {
    transform: translate3d(0, 0, 0); } }

.slideInRight {
  animation-name: slideInRight; }

@keyframes slideInUp {
  from {
    transform: translate3d(0, 100%, 0); }
  to {
    transform: translate3d(0, 0, 0); } }

.slideInUp {
  animation-name: slideInUp; }

@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0); }
  to {
    transform: translate3d(0, 0, 0); } }

.slideInDown {
  animation-name: slideInDown; }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.fadeIn {
  animation-name: fadeIn; }

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0); }
  to {
    opacity: 1;
    transform: none; } }

.fadeInLeft {
  animation-name: fadeInLeft; }

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0); }
  to {
    opacity: 1;
    transform: none; } }

.fadeInRight {
  animation-name: fadeInRight; }

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    transform: none; } }

.fadeInUp {
  animation-name: fadeInUp; }

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0); }
  to {
    opacity: 1;
    transform: none; } }

.fadeInDown {
  animation-name: fadeInDown; }

/*
animate delay
*/
.animates li,
.animates > div {
  animation-duration: 0.5s; }

.animates li:nth-of-type(1),
.animates > div:nth-of-type(1) {
  animation-delay: 0.075s; }

.animates li:nth-of-type(2),
.animates > div:nth-of-type(2) {
  animation-delay: 0.15s; }

.animates li:nth-of-type(3),
.animates > div:nth-of-type(3) {
  animation-delay: 0.225s; }

.animates li:nth-of-type(4),
.animates > div:nth-of-type(4) {
  animation-delay: 0.3s; }

.animates li:nth-of-type(5),
.animates > div:nth-of-type(5) {
  animation-delay: 0.375s; }

.animates li:nth-of-type(6),
.animates > div:nth-of-type(6) {
  animation-delay: 0.45s; }

.animates li:nth-of-type(7),
.animates > div:nth-of-type(7) {
  animation-delay: 0.525s; }

.animates li:nth-of-type(8),
.animates > div:nth-of-type(8) {
  animation-delay: 0.6s; }

.animates li:nth-of-type(9),
.animates > div:nth-of-type(9) {
  animation-delay: 0.675s; }

.animates li:nth-of-type(10),
.animates > div:nth-of-type(10) {
  animation-delay: 0.75s; }

.animates li:nth-of-type(11),
.animates > div:nth-of-type(11) {
  animation-delay: 0.825s; }

.animates li:nth-of-type(12),
.animates > div:nth-of-type(12) {
  animation-delay: 0.9s; }

.animates li:nth-of-type(13),
.animates > div:nth-of-type(13) {
  animation-delay: 0.975s; }

.animates li:nth-of-type(14),
.animates > div:nth-of-type(14) {
  animation-delay: 1.05s; }

.animates li:nth-of-type(15),
.animates > div:nth-of-type(15) {
  animation-delay: 1.125s; }

.animates li:nth-of-type(16),
.animates > div:nth-of-type(16) {
  animation-delay: 1.2s; }

.animates li:nth-of-type(17),
.animates > div:nth-of-type(17) {
  animation-delay: 1.275s; }

.animates li:nth-of-type(18),
.animates > div:nth-of-type(18) {
  animation-delay: 1.35s; }

.animates li:nth-of-type(19),
.animates > div:nth-of-type(19) {
  animation-delay: 1.425s; }

.animates li:nth-of-type(20),
.animates > div:nth-of-type(20) {
  animation-delay: 1.5s; }

.animates li:nth-of-type(21),
.animates > div:nth-of-type(21) {
  animation-delay: 1.575s; }

.animates li:nth-of-type(22),
.animates > div:nth-of-type(22) {
  animation-delay: 1.65s; }

.animates li:nth-of-type(23),
.animates > div:nth-of-type(23) {
  animation-delay: 1.725s; }

.animates li:nth-of-type(24),
.animates > div:nth-of-type(24) {
  animation-delay: 1.8s; }

.animates li:nth-of-type(25),
.animates > div:nth-of-type(25) {
  animation-delay: 1.875s; }

.animates li:nth-of-type(26),
.animates > div:nth-of-type(26) {
  animation-delay: 1.95s; }

.animates li:nth-of-type(27),
.animates > div:nth-of-type(27) {
  animation-delay: 2.025s; }

.animates li:nth-of-type(28),
.animates > div:nth-of-type(28) {
  animation-delay: 2.1s; }

.animates li:nth-of-type(29),
.animates > div:nth-of-type(29) {
  animation-delay: 2.175s; }

.animates li:nth-of-type(30),
.animates > div:nth-of-type(30) {
  animation-delay: 2.25s; }

.animates-fadeInDown li,
.animates-fadeInDown > div {
  animation-name: fadeInDown; }

.animates-fadeInUp li,
.animates-fadeInUp > div {
  animation-name: fadeInUp; }

.animates-fadeInLeft li,
.animates-fadeInLeft > div {
  animation-name: fadeInLeft; }

.animates-fadeInRight li,
.animates-fadeInRight > div {
  animation-name: fadeInRight; }

  .js-Pjax-remove {
  position: absolute; }

.js-Pjax-onswitch {
  position: relative;
  overflow: hidden; }