/* ---------------------------------------------------------------------------------
   
   Talk Gadgets - Home Stylesheet 
   Author: Easyray Design
   Website: www.easyraydesign.co.uk 

--------------------------------------------------------------------------------- */


#greybar-wrap { background: #e5e5e5; padding: 0; height: 324px; }
#greybar { background: url(../home/astro.jpg) no-repeat 345px 0; height: 324px; position: relative; }

.rAbout { width: 260px; padding: 0 0 0 30px; }
.rAbout span { font-weight: bold; }

#australia { background: url(../images/australia.gif) no-repeat 30px 1px; height: 97px; }

#get-in-touch { float: left; width: 260px; background: url(../images/get-in-touch-bg.jpg) no-repeat 0 0; padding: 31px 0 0 30px; height: 150px; }
#get-in-touch h3 {
	text-indent: -5000px;
	height: 17px;
	background-image: url(../images/get-in-touch.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#get-in-touch p a { color: #4c4c4c; }

#new-centre {
	width: 300px;
	float: right;
	height: auto;
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 10px;
	padding-left: 0;
	border-top-width: 1px;
	border-top-style: none;
	border-top-color: #ccc;
}
#new-centre h3 {
	text-indent: -5000px;
	height: 22px;
	background-image: url(../images/ads.png);
	background-repeat: no-repeat;
	background-position: 10px 0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
}
#new-centre p a { color: #4c4c4c; }

#right p a:hover { color: #000; }

#left {
	width: 630px;
	padding-top: 20px;
	background-repeat: no-repeat;
	background-position: 340px 0;
}

.homeBox { float: left; width: 290px; padding-bottom: 36px; }
.homeBox img { margin: 10px 0px 10px 0px; }
.homeBox a img { float: left; border: solid 1px #ccc; padding: 5px; }
.homeBox a img:hover {
	border: 5px solid #FC0;
	padding: 1px;
}
.homeBox h2 { height: 21px; overflow: hidden; }
.homeBox h2 a { height: 21px; float: left; width: 100%; }
.homeBox h2 a span { display: none; }
.homeBox p, .homeBox h2 {
	float: right;
	width: 180px;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 9px;
	line-height: 20px;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
}
#h-interface, #h-pointofsale { padding-right: 30px; }

#h-interface h2 {
	background-image: url(../home/prowler-txt.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#h-hardware h2 {
	background-image: url(../home/free-quote-txt.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#h-pointofsale h2 {
	background-image: url(../home/testimonials-txt.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#h-finance h2 {
	background-image: url(../home/scotchguard-txt.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#h-animation h2 {
	height: 22px;
	background-image: url(../images/latest-news.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}

#h-finance { width: 295px; }
#h-finance h2, #h-finance p { width: 185px; }
#h-animation {
	float: left;
	width: 500px;
	margin-left: 0px;
	background-repeat: no-repeat;
	background-position: 0 bottom;
	padding-top: 0;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0;
}
#h-animation p, #h-animation h2 {
	width: 100%;
	float: left;
}

#intro {
	width: 368px;
	float: left;
	padding-top: 45px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}
#intro h1 {
	font-size: 1.25em;
	color: #4b4b4b;
	line-height: 1.35em;
	border-top: solid 1px #b7b7b7;
	font-weight: normal;
	width: 358px;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0;
	padding-top: 18px;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 0;
}
#intro #presents {
	font-size: 1.05em;
	color: #272472;
	background-image: url(../images/welcome.png);
	background-repeat: no-repeat;
	background-position: 0 bottom;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 15px;
	margin-left: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 10px;
	padding-left: 0;
	height: 29px;
}
#intro #presents span { display: none; }

#astro-png {
	width: 75px;
	height: 278px;
	position: absolute;
	top: 46px;
	left: 490px;
	z-index: 1000;
	background-repeat: no-repeat;
	background-position: 0 0;
}


/* ---------------------------------------------------------------------------------
   CODA STYLES
--------------------------------------------------------------------------------- */

#everyone {
	text-indent: -5000px;
	position: absolute;
	left: 499px;
	top: 25px;
	width: 445px;
	background-image: url(../home/slogan.png);
	background-repeat: no-repeat;
	background-position: right 0;
	height: 25px;
}

#screens {
	width: 465px;
	height: 257px;
	overflow: hidden;
	float: left;
	position: absolute;
	left: 490px;
	top: 19px;
}
.panel { float: left; width: 465px; height: 257px; }

.stripViewer { /* This is the viewing window */
    position: absolute;
    overflow: hidden;
    margin: auto;
    width: 465px; /* Also specified in  .stripViewer .panelContainer .panel  below */
    height: 257px;
    clear: both;
    z-index: 100;
    left: 490px; top: 67px;
}

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
    position: relative;
    left: 0; top: 0;
    width: 100%;
    list-style-type: none;
    z-index: 100;
    /* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
}
.stripNav { display: none; }

.stripNavL a, .stripNavR a {
	width: 37px;
	height: 42px;
	text-indent: -5000px;
	display: block;
	position: absolute;
	top: 294px;
	z-index: 600;
	outline: none;
}
.stripNavL a {
	float: left;
	left: 870px;
	background-image: url(../home/arrow-left.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
.stripNavR a {
	float: right;
	left: 907px;
	background-image: url(../home/arrow-right.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
.stripNavL a:hover, .stripNavR a:hover { background-position: 0 -42px; cursor: hand; cursor: pointer; outline: none; }

#pHome #screens .panel img { border-bottom: solid 5px #000; float: left; }
#pHome #screens .panel p { width: 630px; margin: 0; border-bottom: solid 5px #000; margin-top: 278px; font-size: 0.7em; float: left; }
#pHome #screens .panel p a { color: #545252; width: 300px; float: left; padding: 12px 15px 7px 15px; float: left; text-decoration: none; background: #000; }
#pHome #screens .panel p a span { font-weight: bold; color: #868686; }
#pHome #screens .panel p a:hover { background: url(../images/featured-arrow.gif) no-repeat 306px 15px #000; color: #ccc; }
#pHome #screens .panel p a:hover span { color: #fff; }
#pHome #gallery { margin: 0; }

.panelText { width: 151px; padding: 63px 20px 0 0; float: right; }
#screens .border {
	padding: 9px 5px 0 9px;
	float: left;
	margin: 55px 0 0 21px;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#screens .panel p {
	color: #CCC;
}
#screens h3 { color: #fff;  font-size: 0.8em; height: 20px; width: 100%; text-indent: -5000px; }

#f-bowlers {
	background-image: url(../home/f-mobile-phones.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#f-technicians {
	background-image: url(../home/f-broadband.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#f-frontdesk {
	background-image: url(../home/f-sandv.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#f-management { background: url(../home/f-management.gif) no-repeat 0 0; }
#f-animation { background: url(../home/f-animation.gif) no-repeat 0 0; }
