#banner {
	position: relative;
}


body.homepage #content {
	background: url("/images/simple-innovations/landing-page/splash.jpg") no-repeat top left;
	width:967px;
	height:549px;
}

#banner #imagination {
	display: block;
	background: url("/images/simple-innovations/landing-page/h1-text.jpg") no-repeat top left;
	width:345px;
	height:57px;
	position:absolute;
	top:213px;
	left:27px;
	text-indent:-999999px;
}

#banner #innovation {
	display: block;
	background: url("/images/simple-innovations/landing-page/h2-text.jpg") no-repeat top left;
	width:460px;
	height:31px;
	position:absolute;
	top:126px;
	left:509px;
}

#banner p {
	background: url("/images/simple-innovations/landing-page/paragraph-text.jpg") no-repeat top left;
	width:376px;
	height:148px;
	position:absolute;
	top:165px;
	left:516px;
}

#banner ul li a {
	background: url("/images/simple-innovations/landing-page/arrow.jpg") no-repeat 0 50%;
	text-transform: uppercase;
	color: #e97d11;
	padding-left: 18px;
	text-decoration:none;
	font-size:70%;
	display:block;
	margin-top:101px;
	height: 13px;
}

#banner ul li {
	list-style-type: none;
	position:absolute;
}

#banner #refresh {
	background: url("/images/simple-innovations/landing-page/refresh.jpg") no-repeat top left;
	width:74px;
	height:86px;
	left:54px;
	top:316px;
}

#banner #refresh a {
	display:block;
	margin-top:97px;
	margin-left:-11px;
	width:76px;
}

#banner #primers {
	background: url("/images/simple-innovations/landing-page/primer_waterbased.jpg") no-repeat top left;
	width:93px;
	height:81px;
	left:152px;
	top:359px;
}

#banner #primers a {
	display:block;
	margin-top:96px;
	margin-left:-6px;
	width:83px;
}

#banner #crayola {
	background: url("/images/simple-innovations/landing-page/crayola.png") no-repeat top left;
	width:94px;
	height:45px;
	
	left:558px;
	top:401px;
	
	
	/*left:258px;
		top:419px;*/
}

#banner #crayola a {
	display:block;
	margin-top:59px;
	margin-left:13px;
	width:76px;
}

#banner #color-simplicity {
	background: url("/images/simple-innovations/landing-page/color-simplicity.jpg") no-repeat top left;
	width:63px;
	height:83px;
	left:437px;
	top:418px;
}

#banner #color-simplicity a {
	display:block;
	margin-top:97px;
	margin-left:-28px;
	width:91px;
}

#banner #porch-floor {
	background: url("/images/simple-innovations/landing-page/porch_floor.png") no-repeat top left;
	width:76px;
	height:80px;
	left:277px;
	top:419px;
}

#banner #porch-floor  a {
	display:block;
	margin-top:93px;
	margin-left:-6px;
	width:80px;
}

#banner #dimensions-color-samples {
	background: url("/images/simple-innovations/landing-page/dimensions-color-samples.jpg") no-repeat top left;
	width:71px;
	height:82px;
	left:616px;
	top:374px;
}

#banner #dimensions-color-samples a {
	display:block;
	margin-top:91px;
	margin-left:-7px;
	width:76px;
}

#banner #twist-and-pour {
	background: url("/images/simple-innovations/landing-page/twist-and-pour.png") no-repeat top left;
	width:97px;
	height:100px;
	left:691px;
	top:329px;
}

#banner #twist-and-pour a {
	background: url("/images/simple-innovations/landing-page/colors-arrow.jpg") no-repeat 0 50%;
}

#banner #twist-and-pour a {
	display:block;
	margin-top:109px;
	margin-left:7px;
	width:76px;
}

#banner #twist-try {
	background: url("/images/simple-innovations/landing-page/Twist_Try.jpg") no-repeat top left;
	width:97px;
	height:81px;
	left:822px;
	top:304px;
}

#banner #twist-try a {
	display:block;
	margin-top:87px;
	margin-left:15px;
	width:76px;
}

/* TODO
	IE6 fix for the links. The reason behind them breaking is they're getting cut off by the
	li. This is due to the negative margin some of them have. I'm "fixing" this by setting that
	margin to auto. They'll be slightly off but fully visible.
*/

* html #banner #twist-and-pour a,
* html #banner #primers a,
* html #banner #color-simplicity a,
* html #banner #porch-floor a,
* html #banner #dimensions-color-samples a {
	margin-left: auto;
}

* html #banner #twist-and-pour a {
	width: 60px;
	margin-left: 10px;
}