.cb-slideshow,
.cb-slideshow:after {
    position: fixed;
    top: 0px;
    left: 0px;
	 width: 100%;
    height: 100%;
    z-index: 0;
	list-style: none;
	margin-left: 0;
}
.cb-slideshow:after {
    content: '';
 
}
.cb-slideshow li span {
    position: absolute;
    top: 0px;
    left: 0px;
	width: 100%;
    height: 100%;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
	/*ENSURE THE TOTAL TIME OF THE ANIMATIONS IS UPDATED HERE*/
	-webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 54s linear infinite 0s;
    -moz-animation: imageAnimation 54s linear infinite 0s;
    -o-animation: imageAnimation 54s linear infinite 0s;
    -ms-animation: imageAnimation 54s linear infinite 0s;
    animation: imageAnimation 54s linear infinite 0s;
}
.cb-slideshow li div {
    z-index: 1000;
    position: absolute;	
    bottom: 20px;
    left: 0px;
    width: 100%;
    opacity: 0;

	/*ENSURE THE TOTAL TIME OF THE ANIMATIONS IS UPDATED HERE*/
    -webkit-animation: titleAnimation 54s linear infinite 0s;
    -moz-animation: titleAnimation 54s linear infinite 0s;
    -o-animation: titleAnimation 54s linear infinite 0s;
    -ms-animation: titleAnimation 54s linear infinite 0s;
    animation: titleAnimation 54s linear infinite 0s;
}
/*STYLING OF THE BOTTOM LEFT CORNER LABELS*/
.cb-slideshow li div h6 {
    color:white;
	font-size: 0.55em;
	font-weight: 400;
	text-transform:uppercase;
	text-align: left;
	padding-left: 40px;
	
}

/*IMAGE HOLDERS*/

