.box { padding: 5px; margin: 5px; }

.calendar_block0, calendar_block1 {}
div.calendar_block0, div.calendar_block1 {border-top: 1px solid silver; padding-top: 2px}

.error {
   background:#C6DCF3;
   padding:10px 20px;
   position:relative;
   right:10px;
   margin-top:10px;
   color: red;
}
.left {text-align: left}
.right {text-align: right}
.helpref {float: right}
#girdle, #article, div#middle div.box, div#middleandright div.box, div#middleandleft div.box {width: 98%}
.newIcon, .editIcon, .viewIcon, .deleteIcon, .helpIcon  {}

.tableheader  {background-color: silver}
#adminmenu {position: fixed; right: 10px; top: 150px;}
#adminmenu li, #adminmenu ul {font-size: 10px}
/*
#navbar a { display:block; padding:0px 3px; }
#navbar li { float:left;border-left: 1px solid #000; margin:0; padding:0; }
#navbar ul { margin:0; padding:0; list-style:none; font-size: 10px;}
*/
#navbarFooter a { display:block; padding:0px 3px; }
#navbarFooter li { float:left;border-left: 1px solid #000; margin:0; padding:0; }
#navbarFooter ul { margin:0; padding:0; list-style:none; font-size: 10px;}

#navbarblock { position: relative; float: right; height: 22px; right: 0px; bottom: 0px; margin: 0px;
/*
            background: transparent url(../images/BG.png) top left;
*/
            background: white; /* navbar at bottom colour */
            vertical-align: bottom; padding: 0.5ex 1em 0.5ex 2em; width: auto; }

body>#navbarblock{position: fixed; width: auto; max-width: 50%; border: none;}

#navbarblock a { display:block; padding:0px 3px; color: darkblue;}
#navbarblock a:hover { display:block; padding:0px 3px; color: red;}
#navbarblock li { float:left;border-left: 1px solid #000; margin-left: 1px; padding-left: 1px; line-height: 11px}
#navbarblock ul { margin:0; padding:0; list-style:none; font-size: 9px; }

/* general formatting rules */

/* Fix for anchors <a name="A">A)</a> */
a[name] { text-decoration: none; background-color: transparent; color:black; }

/* these are used for formatting form elements and labels */

/* this lot create labels on the left and form elements on the right like this:
 <div class="row">
   <span class="label">What we call the form element</span>
   <span class="input"><input type="whatever" name="yadda" value="yadda"></span>
 <div> */
/*
div.row h3, div.row h2 {border-left: 1px solid #000; border-top: 1px solid #000; padding-left: 3px}
*/
div.row span.input, div.rowcontent span.input, div.rowrestrict2members span.input, div.rowhiddenText span.input {  float: right;  width:78%;  text-align: left; /*font-size: 11px */ }
div.row span.inputrev {float: left; width: 20%; text-align: right; /* font-size: 11px */}
div.row span.label, div.rowrestrict2members span.label, div.rowhiddenText span.label, div.rowcontent span.label {  float: left;  width: 20%;  text-align: right; /*font-size: 11px */}
div.row span.labelrev {float: right; width: 78%; text-align: left; /* font-size: 11px */}
div.row, div.formrow, div.altrow, div.rowhiddenText, div.rowcontent, div.rowrestrict2members, div.headerrow {  clear:both; padding: 4px 0px }
div.rowhiddenText {background-color: #ffc; height: 18px}
div.headerrow {background-color: #ccc; height: 14px}
div.spacer {clear: both;}
table, .showAdvancedOptionsButton, .hideAdvancedOptionsButton, .showShowDefaultButton, .showHideDefaultButton {font-size: 11px }
/* Whereas these size the form elements themselves  as in
   <input type="text" name="wuddeva" value="a little something something" class="flex">
*/

/* these are used for creating columns and rows */
.float2, .float3, .float5, .float6, .float10, .float15, .float20, .float25, .float30, .float35, .float40, .float50, .float55, .float60 {font-size: 12px}
.float2 {width: 2%; float: left}
.float3 {width: 3%; float: left}
.float5 {width: 5%; float: left}
.float6 {float: left; width: 6%;}
.float10 {width: 10%; float: left}
.float15 {width: 15%; float: left}
.float20 {width: 20%; float: left}
.float25 {float: left; width: 25%;}
.float30 {width: 30%; float: left}
.float35 {float: left; width: 35%;}
.float40 {width: 40%; float: left}
.float50 {width: 50%; float: left}
.float55 {float: left; width: 55%;}
.float60 {float: left; width: 60%;}
.float70 {float: left; width: 70%;}
.float80 {float: left; width: 80%;}
.float90 {float: left; width: 90%;}

/* these are for form elements */

.flex {width: 95%}
.flexarea {width: 95%; height: 200px;}
.flexareasmall {width: 95%; height: 100px}
.halfflex {width: 42%}
.quarterflex {width: 24%}
.required, .mandatory {background-color: #FDEEF1}

/* these two rules make the link index template render the search and pagination
   options in some sections but not others. Right now, it appears in the admin
   section, but when it's just displaying some links associated with a section,
   then there's a need for compactness, not added features */
div#linkadmin {display: none}
body#admin div#linkadmin {display: block}

/* subsection article/section formatting */
.hiddentext {background: #fcf}
.notAvailableOrRemoved {background: #c69}
.restrict2members {background: #9cf}
/* or some colour that matches the site as this one will get seen by a real audience
   ideally we wouldn't load a gif that just has the word "hidden" in it but support or visible text labels is not good.
   url(../images/members.gif) no-repeat top right
div.subsectionlisting p {font-size: 80%; font-style: italic; text-indent: 5px; }
div#subsectionlist li {}
*/

/* admin grouping */
/*
.nav_user0, .nav_user1, .nav_action0, .nav_action1, .nav_layout0, .nav_layout1 {background: #fcf}
*/
.nav_content0, .nav_content1, .nav_subsite0, .nav_subsite1, .nav_misc0, .nav_misc1, .nav_admin0, .nav_admin1 {background: #33A0DB}

/*
CSS Dropdown menus hidden in default stylesheet.  See allcss-dropdown.css
*/
.menu {display: none}
.topnavlist, .subnavlist, .topitem, .subitem {display: none}

/* Version tracking */
span.be_history_added {background-color:pink;}
span.be_history_kept  {}
span.be_history_removed {color: grey; text-decoration:line-through;}