






.ugi-body {
	padding: 0px;
	margin-left: 0px;
	margin-top: 0px;
}

.firewatch .mfp-image-holder .mfp-content {
    max-width: 90%;
margin-left: 0px;
}







.ugi-tekerlek {
  width: 1300px;
  margin-top: 372px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.ugi-tekerlek img {
  width: 100px;
  float: right;
  position: relative;
  display: block;
  margin-right: 26px;
  margin-bottom: 50px;
  animation: rotation 30s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}






.ugi-zeppelin{
	width:500px;

	display: block;
 z-index: 20000;
  text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 200px;
 position: absolute;
  top: -50px;
  right: -500px;
 
   animation: ugi-zeppelin 50s linear 0s infinite reverse;
  z-index: 99;
	
}

.light {
  width: 5px;
  height: 5px;
  background: red;
  border-radius: 50%;
   
  position: absolute;
  z-index: 10;
  left: 430px;
bottom: 8px; 
	animation: light 800ms ease-in-out 0s infinite alternate;
}

@keyframes light {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes ugi-zeppelin {
  from {right:-500px;}
  to {right: 102%;}
}

.ugi-zeppelin img{
	width:500px;

	
}















.ugi-banner-titel  {
  position: relative;
	display: block;
 z-index: 20000;
  text-align: center;
		font-size: 40px;
		margin-top: -180px;
	margin-bottom: 120px;
		font-weight: bold;
		color:#7C1F71;
}

.w3-content{
	display: block;
	position: relative;
	align-content: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 450px;

}

/* PARALLAX */

.keyart, .keyart_layer {
	height: 1000px;
}

#parallax {
	display: none;
}
#nonparallax {
	display: block;
}

#nonparallax {
	background-image: url('../images/keyart-mobile.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: auto 100%;
}

.keyart {
	position: relative;
	z-index: 10;
}

.keyart_layer {
	background-position: bottom center;
	background-size: auto 1038px;
	background-repeat: repeat-x;
	width: 100%;
	position: absolute;
}
.keyart_layer.parallax {
	position: fixed;
}
	  	#keyart-0 {
		background-image: url('../images/Ugi-Banner/parallax0@2x.png');
	
	}
	#keyart-1 {
		background-image: url('../images/Ugi-Banner/parallax1@2x.png');
	}
	#keyart-2 {
		background-image: url('../images/Ugi-Banner/parallax2@2x.png');
	}
	#keyart-3 {
		background-image: url('../images/Ugi-Banner/parallax3@2x.png');
	}
	#keyart-4 {
		background-image: url('../images/Ugi-Banner/parallax4@2x.png');
	}
	#keyart-5 {
		background-image: url('../images/Ugi-Banner/parallax5@2x.png');
	}
	#keyart-6 {
		background-image: url('../images/Ugi-Banner/parallax6@2x.png');
	}
	#keyart-7 {
		background-image: url('../images/Ugi-Banner/parallax7@2x.png');
	}
	#keyart-8 {
		background-image: url('../images/Ugi-Banner/parallax8@2x.png');
	}
	#keyart-scrim {
		background-color: #FFFFFF;
		opacity: 0;
	}

@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi){ 
   	#keyart-0 {
		background-image: url('../images/Ugi-Banner/parallax0@2x.png');
	background-color: #FFFFFF;
	}
	#keyart-1 {
		background-image: url('../images/Ugi-Banner/parallax1@2x.png');
	}
	#keyart-2 {
		background-image: url('../images/Ugi-Banner/parallax2@2x.png');
	}
	#keyart-3 {
		background-image: url('../images/Ugi-Banner/parallax3@2x.png');
	}
	#keyart-4 {
		background-image: url('../images/Ugi-Banner/parallax4@2x.png');
	}
	#keyart-5 {
		background-image: url('../images/Ugi-Banner/parallax5@2x.png');
	}
	#keyart-6 {
		background-image: url('../images/Ugi-Banner/parallax6@2x.png');
	}
	#keyart-7 {
		background-image: url('../images/Ugi-Banner/parallax7@2x.png');
	}
	#keyart-8 {
		background-image: url('../images/Ugi-Banner/parallax8@2x.png');
	}
}




@media only screen and (max-width: 480px) {
	
#nonparallax {
		display: none;
	}
	#parallax {
		display: block;
	}
	.pax #maincontain {
		top: 0px !important;
	}
}

#maincontain {
	background-color: white;
	position: relative;
	z-index: 98;

}

	.pax #maincontain {
		top: 140px;
	}


#main {

		background-image: url(../images/Ugi-Banner/DESIGN/background-06.png);
		
			

	margin-left: auto;
	margin-right: auto;
	z-index: 99;
	position: relative;
	background-color: white;
}







 
/********************/
/********************/
/* ENABLES PARALLAX */
/********************/
/********************/

@media (min-width: 601px) {

	#nonparallax {
		display: none;
	}
	#parallax {
		display: block;
	}

}

/*********************/
/*********************/
/* DISABLES PARALLAX */
/*********************/
/*********************/

@media (max-width: 600px) {

	
	#nonparallax {
		display: none;
	}
	#parallax {
		display: block;
	}
	}

	#main {
	
	}

}


@media only screen and (max-device-width: 450px) {



	#nonparallax {
		display: none;
	}
	#parallax {
		display: block;
	}




/* PARALLAX */

	.keyart, .keyart_layer {
		height: 550px;
	}

	.keyart_layer {
		position: absolute;
		background-size: auto 600px;
	}
}

