/*****************************/
/********** Layout ***********/
/*****************************/

/*#wrap{}*/

#banner{
	width:995px;
	margin:8px auto 0 auto;
}
#banner img{border:none;}

#container{
	width:995px;
	margin:5px auto 0 auto;
	border:none;
	border-collapse:collapse;
	overflow:hidden;
	background:transparent url(/images/CatWeb/bg_side.gif) repeat-y;
}

#sidebar{
	width:225px; /* Use this to change the width of the left menu */
	color:#000;
	border-top:3px solid #000099;
	float:left;
	padding-left:10px;
}

#sidebar_section{
	margin:20px 0px;
	padding:0px;
	width:216px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

#content{
	width:748px;
	border-top:3px solid #000099;
	float:right;
}

#footer{
	width:995px;
	margin-left:auto;
	margin-right:auto;
	background:transparent url(/images/CatWeb/bg_footer.gif) no-repeat;
}

#footer ol,#footer ul {
	list-style: none;
}

/*****************************/
/********** General **********/
/*****************************/

body{
	color:#000;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	margin:0;
	padding:0;
	background-color:#fff;
}

#main-page body{
	color:#000;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	background-image:url(/images/CatWeb/bg.gif);
	margin:0;
	padding:0;
}

p{
	font-size:8pt;
}
.content{
	height:100%;
}
.copyright {
	font-size:7pt;
}
a:link{
	text-decoration:none;
	color:#26237A;
}
a:visited{
	text-decoration:none;
}
a:hover, a:active{
	color:#ED1E22;
	text-decoration:none;
}
h1, a.text{
	font-style:italic;
}
h1{
	font-size:15pt;
	color:#26237A;
}
a.text{
	font-size:11pt;
}
h2{
	font-size:12pt;
}
.formtext{ font-size:8pt}
a.visible{ text-decoration:underline}
a.visible:link{ text-decoration:underline}
a.visible:visited{ text-decoration:underline}
/*a.visible:hover{ color:#16624B; text-decoration:underline}
a.visible:active{ color:#16624B; text-decoration:underline}*/
li{
	color:#000;
}
.bold{
	font-weight:bold;
	color:#ED1E22;
}
img.link{
	cursor:pointer;
}

/*****************************/
/********** Banner ***********/
/*****************************/

/*p.bannerdate{}*/

tr.bannerlinks{
	background-color:#26237A;
}

a.bannerlinks{
	color:#000;
	font-weight:bold;
}

a.bannerlinks:hover{ color:white; text-decoration:underline}
a.bannerlinks:active{ color:white; text-decoration:underline}

#banner-wrap{
	border:3px solid #000099;
	margin-top:8px;
	padding:2px;
	height:30px;
	background-color:#fff;
}

#banner-msg{
	height:25px;
	float:right;
	width:525px;
	margin-bottom:15px;
	font-size:8pt;
	padding:5px 5px 0 10px;
	color:#fff;
	background-color:#26237A;
	text-align:right;
}

#banner-menu{
	height:30px;
	float:left;
	width:445px;
	background-color:#26237A;
}

#viewingmode{
	float:right;
}

/*****************************/
/******* General Page ********/
/*****************************/

p.text, li.text{
	color:#000;
	font-size:8pt;
}
table.extratext{
	text-align:center;
	font-size:8pt;
	border:1px solid #000099;
	border-collapse:collapse;
}

td.extratext{
	background-color:#3CA6F0;
	color:#fff;
}

/*****************************/
/**** Log In & New Users *****/
/*****************************/

#loginarea{
	width:255px;
	float:left;
	margin:10px 5px 0 25px;
	font-size:8pt;
	border:1px solid #000099;
}

#loginarea h3{
	color:#fff;
	background-color:#26237A;
	font-weight:normal;
	text-align:center;
	padding:0.5em;
	margin:0 0 0.5em 0;
}

#loginform{
	padding:5px;
}

#browseform{
	padding:5px;
}

#browseform .text{
	text-align:center;
}

#new-user-area{
	width:400px;
	float:right;
	margin:10px 25px 25px 0;
	font-size:8pt;
	border:1px solid #000099;
}

#new-user-area h3{
	color:#fff;
	background-color:#26237A;
	font-weight:normal;
	text-align:center;
	padding:0.5em;
	margin:0 0 0.5em 0;
}

#new-user-area h3{
	color:#fff;
}

/*table.new_users{
	text-align:center;
}*/

