#banner{
  position: absolute;
  width: 300px;
  height: 600px;
  top: 0px;
  left: 0px;
  overflow: hidden;
  cursor: pointer;
  opacity: 0;
  background-color: #f5f5f5;  


}

.retina{
  position: absolute;
  width: 300px;
  height: 600px;
  top:0px;
  left:0px;
}

#border {
  position: absolute;
  width: 300px;
  height: 600px;
  top: 0px;
  left: 0px;
  border:1px solid #cccccc;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 9999999;
}


.ctaActive{
display: none;
}

.box  {
  position: absolute;
  top:330px;
  left:40px;
  width: 220px;
  height: 220px;
}

.boxTop{
  position: absolute;
  bottom:50%;
  left:0px;
  width: 100%;
  height: 50%;
  background-color:#0f0f0f;
}

.boxFront{
  position: absolute;
  top:0.3%;
  left:0%;
  width: 100%;
  height: 10%;
  background: rgb(27,29,31);
  background: linear-gradient(180deg, rgba(35,35,35,1) 0%, rgba(15,15,15,1) 100%);
}

.flip1, .flip2, .flip3 {
  position: absolute;
  bottom:50%;
  left:0px;
  width: 100%;
}

.flip1{
  height: 42%;
  background: rgb(19,42,60);
  background: linear-gradient(180deg, rgba(19,42,60,1) 0%, rgba(8,21,31,1) 30%);
}

.flip2{
  height: 37%;
  background: rgb(41,73,97);
  background: linear-gradient(180deg, rgba(41,73,97,1) 0%, rgba(8,27,40,1) 30%);
}

.flip3{
  height: 32%;
  background: rgb(54,103,137);
  background: linear-gradient(180deg, rgba(54,103,137,1) 90%, rgba(25,70,98,1) 100%);
}

.city{
  position: absolute;
  bottom:50%;
  left:-4%;
  width: 108%;
  height: 47%;
}


.card{
  position: absolute;
  bottom:50%;
  left:-6%;
  width: 100%;
  height: 50%;
}



.packshotRechts, .packshotMidden, .packshotLinks{
  position: absolute;
  bottom:50%;
  left:0px;
  width: 100%;
  height: 50%;
}


.boxBottom{
  position: absolute;
  top:50%;
  left:0%;
  width: 100%;
  height: 50%;
  background-color: #0f0f0f;
  -webkit-box-shadow: 0px 10px 9px -2px rgba(0,0,0,0.7); 
  box-shadow: 0px 10px 9px -2px rgba(0, 0, 0, 0.7);
  
}

.boxInnerBack{
  position: absolute;
  top:0%;
  left:0%;
  width: 100%;
  height: 10%;
  background-color:#0f0f0f;

}

.boxInnerFront{
  position: absolute;
  top:80%;
  left:0%;
  width: 100%;
  height: 10%;
  background: rgb(27,29,31);
  background: linear-gradient(180deg, rgba(35,35,35,1) 0%, rgba(15,15,15,1) 100%);
}

.boxInnerTop{
  position: absolute;
  top:0%;
  left:0%;
  width: 100%;
  height: 80%;
  background: rgb(27,29,31);
  background: linear-gradient(180deg, rgba(0,0,0,1) 30%, rgba(45,45,45,1) 100%);
}

.boxInnerLeft{
  position: absolute;
  top:0%;
  left:0%;
  width: 5%;
  height: 80%;
  background-color:#272727;

}

.boxInnerRight{
  position: absolute;
  top:0%;
  left:100%;
  width: 5%;
  height: 80%;
  background-color:#272727;
}


.sparkles{
  position: absolute;
  top: 316px;
  left: 0px;
  width: 100%;
  height: 184px;

}

.sparkle1{
  position: absolute;
  height: 5px;
  width: 20px;
  top:95%;
  left:5%;

  background-color: #37aa9f;
}

.sparkle2{
  position: absolute;
  height: 3px;
  width: 16px;
  top:90%;
  left:12%;
  background-color: #389bd8;
}

.sparkle3{
  position: absolute;
  height: 4px;
  width: 4px;
  top:95%;
  left:20%;
  background-color: #eda1c4;
}

.sparkle4{
  position: absolute;
  height: 3px;
  width: 24px;
  top:95%;
  left:75%;

  background-color: #389bd8;
}

.sparkle5{
  position: absolute;
  height: 2px;
  width: 16px;
  top:96%;
  left:88%;
  background-color: #55548b;
}

.sparkle6{
  position: absolute;
  height: 4px;
  width: 4px;
  top:90%;
  left:88%;
  background-color: #37aa9f;
}

.sparkle7{
  position: absolute;
  height: 3px;
  width: 20px;
  top:5%;
  left:15%;

  background-color: #37aa9f;
}

.sparkle8{
  position: absolute;
  height: 5px;
  width: 16px;
  top:10%;
  left:12%;
  background-color: #389bd8;
}

.sparkle9{
  position: absolute;
  height: 4px;
  width: 4px;
  top:5%;
  left:8%;
  background-color: #eda1c4;
}

.sparkle10{
  position: absolute;
  height: 3px;
  width: 24px;
  top:5%;
  left:75%;

  background-color: #389bd8;
}

.sparkle11{
  position: absolute;
  height: 2px;
  width: 16px;
  top:10%;
  left:80%;
  background-color: #55548b;
}

.sparkle12{
  position: absolute;
  height: 4px;
  width: 4px;
  top:10%;
  left:88%;
  background-color: #37aa9f;
}

.sparkle13{
  position: absolute;
  height: 2px;
  width: 20px;
  top:14%;
  left:34%;
  background-color: #eda1c4;
}