@CHARSET "ISO-8859-1";

/** The following colours are used most commonly:
 *
 * #99ccdd -- for borders, edges and other lines  ( pale blue )
 *
 * #447788 -- for headings and active links ( dark blue )
 *
 * #222222 -- for "white" text
 *
 * #dddddd -- for "black" text 
 *
 * #aa5555 -- for "red" text (e.g. error messages)
 */

body * {margin:0; padding:0;}

body {font-size: 0.8em; font-family: "lucida grande", tahoma, verdana, arial, sans-serif; color:#222222; margin:0; padding:0px 0 0 0px;width:800px;}

/** The layout of the two main columns*/
#maincontent   {clear:both; padding-top:5px;}
#twocolumnsone {float:left; width:100px; padding:10px; }
#twocolumnstwo {float:left; width:659px; padding:10px; border-left:solid 1px #99ccdd; }

/** The layout and colours for the header and footer components */
#header { background-image: url('../images/background.png'); background-repeat: repeat-x; height:3em; padding: 0.5em 0 0 0.5em;}
#footer {clear:both;}

.special {font-weight: bold;}

a         { color:#447788; text-decoration:none;}
a:visited { color:#447788; text-decoration:none;}
a:hover   { color:#447788; text-decoration:underline;}

div { margin:0;}
h1 { clear:both; font-size: 1.3em; font-weight:bold; padding:5px; margin-bottom:0.5em; border-bottom:solid 1px #99ccdd; text-transform:capitalize; }
h2 { clear:both; font-size: 1.2em; font-weight:bold; padding:5px; margin-bottom:0.5em; border-bottom:solid 1px #99ccdd; text-transform:capitalize; }
h3 { clear:both; font-size: 1.1em; font-weight:bold; padding:5px; margin-bottom:0.5em; text-transform:capitalize; }

p { margin-bottom:0.75em;}

#tabs      {float:left;clear:both; padding-top:2px; padding-left:10px; border-bottom:solid 1px #99ccdd;}
.tab       {background-color:#ffffff; float:left; font-size:1.1em; padding:10px; font-weight:bold;border:solid 1px #ffffff;}
.tab:hover {color:#000000; background-image: url('../images/background-on.png'); background-repeat: repeat-x; text-decoration:underline; border:solid 1px #99ccdd;}
.tab:hover a {color:#000000;}
.tabSmall {float:right; font-size:0.9em; padding:10px; font-weight:bold;}

#tabs #selected {color:#000000; background-image: url('../images/background-on.png'); background-repeat: repeat-x; border:solid 1px #99ccdd;}

.lefthandmenuitem       {padding-left:4px; color:#447788; background-color:#ffffff;}
.lefthandmenuitem:hover {color:#000000; background-color:#99ccdd;text-decoration:underline;}
.lefthandmenuitem:hover a {color:#000000;}


/** The flashes are the boxes that appear telling the user if something good or bad has happened */
#flashgood, #flashbad, #flashwarn {margin:5px; padding:5px;font-weight:bold; min-height: 14px; padding:10px 0 10px 34px;}
#flashgood {color:#225522; border:solid 2px #99ddcc; font-weight:bold; background-color:#eeffee; background-image: url('../images/icons/flashgood24.png'); background-repeat:no-repeat; background-position: 5px 5px;}
#flashwarn {color:#DE7613; border:solid 2px #DE7613; font-weight:bold; background-color:#FEDEAE; background-image: url('../images/icons/flashwarn24.png'); background-repeat:no-repeat; background-position: 5px 5px;}
#flashbad  {color:#552222; border:solid 2px #ddcc99; font-weight:bold; background-color:#ffeeee; background-image: url('../images/icons/flashbad24.png'); background-repeat:no-repeat; background-position: 5px 5px;}

/** The clearing style, to help stop things floating */
.clearing {clear:both; height:1px;}


/** HTML tables */
table {border-spacing:0px;margin-bottom:0.5em;}
table td {padding:5px; border-bottom:solid 1px #cccccc;}
table th {padding:5px; text-align:left;}

table tr.totalrow td {font-weight:bold;border-top:solid 2px #333333; border-bottom:solid 2px #333333;}

/** Specific tables */
table.daysheet tr:hover  {background-color:#cceeff;}



/** Images */
a img {border:none;}


/* Form styles */
.row {padding-bottom:5px;display:block;clear:both;margin-bottom:5px;}
.button {background-color:#99ccdd; color:#222222; font-weight: bolf;}
form label {float:left; width:150px;}
form input {width:150px;}
form .error {color:#aa5555; border:solid 1px #aa5555; margin:5px 0 2px 0; padding:5px; width:300px; padding-left:22px; background-color:#ffeeee; background-image: url("../images/icons/formerror16.png"); background-repeat: no-repeat; background-position: 3px;}
form textarea {width:500px;height:200px;font-size:9pt;}
	
.indent {padding-left:10px;display:block;}

.semibox {width:310px;padding:10px 5px 5px 10px;border:solid 1px #99ccdd; }

.box     {padding:5px;border:solid 1px #99ccdd;margin-bottom:5px; clear:left; }

.rightbox {padding:5px;margin-left:5px;border:solid 1px #99ccdd; float:right; max-width:320px; }

.boxheader {display:inline; font-weight: bold; font-size: 1.1em; }
.boxexpander {float:right;}


/** ICONS -- all left padding is the image size, in pixels, plus another 3 pixels */
h2.icon {padding-left:35px; background-repeat:no-repeat;min-height:32px }

h2.bookings {background-image:url("../images/icons/bookings32.png"); }
h2.email {background-image:url("../images/icons/email32.png"); }
h2.info {background-image:url("../images/icons/info32.png"); }
h2.login {background-image:url("../images/icons/login32.png"); }
h2.newuser {background-image:url("../images/icons/newuser32.png"); }
h2.reports {background-image:url("../images/icons/reports32.png"); }
h2.special {background-image:url("../images/icons/special32.png"); }
h2.stylesheet {background-image:url("../images/icons/stylesheet32.png");}
h2.help {background-image:url("../images/icons/help32.png");}
h2.customerlink {background-image:url("../images/icons/customerlink32.png");}


h3.icon {padding-left:27px;background-repeat:no-repeat;}

h3.email {background-image:url("../images/icons/email24.png");}
h3.info {background-image:url("../images/icons/info24.png");}
h3.bookings {background-image:url("../images/icons/bookings24.png");}
h3.reports {background-image:url("../images/icons/reports24.png");}
h3.setup   {background-image:url("../images/icons/setup24.png");}
h3.special {background-image:url("../images/icons/special24.png");}
h3.stylesheet {background-image:url("../images/icons/stylesheet24.png");}
h3.help {background-image:url("../images/icons/help24.png");}
h3.customerlink {background-image:url("../images/icons/customerlink24.png");}

td.icon {padding-left:20px;background-repeat:no-repeat;background-position:3px; }

td.cancelled {background-image:url("../images/icons/cancelled16.png");}