.cb-slideshow li:nth-child(1) span {
	position: fixed; 
    left: 0px; 
    top: 0px; 
	background-image: url(../animated_bg/Portfolio/EU.jpg);
	width: 115%;
	-webkit-animation: Bg1 54s infinite;	
    -moz-animation: Bg1 54s infinite;	
    -o-animation: Bg1 54s infinite;	
    -ms-animation: Bg1 54s infinite;	
	animation: Bg1 54s infinite;	
	
}
@keyframes Bg1 {	
  0% {
    transform: translateX(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(-12%);
	 opacity: 0;
  }
} 

.cb-slideshow li:nth-child(2) span {
	position: fixed; 
    left: 0px; 
    top: 5%; 
    background-image: url(../animated_bg/Portfolio/UE_Spain.jpg);
	width: 80%;
	height: 130%;
	-webkit-animation: Bg2 54s 6s infinite;	
    -moz-animation: Bg2 54s 6s infinite;	
    -o-animation: Bg2 54s 6s infinite;	
    -ms-animation: Bg2 54s 6s infinite;
	animation: Bg2 54s 6s infinite;
}
@keyframes Bg2 {
0% {
    transform: translateY(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateY(-12%);
	 opacity: 0;
  }

}

.cb-slideshow li:nth-child(3) span {
	position: fixed; 
    left: -8%; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/Uber_Pass_Storefront.jpg);
	width: 110%; 
	-webkit-animation: Bg3  54s 12s infinite;
    -moz-animation: Bg3  54s 12s infinite;	
    -o-animation: Bg3  54s 12s infinite;	
    -ms-animation: Bg3  54s 12s infinite;
   animation: Bg3  54s 12s infinite;
}
@keyframes Bg3 {
0% {
    transform: translateX(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(8%);
	 opacity: 0;
  }

}

.cb-slideshow li:nth-child(4) span {
	position: fixed; 
    left:0px; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/Digital_showroom_1.png);
   width: 120%; 
	-webkit-animation: Bg4 54s 18s infinite;
    -moz-animation: Bg4 54s 18s infinite;	
    -o-animation: Bg4 54s 18s infinite;	
    -ms-animation: Bg4 54s 18s infinite;
	animation: Bg4 54s 18s infinite;
	}
@keyframes Bg4 {
0% {
    transform: translateY(-5%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateY(0%);
	 opacity: 0;
  }

}

.cb-slideshow li:nth-child(5) span {
	position: fixed; 
    left: -8%; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/TH_Nadal_Balls.jpg);
   width: 110%; 
	-webkit-animation: Bg5 54s 24s infinite;
    -moz-animation: Bg5 54s 24s infinite;	
    -o-animation: Bg5 54s 24s infinite;
    -ms-animation: Bg5 54s 24s infinite;
	animation: Bg5 54s 24s infinite;
}
@keyframes Bg5 {
0% {
    transform: translateX(-2%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(8%);
	 opacity: 0;
  }

}

.cb-slideshow li:nth-child(6) span {
	position: fixed; 
    left: 0px; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/Uber_driver_stories.jpg);
    height: 118%; 
	background-position: top;
	-webkit-animation: Bg6 54s 30s infinite;
    -moz-animation: Bg6 54s 30s infinite;	
    -o-animation: Bg6 54s 30s infinite;
    -ms-animation: Bg6 54s 30s infinite;
	animation: Bg6 54s 30s infinite;
}
@keyframes Bg6 {
0% {
	transform: translateY(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateY(-15%);
	 opacity: 0;
  }
}

.cb-slideshow li:nth-child(7) span {
	position: fixed; 
    left:0px; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/Uber_pass_CRM_screens.jpg);
  width: 112%; 
	-webkit-animation: Bg7 54s 36s infinite;	
    -moz-animation: Bg7 54s 36s infinite;	
    -o-animation: Bg7 54s 36s infinite;
    -ms-animation: Bg7 54s 36s infinite;		
	animation: Bg7 54s 36s infinite;
}
@keyframes Bg7 {
	0% {
	transform: translateX(-10%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(-5%);
	 opacity: 0;
  }
}

.cb-slideshow li:nth-child(8) span {
	position: fixed; 
    left:0px; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/UE_print.jpg);
   width: 120%; 
	-webkit-animation: Bg8 54s 42s infinite;
    -moz-animation: Bg8 54s 42s infinite;	
    -o-animation: Bg8 54s 42s infinite;
    -ms-animation: Bg8 54s 42s infinite;
	animation: Bg8 54s 42s infinite;
}
@keyframes Bg8 {
0% {
    transform: translateX(2%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(-8%);
	 opacity: 0;
  }

}

.cb-slideshow li:nth-child(9) span {
	position:fixed; 
    left: 0px; 
    top: 0px; 
	background-image: url(../animated_bg/Portfolio/NikeRussia_head.JPG);
	height: 120%; 
	background-position: top;
	-webkit-animation: Bg9 54s 48s infinite;
    -moz-animation: Bg9 54s 48s infinite;	
    -o-animation: Bg9 54s 48s infinite;
    -ms-animation: Bg9 54s 48s infinite;
	animation: Bg9 54s 48s infinite;
	}
@keyframes Bg9 {
	0% {
    transform: translateY(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateY(-12%);
	 opacity: 0;
  }

}
/*--
.cb-slideshow li:nth-child(10) span {
	position: fixed; 
    left: 0px; 
    top: 0px; 
    background-image: url(../animated_bg/Portfolio/Nadal_5.jpg);
   width: 120%; 
	-webkit-animation: Bg10 54s 54s infinite;
    -moz-animation: Bg10 54s 54s infinite;	
    -o-animation: Bg10 54s 54s infinite;
    -ms-animation: Bg10 54s 54s infinite;
	animation: Bg10 54s 54s infinite;
}
@keyframes Bg10 {
0% {
    transform: translateX(0%);
	opacity: 0;
  }
	 5% {
		 opacity: 1;
	}
  10% {
	 transform: translateX(-12%);
	 opacity: 0;
  }

}
--*/

/*fade out animations of titles */
.cb-slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}

.cb-slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) div {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) div {
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) div {
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}

.cb-slideshow li:nth-child(7) div {
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s;
}

.cb-slideshow li:nth-child(8) div {
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s;
}

.cb-slideshow li:nth-child(9) div {
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s;
}

.cb-slideshow li:nth-child(10) div {
    -webkit-animation-delay: 54s;
    -moz-animation-delay: 54s;
    -o-animation-delay: 54s;
    -ms-animation-delay: 54s;
    animation-delay: 54s;
}




/* Animation for the title */
@-webkit-keyframes titleAnimation { 
	 0% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
	 8% {
    opacity: 0;
  }
	
}