tr.new_users{
	height:10px;
}

td.new_users_title{
	width:100px;
}

td.new_users_detail{
	width:300px;
}

#new-user{
	padding:0 5px 5px 5px;
}

/*****************************/
/***** Main Page / Menus *****/
/*****************************/

.mainmenu{
	margin-left:auto;
	margin-right:auto;
}

a.menu, h2.menu{
	color:#26237A;
}
a.menu:hover{
	color:#ED1E22;
}

/*h2.submenu{}*/

/*****************************/
/********* Left Menu *********/
/*****************************/

/* Note leftmenu is the products & links section within the leftmenubar */

/*table.leftmenu, td.leftmenubar{*/
	/*width:220px;*/ /* Use this to change the width of the left menu */
/*}*/

.leftmenu{
	font-size:8pt;
}

/*table.leftmenu{}*/

p.leftmenu, a.leftmenu{
	font-weight:bold;
	width:110px; /* This also affects left menu width */
}

a.leftmenu{
	text-decoration:none;
}

td.leftmenutop{
	font-size:8pt;
}

input.leftmenubox{
	width:175px;
}

td.leftmenu{
	width:35px;
	text-align:center;
}

td.leftmenutext{
	width:250px;
}

p.lefttext{
	text-align:center;
	color:#26237A;
	font-size:7pt;
}

tr.bar{
	/*background:url(/images/CatWeb/bar.gif) repeat-x;*/
	height:4px;
}

tr.spacer{
	height:10px;
}

#accord{
	width:200px;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}

#accord p{
	text-align:center;
}

#accord a{
	text-decoration:none;
}

/*****************************/
/******* Login Screen ********/
/*****************************/

.sublabel{
	font-size:8pt;
	font-weight:bold;
}

.label{
	color:#000;
	font-size:8pt;
}

input.viewbutton{
	color:white;
	background-color:#fff;
	font-weight:bold;
	width:146px;
}

/*****************************/
/********** Footer ***********/
/*****************************/

#footer .nav li {
	margin-top:20px;
	float:left;
	padding-right:30px;
}

#footer .nav li a {
	color:#000;
	text-decoration:none;
}

#footer .nav li a:hover {
	text-decoration:underline;
}

#footer p {
	float:right;
	margin-top:20px;
}


/*#links ul{
	padding-left: 10px;
	margin: 0 0 5px 0;
}
#links  li{
	display:inline;
	font-size:8pt;
	color:#fff;
}
#links a, #links a:visited{
	color:#fff;
	text-decoration:none;
}
#links a:hover{
	color:#252668;
	text-decoration:underline;
}*/
#powered{
	margin-top:30px;
	margin-left:0px;
	text-align:center;
	font-size:8pt;
	width:220px;
	margin-left:auto;
	margin-right:auto;
	float:left;
}
#powered a, #powered a{
	color:#26237A;
	text-decoration:underline;
}
#powered a:hover, #powered a:active, #powered a:link{
	color:#ED1E22;
}
/*
#links{
	width:648px;
	float:right;
}
*/

/*****************************/
/** Product / Offers Tables **/
/*****************************/

table#main-table, table#specials-table, table#prev-orders, table#totals{
	width:710px;
	border-collapse:collapse;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	font-size:8pt;
}

#pop table#main-table{
	width:648px;
	border-collapse:collapse;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	font-size:8pt;
}

table#totals{
	border:1px solid #000099;
}

/* For each table the column widths need to add up to 100%
   Main table */
table#main-table #qty{width:12%;}
table#main-table #prod-code{width:8%;}
table#main-table #prod-desc{width:26%;}
table#main-table #spec-offer{width:6%;}
table#main-table #pack-size{width:11%;}
table#main-table #price-p-pack{width:8%;}
table#main-table #rrp{width:8%;}
table#main-table #vat{width:5%;}
table#main-table #line-msg{width:6%;}
table#main-table #avail-stock{width:10%;}
/* Specials */
table#specials-table #prod-code{width:10%;}
table#specials-table #prod-desc{width:30%;}
table#specials-table #ord-type{width:29%;}
table#specials-table #start-date{width:11%;}
table#specials-table #end-date{width:11%;}
table#specials-table #scheme{width:9%;}
/* Prev Orders */
table#prev-orders #order{width:15%;}
table#prev-orders #deliv-date{width:20%;}
table#prev-orders #day{width:15%;}
table#prev-orders #value{width:15%;}
table#prev-orders #ord-type{width:15%;}
table#prev-orders #status{width:20%;}
/* Totals */
table#totals #order-tag{width:20%;}
table#totals #order{width:13%;}
table#totals #items-tag{width:23%;}
table#totals #items{width:10%;}
table#totals #price-tag{width:15%;}
table#totals #price{width:18%;}

