/*
	Style sheet for Foot Care Supplies
	Last updated: 21/04/2008
*/


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Layout  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

@font-face
{
    font-family: 'MyriadWebProBold';
    src: url('myriadwebpro-bold-webfont.eot');
    src: local('☺'), url('myriadwebpro-bold-webfont.woff') format('woff'), url('myriadwebpro-bold-webfont.ttf') format('truetype'), url('myriadwebpro-bold-webfont.svg#webfontaMYW8fu9') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'MyriadWebProRegular';
    src: url('myriadwebpro-webfont.eot');
    src: local('☺'), url('myriadwebpro-webfont.woff') format('woff'), url('myriadwebpro-webfont.ttf') format('truetype'), url('myriadwebpro-webfont.svg#webfontQuDBU310') format('svg');
    font-weight: normal;
    font-style: normal;
}


.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12
{
    display: inline;
    float: left;
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
}
.grid_1
{
    width: 60px;
}
.grid_2
{
    width: 140px;
}
.grid_3
{
    width: 220px;
}
.grid_4
{
    width: 300px;
}
.grid_5
{
    width: 380px;
}
.grid_6
{
    width: 460px;
}
.grid_7
{
    width: 540px;
}
.grid_8
{
    width: 620px;
}
.grid_9
{
    width: 700px;
}
.grid_10
{
    width: 780px;
}
.grid_11
{
    width: 860px;
}
.grid_12
{
    width: 940px;
}




*
{
    margin: 0;
    padding: 0;
}

html
{
    background: transparent url(/media/bg.gif) repeat-x;
}

body
{
    font-family: Arial, Helvetica, sans-serif;
    background: url(/media/shadow.png) repeat-y center;
    _background: none;
    text-align: center;
    font-size: 85%;
    color: #333;
}

#wrapper
{
    margin: 0px auto;
    width: 960px;
    background: #fff;
    text-align: left;
}

#header p.logo
{
    float: left;
    display: inline;
    margin: 10px 0;
}
#header p.helpline
{
    color: #666;
    float: right;
    margin: 10px 0 0;
    font-size: 90%;
}

#header p.helpline a
{
    color: #666;
    text-decoration: underline;
}
#header p.helpline a:hover
{
    text-decoration: none; ;}

#header p.helpline span
{
    font-size: 150%;
    color: #fff;
}

