/*
COLOURS.
Mauve: #336600
Grey: #CCCCCC
*/
/* ------------------- Standard Tags ------------------- */
body { font: 75% Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
margin: 0;
padding: 0;
text-align: center;
color: #000000;
background-image:url(../images/bg3.gif);
background-position: top center;
background-repeat: repeat-y;
}
#shadow { width: 100%;
background-image:url(../images/bg.gif);
background-position: top center;
background-repeat: repeat-y;
}
#shadow_bottom { width: 100%;
height: 15px;
background-image:url(../images/bg2.gif);
background-position: top center;
background-repeat: no-repeat;
}
#container { position: relative;
width: 940px;
margin: 0 auto;
text-align: left;
background-color: #FFFFFF;
background-image: none;
background-repeat: repeat-y;
background-position: right top;
}
hr { color: #336600; height: 1px;}
img border { color: #333333;}
.top h1 { font-size: 80%;
margin:0;
padding:0;
color: #999999;
background-image:url(../images/bg4.gif);
background-position: bottom center;
background-repeat: no-repeat;
height: 20px;
}
h3 { font-family: "Courier New", Courier, mono;}
h6 { font-family: "Courier New", Courier, mono;
margin: 0px 0px 4px 0px;
padding: 0px;
font-size: 160%;
}
a { text-decoration: none; color: #336600;}
a:hover { text-decoration: underline;}
table { font-size: 100%;}
/* ------------------- Standard Tags ------------------- */
/* ------------------- HEADER STUFF ------------------- */
#header { height: 170px;
padding: 0;
color: white;
background-color: #336600;
background-image:url('/08shop/banners/head.jpg');
background-position: top center;
background-repeat:no-repeat;
}
#header #hLeft { float:left;
width:480px;
height: 170px;
}
#header #hRight { float:left;
width: 440px;
height: 170px;
background-image: url(../images/pic_1.jpg);
background-repeat: no-repeat;
background-position: top right;
}
#header #hRight h2 { text-align: right;
font-size: 18px;
margin-top: 20px;
}
#header #hRight input { font-size: 80%; }
.breadcrumb { clear: left;
color: #333333;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
width: 100%;
text-align: right;
font-size: 90%;
height: 20px;
line-height: 20px;
background-image:url(../images/cellFade3.gif);
background-position: center center;
background-repeat: repeat-x;
}
.breadcrumb a { color: #333333;}
/* ------------------- HEADER STUFF ------------------- */
/* ------------------- FOOTER STUFF ------------------- */
#footer_outer { padding: 0;
background-color: #333333;
height: 35px;
clear: right;
background-image:url(../images/cellFade.gif);
background-position: top center;
background-repeat: repeat-x;
}
#footer_inner { padding: 5px;
text-align:center;
font-size: 80%;
color: Black;
}
#footer_inner a { color: Black; }
/* ------------------- FOOTER STUFF ------------------- */
.cellPad { padding: 0px; font-size: 100%;}
/* ------------------- Admin Menu ------------------- */
.admin { background-color: red;
font-weight: bold;
}
.admin ul { margin: 0;
padding: 0;
list-style-type:none;
}
.admin ul li { border-bottom: 1px solid #CC0000;
padding: 2px;
}
.admin a { color: white;
}
.admin a:hover { text-decoration:none;
color: Black;
}
/* ------------------- Admin Menu ------------------- */
/* ------------------- COLUMN STUFF ------------------- */
#main_left { width: 150px;
padding: 0;
margin: 0;
float: right;
}
#main_right { width: 150px;
padding: 0;
margin: 0;
float: left;
}
#main_mid { width: 600px;
margin: 10px;
float: left;
}
#mainContent { margin: 0;
padding: 0;
float: right;
width: 790px;
}
#page { margin: 0px 0px 10px 10px;}
/* ------------------- COLUMN STUFF ------------------- */
.messageBox { font-size: 80%;
border: 1px solid #336600;
background-color: #FFFFFF;
}
.boxTitle { text-align: center;
font-weight: bold;
color: white;
background-color: #336600;
font-size: 160%;
}
.invoiceBox { border: 1px solid #336600;
background-color: white;
border-bottom: none;
font-size: 90%;
}
.invoiceBox td { text-align: right;
border-bottom: 1px solid #336600;
}
.invoiceBox input { font-size: 80%;}
.smallEdit { border: 1px solid #336600;
background-color: white;
font-size: 90%;
}
.smallEdit td { text-align: right;
border-bottom: 1px solid #336600;
}
.smallEdit input { font-size: 90%;}
.smallEdit select { font-size: 90%;}
/* --------------------- Box on right of home page -------------------- */
.right_box { width: 138px;
background-color: White;
margin: 5px;
font-weight: bold;
border: 1px solid #336600;
background-image:url(../images/cellFade2.gif);
background-position: top center;
background-repeat: repeat-x;
}
.right_box div { padding: 4px; text-align: center;}
.right_box a { color: blue; }
.right_box img { border: 1px solid #336600;}
.newsBox { text-align: center;
background-color: #DEDEDE;
width: 138px;
margin: 5px 0px 5px 0px;
border: 1px solid #006633;
}
.newsBox a { color: #666666; font-weight: bold;}
.newsBox div { padding: 4px; text-align: left;}
.newsBox div div { border-top: 1px solid white;}
.newsBox h3 { color: White;
background-color: #666666;
padding: 0;
margin: 0;
line-height: 20px;
text-align: center;
}
/* --------------------- Box on right of home page -------------------- */
.pad { padding: 8px; text-align: center; }
.search { text-align: center;
padding: 2px;
border: 1px solid #333333;
background-color: #CCCCCC;
margin: 15px 8px 8px 8px;
color: #333333;
}
.footLinks { padding:4px; font-size: 120%; }
.warning { font-weight: bold;
font-size: 120%;
background-color: Red;
color: white;
border: 1px solid #000000;
}
.warning2 { font-weight: bold;
background-color: Red;
color: white;
border: 2px solid red;
}
/* -------------------------- Used for listing items and icons ---------------------------- */
.product_list_table td { padding: 4px;
text-align: left;
border: 1px solid #336600;
background-color:#FFFFFF;
font-size: 90%;
width: 25%;
}
.product_list_table a { color: Black; }
.product_list_table .price { font-size:200%;
font-family:Times New Roman, Serif;
color: #666666;
margin: 0;
padding: 3px 0 3px 0;
}
.product_list_table img { border: none; float: left;}
.product_list_table a:hover img {
filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;
}
/* -------------------------- Used for listing items and icons ---------------------------- */
/* -------------------------- icons ---------------------------- */
.icons td { text-align: center;
border: 1px solid #336600;
background-color:#FFFFFF;
font-size: 90%;
width: 25%;
}
.icons td .top { height: 130px;
}
.icons td .top2 { height: 130px;
}
.icons td .top2 img { margin-top: 10px;}
.icons td .btm { background-color: #336600;
width: 100%;
line-height: 20px;
color: White;
font-weight: bold;
font-size: 120%;
}
.icons a { color: Black; }
.icons a img { border: none; margin: 4px;}
.icons a:hover img { filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;
}
/* -------------------------- icons ---------------------------- */
/* -------------------------- XXX ---------------------------- */
.blockList { margin:0px;
padding:0px;
text-align: center;
clear: left;
width: 100%;
font-size: 90%;
}
.blockList UL { padding:0px;
list-style-type: none;
margin: 0px auto 0px auto;
}
.blockList UL LI { display: inline;
margin:15px !important; margin: 18px;
padding: 0px;
float: left;
width: 150px;
height: auto;
text-align: center;
border: 1px solid #336600;
background-color:#FFFFCC;
}
.blockList .prodTop { height: 120px; overflow: hidden;}
.blockList .prodMid { height: 30px; overflow: hidden;}
.blockList UL LI p { margin: 5px; }
.blockList UL LI img { padding: 6px; }
.blockList a { color: #333333; font-weight: bold;}
.blockList .price { font-size: 120%; font-weight: bold;}
/* -------------------------- XXX ---------------------------- */
.productGallery { width: 100%;
border: 1px solid #336600;
background-color:#FFFFCC;
}
.productGallery td { text-align: center; width: 33%; }
/* -------------------------- Photo Gallery ---------------------------- */
.galleryList { margin:0px;
padding:0px;
text-align: center;
clear: left;
width: 100%;
}
.galleryList UL { padding:0px;
list-style-type: none;
margin: auto;
}
.galleryList UL LI { display: inline;
padding: 8px;
width: 110px;
height: 110px;
}
.galleryList UL LI img { border : 1px solid #336600;
padding: 5px;
}
.galleryList a { color: blue;}
/* -------------------------- Photo Gallery ---------------------------- */
.total { font-weight: bold;
text-align: center;
font-size: 140%;
width: 100%;
background-color: white;
margin-top: 20px;
clear: left;
}
.prodLeft { width: 300px;
float: left;
}
.prodRight { width: 280px;
float: left;
text-align: left;
margin-left: 6px;
}
.prodFeedback { color: #336600;}
.basketInput { font-size: 90%;
background-color: #336600;
border: 1px solid #336600;
font-weight: bold;
text-align: center;
}
.basketButton { font-size: 100%;
}
.logIn { height: 160px;
width: 180px;
float: left;
background-image: url(../images/logIn.gif);
}
.contactBox { font-size: 80%;
border: 1px solid #336600;
background-color: #FFFFFF;
}
.contactBox h1 { margin: 0px;
padding: 0px;
font-size: 110%;
margin-bottom: 4px;
}
.oneThird { width: 33%; float: left; }
.oneHalf { width: 82px; float: left; }
.oneThird a { margin: 10px 0px 0px 10px;
}
.messages { border-bottom: 1px solid #CCC; }
.notes { font-size: 80%; }
.blogs { border-bottom: 4px solid #FFF; }
.blogBox { font-size: 80%;
border: 1px solid #006699;
background-color: #FFFFFF;
color: #999999;
}
.blog_grid { background-color: #DEDEFF; }
/* ----------------------- Admin --------------------------- */
.adminBox { background-color: #FFFFDE;
border: 1px solid #336600;
text-align: left;
}
.adminBox th { background-color: #333333;
color: White;
font-weight: bold;
background-image:url(../images/cellFade.gif);
background-position: top center;
}
.adminBox th a { background-color: red; color: White; }
/* ----------------------- Admin --------------------------- */
/* ------------------- list grids ------------------- */
.product_grid { border: 1px solid #336600;
background-color: White;
font-size: 100%;
margin-bottom: 20px;
margin-top: 20px;
}
.product_grid th { background-color: #FFFFFF;
color: #000000;
font-size: 120%;
font-weight: bold;
}
.product_grid select { font-size: 90%;
background-color: #336600;
border: 1px solid #336600;
}
.product_grid input { font-size: 90%; }
.product_grid td { border-bottom: 1px solid #336600;
}
.prodCell { border-bottom: 1px solid #336600; }
.colHeads { background-color: White;
color: #000000;
text-align: left;
background-image:url(../images/cellFade.gif);
background-position: top center;
background-repeat: repeat-x;
}
.colHeads a { color: #336600;
font-weight: bold;
}
.pagerStyle { color: #333333;
text-align: center;
font-weight: bold;
background-color: #333333;
}
.pagerStyle a { color: white;
}
/* ------------------- list grids ------------------- */
/* ------------------- basket summary ------------------- */
.sBasket { width: 138px;
background-color: #FFFFFF;
color: Black;
font-weight: bold;
margin-top: 6px;
border: 1px solid #336600;
background-image:url(../images/cellFade3.gif);
background-position: bottom center;
background-repeat: repeat-x;
}
.sBasket div {
}
.sBasket a { color: Black;
text-decoration: underline;
}
.sBasket h3 { color: #336600;}
.sBasketBottom { height: 20px;
width: 138px;
text-align:center;
}
.sBasket_grid { border-top: 1px solid #336600;
text-align: left;
font-size: 90%;
margin: 3px 0px 5px 0px;
}
.sBasket_grid th { font-size: 80%;
font-weight: normal;
border-bottom: 1px solid #336600;
}
/* ------------------- basket summary ------------------- */
.contacts { border:1px solid #999999; }
.contacts th { background-color:#CCCCCC;font-size:110%; }
.counterBox { height: 22px;
line-height: 22px;
width: 140px;
margin: 24px 0px 4px 10px;
background-color: #336600;
font-weight: bold;
text-align: center;
color: #FFFFFF;
}
.quick_login { font-size: 80%;
border: 1px solid #666666;
background-color: #FFFFFF;
color: #333333;
width: 140px;
margin: 14px auto 4px auto;
}
.quick_login th { font-size: 120%;
background-color: #336600;
text-align:center;
}
.quick_login input{ font-size: 90%;
}
.also { width: 100%; border: 1px solid #333333;background-color:#336600;}
.also td { text-align: center; vertical-align: top; font-size:90%;width:25%;}
.filterBox { border: 1px solid #999999;
background-color: #CCCCCC;
margin-bottom: 4px;
text-align: center;
}
.filterBox a { line-height:14px;
margin: 2px 0 2px 0;
}
/* ------------------- Front Page Scrolling ------------------- */
.scroller{}
#marqueecontainer{ position: relative;
overflow: hidden;
height: 86px;
width: 586px;
border: 1px solid #C2B7F6;
margin: auto;
background-color: White;
}
#vmarqueeX { width: 98%;
position: absolute;
width: 665px;
}
#vmarqueeX div { margin: 5px;
font-size: 95%;
width: 665px;
}
#vmarqueeX a { margin-right: 20px;
}
#vmarquee { width: 98%;
position: absolute;
width: 665px;
}
#vmarquee div { margin: 5px;
font-size: 95%;
width: 665px;
}
#vmarquee a { margin-right: 20px;
}
/* ------------------- Front Page Scrolling ------------------- */
#navigation { margin-top: 10px;}
#navigation ul.AspNet-Menu /* Tier 1 */
{
width: 150px; /* This is more than (6em x 2) because we want to leave room for borders around the <li> elements that are selected */
background: #FFFFCC;
}
#navigation ul.AspNet-Menu ul /* Tier 2 */
{
width: 150px;
top: 0;
left: 150px;
background-color: #FFFFCC;
border: 1px solid #CCCCCC;
}
#navigation ul.AspNet-Menu ul ul /* Tier 3+ */
{
top: 0;
left: 150px;
background-color: #FFFFCC;
}
#navigation li /* all list items */
{
width: 150px;
background-image:url(../images/bullet.gif);
background-position: center left;
background-repeat:no-repeat;
}
/* list items being hovered over */
#navigation li:hover,
#navigation li.AspNet-Menu-Hover
{
background-image:url(../images/bullet2.gif);
}
#navigation a, /* all anchors and spans (nodes with no link) */
#navigation span
{
color: #666666;
padding: 5px 2px 5px 32px;
background: transparent url(../images/arr.gif) right center no-repeat;
}
#navigation li.AspNet-Menu-Leaf a, /* leaves */
#navigation li.AspNet-Menu-Leaf span
{
background-image: none !important;
}
#navigation li:hover a, /* hovered text */
#navigation li:hover span,
#navigation li.AspNet-Menu-Hover a,
#navigation li.AspNet-Menu-Hover span,
#navigation li:hover li:hover a,
#navigation li:hover li:hover span,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover a,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover span,
#navigation li:hover li:hover li:hover a,
#navigation li:hover li:hover li:hover span,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover li.AspNet-Menu-Hover a,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover li.AspNet-Menu-Hover span
{
color: red;
text-decoration: underline;
background: #FFFFFF url(../images/arr.gif) right center no-repeat;
}
#navigation li:hover li a, /* the tier above this one is hovered */
#navigation li:hover li span,
#navigation li.AspNet-Menu-Hover li a,
#navigation li.AspNet-Menu-Hover li span,
#navigation li:hover li:hover li a,
#navigation li:hover li:hover li span,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover li a,
#navigation li.AspNet-Menu-Hover li.AspNet-Menu-Hover li span
{
color: red;
background: transparent url(../images/arr.gif) right center no-repeat;
}
#navigation .AspNet-Menu-Selected,
#navigation .AspNet-Menu-ChildSelected,
#navigation .AspNet-Menu-ParentSelected
{
background-image:url(../images/bullet2.gif);
font-weight: bold;
}
.key_list { margin-left: 0px;}
.key_list li { margin-left: 16px;}
.slideshow { margin: auto;
}
.slideshow img { border: 1px solid #000000;
background-color: #DEDEDE;
padding: 2px;
}