/* mac hide \*/
html, body {height:100%}
/* end hide*/
body {
padding:0;
margin:0;
background:#f5f5f5; /* background colour of left navigation area */
color: #000000;
font-family: Ariel, Verdana, Sans-Serif;
font-size: 95%;
}
#outer{
min-height:100%;/*for mozilla as IE treats height as min-height anyway*/
margin-left:160px;
background:#ffffff; /* background colour of main content area */
border-left:1px solid #999;
border-right:1px solid #999;
margin-bottom:-22px;
color: #000000;
}
* html #outer{ /* ie 3 pixel jog*/
height:100%;
/*margin-left:157px*/
}
#header{
position:absolute;
top:0;
left:0;
width:100%;
height:77px;
border-top:1px solid #999;
border-bottom:1px solid #999;
overflow:hidden;
color: #000000;
background-color:#CC9966;
}
#header_inner{
padding-left:10px;
padding-top:10px;
padding-right:10px;
padding-bottom:10px;
font-size: 130%;
font-weight: bold;
color: #fff;
}
/* START OF LEFT NAVIGATION */
/* ------------------------ */
#left {
position:relative;/*ie needs this to show float */
width:159px;
float:left;
margin-left:-158px;/*must be 1px less than width otherwise won't push footer down */
padding-top:80px;/*needed to make room for header*/
left:-1px;/* line things up exactly*/
}
* html #left{
margin-right:-3px; /* three pixel jog*/
}
/*
#left ul{
list-style:none;
margin-left:-1px;
border-left:0px;
padding-left:0px;
padding-top:0px;
margin-top:0px;
}
#left li a{
background-color: #f3f3f3;
line-height:20px;
list-style-type: none;
text-decoration:none;
width:151px;
display:block;
border-bottom:1px solid #999;
margin-left:0px;
padding-left:5px;
/*padding-top:1px;*/
/*padding-bottom:1px;*/
/*
font-size:80%;
font-weight:bold;
}
#left a:hover{
background-color: #ffffff;
}
*/
/* RULES FOR THE "MENUDIV" OBJECT */
/* An absolutely positioned and hidden DIV (treated as a layer in NS4). */
.menudiv {
position: absolute;
visibility: hidden;
z-index: 1000;
border: 2px outset #FFFFCC;
/* Borders: Top Right Bottom Left */
border-color: #999 #999 #999 #999;
background-color: #f5f5f5;
/* layer-background-color is non-standard and NS4 only. */
layer-background-color: #f5f5f5;
padding: 6px;
font-size: 70%;
font-family: verdana, sans-serif;
/* Here's a cool effect, try uncommenting this, althought it's non-standard: */
/* filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8 */
}
/* Formatting to apply to the elements inside the "menudiv" class elements. */
/* Of course, you can put whatever you want within the menu divs, these are just examples. */
.menudiv .header {
width: 100%;
font-weight: bold;
text-align: center;
border-bottom: 2px dashed #999966;
margin-bottom: 5px;
}
.menudiv a {
display: block;
/* I've specified borders for each side individually so NS4 ignores this setting */
border-top: 1px solid #999;
border-right: 1px solid #999;
border-bottom: 1px solid #999;
border-left: 1px solid #999;
color: #f5f5f5;
text-indent: 5px;
text-decoration: none;
}
/* I'm using :hover and :active pseudo-classes for link mouse effects. */
.menudiv a:hover {
border: 1px solid #999;
border-color: #999 #999 #999 #99;
background-color: #fff;
color: #FFFFFF;
}
.menudiv a:active {
border: 1px solid #999;
border-color: #999 #999 #999 #999;
background-color: #f5f5f5;
color: #FFFFFF;
font-size: 70%;
font-family: Ariel, Verdana, Sans-Serif;
}
/*
The script will automatically assign a class of "highlighted" to elements that currently
have an active submenu, so here's a little CSS to format links within a .menudiv element.
*/
.menudiv .highlighted {
background-color: #000;
border-color: #999;
color: #FFFFFF;
}
/* The links in the upper-left that pop out 'divMenu' menus. */
.trigger a {
font-size: 70%;
font-family: Ariel, Verdana, Sans-Serif;
color: #003366;
text-decoration: none;
}
/* Likewise, style active trigger links */
.trigger a.highlighted {
color: #CC9966;
}
/* VERTICAL FREESTYLE MENU LAYOUT */
/* All tags in the menu including the first level */
.menulist, .menulist ul {
margin: 0;
padding: 0;
width: 157px;
list-style: none;
}
/* Submenus ( tags) are hidden and absolutely positioned across from their parent */
.menulist ul {
visibility: hidden;
position: absolute;
top: 0;
left: 157px;
}
/*
All menu items (- tags) are relatively positioned to correctly offset their submenus.
They have borders that are slightly overlaid on one another to avoid doubling up.
*/
.menulist li {
position: relative;
border: 1px solid #999;
background: #f5f5f5;
margin-bottom: -1px;
}
.menulist ul>li:last-child {
margin-bottom: 1px;
}
/* Links inside the menu */
.menulist a {
display: block;
padding: 4px;
color: #A60002;
text-decoration: none;
font-size: 70%;
font-family: Ariel, Verdana, Sans-Serif;
font-weight: bold;
}
/*
Lit items: 'hover' is mouseover, 'highlighted' are parent items to visible menus.
*/
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
color: #A60002;
background-color: #fff;
}
.menulist a.highlighted {
color: #A60002;
background-color: #fff;
}
/* 'subind' submenu indicators, which are automatically prepended to 'A' tag contents. */
.menulist a .subind {
float: right;
font-size:65%;
padding-top:2px;
}
/* This semi-commented section exists to fix bugs in IE/Windows (the 'Holly Hack'). \*/
* html .menulist li {
float: left;
height: 1%;
}
* html .menulist a {
height: 1%;
}
/* End Hack */
/* END OF LEFT NAVIGATION */
/* ------------------------ */
#footer {
width:100%;
clear:both;
height:20px;
border-top:1px solid #999;
border-bottom:1px solid #999;
background-color:#CC9966;
color: #000000;
text-align:center;
position:relative;
font-size:65%;
font-weight:bold;
color: #fff;
}
.footer_text{
font-size:65%;
font-weight:bold;
color: #FFFFFF;
}
.footer_text_hit_counter{
font-size:65%;
font-weight:normal;
color: #FFFFFF;
}
#page_title{
background-image: url(../graphics/page_title_tile.jpg);
padding-top:4px;
padding-bottom:5px;
padding-left:10px;
font-size:80%;
font-weight:bold;
}
.page_sub_title{
background-image: url(../graphics/page_title_tile.jpg);
padding-top:4px;
padding-bottom:5px;
padding-left:10px;
font-size:100%;
font-weight:bold;
}
#cart_holder{
float:right;
position:relative;
font-weight:normal;
padding-right:10px;
font-size:80%;
font-style:italic;
}
.section_title{
background-image: url(../graphics/page_title_tile.jpg);
padding-top:4px;
padding-bottom:5px;
padding-left:10px;
font-size:100%;
font-weight:bold;
border-bottom:1px solid #cccccc;
margin-bottom:10px;
}
#page_title_shadow{
background-image: url(../graphics/page_title_shadow.jpg);
height:5px;
display:block;
}
#centrecontent_inner{
padding-left:10px;
padding-top:10px;
padding-right:10px;
padding-bottom:10px;
font-size:77%;
}
#centrecontent_inner td{
font-size:77%;
}
* html #footer {/*only ie gets this style*/
\height:22px;/* for ie5 */
he\ight:20px;/* for ie6 */
}
#clearheader{ /*needed to make room for header*/
height:79px;
}
#clearfooter{ /*needed to make room for footer*/
clear:both;height:40px;
}
div,p{ /*clear top margin for mozilla*/
margin-top:0;
}
* html #centrecontent{ /* combat IE's 3 pixel jog */
height:1%;
margin-bottom:12px;
}
.norm{
font-size:77%;
}
.norm_grey{
font-size:77%;
color:#cccccc;
}
.norm2{
font-size:70%;
}
.admin_table_header{
font-size:77%;
background-color:#F7F7F7;
font-weight:bold;
}
.form_surround_big{
display:block;
background-color:#F7F7F7;
padding:5px;
border: 1px solid #999999;
width:99%;
}
.form_surround_small_1{
display:block;
background-color:#F7F7F7;
padding:5px;
border: 1px solid #999999;
width:35%;
}
.form_surround_small_2{
display:block;
background-color:#F7F7F7;
padding:5px;
border: 1px solid #999999;
width:65%;
}
.form_surround_small_3{
display:block;
background-color:#F7F7F7;
padding:5px;
border: 1px solid #999999;
width:75%;
}
.admin_preview{
width:100%;
height:100%;
padding-left:10px;
padding-right:10px;
background-color:#ffffff;
font-size:77%;
}
.popup_container p{
font-size:77%;
}
.popup_close_link{
font-size:70%;
background-color:#ffffff;
font-weight:bold;
padding-bottom:5px;
}
.popup_close_link a{
text-decoration:none;
}
.popup_page_title{
font-size:80%;
background-color:#F7F7F7;
font-weight:bold;
padding:5px;
background-image: url(../graphics/page_title_tile.jpg);
border-bottom: 1px solid #cccccc;
margin-bottom: 12px;
}
.small_p{
font-size:70%;
}
.small_p2{
font-size:80%;
}
.small_link{
font-size:70%;
text-decoration:none;
}
.small_link a:hover{
text-decoration:underline;
}
.image_title{
font-size:80%;
font-weight:bold;
}
#admin{
border-bottom:1px solid #999;
}
.admin_bar{
background-image: url(../graphics/page_title_tile.jpg);
}
.admin_options{
background-image: url(../graphics/page_title_tile.jpg);
font-size:70%;
}
.admin_link a{
display:block;
background-color:#F7F7F7;
font-size:70%;
padding:3px;
border: 1px solid #cccccc;
}
.admin_link a:hover{
background-color:#ffffff;
border: 1px solid #ff0000;
}
.header_graphic{
background-color:#CC9966;
background-image: url(../graphics/header_images/header_tile.jpg);
}
.padded_container{
padding:10px;
font-size:80%;
}
div.container {
background-color: #fff;
width:99%;
}
div.spacer {
clear: both;
}
div.float {
float: left;
width:49%;
height:285px;
background:#f5f5f5;
background:#ffffff;
margin-bottom:7px;
margin-right:7px;
border:1px solid #E6D29F;
padding:4px;
}
div.product_name_holder{
background:#663333;
display:block;
color:#FFFFFF;
margin-bottom:5px;
padding:3px;
font-weight:bold;
}
.prod_ref_no{
color:#999999;
padding:5px;
font-size:90%;
}
.prod_desc{
padding:5px;
font-size:90%;
}