/* specific styling for the homepage			*/
/* author: daniel angel 						*/
/* date: 06 Sep, 2008							*/


/* layout overriding ... do so in 		*/
/* case its absolutely necessary!		*/
/* and comment on the reason!			*/



/*  UPDATE!
	Updated by: Owen Evans..
	Original styling disabled into comments...
	New Styling Sits above...
*/



body#home div#main-content { 
	padding: 5px 20px;
	width: 930px; /* make up for the lach of horizontal padding */
}


/* the first horizontal row */

body#home div#first-row {
	height: 230px;
	padding: 10px 0 0 0;
}

body#home span#shane {
	display: block;
	position: relative;
	top: -34px;
	left: -32px;
	background: url(../images/shane.png) top left no-repeat !important;
	background: url(../images/shane.gif) top left no-repeat;
	width: 202px;
	height: 265px;
}
	
body#home div#first-row h3 {
	color: #322f30;
	font-size: 20px;
	text-transform: uppercase;
	width: 350px;
	margin: -240px 0 0 190px;
}
body#home div#first-row h3 strong {
	display: block;
	font-size: 28px;
}

body#home div#first-row div#first-row-text {
	line-height: 1.2em;
	width: 475px;
	margin: -147px 0 0 425px;
}
body#home div#first-row p.p-1 {
	margin-top: 17px;
}
body#home div#first-row p#p-2 {
	position: relative;
	top: -65px;
	left: 380px;
	width: 350px;
	z-index: 0;
}
body#home div#first-row p#p-3 {
	position: relative;
	top: -10px;
	left: 380px;
	width: 350px;
	z-index: 0;
}
	/*
	Original Styling Disabled... See notes above...
	
	body#home div#first-row h3 {
		color: #322f30;
		font-size: 20px;
		text-transform: uppercase;
		width: 226px;
		margin: -255px 0 0 170px;
	}
	body#home div#first-row h3 strong {
		display: block;
		font-size: 28px;
	}
	body#home div#first-row p {
		line-height: 1.2em;
		width: 216px;
		margin: -10px 0 0 170px;
	}
	body#home div#first-row p#p-1 {
		margin-top: 5px;
	}
	body#home div#first-row p#p-2 {
		position: relative;
		top: -185px;
		left: 232px;
		z-index: 0;
	}
	body#home div#first-row p#p-3 {
		position: relative;
		top: -161px;
		left: 232px;
		z-index: 0;
	}
	body#home div#first-row p#p-4 {
		position: relative;
		top: -137px;
		left: 232px;
		z-index: 0;
	}
	body#home div#first-row h4 {
		background: url(../images/home-first-row-h4-a.png) top right no-repeat !important;
		background: url(../images/home-first-row-h4-a.gif) top right no-repeat;
		width: 343px;
		height: 370px;
		position: relative;
		top: -475px;
		left: 615px;
		z-index: 1;
	}
		body#home div#first-row h4 a {
			display: block;
			text-indent: -9999px;
			height: 370px;
			overflow: hidden;
		}
	
 	... end of original styling disabled 
 	*/

/* end the first horizontal row */


body#home div#second-row {
	background: url(../images/home-second-row-background.png) bottom right no-repeat; /* little trick to complete the little backgrounds of the boxes inside */
	height: 378px; /*need it to match the height of the containers */
}

body#home div#second-row div#video {
	background: url(../images/home-second-row-video-background.png) top left no-repeat;
	width: 293px;
	height: 378px;
	float: left;
}

	body#home div#second-row div#video h4 {
		font-size: 20px;
		text-transform: uppercase;
	}
	
	body#home div#second-row div#video h4 strong {
		display: block;
		font-size: 25px;
	}
	
	body#home div#second-row div#video p.button {
		width: 98px;
		height: 39px;
		position: relative;
		top: 3px;
		left: 150px;
	}
	
		body#home div#second-row div#video p.button a, body#home div#second-row div#try-it p.button a, body#home div#second-row div#quotation p.button a {
			display: block;
			height: 39px;
			text-indent: -9999px;
			overflow: hidden;
		}
	
		body#home div#second-row div#video p.button a {
			background: url(../images/home-video-p-button.png) top left no-repeat;
		}
	
	body#home div#second-row div#video img, body#home div#second-row div#try-it img {
		display: block;
		margin: -14px auto 0 auto;
	}


body#home div#second-row div#try-it {
	background: url(../images/home-second-row-try-it-background.png) top left no-repeat;
	width: 293px;
	height: 378px;
	float: left;
	margin: 0 24px 0 24px;
}

	body#home div#second-row div#try-it h4 {
		font-size: 20px;
		color: #0081C6;
		text-transform: uppercase;
	}
	
	body#home div#second-row div#try-it h4 strong {
		display: block;
		font-size: 25px;
	}
	
	body#home div#second-row div#try-it p.button {
		width: 107px;
		height: 39px;
		position: relative;
		top: -10px;
		left: 150px;
	}
		
		body#home div#second-row div#try-it p.button a {
			background: url(../images/home-try-it-p-button.png) top left no-repeat;
		}

body#home div#second-row div#quotation, body#home div#second-row div#operator {
	width: 296px;
	height: 178px;
	float: left;
}

	body#home div#second-row div#quotation h4, body#home div#second-row div#operator h4 {
		font-size: 20px;
		color: #FFF;
		text-transform: uppercase;
	}
	
	body#home div#second-row div#quotation h4 strong, body#home div#second-row div#operator h4 strong {
		display: block;
		font-size: 25px;
	}

body#home div#second-row div#quotation {
	background: url(../images/home-second-row-quotation-background.png) bottom left no-repeat;
	margin: 0 0 22px 0;
}

	body#home div#second-row div#quotation h4 {
		text-align: right;
		margin: 11px 15px 0 0;
		letter-spacing: -2px;
	}
	
	body#home div#second-row div#quotation p {
		color: #FFF;
		line-height: 13px;
		margin: 0 0 0 120px;
	}
	
	body#home div#second-row div#quotation p.button {
		width: 115px;
		height: 39px;
		position: relative;
		top: 10px;
		left: 45px;
	}
	
		body#home div#second-row div#quotation p.button a {
			background: url(../images/home-quotation-p-button.png) top left no-repeat;
		}
		
		body#home div#second-row div#video p.button a:hover, body#home div#second-row div#try-it p.button a:hover, body#home div#second-row div#quotation p.button a:hover {
			background-position: 0 -39px;
		}

body#home div#second-row div#operator {
	background: url(../images/home-second-row-operator-background.png) bottom right no-repeat;
}

	body#home div#second-row div#operator h4 {
		margin: 15px 0 0 35px;
	}
	
	body#home div#second-row div#operator h4 span {
		margin-left: 30px;
	}
	
	body#home div#second-row div#operator p {
		color: #FFF;
		position: relative;
		top: 40px;
		left: 20px;
	}
	
	body#home div#second-row div#operator p strong {
		display: block;
		font-size: 23px;
	}

/* cosmetic adjustments */


body#home div#second-row div#video h4, body#home div#second-row div#video p, body#home div#second-row div#try-it h4, body#home div#second-row div#try-it p {
	margin: 12px 15px 7px 15px;
}

body#home div#second-row div#video p, body#home div#second-row div#try-it p {
	line-height: 13px;
}


div#youtube-video {
	text-align: center;
	width: 260px;
	margin: -10px 0 -5px 16px;
}