/* Import required stlyes
****************************************************************************/
@import url("reset.css");
@import url("global.css");

/* Styling of shared page areas i.e. header, footer navigation
****************************************************************************/
body {
	text-align:center;
	background:#596D92 url(img/bg_face.gif);
	font-family:Georgia,Arial,Helvetica,sans-serif;
	font-size:16px;
}
/* Enclosing container box */
#Container {position:relative;width:780px;margin:35px auto 0;color:#000;}
#T1 #Container {height:520px;background:#FFF url(img/bg_home.gif) top left repeat-y;}
#T2 #Container {background:#FFF url(img/bg_rpt_notebook.gif) top left repeat-y;}

/* Header including logo */
#Header {height:210px;background:url(img/bg_header.gif) top left no-repeat;}
#Logo {display:none;}

/* Mailing list box */
#MailingListForm {position:absolute;width:195px;}
#MailingListForm p {margin:0;padding:0;}
#T1 #MailingListForm {top:360px;right:31px;}
#T2 #MailingListForm {top:34px;right:40px;}
#MailingListForm input, p#MailingListFeedback {
	margin:4px 2px 3px;
	border:1px solid #A5ACB2;
	background:#FFF;
	padding:3px 2px;
	font-size:12px;
	font-family:Georgia,Arial,Helvetica,sans-serif;
	color:#A5ACB2;
}
p#MailingListFeedback {color:#000;}
#MailingListForm #Email, p#MailingListFeedback {width:183px;}
#MailingListForm #FirstName, #MailingListForm #Surname {
	display:none;
	margin-right:-5px;
	width:88px;
}
#MailingListForm #Submit {
	margin:0 2px;
	padding:1px 3px;
	background:#EEE;
	color:#000;
}
p#MailingListFeedback {
	display:none;
}

/* Main navigation */
#T1 #PrimaryNav {position:absolute;top:205px;left:36px;margin:0;}
#T2 #PrimaryNav {
	position:absolute;
	top:142px;
	left:201px;
	margin:0;

}
#T1 #PrimaryNav li {margin:0;}
#T2 #PrimaryNav li {display:inline;margin:0;}
#T2 #PrimaryNav li img {padding-right:6px;}
#T2 #PrimaryNav #NavHome img {background:url(img/nav_home_dot.gif) right center no-repeat;}
#T2 #PrimaryNav #NavBrands img {background:url(img/nav_brands_dot.gif) right center no-repeat;}
#T2 #PrimaryNav #NavStore img {background:url(img/nav_store_dot.gif) right center no-repeat;}
#T2 #PrimaryNav #NavAbout img {background:url(img/nav_about_dot.gif) right center no-repeat;}
#T2 #PrimaryNav #NavNews img {background:url(img/nav_news_dot.gif) right center no-repeat;}
#T2 #PrimaryNav #NavContact img {padding-right:0;}

/* Content boxes */
#Content {float:left;margin:0 25px 20px;}
#T1 #Content h1 {margin-bottom:8px;}
#T1 #Content {position:absolute;top:0;right:4px;width:195px;}
#MainContent {float:right;width:530px;padding-left:25px;}
#SecondaryContent {
	margin-right:555px;
	padding:8px 25px 8px 0;
	background:url(img/sep_vertical_rpt.gif) right top repeat-y;
}

/* Footer */
#Footer {padding:20px 0;background:none;font-size:11px;color:#FFF;}
#T1 #Footer {position:absolute;top:520px;width:780px;}
#T2 #Footer {clear:both;}
#Footer p {margin:0;text-align:center;}
#Footer strong {font-weight:bold;}
#Footer a {text-decoration:none;color:#FFF;}
#Footer a:hover {text-decoration:underline;}


/* Non-global elements generally used in Content section of site
****************************************************************************/
/* secondary nav */
.secondaryNav {margin:0;}
.secondaryNav li {text-align:right;font-size:14px;margin:5px 0;}
.listHeader {font-weight:bold;color:#D10033;}
.secondaryNav {color:#F55F00;}
.secondaryNav a {color:#000;text-decoration:none;}
.secondaryNav a:hover {color:#F55F00;}

/* news and articles */
.newsLink {
	background:url(img/sep_horizontal_rpt.gif) left top repeat-x;
	padding:8px 0;
	font-size:10px;
}
.newsLink h3, .newsLink p {margin:0;}
.newsLink h3 a {font-size:11px;font-weight:bold;color:#03A6D4;}
.newsLink a {text-decoration:none;color:#f96a0f;}
.newsLink a:hover {text-decoration:underline;}
.newsImage {float:right;margin:0 0 15px 15px;border:1px dashed #596D92;}

/* content */
#SecondaryContent .infoLink {
	font-size:11px;
	margin:5px 0 15px;
}
#SecondaryContent .infoLink h3, #SecondaryContent .infoLink p {
	margin:0;
	text-align:right;
}
#SecondaryContent .infoLink a {
	font-size:10px;
	color:#000;
	text-decoration:none;
}
#SecondaryContent .infoLink a:hover {
	color:#F55F00;
}

/* products page */
.productThumb {float:left;margin:6px 16px 0 0;font-size:10px;}
.productThumb p {width:116px;}
.productThumb img {padding:8px;background:#FFF;}
.productThumb em {color:#EB0017;font-style:normal;}
.productNav {clear:both;padding:6px 0;font-size:14px;}
.productNav a, .productNav strong {padding:4px;}