html {width: 100%; height: 100%;}
body {width: 100%; height: 100%; margin: 0; padding: 0; color: #000; background: #CCC; font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-size: 13px;}
div#wrapper {height: 100%; margin: 0 auto; width: 760px;}
div#nav-band {float: left; display: inline;}
div#nav-band img {float: left; display: inline;}
form.nomarg {margin: 0; padding: 0;}
input.greensubmit {background: #2F372A; border: 1px #FFF solid; color: #FFF;}

/* Header */
div#header {float: left; width: 760px; background: #FFF;}
div#strapline {float: left; display: inline; width: 191px; \width: 203px; w\idth: 191px; height: 36px; \height: 54px; he\ight: 36px; padding: 18px 0 0 12px;}

/* Suckerfish Nav
---------------------------------------------------------- */
div#nav-wrap {float: left; display: inline; width: 760px; background: #405A76; height: 2.5em;}
#nav, #nav ul { /* all lists */padding: 0; margin: 0; list-style: none; width: 740px;}
#nav {float: left; margin: 5px 0 0 6px; padding: 0 0 4px 0;}
#nav a {display: block; width: auto;}
li.headli {height: 22px; margin: 0 0 0 0px; padding: 2px 0 3px 0; }
li.headli a.toplevel {color: #FFF; text-decoration: none; padding: 0px 6px; border-right: 1px solid #99a; }
li.headli a.toplevel:link {}
li.headli a.toplevel:visited {}
li.headli a.toplevel:hover {}
li.headli a.toplevel:active {}
li.headli a.last { border: 0; }
#nav li { /* all list items */position: relative; float: left; width: auto; /* width needed or else Opera goes nuts */}
#nav li ul { /* second-level lists */position: absolute; display: block; top: 17px; padding: 10px; width: auto; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */}
#nav li ul li {clear: both; display: block; width: 11em; color: #FFF; font-size: 95%;}
#nav li ul li a {width: 8em;}
#nav li ul li a:link {color: #FFF; background: #405A76; text-decoration: none; margin: 0; padding: 3px;}
#nav li ul li a:visited {color: #FFF; background: #405A76; text-decoration: none; margin: 0; padding: 3px;}
#nav li ul li a:hover {color: #FFF; background: #607A96; text-decoration: none; margin: 0; padding: 3px;}
#nav li ul li a:active {color: #FFF; background: #405A76; text-decoration: none; margin: 0; padding: 3px;}
#nav li:hover ul, #nav li.sfhover ul {/* lists nested under hovered list items */left: -11px;}

div.rightmenu {float: right; display: inline; margin: 7px 10px 0 0;}
div.rightmenu ul {list-style: none;}
div.rightmenu ul li {display: inline; margin: 0 5px 0 0;}
div.rightmenu a {text-decoration: none; color: #8A8577; font-weight: bold;}

div#content-wrap {float: left; background: #ECEBE0; width: 760px;}

div.adminspace {float: left; padding: 15px; width: 730px; \width: 760px; w\idth: 730px; display: inline;}
div.adminspace h1 {font-size: 160%; margin: 0 0 3px 0; color: #2A4057;}
div.adminspace h2 {font-size: 120%; margin: 0 0 3px 0; color: #2A4057;}

div.hgap {width: 100%; height: 8px; font-size: 1px; line-height: 1px;}
div.greybox {background: #F9F9F9; padding: 14px; margin: 8px 0 0 0;}
div.expired {background: #F9F9F9; padding: 14px; margin: 8px 0 0 0; border: 1px #F00 solid;}
table.tableinput, table.tableinput-sm {width: 100%; margin: 20px 0 0 0; border-collapse: collapse; vertical-align: top;}
table.tableinput td {padding: 3px; font-weight: normal; color: #4C4C4C; vertical-align: top;}
table.tableinput-sm td {padding: 2px; font-weight: normal; color: #4C4C4C; vertical-align: top;}
tr.equalwidth th {width: 80px; vertical-align: top; background: #E8E8E8;}
tr.equalwidth_sm th {width: 60px; vertical-align: top; background: #E8E8E8;}
td.lcell {text-align: right;}
td.width200 {width: 200px;}

table.resulttable {width:100%; border: 1px solid #A0A0A0; border-collapse:collapse;}
table.resulttable th {background-color: #E8E8E8;}
table.resulttable th.sorted { background-color: #c9c9c9; }
table.resulttable tr.grey {background-color: #F5F5F5;}
table.resulttable tr.white {background-color: #FFF;}
table.resulttable td, table.resulttable th {border: 1px solid #A0A0A0; border-width: 0 1px 0 1px; padding: 4px;}
table.resulttable td.bottom {border: 1px solid #A0A0A0; border-width: 1px 0 0 0; text-align: center;}
table.resulttable a:link {text-decoration: none;}
table.resulttable a:visited {text-decoration: none;}
table.resulttable a:hover {text-decoration: underline;}
table.resulttable a:active {text-decoration: none;}
table.resulttable tr.expired td {background-color: #CCC; color: #333;}
table.resulttable tr.clientStart td { border-top: 1px solid #a0a0a0; }

/* Text Styles */
/*h1 {font-size: 16px; font-weight: bold; display: inline; padding: 0; line-height: 16px;}*/
p.smalltext,td.smalltext,tr.smalltext td {font-size: 9px;}
p.phr-bl {background: url(../../images/hdot-navy.gif) repeat-x scroll center; margin-top: 2px; margin-bottom: 4px; height: 1px; line-height: 1px;}
a {color: #333;}

/* Form Styles */
form { border:0px solid #B7B7B7; }
input { font-size:12px; border: 1px solid #666; background-color: #FFF;}
input.smallinput {width: 70px;}
input.smallerinput {width: 60px;}
input.smallestinput {width: 58px;}
select { font-size:12px; border: 1px solid #666; background-color: #FFF; }
textarea { font-size:12px; border: 1px solid #666; background-color: #FFF; }
input.inputfield {width: 350px;}
textarea.areafield {width: 350px;}

div.loginl {width:100px;}
div.loginr {width:200px;}
div.loginr input {width:150px;}

/*Extra*/
table.tableinput {border-collapse: collapse; width: 100%;}
table.tableinput td, table.tableinput th {padding: 5px;}
table.tablelist {border: 1px solid #A0A0A0; border-collapse: collapse;width: 100%;}
table.tablelist td, table.tablelist th {padding: 4px; border: 1px solid #A0A0A0;}
table.tablelist th {background: #E5E5E5;}
table.tablelist tr.odd {background: #F5F5F5;}
table.tablelist tr.even {background: #FFF;}
td.centre {text-align:center;}
form.nomarg {padding: 0; margin: 0;}
tr.trimage {background: #F3F3F3;}
tr.trimage2 {background: #FFF;}
tr.trpdf {background: #EDD;}
input.textinput {width: 325px;}
tr.textbox textarea {width: 475px; height: 250px;}
tr.textbox2 textarea {width: 475px; height: 50px;}

/* Calendar Page */
div.yearnav {float: left; width: 726px; margin: 0 0 5px 0;}
div.yearnav a {float: left; background: #DCE7F1; color: #676E89; border: 1px #FFF solid; text-decoration: none; padding: 2px 3px 1px 3px;}
div.yearnav div.previous {float: left;}
div.yearnav div.next {float: right;}
div.monthdiv {float: left; width: 180px; height: 149px; margin: 0 2px 6px 0;}
table.monthnavy, table.monthblue, table.monthgreen {float: left; border-width: 3px; border-style: solid; background: #FFF; width: 100%;}
tr.blank td {font-size: 85%; border: 1px #FFF solid;}
table.monthtable {width: 100%; float: left; border-collapse: collapse;}
table.monthtable table {float: left; border-collapse: collapse; width: 100%; }
table.monthtable td.padding {padding: 4px 4px 3px 4px;}
table.dates {float: left;}
table.monthnavy table td, table.monthblue table td, table.monthgreen table td {text-align: center; border-collapse: collapse;}
table.monthnavy {border-color: #405A76;}
table.monthnavy td.wtext {background: #405A76; color: #FFF; font-size: 90%;}
table.monthnavy tr.days td {background: #708398; color: #FFF; height: 16px;}
table.monthnavy table td.notbooked {background: #C5CDD6; color: #4F6E89; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthnavy table td.notbooked-we {background: #D9DEE4; color: #728395; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthnavy table td.booked {background: #676B70; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthnavy table td.booked-we {background: #8D9299; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthnavy table td.today {background: #6283A6; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthblue {border-color: #749BC5;}
table.monthblue td.wtext {background: #749BC5; color: #FFF; font-size: 90%;}
table.monthblue tr.days td {background: #97B4D4; color: #FFF; height: 16px;}
table.monthblue table td.notbooked {background: #DCE7F1; color: #4F6E89; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthblue table td.notbooked-we {background: #E8EFF6; color: #728395; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthblue table td.booked {background: #737980; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthblue table td.booked-we {background: #8A9199; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthgreen {border-color: #9CB59E;}
table.monthgreen td.wtext {background: #ABC1AE; color: #FFF; font-size: 90%;}
table.monthgreen tr.days td {background: #C1D2C3; color: #FFF; height: 16px;}
table.monthgreen table td.notbooked {background: #DAE4DB; color: #4F6E89; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthgreen table td.notbooked-we {background: #E7EDE8; color: #738496; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthgreen table td.booked {background: #79807A; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}
table.monthgreen table td.booked-we {background: #919992; color: #FFF; border: 1px #FFF solid; font-size: 85%; width: 27px; height: 16px;}

table.browntable {width: 100%; border-collapse: collapse;}
table.browntable th, table.browntable td {padding: 4px 10px; text-align: left;}
table.browntable th a {color: #FFF;}
table.browntable tr.mainheader th {background: #B6B09D; color: #FFF;}
table.browntable tr.header th {background: #DCD9CC; color: #5B584F;}
table.browntable td {border: 1px dotted #DAD7CE; border-width: 0 0 1px 0; background: #FFF; color: #5B584F}
table.browntable td.nodesc a {text-decoration: none;}
table.browntable td a {color: #5B584F;}

div.column-1 {float: left; padding: 10px 0 0 0; width: 190px; display: inline;}
div.column-2 {float: left; padding: 10px 0 0 10px; width: 530px; \width: 545px; w\idth: 530px; display: inline;}

/*Footer*/
div#bottomspace {clear: both; width: 760px; height: 10px;}
div#footer {float: left; clear: both; padding: 8px; width: 744px; \width: 760px; w\idth: 744px; font-size: 90%; background: #405A76; color: #B5C7D9;}
div#footer div.terms {float: left;}
div#footer div.login {float: right;}
div#footer div.contact strong {display: block; padding-bottom: 3px; color: #FFF;}
div#footer a {color: #FFF; font-weight: bold; text-decoration: none;}