/*****************************************
	W.J.Edwards CSS	by nwonline.co.uk
*****************************************/

body { background: #012258 url('../images/site/bg-body.jpg') repeat-x;	font-family: "Arial", Gadget, sans-serif; margin: 10px 0 0 0}

/*components*/
#index-wrapper {width:981px;height:auto;margin:0 auto}
#navbox {height:183px;width:981px;margin:0 auto}
#header {width:981px;height:183px;background:url('../images/site/HEADER.jpg') 0 0 no-repeat;}
#maincontent{width:981px;height:auto;background:#FFF;float: left}
#leftcontent {width:630px;float:left;padding:10px 0 20px 10px;}
#rightcontent {width:725px;float:right;padding:15px}
#legalcontent {width:900px;height:auto;float:left;background: #fff;padding: 25px 40px;}
#rightcol {float: right; position: relative; width: 310px; padding: 10px 10px 0 0}

.aligncenter { margin: 0 auto; width: 408px }

/*footer*/
#footer{ width: 981px; height: 30px; background: url('../images/site/foot-bg.jpg') repeat-x;	border-top: 1px solid #ccc; clear:both; padding: 5px 0; color: #6b8db3; font: bold 12px sans-serif; float: left;}
#footer a { color: #2873b2;font: bold 12px sans-serif;}
#footer a:hover { text-decoration: underline;}
.footer_gen_links-left { float: left;padding: 10px;}
.footer_gen_links-right { float: right;padding: 10px;}

/* typography */
p {color: #666; font: normal 12px/20px sans-serif;}
a:link, a:visited {	text-decoration: none;}
a:hover, a:active { text-decoration: underline;}

address { font: normal 12px/19px sans-serif; color: #666; font-style: italic;}
em { font: normal 12px/19px sans-serif; font-style: italic;}

#leftcontent ul { clear: both; padding: 10px 0; width: 590px; list-style-type: disc ; list-style: disc; margin: 0;}
#leftcontent ol { clear: both; padding: 10px 0; width: 590px; list-style-type: decimal; list-style: decimal; margin: 0;}
#leftcontent ul li { font: normal 12px/19px sans-serif; color: #666; list-style-type: disc; list-style: disc; margin: 0 0 0 30px}
#leftcontent ol li { font: normal 12px/19px sans-serif; color: #666; list-style-type: decimal; list-style: decimal; margin: 0 0 0 30px}

#legalcontent ul { clear: both; padding: 10px 0; width: 590px; list-style-type: disc ; list-style: disc; margin: 0;}
#legalcontent ol { clear: both; padding: 10px 0; width: 590px; list-style-type: decimal; list-style: decimal; margin: 0;}
#legalcontent ul li { font: normal 12px/19px sans-serif; color: #666; list-style-type: disc; list-style: disc; margin: 0 0 0 30px}
#legalcontent ol li { font: normal 12px/19px sans-serif; color: #666; list-style-type: decimal; list-style: decimal; margin: 0 0 0 30px}

/*GMap*/
span#gmap { float: right; position: relative; right: 150px; width: 256px; height: 160px; padding: 2px; border: 1px solid #ccc;}
span#gmap:hover { cursor: pointer; border: 1px solid #666;}
span#gmap img { border: none;}
span#gmap img a { border: none;}

/*headers*/
h1 { color: #275589; font: normal 30px/35px "Times New Roman", Times, serif; letter-spacing: -1px; text-transform: capitalize; font-variant: small-caps;}

h2 { font: bold 12px sans-serif; color: #039; padding: 5px 10px 0 0;}
h4 { font: normal 12px sans-serif;}

/* nav bar */
.navigation-wrapper { width: 981px; background: #FFF; float: left; font-family: Arial, Helvetica, sans-serif; background: #efefef url('../images/site/nav_bg_full.jpg') no-repeat;}
#topmenu { height: 43px; width: 981px; float: left; width: 971px; float: left; margin: 0 0 0 10px}
#topmenu li { float: left; position: relative; font: bold 12px/43px sans-serif; list-style: none;}
#topmenu li a { font: bold 12px/43px sans-serif; display: block; padding: 0 10px; color: #29588c; text-decoration: none; margin: 0 0 0 1px;}
#topmenu li a.selected, 
#topmenu li a:hover{ color: #fff; background: url('../images/site/nav_hover.jpg') 0 0 repeat-x;}

/*Contact Page*/
#contact-form_dup { width: 460px; padding: 15px 10px 10px 10px; float: left; margin: 10px 0; background: #F7F7F7; border-top: 1px solid #dedede; border-bottom: 1px solid #ccc; overflow: hidden;}
#contact-form_dup form { float: left; width: 300px; margin: 0 0 0 40px; }
#contact-form_dup label { width: 220px; float: left; clear: both; font: normal 12px/26px sans-serif; color: #666;}
#contact-form_dup label#textarea{ width: 220px; float: left; clear: both; font: normal 12px/26px sans-serif; color: #666; height: 110px;}
#contact-form_dup label.full { width: 440px;}
#contact-form_dup input { float: left; font: normal 12px/21px sans-serif; color: #666; width: 260px; margin: 2px 0; padding: 2px 4px;}
#contact-form_dup input[type=submit] {width: auto !important; border: none; background: #036; color: #fff; font-weight: bold; padding: 0 5px; height: 30px; line-height: 30px !important; cursor: pointer;}
#contact-form_dup input[type=submit]:hover { background: #069;}
#contact-form_dup .submit { width: 90px; float: right; margin: 0; clear: both;} 
#contact-form_dup textarea { font: normal 12px/18px sans-serif; color: #666; padding: 4px; float: left; width: 260px; height: 110px; margin: 0;}	
#contact-form_dup select { font: normal 12px/23px sans-serif; color: #666; height: 23px; float: right; width: 272px; margin: 0;}
#contact-form_dup small { font: normal 11px/34px sans-serif; color: #666;}
#contact-form_dup em { font-style: italic;}

/*Drop Down*/
#topmenu li ul {list-style: none;position: absolute;visibility: hidden;overflow: hidden;top: 43px;left: 1px;float: left;z-index: 100;padding: 5px 10px 10px 10px;width: 180px;background: #002650 url('../images/site/nav_li_ul.jpg') 0 0 repeat-x !important;margin: 0 !important;text-align: left; z-index: 10 !important; border-top: 1px solid #036;}
#topmenu li.hover ul,
#topmenu li:hover ul { visibility:visible;  z-index: 10 !important}
#topmenu li li {margin: 0 !important;padding:0 !important;text-align: left;height: 30px !important;float: left;clear: both;width: 180px;font: bold 12px/30px sans-serif !important; background: url('../images/site/png_dn.png') 0 28px repeat-x;}
#topmenu li li:first-child { border: none !important;}
#topmenu li li a {font: bold 12px/30px sans-serif !important;width: 180px !important;color: #FFF;margin: 0;padding: 0 10px !important;text-decoration: none;}
#topmenu li li a:hover {color: #fff !important;text-decoration: underline !important; background: transparent !important;}

/*contact fields*/
.contactfield {	border: #999 1px solid; font: normal 12px/20px sans-serif; width: 194px; padding: 2px}	
.contactlabel { clear: left; padding: 2px; display: inline; float: left; margin: 0 10px 10px 0; width: 150px; color: #033; font: normal 12px/20px sans-serif}
.contactfieldwrap {	margin-bottom: 5px}

/*right col*/
.right-col-box-wrapper-1 { width: 320px; height: 125px; padding: 0;	margin: 0 0 10px 0;	float: left; background: url('../images/site/north-west.jpg') no-repeat; border: 1px solid #CCC;}
.right-col-box-container-1 { width: 200px; height: 55px; padding: 60px 10px 10px 10px; margin: 0; float: left;}

/*left col nav*/
#leftcol_short { float: left; width: 212px; padding: 20px 0 20px 10px;}
#leftcol_short ul { list-style-type: none; font: bold 12px/24px sans-serif;}
#leftcol_short li { float: left; position: relative; clear: both; display: block; width: 212px;}
#leftcol_short li a { border-top: 1px solid #fff; border-bottom: 1px solid #ccc; padding: 0 0 0 30px; display: block; background: #eee url('../images/site/chevron.jpg') 10px 8px no-repeat; color: #666;}
#leftcol_short li a:hover{ background: #fff url('../images/site/chevron.jpg') 10px 8px no-repeat; color: #2171af;}
#leftcol_short li#bot { background: url('../images/site/left_nav_bot.jpg') 0 0 no-repeat; height: 12px;}
#leftcol_short li#top { background: url('../images/site/left_nav_top.jpg') 0 0 no-repeat; height: 35px;}
#leftcol_short li#top { font: bold 12px/35px sans-serif; color: #29588c; padding: 0 0 0 10px; border-bottom: 1px solid #ccc; width: 202px;}

#leftcol_short li ul { float: left; position: relative; clear: both; display: block; width: 212px; list-style-type: none; font: bold 12px/24px sans-serif; left: 0; border-bottom: 1px solid #ccc; border-top: 1px solid #fff;}
#leftcol_short li ul li {float: left; position: relative; clear: both; display: block; width: 212px;}
#leftcol_short li ul li a { border: none; padding: 0 0 0 30px; display: block; background: #f9f9f9 url('../images/site/chevron2.jpg') 20px 8px no-repeat; color: #666; text-indent: 10px; font: normal 11px/22px Tahoma, sans-serif;}

#leftcol_short li ul li a:hover { background: #eee url('../images/site/chevron2.jpg') 20px 8px no-repeat; color: #2171af;}


/*Homepage Boxes*/
#hp_boxwrap { width: 981px; height: 180px; position: relative;}
#hp_boxwrap ul { list-style-type: none; padding: 10px;}
#hp_boxwrap li { width: 274px; height: 135px; position: relative; float: left; background: #252525 url('../images/site/hpbg.jpg') center center no-repeat; margin: 0 0 0 15px; padding: 18px;}
#hp_boxwrap li:first-child { margin: 0 !important;}
#hp_boxwrap li h2 { color: #e8e8e8; font: normal 24px/24px "Times New Roman", Times, serif; letter-spacing: -1px; text-transform: capitalize; font-variant: small-caps; margin: 0; padding: 0;}
#hp_boxwrap li p { font: normal 12px/16px sans-serif; color: #ccc;}
#hp_boxwrap li p a { font: bold 12px/16px sans-serif; color: #ccc; text-decoration: underline;}
#hp_boxwrap li p a:hover { font: bold 12px/16px sans-serif; color: #2873b2; text-decoration: none;}

#hp_boxwrap li span.link { position: absolute; float: left; display: block; left: 20px; bottom: 20px; width: 200px; font: bold 12px/20px sans-serif; height: 20px;}
#hp_boxwrap li span.link a { color: #ccc !important; text-decoration: underline; float: left; display: block; position: absolute;}
#hp_boxwrap li span.link a:hover { font: bold 12px/20px sans-serif; color: #2873b2 !important; text-decoration: none;}

#hp_boxwrap li span#ps { width: 130px; height: 90px; position: absolute; right: 0; bottom: 15px; display: block; background: url('../images/site/png_ps.png') 10px 0 no-repeat; z-index: 1}
#hp_boxwrap li span#cs { width: 110px; height: 160px; position: absolute; right: 0; top: 0; display: block; background: url('../images/site/png_jewel.png') 0 0 no-repeat; z-index: 1}
#hp_boxwrap li span#cg { width: 166px; height: 150px; position: absolute; right: -20px; bottom: 0; display: block; background: url('../images/site/png_cg.png') 0 5px no-repeat; z-index: 1}

#hp_boxwrap li span#tl { width:18px; height:18px; position:absolute; left:0; top:0; display: block; background: url('../images/site/span_tl.jpg') 0 0 no-repeat;}
#hp_boxwrap li span#tr { width:18px; height:18px; position:absolute; top:0; right:0; display: block; background: url('../images/site/span_tr.jpg') 0 0 no-repeat;}
#hp_boxwrap li span#bl { width:18px; height:18px; position:absolute; bottom:0; left:0; display: block; background: url('../images/site/span_bl.jpg') 0 0 no-repeat;}
#hp_boxwrap li span#br { width:18px; height:18px; position:absolute; bottom:0; right:0; display: block; background: url('../images/site/span_br.jpg') 0 0 no-repeat;}

/*Right Col Boxes*/
#rightcol ul { list-style-type: none; padding: 0; float: left; clear: both;}
#rightcol li { width: 274px; height: 135px; position: relative; float: left; background: #252525 url('../images/site/hpbg.jpg') center center no-repeat; margin: 10px 0 10px 0; padding: 18px;}
#rightcol li:first-child { margin: 0 !important;}
#rightcol li h2 { color: #e8e8e8; font: normal 18px/20px "Times New Roman", Times, serif; letter-spacing: -1px; text-transform: uppercase;}
#rightcol li h2:first-letter { font: normal 24px/20px "Times New Roman", Times, serif;}
#rightcol li p { font: normal 12px/16px sans-serif; color: #ccc;}
#rightcol li p a { font: bold 12px/16px sans-serif; color: #ccc; text-decoration: underline;}
#rightcol li p a:hover { font: bold 12px/16px sans-serif; color: #2873b2; text-decoration: none;}

#rightcol li span#ps { width: 130px; height: 90px; position: absolute; right: 0; bottom: 15px; display: block; background: url('../images/site/png_ps.png') 0 0 no-repeat; z-index: 1}
#rightcol li span#cs { width: 150px; height: 130px; position: absolute; right: 0; bottom: 0; display: block; background: url('../images/site/png_cs.png') 0 0 no-repeat; z-index: 1}
#rightcol li span#cg { width: 166px; height: 150px; position: absolute; right: -20px; bottom: 0; display: block; background: url('../images/site/png_cg.png') 0 0 no-repeat; z-index: 1}

#rightcol li span#tl { width:18px; height:18px; position:absolute; left:0; top:0; display: block; background: url('../images/site/span_tl.jpg') 0 0 no-repeat;}
#rightcol li span#tr { width:18px; height:18px; position:absolute; top:0; right:0; display: block; background: url('../images/site/span_tr.jpg') 0 0 no-repeat;}
#rightcol li span#bl { width:18px; height:18px; position:absolute; bottom:0; left:0; display: block; background: url('../images/site/span_bl.jpg') 0 0 no-repeat;}
#rightcol li span#br { width:18px; height:18px; position:absolute; bottom:0; right:0; display: block; background: url('../images/site/span_br.jpg') 0 0 no-repeat;}

#rightcol li#store {background: url('../images/site/rc_store.jpg') 0 -20px no-repeat; min-height: 180px;}
#rightcol li#store p a:hover { color: #000;}

#rightcol li#store span#tl { width:18px; height:18px; position:absolute; left:0; top:0; display: block; background: url('../images/site/png_tl.png') 0 0 no-repeat;}
#rightcol li#store span#tr { width:18px; height:18px; position:absolute; top:0; right:0; display: block; background: url('../images/site/png_tr.png') 0 0 no-repeat;}
#rightcol li#store span#bl { width:18px; height:18px; position:absolute; bottom:0; left:0; display: block; background: url('../images/site/png_bl.png') 0 0 no-repeat;}
#rightcol li#store span#br { width:18px; height:18px; position:absolute; bottom:0; right:0; display: block; background: url('../images/site/png_br.png') 0 0 no-repeat;}

#rightcol li#store_img { margin: 0; padding: 0;}

/*Homepage Products*/
#rightcontent #homepage_products { float: left; width: 720px;}
#rightcontent #homepage_products li { width: 130px; height: 200px; float: left; padding: 5px; margin: 0 4px 0 0;}
#rightcontent #homepage_products li:last-child { margin: 0 !important;}
#rightcontent #homepage_products li#last-child { margin: 0 !important;}
#rightcontent #homepage_products li img { background: #fff; padding: 2px; border: 1px solid #ccc;}
#rightcontent #homepage_products li a { display: block; foat: left; position: relative; clear: both; font: normal 12px/20px sans-serif; text-align: center; color: #29588c;}

/*Product Details*/
#rightcontent #pd_leftwrap{ width: 380px; float: left; position: relative; padding: 0;}
#rightcontent #pd_description { width: 380px; float: left; position: relative; padding: 0 0 10px 0; border-bottom: 1px dotted #ccc;}
#rightcontent #pd_image { width: 300px; height: 300px; float: right; position: relative; border: 1px solid #ccc; text-align:center; right: 10px;}
#rightcontent #pd_image img { width: 280px; height: 280px; border: none;}
#rightcontent .pd_component { width: 380px; float: left; position: relative; clear: both; padding: 10px 0 10px 0; border-bottom: 1px dotted #ccc;}
#rightcontent .pd_component p { font: normal 12px/27px sans-serif; margin: 0; padding: 0}
#rightcontent .pd_component small { font: normal 11px/27px "Tahoma", sans-serif; color: #ACACAC;}
#rightcontent .pd_component big { font: normal 21px/27px "Times New Roman", Times, serif; color: #29588c; letter-spacing: -1px;}
#rightcontent .pd_component abbr { cursor:help; background: url('../images/site/dotted.jpg') 0 bottom repeat-x;}
#rightcontent .pd_component cite { color: #666; font: normal 18px/27px "Times New Roman", Times, serif;}
#rightcontent .pd_component em { font: italic 11px/24px "Tahoma", sans-serif; color: #a0a0a0; padding: 0 10px}
#rightcontent .pd_component span#enquire a { font: bold 12px/24px sans-serif; color: #fff; background: #29588c; padding: 0 9px; display: block; float: left; }