#main-table td,#specials-table td,#prev-orders td{
	border:1px solid #000099;
	background-color:#fff;
	padding:3px;
}

#pop #main-table td{
	color:#006;
}

#main-table th,#specials-table th,#prev-orders th{
	background-color:#26237A;
	color:#fff;
	padding:10px 0 10px 0;
	text-align:center;
	border:1px solid #26237A;
}

#prev-orders a,#specials-table a{
	text-decoration:underline;
}

#totals td{
	background-color:#26237A;
	color:#fff;
	padding:10px 10px 10px 0;
}

/* Colour of the alternate rows, comment out if not required */
#main-table tr.alt td{
	color:#000;
	background-color:#EDEFF5;
}

td.r{
	text-align:right;
}

td.l{
	text-align:left;
}

tr.coltotal{
	text-align:center;
	background-color:#26237A;
	line-height:110%;
	color:#fff;
}

p.coltotal{
	text-align:center;
	font-weight:bold;
}

input.coltotal{
	background-color:#26237A;
	font-weight:bold;
	color:#FFD800;
	border-collapse:collapse;
	border:0;
}

/*input.box, option.box{}*/

/******************************************/
/********* Product Image Popup ********** */
/******************************************/
/*** Credits: Dynamic Drive CSS Library ***/
/*** http://www.dynamicdrive.com/style/ ***/
/******************************************/

.thumb, .thumb-sub{
	position:relative;
	z-index:0;
	font-size:8pt;
	display:block;
}

.thumb:visited, .thumb:active, .thumb:link{
	color:#000;
}

.thumb:hover, .thumb-sub:hover{
	background-color:transparent;
	z-index:9999;
	color:#000;    
}

/*CSS for enlarged image*/
.thumb span, .thumb-sub span{
	position:absolute;
	background-color:#fff;
	padding:5px 9px 5px 5px;
	left:-1000px;
	visibility:hidden;
	color:#000;
	text-decoration:none;
	border:medium double #26237A;
	width:300px;
}

/*CSS for enlarged image*/
.thumb span img, .thumb-sub span img{
	border-width:0;
	padding:2px;
}

/*CSS for enlarged image on hover*/
.thumb:hover span, .thumb-sub:hover span{
	visibility:visible;
	top:0px;
	left:50px;
}

div.prodimage{
	position:absolute;
	border:medium double gray;
	background-color:white;
}

img.prodimage{
	width:300px;
	height:300px;
}

p.prodimage{
	width:300px;
	height:300px;
	text-align:center;
	position:relative;
	top:35%;
	color:black;
}

/*table.links{}*/

/*****************************/
/******** Popup Boxes ********/
/*****************************/

#pop .text{
	color:#000;
	font-size:8pt;
}

#pop a, #pop li, #pop p{color:#fff;}

table.pop{
	background-color:#26237A;
	border-collapse:collapse;
	border:1px solid #fff;
}

tr.popheader{
	background-color:#26237A;
	color:#fff;
	text-align:center;
	font-weight:bold;
}

/*p.popheader{}*/

body.popbody{
	color:#000;
	text-align:center;
}

img.popbody{ 
	width:200px;
	height:200px;
}

/*****************************/
/******* Order Submit ********/
/*****************************/

p.tabletext, p.subtabletext, td.tabletext{
	color:#000;
}

/*p.subtabletext{}*/

.subtabletext, .submit td{
	color:#000;
	font-size:8pt;
	font-weight:bold;
}

a.pagebottom{
	color:#000;
}

#terms{
	width:500px;
	margin-left:auto;
	margin-right:auto;
	font-size:8pt;
	text-align:center;
	padding-bottom:10px;
}

.link:visited{
	color:#000;
}

/*****************************/
/********* Buttons ***********/
/*****************************/

input.buttons {
	background: none no-repeat top left;
	border: none;
	cursor: pointer;
	display: block;
	height: 22px;
	overflow: hidden;
	padding: 0;
	margin: 0 2px 0 0;
	text-indent: -9999px;
	width: auto;
}

input.viewingMode{
	background-image: url(/images/CatWeb/buttons_icons/viewmode.gif);
	width: 22px;
}