/* SLIDER CONTAINER (CUSTOMIZE) */
#sequence {
	width: 100%; /* previously 1340px */
	height: 375px; /* *** */
	margin: 0px;
	padding: 0px;
	margin-top:75px;
	position: relative; /* required */
}
		
.home .hero-unit{ margin-top:0px;}
		
/* THESE NEXT 3 WONT CHANGE */
#sequence > .sequence-canvas li > * {  /* required */
	position: absolute;
}		
/* make the canvas the same size as the container */
#sequence > .sequence-canvas { /* required */
	height: 100%; 
	width: 100%;
}				
/* add some declarations to each frame */
#sequence > .sequence-canvas > li { /* required */
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
}		
			
/* APPLYING TRANSITIONAL PROPERTIES (CUSTOMIZE LEFT VALUE) */
.info1,
.info2,
.info3 {
	left: -1350px; 
	/*top: 10px;*/
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	-ms-transition-duration: 1s;
	transition-duration: 1s;
	width: 100%;
}		
		
/* You’ve made it so that the <div> with class info1, will move from its “start” position of left: -150px, to left: 165px */
.animate-in .info1,
.animate-in .info2,
.animate-in .info3 {
	left: 0px;
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	-ms-transition-duration: 1s;
	transition-duration: 1s;
}

.animate-out .info1,
.animate-out .info2,
.animate-out .info3 {
	left: 0; /* previously 1400px */
	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	-ms-transition-duration: 1s;
	transition-duration: 1s;
}  
			

/* Here you’ve given start positions to the <div> elements within the second and third frames. */
/*
.info2 {
	top: 130px;
}

.info3 {
	top: 250px;
}
*/
		
/* *** Added myself *** */
ul.sequence-canvas { list-style-type: none; margin: 0; padding: 0; }