/**********************************
Utility........: style.css
Description....: Master Screen CSS
Copyright......: Persona Creative Ltd.
Email..........: lewis@personacreative.com
Last Changed...: 14-09-2007
Notes #1.......: Do NOT modify main styles
Notes #2........ "Reset CSS" adapted from Erik Meyer (meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/)
**********************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	/*font-weight:inherit;*/
	/*font-style:inherit;*/
	font-size:100%;
	font-family:inherit;
	/*vertical-align:baseline;*/
}
ol, ul {
	list-style:none;
}
table {
	border-collapse:separate;
	border-spacing:0;
}
caption, th, td {
	text-align:left;
	font-weight:normal;
}
/******************
Layout
******************/
body {
	font-family:arial, tahoma;
	background:#404040 url(../img/bg.jpg) repeat-x center 0;
}
.container {
	position:relative;
	width:960px;
	margin:0 auto;
}
/******************
Banner/Logo Area
******************/
#banner-area {
	float:left;
	width:100%;
	background:url(../img/banner.gif) right no-repeat;
}
#logo {
	float:left;
	height:80px;
	width:211px;
	background:#000;
}
#logo h1 {
	height:80px;
	width:211px;
	background:url(../img/clickandplay_logo.gif);
}
#logo h1 a {
	display:block;
	height:80px;
	width:211px;
}
#logo h1 span, #logo p {
	display:none;
}
#info {
	float:right;
	height:80px;
	/*display:none;*/
	width:170px;
	background:#000;
}
#info p {
	margin-top:10px;
	font-size:0.8em;
	font-weight:bold;
	color:#fff;
	text-align:center;
}
#info span {
	font-size:1.4em;
}
#info a:link, #info a:active, #info a:visited {
	color:#fff;
}
/******************
Date
******************/
#date {
	position:absolute;
	width:180px;
	top:85px;
	right:9px;
}
#date p {
	font-size:0.7em;
	text-align:right;
	font-weight:bold;
}
/******************
Left Navigation |***| 
******************/
.left-nav_holder {
	float:left;
	width:220px;
	padding-bottom:8px;
	margin-bottom:10px;
	background:url(../img/left-nav_holder_bg.gif) no-repeat bottom;
}
#left-nav {
	float:left;
	width:220px;
	/*height:521px;*/
	margin-top:7px;
	background:url(../img/left-nav_bg.gif);
}
#left-nav p.head {
	/*font-size:0.8em;
	font-weight:bold;
	text-transform:uppercase;*/
	color:#a7a7a7;
	padding:8px 0 6px 34px;
	margin:0;
	background:url(../img/left-nav_head.gif) no-repeat top left;
}
#left-nav p {
	float:left;
	clear:left;
	width:200px;
	height:15px;
	color:#a7a7a7;
	font-size:0.75em;
	font-weight:bold;
	text-transform:uppercase;
	margin:8px 0 0 8px;
}
#left-nav span {
	padding-left:24px;
}
#left-nav img {
	
}
.left-sections {
	list-style:none;
	margin-left:7px;
}
.left-sections ul {
}
.left-sections li {
	float:left;
	display:inline;
}
.left-sections li a {
	display:block;
	width:177px;
	height:20px;
	border:0;
	color:#404040;
	font-size:0.75em;
	text-transform:uppercase;
	text-decoration:none;
	background:url(../img/left-nav_tab.gif) no-repeat 0 0;
	padding:8px 0 4px 25px;
	margin:3px 0 0 3px;
}
.left-sections a:hover {
	text-decoration:none;
	background:url(../img/left-nav_tab.gif) no-repeat 0 -32px;
}
.left-sections a:active {
	text-decoration:none;
	background:url(../img/left-nav_tab.gif) no-repeat 0 -64px;
}
.left-sections a img {
	border:0;
	height:32px;
	width:185px;
}
.left-sections li.selected a {
	color:#fff;
	background:url(../img/left-nav_tab.gif) no-repeat 0 -96px;
}
/******************
left-sections (Sub-Sections)
******************/
.left-sections ul.subnav {
	margin-top:8px;
}
.left-sections ul.subnav li {
	float:left;
	display:inline;
	width:174px;
}
.left-sections ul.subnav li a {
	display:block;
	width:166px;
	color:#000;
	font-size:0.7em;
	font-weight:normal;
	height:auto;
	text-transform:uppercase;
	background:none;
	margin:0;
	padding:0px 0px 0px 30px;
}
.left-sections ul.subnav li a:hover {
	color:#00bcff;
}
.left-sections ul.subnav li.on a {
	color:#00bcff;
}
/******************
Rotating Images
******************/
#rotating_preview {
	float:left;
	overflow:hidden;
	height:143px;
	width:191px;
	margin:5px 12px;
	background:url(../img/left-nav_clientlogos00.gif);
}
/******************
Expand Holder |***| 
******************/
.expand {
	float:left;
	width:740px;
	margin-bottom:10px;
	color:#000;
	background:#fefefe url(../img/expand_bg.gif) no-repeat bottom;
}
/******************
Main Content |***| 
******************/
.main-content {
	float:left;
	width:740px;
	color:#000;
	background:url(../img/main-content_bg.gif) no-repeat top;
}
.main-content h2 {
	font-size:1.0em;
	font-weight:bold;
	margin:11px 12px 3px 12px;
}
.main-content h3 {
	font-size:0.85em;
	font-weight:bold;
	margin:11px 12px 3px 12px;
}
.main-content h4 {
	font-size:0.8em;
	margin:11px 12px 3px 12px;
}
.main-content p {
	font-size:0.75em;
	margin:0 12px 12px 12px;
}
.main-content ul {
	margin-bottom:10px;
}
.main-content ul li {
	list-style:disc;
	font-size:0.75em;
	line-height:1.3em;
	margin:0 12px 0 40px;
}
.main-content ul li ul li {
	margin-top:5px;
	font-size:1.0em;
}
.main-content ol {
	margin-bottom:10px;
}
.main-content ol li {
	list-style:lower-alpha;
	font-size:0.75em;
	line-height:1.3em;
	margin:0 12px 0 40px;
}
.main-content ul.bullet li {
	list-style:disc;
}
/*Product Table*/
.main-content table.products {
	margin:5px 12px;
}
.main-content table.products img {
	margin:0;
}
.main-content table.products td {
	padding:0px;
	vertical-align:top;
}
.main-content table.products td.title {
	width:154px;
	vertical-align:top;
	font-family:arial, tahoma;
	font-size:0.8em;
	font-weight:bold;
	padding:0px;
}
/****************/
.main-content img {
	float:right;
	margin:12px;
}
.main-content img:hover {
}
.main-content img#totop {
	float:right;
	margin:5px;
}
.main-content a:link, .main-content a:active, .main-content a:visited {
	font-weight:bold;
	color:#00bcff;
	text-decoration:none;
	border-bottom:1px dotted #918574;
}
.main-content a:hover {
	border-bottom:1px solid #000;
}	
.main-content table.standard {
	width:350px;
	margin:5px 0 10px 0px;
	font:normal 0.7em arial, helvetica, sans-serif;
}
.main-content table.standard td {
	vertical-align:top;
	background:#fff;
	padding:3px 3px 3px 6px;
}
img.long {
	float:left;
	margin-left:5px;
}
/******************
IMAGE HOLDER
******************/
.image_holder {
	float:right;
	width:170px;
	margin:12px;
}
.image_holder img {
	width:170px;
	margin:5px 0 5px 0;
	border:0;
}
/******************
Brands
******************/
#brands {
	float:left;
	width:740px;
}
#brands img {
	float:left;
}
/******************
Testimonials
******************/
.testimonials {
	float:left;
	width:500px;
	margin:0 12px 12px 12px;
	border:1px solid #ddd;
}
.testimonials h4 {
	margin:0 0 6px 0;
	padding:4px;
	background:#888;
	color:#fff;
}
.testimonials p {
	font-family:verdana, arial, helvetica, sans-serif;
	font-size:0.7em;
	color:#666;
}
/******************
Packages GSB
******************/
#packages {
	float:left;
	margin-left:12px;
}
#packages img {
	margin:0;
}
#bronze {
	float:left;
	width:237px;
}
#silver {
	float:left;
	width:237px;
}
#gold {
	float:left;
	width:237px;
}
/******************
Breadcrumb
******************/
#breadcrumb {
	float:left;
	margin:0 12px;
	width:720px;
}
#breadcrumb p {
	font-size:0.6em;
	margin:12px 12px 5px 0;
}
/******************
Next Area
******************/
#next-area {
	float:left;
	clear:left;
	margin:5px 0 5px 12px;
	height:20px;
	width:720px;
	background:url(../img/next_bg.gif);
}
.next-desc {
	float:left;
	width:308px;
	font-size:0.7em;
	color:#fff;
	text-transform:uppercase;
	margin:2px 0 0 12px;
}
.next-link a {
	float:left;
	width:130px;
	text-align:center;
	vertical-align:middle;
	font-size:0.7em;
	padding-top:2px;
}
.next-link a:link, .next-link a:visited, .next-link a:active {
	color:#000;
	border-bottom:0;
	text-decoration:none;
}
.next-link a:hover {
	color:#fff;
	background:none;
	border-bottom:0;
	text-decoration:none;
}
/******************
Flash Content
******************/
#flashcontent {
	float:left;
	margin:0 12px 12px 12px;
	border:0px solid #f00;
}
#flashcontent img {
	margin:0;
	float:left;/*dont float me with flash please*/
}
/******************
Flash Text
******************/
#flash-text {
	float:left;
	width:479px;
	height:132px;
	margin:0 0 0 10px;
	background:url(../img/flash-text_bg.gif);
}
/******************
Related Blocks
******************/
.related-images {
	float:left;
	width:85px;
	height:125px;
	margin-left:10px;
	background:url(../img/related-images_bg.gif) no-repeat 100% 4px;
}
.related-images p {
	font-size:0.7em;
	width:75px;
	text-transform:uppercase;
	margin:0;
	margin-top:11px;
}
.related-images p span {

}
.related-images img {
	float:left;
	border:0;
}
.related-images img:hover {
	border:0;
}
.related-images a:link, .related-images a:visited, .related-images a:active {
	color:#000;
	border-bottom:0;
	text-decoration:none;
}
.related-images a:hover {
	color:#fff;
	background:none;
	border-bottom:0;
	text-decoration:none;
}
.related-images img {
	margin:0;
}
/******************
Data Blocks
******************/
.data-block_holder {
	float:left;
	margin:0 0 14px 10px;
	width:234px;
	background:#fcfcfc url(../img/data-block_holder_bg.gif) repeat-y;
	border:0px solid #f00;
}
.data-block {
	float:left;
	width:234px;
	background:url(../img/data-block_bg.gif) no-repeat bottom;
}
.data-block h4 {
	font-size:0.7em;	
	text-transform:uppercase;
	color:#666;
	padding:9px 10px 0px 10px;
	margin:0;
	background:#dcdcdc url(../img/data-block_head.gif) no-repeat top;
}
.data-block p {
	font-size:0.7em;
	margin:5px 10px;
}
.data-block ul li {
	list-style:disc;
	font-size:0.7em;
	line-height:1.3em;
	margin:5px 0 0 20px;
}
.data-block img.rss {
	padding:0;
	margin:-6px 4px 2px 0;
}
/******************
RSS Live Display ||*||| 
******************/
.feedburnerFeedBlock img {
	display:none;
}
/*span.headline {
	display:none;
}*/
/*image with tag*/
.tagimage {
	float:right;
	width:72px;
	margin:7px;
}
.tagimage p {
	float:right;
	width:72px;
	font-size:0.7em;
	text-align:center;
	color:#000;
	line-height:12px;
	margin:2px;
}
.tagimage img {
	margin:0;
	border:0;
}
.tagimage a:link, .tagimage a:active, .tagimage a:visited {
	color:#00bcff;
	border-bottom:0;
	text-decoration:underline;
}
.tagimage a:hover {
	background:none;
	border-bottom:0;
	text-decoration:none;
}
/******************
Contact Form
******************/
.form_area {
	float:left;
	margin:0 12px 12px 12px;
	padding:12px;
	background:#f8f8f8;
	border:1px solid #bbb;
}
.form_area h4, .form_area p {
	margin-left:0;
}
.contactform {
	font:0.7em tahoma, helvetica, arial, sans-serif;
	float:left;
	clear:both;
}
.contactform td {
	padding:0px 5px 0 0px;
	width:200px;
}
.contactform input {
	width:194px;
	height:17px;	
	font:1.0em tahoma, helvetica, arial, sans-serif;
	padding:3px 5px 0 5px;
	border:1px solid #ddd;
}
.contactform input:hover {
	background:#f9f9f9;
}
.contactform input#contactChoice_0 {
	width:15px;
	vertical-align:sub;
	border:0;
}
.contactform input#contactChoice_1 {
	width:15px;
	vertical-align:sub;
	border:0;
}
.contactform select {
	width:205px;
	font:1.0em tahoma, helvetica, arial, sans-serif;
}
.contactform span {
	color:#999;
}
.contactform textarea {
	width:194px;
	height:100px;
	font:1.0em tahoma, helvetica, arial, sans-serif;
	padding:3px 5px 0 5px;
	border:1px solid #ddd;
}
.contactform textarea:hover {
	background:#f9f9f9;
}
.contactform input.submit {
	width:110px;
	height:20px;
	font:1.1em tahoma, helvetica, arial, sans-serif;
	color:#333;
	padding-top:0px;
	/*padding-bottom:10px;*/
	background:#fff;
}
.contactform input.submit:hover {
	background:#00bcff;
	color:#fff;
	cursor:pointer;
}
/* Hints */
span.hint {
	display:none;
	position:absolute;
	right:325px;
	width:155px;
	color:#000;
	border:1px solid #c93;
	padding:10px;
	background:#ffc;
}
span.hint_two {
	display:none;
	position:absolute;
	right:-10px;
	width:155px;
	color:#000;
	border:1px solid #c93;
	padding:10px;
	background:#ffc;
}
/* Liva Validate */
span.LV_valid {
	color:#0c0;
}	
span.LV_invalid {
	color:#c00;
}
span.LV_validation_message{
	float:left;
	font-weight:bold;
	margin:0 0 0 5px;
}
.LV_valid_field,
input.LV_valid_field:hover, 
input.LV_valid_field:active,
textarea.LV_valid_field:hover, 
textarea.LV_valid_field:active,
.fieldWithErrors input.LV_valid_field,
.fieldWithErrors textarea.LV_valid_field {
	border:1px solid #0c0;
}
.LV_invalid_field,
input.LV_invalid_field:hover, 
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover, 
textarea.LV_invalid_field:active,
.fieldWithErrors input.LV_invalid_field,
.fieldWithErrors textarea.LV_invalid_field {
	border:1px solid #c00;
}
/******************
Footer
******************/
#footer {
	float:right;
	width:100%;
	margin:0 0 -10px 0;
}
#footer p {
	font-size:0.7em;
	color:#fff;
	text-align:right;
	margin:0 10px 10px 0;
}
#footer img {
	border:0;
	text-decoration:none;
	vertical-align:middle;
}
#footer a, #footer a:active, #footer a:visited {
	color:#fff;
	text-decoration:underline;
}
#footer a:hover {
	text-decoration:none;
}
#footer img {
}
/******************
External Links
******************/
a.ext {
	padding-right:18px;
	background:url(../images/new_window.png) no-repeat 100% 0px;
}
a.ext:hover {
	background:#f9f7f0 url(../images/new_window.png) no-repeat 100% 0px;
}
/******************
Global Styles
******************/
acronym {
	cursor:help;
	border-bottom:1px dotted #000;
}
.line {
	border-bottom:1px solid #ddd;
	margin:10px;
	height:1px;
	clear:both;
}
.clearing {clear:both;}
strong {}
a:link {color:#000;text-decoration:none;}
a:visited {color:#000;text-decoration:none;}
a:hover {color:#000;text-decoration:underline;}
a:active {color:#000;}
a:focus {outline:none;}
/******************
CLEARFIX CODE
*****************/
.clearfix:after {
	content:".";
	display:block;
	clear:both;
	visibility:hidden;
	line-height:0;
	height:0;
}
html[xmlns] .clearfix {
	display:block;
}
* html .clearfix {
	height:1%;
}