#introFull
{
position: fixed;
  top: 0;
  background: #000;
  color: #fff;
  width: 100%;
  padding: 20px;
  min-width: 100%;
  min-height: 100%;
  z-index: 1000;
  height: 500px;
}

#introFull.withBG
{
	background:url(../images/logo_redshow.png) no-repeat;
	background-size:contain;
	background-position:center;background-color: #000;
	padding: 0;
}



 /* Style the video: 100% width and height to cover the entire window */
#introVideoBG
{
	z-index:1;
	  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  background-image:url(../images/bg_frame.png);
  
}
#introVideo {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  z-index:0;
    transform: translateX(calc((100% - 100vw) / 2));
}

/* Add some content at the bottom of the video/page */
.introContent{
  position: absolute;
  bottom: 44px;
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 80%;
  margin:auto;
  padding: 20px;
  z-index:2;
  text-align: center;
  left: 10%;
}




.intro-anim {
	z-index:3;position: relative;
  margin-top: 22vh;
}


.intro-anim-iphone
{
	
}

.intro-anim-cta
{
	text-decoration:underline;
	 font-family: ducati-extended, 'ducatiStyleExtended', sans-serif;
	 color:#fff;
	font-size:3rem;
	text-align:center;
	font-weight: 700;
}
.intro-event-city
{
	background-color: #f00;
  color: #fff;
  padding: 20px 50px;
  font-size: 2.5rem;
  display: inline-block;
  font-weight: 900;
  text-transform: uppercase
}
.intro-event-date
{
color: #fff;
  padding: 10px;
  font-size: 1.4rem;
  display: inline-block;
  font-style: italic;
}
.intro-anim-content ,.intro-anim-content-iphone 
{
	 font-family: ducati-extended, 'ducatiStyleExtended', sans-serif;
	 color:#fff;
	font-size:3rem;
	text-align:center;
	font-weight: 700;
	position:absolute;
	left: 15%;
	  width: 70%;
	  top: 30%;
	  opacity: 0; 
	
}
.intro-anim-content{ opacity: 0;transform-origin: 50% 50%};

.intro-anim-content-iphone{ opacity: 0;transform-origin: 50% 50%};
.intro-anim { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index:2; } 


#intro-anim-content-0.on{animation: fadeZoom 4s;}
#intro-anim-content-1.on{animation: fadeZoom 5s;}
#intro-anim-content-2.on{animation: fadeZoom 6s;}
#intro-anim-content-3.on{animation: fadeZoom 7s;}
#intro-anim-content-4.on{animation: fadeZoom 4s;}


.intro-anim-iphone-bg{ height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  animation-iteration-count:infinite;
}
.intro-anim-iphone-text{z-index: 1;
  opacity: 0;
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
  position: absolute;
  margin-top: 10vh;width: 100%;
  left: 0;
}

#intro-anim-content-iphone-0{animation:  36s linear 0s  fadeZoomIphone infinite;}
#intro-anim-content-iphone-1{animation:  36s linear 3s  fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim1.jpg);}
#intro-anim-content-iphone-2{animation:  36s linear 6s fadeZoomIphone infinite ;}
#intro-anim-content-iphone-3{animation:  36s linear 9s  fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim2.jpg);}
#intro-anim-content-iphone-4{animation:  36s linear 12s  fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim3.jpg);}
#intro-anim-content-iphone-5{animation:  36s linear 15s  fadeZoomIphone infinite;}
#intro-anim-content-iphone-6{animation:  36s linear 18s fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim4.jpg);}
#intro-anim-content-iphone-7{animation:  36s linear 21s fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim5.jpg);}
#intro-anim-content-iphone-8{animation:  36s linear 24s fadeZoomIphone infinite;}
#intro-anim-content-iphone-9{animation:  36s linear 27s fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim7.jpg);}
#intro-anim-content-iphone-10{animation: 36s linear 30s fadeZoomBGIphone infinite; background-image:url(../images/anim-iphone/anim8.jpg);}
#intro-anim-content-iphone-11{animation: 36s linear 33s fadeZoomIphone infinite;}

/*
.intro-anim-content:nth-child(1).on { animation-delay: 8s; animation-duration:49720ms }
.intro-anim-content:nth-child(2).on { animation-delay: 14s; animation-duration:49720ms } 
.intro-anim-content:nth-child(3).on { animation-delay: 20s; animation-duration:49720ms} 
.intro-anim-content:nth-child(4).on { animation-delay: 42s; animation-duration:49720ms}*/

@keyframes fadeZoom { 0% { opacity: 0; transform: scale(0.9); } 10% { opacity: 1; transform: scale(1); } 80% { opacity: 1; transform: scale(1); } 90% { opacity: 0; transform: scale(0.5); } 100% { opacity: 0; transform: scale(0.5); } }
@keyframes fadeZoomIphone {  0% { opacity: 0; transform: scale(0.9); } 2% { opacity: 1; transform: scale(1); } 10% { opacity: 1; transform: scale(1); } 12% { opacity: 0; transform: scale(0.5); } 100% { opacity: 0; transform: scale(0.5); } }
@keyframes fadeZoomBGIphone{  0% { opacity: 0;  } 2% { opacity: 1; } 10% { opacity: 1; } 12% { opacity: 0;  } 100% { opacity: 0;  } }


@media only screen and (max-height: 592px) {
.intro-anim-content 
{top:20px;
}
.intro-anim {
  position: relative;}
  h1 {
  font-size: 1.7em;}

}

@media only screen and (max-width: 572px) {
	.intro-anim-content 
{top:20px;font-size: 25px; margin-top:10%;
}

.intro-anim {
  position: relative;}


}