#header .header-grad
{
    background: #EDEBE8; /* this is needed for fallback on non supportive browsers */
    background: -moz-linear-gradient(90deg, #ddd9d3, #ffffff);
    background: -webkit-gradient(linear, left bottom, left top, from(#ddd9d3), to(#ffffff));
    -pie-background: no-repeat, linear-gradient(90deg, #ddd9d3, #ffffff);
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    border: 2px solid #C4C0BF;
    behavior: url(/js/PIE.htc);
    float: right;
    clear: right;
    margin: 10px 0;
    color: #004863;
    font-size: 95%;
    position: relative;
    width: 627px;
    height: 70px;
}

#header .header-grad li
{
    float: left;
    display: inline;
    list-style-type: none;
    padding: 0 10px 0 0;
    margin: 10px 0 10px 10px;
    height: 50px;
}

#header .header-grad a
{
    color: #666;
    font-size: 90%;
    text-decoration: underline;
}

#header .header-grad a:hover
{
    text-decoration: none;
}

#header .header-grad .searchform
{
    width: 185px;
    border-right: 1px solid #ccc;
    padding-left: 35px;
    background: url(/media/ico_search.png) no-repeat top left;
}
#header .header-grad .checkout
{
    width: 140px;
    border-right: 1px solid #ccc;
    padding-left: 35px;
    background: url(/media/ico_basket.png) no-repeat top left;
}
#header .header-grad .MyAccount
{
    width: 130px;
    background: url(/media/ico_user.png) no-repeat top left;
    padding-left: 35px;
}

#header .header-grad img
{
    vertical-align: middle;
    float: left;
    display: inline;
    margin-right: 10px;
}

#header .header-grad .title
{
    margin-bottom: 10px;
}

#header .header-grad .title a
{
    color: #004863;
    font-weight: 700;
    font-size: 110%;
    text-decoration: none;
}

#header .header-grad form
{
    float: left;
    display: inline;
    position: relative;
}

#header .header-grad form .button
{
    position: absolute;
    right: -25px;
    top: 0;
    padding: 0.1em;
}

#header input#Keyword
{
    color: #999999;
    border: none;
}

#header .strap
{
    clear: left;
    color: #00A89E;
    float: left;
    display: inline;
    font-style: italic;
    font-weight: 700;
    margin-left: 167px;
    margin-top: -10px;
}

div.Banner
{
    float: right;
    padding: 0 15px;
    text-align: right;
    background: #ffffff url(/media/banners/footcare.bg.jpg) no-repeat;
    width: 960px;
    height: 211px;
    display: none;
    overflow: hidden;
}

div.ShoeOrthotics
{
    background-image: url(/media/banners/shoe-orthotics-banner.jpg);
}
div.GelCushions
{
    background-image: url(/media/banners/GELBUNION.jpg);
}
div.InstrumentsAndFiles
{
    background-image: url(/media/banners/banner_tools.jpg);
}
div.FootTreatments
{
    background-image: url(/media/banners/footcare.bg.jpg);
}
div.GelPads
{
    background-image: url(/media/banners/banner_gelpads.jpg);
}

div.Category
{
    float: right;
    padding: 0 15px;
    text-align: right;
    background: #ffffff url(/media/banners/footcare.bg.jpg) no-repeat;
    width: 960px;
    height: 211px;
}
div.homeonly
{
    display: none;
}
body#home div.homeonly
{
    display: block;
    overflow: hidden;
}

div.Category
{
    display: none;
}

body#Cat7 div.ShoeOrthotics
{
    background-image: url(/media/banners/shoe-orthotics-banner.jpg);
    display: block;
}
body#Cat4 div.GelCushions
{
    background-image: url(/media/banners/banner_gelpads.jpg);
    display: block;
}
body#Cat9 div.InstrumentsAndFiles
{
    background-image: url(/media/banners/blade.jpg);
    display: block;
}
body#Cat1 div.GelProtection
{
    background-image: url(/media/banners/Gel-Protection.jpg);
    display: block;
}
body#Cat5 div.ShoeInserts
{
    background-image: url(/media/banners/shoeinserts.jpg);
    display: block;
}
body#Cat6 div.LeatherPads
{
    background-image: url(/media/banners/leather-pads.jpg);
    display: block;
}
body#Cat8 div.Dressings
{
    background-image: url(/media/banners/Dressings.jpg);
    display: block;
}
body#Cat10 div.FootTreatments
{
    background-image: url(/media/banners/footcare.bg.jpg);
    display: block;
}
body#Cat11 div.HeelProtection
{
    background-image: url(/media/banners/heel.jpg);
    display: block;
}
body#Cat17 div.Socks
{
    background-image: url(/media/banners/socks.jpg);
    display: block;
}
body#Cat18 div.Splints
{
    background-image: url(/media/banners/splints.jpg);
    display: block;
}
body#Cat19 div.BunionProtection
{
    background-image: url(/media/banners/bunnion.jpg);
    display: block;
}

div.Banner h1, div.Category h1
{
    font-size: 220%;
    color: #FD8100;
    background: none;
    margin: 0 0 0 500px;
    padding: 0;
    line-height: 40px;
}

div.Banner p, div.Category p
{
    font-size: 130%;
    color: #666;
    text-align: right;
    margin: 0 0 0 380px;
}

#navigation div.Banner a, #navigation div.Category a
{
    background: url("/media/button.png") repeat scroll 0 0 transparent;
    bottom: 0;
    color: #FFFFFF;
    display: block;
    float: right;
    font-size: 130%;
    height: 44px;
    line-height: 42px;
    margin: 0 15px 15px 0;
    position: absolute;
    right: 0;
    text-align: center;
    text-shadow: 1px 1px 3px #CECECE;
    width: 176px;
}


#navigation div.Category
{
    position: relative;
    z-index: 4;
}
#navigation div.Category a
{
    position: absolute;
}

.promotional
{
    text-transform: uppercase;
    color: #666;
    padding: 2px 0 10px;
    float: left;
    display: inline;
    width: 960px;
}
.promotional p
{
    font-size: 85%;
    text-align: center;
}
.promotional p img
{
    vertical-align: -6px;
}

#banner
{
    width: 960px;
    text-align: center;
    position: relative;
}
#banner .slide
{
    border-bottom: 10px solid #0E4862;
    width: 940px;
    margin: 0 auto;
    height: 199px;
    overflow: hidden;
    position: relative;
}

#banner .prev, #banner .next
{
    background-color: #0E4862;
    color: #faaf42;
    position: absolute;
    font-weight: 700;
    font-size: 135%;
    top: 35%;
    z-index: 10;
}

#banner .prev
{
    left: 0;
    -moz-border-radius: 0 30px 30px 0;
    -webkit-border-radius: 0 30px 30px 0;
    border-radius: 0 30px 30px 0;
    behavior: url(/js/PIE.htc);
    padding: 20px 10px 20px 5px;
}

#banner .next
{
    right: 0;
    -moz-border-radius: 30px 0 0 30px;
    -webkit-border-radius: 30px 0 0 30px;
    border-radius: 30px 0 0 30px;
    behavior: url(/js/PIE.htc);
    padding: 20px 5px 20px 10px;
}

#banner .advice
{
    float: right;
    margin: 10px;
}
#banner .advice .advicedd
{
    border: 1px solid #ccc;
}

#sidenavigation
{
    display: none;
}

#leftnavigation
{
    display: none;
}

#rightnavigation
{
    display: none;
    width: 200px;
    padding: 10px 10px 10px 10px;
}

#rightnavigation select
{
    width: 193px;
    font-size: 80%;
    margin: 32px 0 0 0;
}
#rightnavigation option
{
    font-size: 80%;
}

#maincontent
{
    width: 960px;
}

#maincontent h1, #maincontent h2, #maincontent h3, #maincontent h4, #maincontent h5, #maincontent h6, #maincontent p
{
    padding: 10px;
}

#maincontent li
{
    margin-left: 40px;
    padding: 0;
}

#maincontent ol
{
    font-size: 150%;
    color: #0E4862;
}
#maincontent ol a
{
    font-size: 65%;
}

#maincontent .highlightsection
{
}
#maincontent .footbg {background-color:#fff;}

#maincontent .footbg div
{
	overflow:hidden;
	position:relative;
}

#maincontent .footbg div * {
	position:relative;z-index:999;
}

#maincontent .footbg div img {position:absolute;right:-80px;top:0;z-index:0;}

#maincontent .top5 div
{
    height: 232px;
}
#maincontent .highlightsection h3
{
    color: #0E4862;
    font-size: 170%;
}

#maincontent .highlightsection h3 span
{
    color: #0E4862;
    font-size: 70%;
}

#maincontent .highlightsection h3 .circle
{
    color: #E67F28;
    font-size: 100%;
    padding: 4px 10px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    position: relative;
    behavior: url(/js/PIE.htc);
    background-color: #0E4862;
}



#maincontent .highlightsection div
{
    background-color: #fff;
}

.highlightsection .cbox
{
    margin-left: 10px;
    position: relative;
    box-shadow: 0 0 5px #CCCCCC;
    -webkit-box-shadow: 0 0 5px #CCCCCC;
    -moz-box-shadow: 0 0 5px #CCCCCC;
    border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    display: inline;
    float: left;
    list-style-type: none;
    margin: 0 10px 20px;
    overflow: hidden;
    background: #ddd9d3; /* this is needed for fallback on non supportive browsers */
    background: -moz-linear-gradient(90deg, #ddd9d3, #ffffff);
    background: -webkit-gradient(linear, left bottom, left top, from(#ddd9d3), to(#ffffff));
    -pie-background: no-repeat, linear-gradient(90deg, #ddd9d3, #ffffff);
    behavior: url(/js/PIE.htc);
}

#maincontent .highlightsection .cbox div
{
    border: 1px solid #cccccc;
    margin: 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    behavior: url(/js/PIE.htc);
    background-color: #fff;
    position: relative;
}

#maincontent .highlightsection .cbox h3
{
    padding-bottom: 0;
}

#maincontent .highlightsection .cbox.delivery div
{
    background: url("/media/ico_delivery-truck.gif") no-repeat scroll 97% 5px #FFFFFF;
    height: 115px;
}

#maincontent .highlightsection .cbox.catalogue div
{
    background: url("/media/ico_catalogue.gif") no-repeat scroll 95% 49% #FFFFFF;
    height: 115px;
}

div.CBox
{
    border: 1px solid #ccc;
    margin: 10px;
}

div.CBox table td
{
    background: #eee; /* this is needed for fallback on non supportive browsers */
}

div.CBox table td a img
{
    border: 1px solid #ccc;
    margin: 10px 0 10px 10px;
}

#rightnavigation div.CBox
{
    width: 190px;
    padding: 10px 5px;
}

#rightnavigation div.CBox h1
{
    font-size: 130%;
}

/*
div.basket h2 {
background:url("/media/basket.gif") no-repeat scroll 100% 2px;
}

*/


#rightnavigation div.ccwrapper
{
    width: 200px;
}

div.advicepages
{
    background: url("/media/search.jpg") no-repeat scroll 0 0 transparent;
    height: 118px;
    padding: 0 0 0 6px;
    width: 194px;
}

div.advicepages h2
{
    margin: 0 0 0 3px;
    padding: 0;
}


body#home div.endorsements
{
    display: none;
}

ul.categories
{
    float: left;
    display: inline;
    margin: 0;
}
ul.categories div.ccwrapper
{
    float: left;
    display: inline;
}
#maincontent ul.categories li
{
    margin-left: 10px;
    position: relative;
    box-shadow: 0 0 5px #CCCCCC;
    -webkit-box-shadow: 0 0 5px #CCCCCC;
    -moz-box-shadow: 0 0 5px #ccc;
    border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px 8px 8px 8px;
    -webkit-border-radius: 8px 8px 8px 8px;
    display: inline;
    float: left;
    list-style-type: none;
    margin: 0 10px 20px;
    overflow: hidden;
    background: #ddd9d3; /* this is needed for fallback on non supportive browsers */
    background: -moz-linear-gradient(90deg, #ddd9d3, #ffffff);
    background: -webkit-gradient(linear, left bottom, left top, from(#ddd9d3), to(#ffffff));
    -pie-background: no-repeat, linear-gradient(90deg, #ddd9d3, #ffffff);
    behavior: url(/js/PIE.htc);
}

ul.categories li div
{
    position: relative;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    width: 128px;
    margin: 5px;
    padding: 0;
    border: 1px solid #cccccc;
    background-color: #ffffff;
    height: 115px;
    overflow: hidden;
    behavior: url(/js/PIE.htc);
}

#maincontent ul.categories li h2
{
    padding: 2px;
    font-size: 100%;
    text-align: center;
}

#maincontent .categories .infobutton
{
    background-color: #0E4862;
    border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;
    behavior: url(/js/PIE.htc);
    bottom: 5px;
    color: #F6992C;
    font-size: 80%;
    font-weight: 700;
    padding: 2px 4px;
    position: absolute;
    right: 5px;
    text-decoration: none;
}

ul.categories li div.autoPadDiv
{
    text-align: center;
}

#maincontent ul.categories li h2 a
{
    display: block;
    color: #0E4862;
    text-decoration: none;
}
ul.categories li img
{
    text-align: center;
}


#footer
{
    position: relative;
    z-index: 1;
    font-size: 85%;
    background-color: #0E4862;
    color: #fff;
    padding: 0 0 10px;
}

#footer .highlight
{
    background-color: #33B9B1;
    padding: 10px;
    margin-bottom: 10px;
}
#footer .highlight img
{
    vertical-align: -12px;
}
#footer .highlight a
{
    font-size: 200%;
    color: #0E4862;
}
#footer .cards
{
    float: left;
    padding: 0 0 10px;
    display: inline;
}
#footer .cards li
{
    float: left;
    display: inline;
    border: none;
    margin: 0 7px 3px 0;
    padding: 0;
    width: auto;
}
#footer .cards li img
{
    width: 53px;
}

#footer p
{
    margin: 10px 0;
}


#footer .footertreat
{
    float: right;
    margin: 19px 112px 0 0;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Typography */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

h1, h2, h3, h4, h5, h6
{
    font-family: 'MyriadWebProBold';
    color: #00a89e;
	line-height: 1;
}

h2, h3, h4, h5, h6
{
    font-size: 120%;
    line-height: 1;
}

h1.categorytitle{font-family: 'Reenie Beanie', arial, serif; color:#fd8100; font-size:300%; font-weight: bold; margin-bottom: -10px;}
.alignright
{
    text-align: right;
}

.alignmiddle
{
    text-align: center;
}


ul
{
    margin-left: 30px;
}




ul li
{
    list-style-type: square;
}

#footer ul
{
    margin: 0;
}

#footer li
{
    border-bottom: 1px dashed #E67F28;
    float: left;
    display: inline;
    list-style-type: none;
    margin: 0 10px;
    width: 120px;
    padding: 8px 0 8px 10px;
}
.small
{
    font-size: 85%;
}

.large
{
    font-size: 140%;
}

.bold
{
    font-weight: 700;
}


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Link Styles */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */



sup
{
    font-size: 70%;
}

a
{
    text-decoration: none;
    color: #E67F28;
}

a:hover
{
}


#footer a
{
    text-decoration: none;
    color: #fff;
}

#footer a:hover
{
    text-decoration: none;
    color: #eee;
}

.sitecredit
{
    background-color: #0E4862;
    display: block;
    width: 960px;
    font-size: 80%;
    text-decoration: none;
    text-align: center;
    padding: 10px 0;
    margin: 0 auto;
    color: #ffffff;
}



#maincontent a
{
    text-decoration: underline;
}


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Extra Bits */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
.sitemap
{
    margin-left: 30px;
}

.sitemapsub
{
    margin-left: 15px;
}

th
{
    padding: 5px 5px 5px 5px;
    background-color: #004863;
    color: #E67F28;
}

td
{
    vertical-align: top;
}

.storebutton
{
    background-color: #782587;
    border: none;
    color: #fff;
    font-weight: bold;
    padding: 5px;
    margin: 5px 0 5px 0;
}

.storebuttonlink
{
    text-align: center;
    padding: 5px;
    margin: 5px 0 5px 0;
    display: block;
    background-color: #782587;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
}

.storebutton:hover
{
    background-color: #ccc;
    cursor: pointer;
    color: #fff;
    text-decoration: none;
}

.storebuttonlink:hover
{
    background-color: #ccc;
    cursor: pointer;
    color: #fff;
    text-decoration: none;
}

.purple
{
    width: 207px;
}
.purple h2
{
    background: url('/media/purple-icon.gif') no-repeat;
    color: #782587;
    padding: 4px 0 0 35px;
    margin: 0 0 0 4px;
    height: 31px;
}
.purple p
{
    color: #782587;
    margin: 5px 10px 5px 10px;
}

.purple ul
{
    font-size: 90%;
    margin: 0 0 0 22px;
}

.purple li
{
    color: #782587;
    list-style-image: url('/media/purple-li.gif');
}

.purple strong
{
    color: #782587;
}
.purple a.button
{
    padding: 5px;
    background-color: #782587;
    color: #fff;
    font-weight: bold;
}
.purple a:hover.button
{
    background-color: #ccc;
    text-decoration: none;
}
.purple input.textbox
{
    border: 1px solid #ccc;
    color: #782587;
    width: 178px;
    font-size: 85%;
}
.purple input.button
{
    background-color: #782587;
    border: none;
    color: #fff;
    font-weight: bold;
    padding: 3px;
    margin: 5px 0 5px 0;
}
.purple input:hover.button
{
    background-color: #ccc;
    cursor: pointer;
}
.purple td.top
{
    background: url('/media/purple-top.gif') no-repeat;
    height: 8px;
}
.purple td.mid
{
    background: url('/media/purple-mid.gif') repeat-y;
}
.purple td.bottom
{
    background: url('/media/purple-bottom.gif') repeat-y;
    height: 8px;
}

.shopnav
{
    width: 940px;
    margin: 10px;
    background-color: #004863;
    color: #fff;
}

.shopnav td
{
    padding: 3px 0;
    text-align: center !important;
}

#maincontent .shopnav p
{
    font-size: 85%;
    color: #E67F28;
    margin: 0;
    padding: 0;
    text-align: center;
}

.shopnav strong
{
    color: #fff;
}

.shopnav a
{
    color: #E67F28;
    font-weight: bold;
    text-decoration: underline;
}

.shopnav a:hover
{
    text-decoration: none;
}

.strapline
{
    font-size: 140%;
    color: #ffffff;
}

.hide
{
    height: 0;
    width: 0;
    overflow: hidden;
    position: absolute; /* for the benefit of IE5 Mac */
}

img
{
    border: 0;
}

hr
{
    text-align: center;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #ccc;
    height: 1px;
}

.hiddenclear
{
    clear: both;
    color: #fff;
    font-size: 0;
    visibility: hidden;
}

.padded
{
    padding: 0 0;
}

.left
{
    float: left;
    display: inline;
}

.floatleft
{
    float: left;
    display: inline;
    margin-right: 5px;
}

.floatleftb
{
    float: left;
    display: inline;
    margin-right: 5px;
    border: solid 1px #3399cc;
}

.floatright
{
    float: right;
    margin-left: 5px;
}

.floatrightb
{
    float: right;
    margin-left: 5px;
    border: solid 1px #3399cc;
}

.right
{
    text-align: right;
}

.center
{
    text-align: center;
}

.width100
{
    width: 100px;
}

.purpletext
{
    color: #9973b4;
    font-weight: bold;
}

.purpletext span
{
    color: #9973b4;
    text-align: left;
}


.purpletext em
{
    color: #9973b4;
    text-align: left;
}


.promotional a
{
    color:  #666666;
  
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Forms and fields */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

form
{
}


fieldset
{
    border: 1px solid #782587;
    padding: 15px;
}

legend
{
    font-weight: bold;
    color: #782587;
}

.blurred
{
    border: #ccc 1px solid;
    padding: 2px;
}

.focused
{
    border: #cc0000 1px solid;
    padding: 2px;
}


#sidenavigation form
{
    font-size: 85%;
}

#nEmailAddress
{
    margin: 3px 0 3px 0;
}
#password
{
    margin: 3px 0 3px 0;
}
#emailaddress
{
    margin: 3px 0 3px 0;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Top Nav */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

#topnav
{
    float: left;
    display: inline;
    clear: both;
    margin: 0 9px;
    width: 940px;
    border: 1px solid #c4c0bf;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background-color: #EDEBE8; /* this is needed for fallback on non supportive browsers */
    background-image: -moz-linear-gradient(90deg, #ddd9d3, #ffffff);
    background-image: -webkit-gradient(linear, left bottom, left top, from(#ddd9d3), to(#ffffff));
    -pie-background: no-repeat, linear-gradient(90deg, #ddd9d3, #ffffff);
    behavior: url(/js/PIE.htc);
    position: relative;
    z-index: 2;
}



#topnav li
{
    float: left;
    display: inline;
    list-style-type: none;
}

#topnav a
{
    color: #004863;
    float: left;
    display: inline;
    padding: 0.5em 1.80em;
    behavior: url(/js/PIE.htc);
    border-right: 1px solid #c4c0bf;
    white-space: nowrap;
}

#topnav .first a
{
    -webkit-border-radius: 8px 0 0 8px;
    -moz-border-radius: 8px 0 0 8px;
    border-radius: 8px 0 0 8px;
    behavior: url(/js/PIE.htc);
}

#topnav .last a
{
    -webkit-border-radius: 0 8px 8px 0;
    -moz-border-radius: 0 8px 8px 0;
    border-radius: 0 8px 8px 0;
    behavior: url(/js/PIE.htc);
    border-right: none;
}

#topnav a:hover
{
    background-color: #ddd9d3; /* this is needed for fallback on non supportive browsers */
    background-image: -moz-linear-gradient(90deg, #ddd9d3, #F0F0F0);
    background-image: -webkit-gradient(linear, left bottom, left top, from(#ddd9d3), to(#F0F0F0));
    -pie-background: no-repeat, linear-gradient(90deg, #ddd9d3, #F0F0F0);
    behavior: url(/js/PIE.htc);
}

#navigation #catnav
{
    z-index: 1;
    position: relative;
    top: -10px;
    float: left;
    display: inline;
    width: 940px;
    margin: 0 9px;
    background-color: #004863;
    padding: 11px 0 0;
    border: 1px solid #1d75bc;
    border-top: none;
    -webkit-border-radius: 0 0 8px 8px;
    -moz-border-radius: 0 0 8px 8px;
    border-radius: 0 0 8px 8px;
    behavior: url(/js/PIE.htc);
}

#navigation #catnav li
{
    display: inline;
}

#navigation #catnav li a
{
    padding: 5px 6px;
    font-size: 80%;
    color: #fff;
    float: left;
    display: inline;
}

#navigation #catnav li a:hover
{
    color: #ccc;
}

#navigation
{
    background: none;
    height: 25px;
    text-align: center;
    vertical-align: middle;
}





/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Side Nav */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

#sidenav
{
    width: 160px;
    text-align: left;
}

#sidenav ul
{
}

#sidenav li
{
    margin: 8px 0 0 0;
    list-style: none;
    color: #005bac;
}

#sidenav li a
{
    display: block;
    background: #fff;
    text-decoration: none;
    font-weight: bold;
}

#sidenav li.sub
{
    font-size: 91%;
    list-style: circle;
    list-style-position: outside;
    border: none;
    text-align: left;
}

#sidenav ul.sub
{
}

#sidenav li.subsub
{
    font-size: 91%;
    list-style: disc;
    list-style-position: outside;
    border: none;
    text-align: left;
    color: #3399cc;
}

#sidenav ul.subsub
{
}

#sidenav li a:link
{
    color: #3399cc;
}

#sidenav li a:visited
{
    color: #3399cc;
}

#sidenav li a:hover
{
    color: #782587;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
.button
{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #e67f28;
    color: #ffffff;
    background: #e67f28;
    background: -moz-linear-gradient(90deg, #f1b02d, #e67f28);
    background: -webkit-gradient(linear, left bottom, left top, from(#f1b02d), to(#e67f28));
    -pie-background: no-repeat, linear-gradient(90deg, #f1b02d, #e67f28);
    behavior: url(/js/PIE.htc);
    cursor: pointer;
    float:left;
    margin: 10px 10px 0 0;
	padding:4px 10px;
    overflow: visible;
    position: relative;
    text-align: center;
    text-decoration: none !important;
}

.button:hover
{
    /* Set the text colour and background of the button on hover */
}

form.form label, form.form input
{
    display: block;
    float: left;
    display: inline;
    margin-bottom: 10px;
}

form.form label
{
    width: 150px;
}

form.form input
{
    width: 180px;
    padding: 2px;
}

input
{
    padding: 2px;
}

input, select, textarea
{
    border-radius: 5px;
    background: #fff;
    _behavior: none;
    padding: 4px 5px 3px;
    border: 1px solid #ccc;
    position: relative;
}

form.form input.checkbox
{
    width: auto;
    margin-top: 5px;
    padding: 0;
}

form.form input.button
{
    margin-left: 148px;
    width: auto;
    float: none;
}

form.form a
{
    margin-left: 148px;
    display: block;
}

form.form br
{
    clear: left;
}



.clearboth
{
    clear: both;
}

div.featuredbox {border: 2px solid #ccc; float:right; width:380px; margin: 0 0 10px 0; }
div.featuredbox img.product {float:right; padding:5px;}
#maincontent div.featuredbox h2 {padding: 10px 10px 5px 10px;}
div.featuredbox p {font-size:90%;}
div.featuredbox p.price {color: #f36523; font-weight:bold; font-size:120%;}
div.featuredbox img.info {float:left; padding:0 0 10px 5px;}
div.recommended {background:url(../media/flash.png) no-repeat; height:102px;
width:121px; position: absolute; right:-30px; top:-15px;}