/* Styles... */
body{
	background-color: white;
}

.odd{
	font-size: 8em;
	font-family: 'Francois One', sans-serif;
	overflow: scroll;
	float: right;
}
.even{
	font-size: 8em;
	font-family: 'Francois One', sans-serif;
	overflow: scroll;
	float: left;
	
}
.one{
	display: inline-block;
	background-color: red;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}
.two{
	display: inline-block;
	background-color: blue;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}

.three{
	display: inline-block;
	background-color: red;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}
.four{
	display: inline-block;
	background-color: blue;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}
.five{
	display: inline-block;
	background-color: red;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}
.six{
	display: inline-block;
	background-color: blue;
	width: 100%;
	height: 10em;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
}

@media (min-width: 400px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-40px);
		transition: all 1s ;
	}
}

@media (min-width: 600px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-80px);
		transition: all 1s ;
	}
}
@media (min-width: 800px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-120px);
		transition: all 1s ;
	}
}
@media (min-width: 1000px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-160px);
		transition: all 1s ;
	}
}
@media (min-width: 1200px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-200px);
		transition: all 1s ;
	}
}
@media (min-width: 1400px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-240px);
		transition: all 1s ;
	}
}
@media (min-width: 1600px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-280px);
		transition: all 1s ;
	}
}
@media (min-width: 1800px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-320px);
		transition: all 1s ;
	}
}
@media (min-width: 2000px){
	.even{ 
		/*color: white;*/
		position: relative;
		transform: translateX(-360px);
		transition: all 1s ;
	}
}