/* 
   Font sizes all relative to the "body" tag below and by using "em" it means if the user increases the font size on the browser (DDA compliance)
   then the sizes increase on the site in proportion too.
*/
body { font-family: Arial; font-size: .80em; background-color: #808080;}

body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th {
	margin:0;
	padding:0;
}

table {border-collapse: collapse;}

a img { border:0px; }

/* this sets the overall width of the template so that we don't have to define it all the way through - plus it centres it */
#page {margin: 0 auto; width:974px; background-image:url(images/template/bg_page.gif);  } 
#Headerbar { background-image:url(images/template/bg_top.gif); width:974px; height:137px; color:#ffffff; }
#Headerbar A {color:#ffffff; text-decoration:none; }
#Headerbar A:hover {color:#ffffff; text-decoration:underline; }
#Headerbar .righthandcontent {float:right; width:282px; padding-right:23px; padding-top:20px; height:117px;}
#Headerbar .strapline { float:left; font-weight:bold; position:relative; top:30px; left:29px; letter-spacing:0.35pt; width:500px; }
#Headerbar .login { font-size:.8em; float:right; font-size:.75em;}
#Headerbar .country { float:right; width:134px; font-size:.7em; }
#Headerbar .Tel { float:right; width:250px; padding-top:34px; font-weight:bold; letter-spacing:1.1pt; font-size:.95em;  }
#Headerbar .searchBox { position:relative; top:18px;}
 
/* Region: TOP MENU  */
#regTopMenuBar { width: 100%; color: #4D165C; height:37px; background-image:url(images/template/topnav_bg.gif); }
#regTopMenuBar .MenuLinks { height:37px;}
#regTopMenuBar .MenuLinks ul { display: inline; margin-left:0px; padding-left:0px; }
#regTopMenuBar .MenuLinks ul li { display: inline; margin:0px 0px 0px 0px; font-size: .95em; color:#4D165C; padding:0px 0px 0px 0px;}
#regTopMenuBar .MenuLinks ul li a { color:#4D165C; padding:0px 13px 8px 13px; }

#regTopMenuBar .MenuLinks a {color: #4D165C; font-weight: bold; text-decoration: none; position:relative; bottom:16px;}
#regTopMenuBar .MenuLinks a:hover { text-decoration: none;}


/* Region: FOOTER */
#Addressfooter { border:solid 1px #CACACA; font-size:.85em; text-align:center; clear:both; margin-bottom:6px; margin-top:20px; padding:5px 0px 5px 0px; }
#Addressfooter a {text-decoration: underline; color: #510860; }

#regFooter {width: 100%; color:#ffffff; font-size: .8em; padding: 0px 20px 10px 20px; margin: 0 auto; width:934px;}
#regFooter .Copyright { display: inline; padding-right: 15px; }
#regFooter .MenuLinks { display: inline; padding-top: 4px; padding-bottom: 4px; }
#regFooter .MenuLinks ul { display: inline}
#regFooter .MenuLinks ul li { display: inline; padding: 0px 3px 0px 3px; }
#regFooter a {color: #ffffff; font-weight: normal; text-decoration: none;}
#regFooter a:hover {text-decoration: underline;}

/* Region: Middle bit encompassing left menu and body content (and right menu if appropriate) */
#regMainContent {width: 944px; padding:0px 15px 0px 15px; overflow:auto;}


#regLeftMenu {font-size: .95em; vertical-align:top; color: #44749D; width: 165px; background-color: white; display:inline; padding: 5px 2px 5px 2px; float:left;}
#regLeftMenu a {color: #4D165C; text-decoration: none;}
#regLeftMenu h2 {font-size: 1em; font-weight: bold; color: white; padding: 2px 5px 2px 2px; background-color:#3b0d48; margin-top: 3px; }

#regLeftMenu .menuItemsBox { padding: 0px 0px 10px 0px;}
#regLeftMenu .MenuItem { font-size:.95em;  background-color: #ffffff; margin: 0px 0px 1px 0px; border:solid 1px #CACACA; padding: 3px 0px 3px 6px; }
#regLeftMenu .MenuItem A { color:#4D165C; font-weight: bold; text-decoration: none;}
#regLeftMenu .MenuItem A:hover {text-decoration: underline;}

#regLeftMenu .subMenuItem { font-size: .95em; margin: 0px 0px 1px 0px; padding: 2px 4px 2px 8px; color:black;}
#regLeftMenu .subMenuItem A { color:black; font-weight: normal; text-decoration: none; }
#regLeftMenu .subMenuItem A:hover {text-decoration: none; color:#4D165C; }

#regLeftMenu #scrollerPanelNews { height: 170px; padding: 5px; font-size: 1em; font-family: Arial; text-align:left;}

#rightcolumn .rhsNewsHeading {padding-top: 10px;}
#rightcolumn .rhsNewsHeading A {color: #885a99; font-weight:bold; font-size:.85em; text-decoration: none; }
#rightcolumn .rhsNewsBody {color: #1e1e1e; font-size:.85em; text-decoration: none;}
#rightcolumn .rhsNewsBody:hover {color: #555555; font-size:.85em; text-decoration: none;}

/* set the 750px width below to be the width (920 - left hand menu width).. */
#regBodyContent {vertical-align:top; min-height:400px; padding:0px; width:944px; color:#333333; display:inline; margin-bottom: 6px; background-color: White; font-size: .9em; float:right;}
#regBodyContent h1 {margin-top: 5px; margin-bottom: 5px; font-size: 1.8em; font-weight: normal; color: #510860}
#regBodyContent h2 {margin-top: 8px; margin-bottom: 3px; font-size: 1.6em; font-weight: bold; color: #510860;}
#regBodyContent h3 {margin-top: 0px; margin-bottom: 2px; font-size: 1.5em; font-weight: bold; color: #510860;}
#regBodyContent h4 {margin-top: 5px; margin-bottom: 2px; font-size: 1.2em; font-weight: normal; color: #510860;}

#regBodyContent select {font-size: 1em; padding-left: 2px;}
#regBodyContent input {font-size: 1em; padding-left: 2px;}

#regBodyContent A {text-decoration: none; font-weight: bold; color: #5C248C; }
#regBodyContent A:hover {text-decoration: underline; }
#regBodyContent .MessageToUser {font-weight: bold; color: red; padding-top: 5px; padding-bottom: 10px} 
#regBodyContent .breadcrumbtrail {padding-top:5px; padding-bottom:10px}
#regBodyContent .breadcrumbtrail A {color: #F8A261}
#regBodyContent .highlight {background-color:Yellow}

/* put table cells for the main body content to have a 1px padding by default */
#regBodyContent table td {padding: 1px 1px 1px 1px}


/* Button styles */
#regBodyContent .button {font-weight: bold; color: #6A3F86;}
#regBodyContent .CancelButton {font-weight: normal; color: Red;}

/* datagrid styles */
#regBodyContent .datagridHeader {background-color: #cccccc;font-weight: bold; padding-top: 3px; padding-bottom: 3px; padding-left: 3px; padding-right: 3px; margin-bottom: 10px;}
#regBodyContent .datagridItem {background-color: #efefef; border-bottom: 1px solid #666666}
#regBodyContent .datagridAlternatingItem {background-color: #ffffff; border-bottom: 1px solid #666666}


/* Payment/checkout/myaccount order history page styles */
#regBodyContent .PaymentForm {margin-left: 30px; margin-top:8px; width: 90%;}
#regBodyContent .PaymentForm .heading {width: 140px}
#regBodyContent .PaymentForm input, textarea {font-size: 1em;}
#regBodyContent .PaymentFormHeading {background-color: #3B0D48; color: White; font-weight: bold; margin-top: 10px; margin-bottom: 6px; border-bottom: 2px solid #9AA3B1;padding-top:4px; padding-bottom: 4px; padding-left: 5px;}
#regBodyContent .PaymentSecureSeal  { text-align:center; margin-top: 10px; }

/* these styles are used on the view shopping basket page... */
#regBodyContent .BasketSummary {margin-left: 30px; width: 550px;}
#regBodyContent .BasketSummary .BasketSummaryTable {width: 100%; border-collapse: collapse; }
#regBodyContent .BasketSummary .BasketSummaryTable .BasketSummaryHeader td { background-color: black; color: White; font-weight: bold;}
#regBodyContent .BasketSummary .BasketSummaryTable .BasketSummaryItem td { border-bottom: 1px solid gray; padding-top: 1px; padding-bottom: 2px;}
#regBodyContent .BasketSummary .BasketSummaryTable .BasketItemQuantity {width: 20px; text-align:center; font-size: 1em; margin-left: 25px;}
#regBodyContent .BasketSummary .BasketSubtotal { width: 100%; text-align: right; border-top: 2px solid gray; margin-bottom: 3px; padding-top: 4px; padding-bottom: 1px;}
#regBodyContent .BasketSummary .BasketDelivery { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 3px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .BasketSummary .BasketWeight { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 3px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .BasketSummary .BasketDelivery select {font-size: 1.05em; margin-left: 5px;}
#regBodyContent .BasketSummary .BasketDiscount { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 3px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .BasketSummary .BasketVATAmount { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 6px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .BasketSummary .BasketGrandTotal { width: 100%; text-align: right; border-bottom: 2px solid black; border-top: 1px solid black; font-weight: bold; font-size: 1.1em; margin-bottom: 5px; padding: 3px 0px 3px 0px;}
#regBodyContent .BasketSummary .CartBorder { border: 1px solid #D0D0D0; text-align: center; width: 80px;}
#regBodyContent .BasketSummary .BasketButtons {width: 100%; margin-bottom: 5px; margin-top: 10px;}
#regBodyContent .BasketSummary .BasketButtons .UpdateQuantity {color: Navy; font-weight: bold; font-size: 1em; width:110px; }
#regBodyContent .BasketSummary .BasketButtons .ContinueShopping { color: Navy; font-weight: bold; font-size: 1em; width:140px; }
#regBodyContent .BasketSummary .BasketButtons .Checkout {color: DarkGreen; font-weight: bold; font-size: 1em; width: 220px; margin-top: 20px; }
#regBodyContent .BasketSummary .ApplyDiscountCode {color: DarkGreen; font-weight: bold; font-size: 1em; width:65px}
#regBodyContent .BasketSummary .CartRemove { background-color: #FFFFFF;font-weight: bold; color: #000000; border: 0px}
#regBodyContent .BasketSummary .CartRemove:Hover { text-decoration: none;}

/* these styles are used on the final checkout page... */
#regBodyContent .PaymentSummary {margin-left: 30px; width: 550px;}
#regBodyContent .PaymentSummary .PaymentSummaryTable {width: 100%; }
#regBodyContent .PaymentSummary .PaymentSummaryTable .PaymentSummaryHeader { background-color: black; color: White; font-weight: bold;}
#regBodyContent .PaymentSummary .PaymentSummaryTable .PaymentSummaryHeader td { padding: 2px 4px 2px 4px;}
#regBodyContent .PaymentSummary .PaymentSummaryTable .PaymentSummaryItem {}
#regBodyContent .PaymentSummary .PaymentSummaryTable .PaymentSummaryItem td { border-bottom: 1px solid gray; padding-top: 1px; padding-bottom: 2px; }
#regBodyContent .PaymentSummary .PaymentSubtotal { width: 100%; text-align: right; border-top: 2px solid gray; margin-bottom: 3px; padding-top: 4px; padding-bottom: 1px;}
#regBodyContent .PaymentSummary .PaymentDelivery { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 3px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .PaymentSummary .PaymentDiscount { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 3px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .PaymentSummary .PaymentVATAmount { width: 100%; text-align: right; border-top: 1px solid gray; margin-bottom: 6px; padding-top: 3px; padding-bottom: 1px;}
#regBodyContent .PaymentSummary .PaymentGrandTotal { width: 100%; text-align: right; border-bottom: 2px solid black; border-top: 1px solid black; font-weight: bold; font-size: 1.2em; margin-bottom: 15px; padding-top: 3px; padding-bottom: 3px;}


#regBodyContent .ProductPhotos {margin-right: 10px; }
#regBodyContent .ProductPhotos .MainContent {padding-left: 10px}
#regBodyContent .ProductPhotos .MainPhoto { text-align:center; border: 1px solid black; height: 260px; width: 260px; padding: auto; margin: auto;}

#regBodyContent .ProductPhotos .ThumbnailCaption {font-weight:normal; text-align:center; color: #777777; padding: 5px 0px 5px 0px;}
#regBodyContent .ProductPhotos .ThumbnailPhoto { border: 1px solid #aaaaaa; height:90px; margin-left: 3px; margin-right: 3px; margin-bottom: 5px; text-align: center;}

.ProductSKUsTable .ProductSKUsHeader { background-color: black; color: White; font-weight: bold;}
.ProductSKUsTable .ProductSKUsItem { border-bottom: 1px solid gray; padding-top: 1px; padding-bottom: 2px;}
.ProductSKUsTable .ProductSKUsItem .buyNow {color: #6A3F86; font-weight: bold; font-size: .6em;}

.ProductThumbnailBrowse {}
.ProductThumbnailBrowse .Thumbnail {height: 190px; width: 150px}
.ProductThumbnailBrowse .Thumbnail .ThumbnailPhoto {border: 1px solid #aaaaaa; height:150px; margin-left: 3px; margin-right: 3px; margin-bottom: 5px; text-align: center;}
.ProductThumbnailBrowse .Thumbnail .ThumbnailProductName {text-align: center; padding-top: 3px; height: 40px; }