/* ------------------------------- Styles common to all pages -------------- */
* {/* sets on ALL elements */
	margin: 0;
	padding: 0;
	border: 0;
}
body {
	background-color: #dedede;
	padding-bottom: 10px;
	color: #000;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: 1.125em;  /*explanation http://www.alistapart.com/articles/howtosizetextincss/ */
/* sets quote marks for nested quotes (below) - see Bos and Lie p 137-9 */
	quotes: '\201C' '\201D' '\2018' '\2019' '\2039' '\203A';
}
ul#skip {
	position: absolute;
	left: -999px;
	width: 990px;
}
#wrapper {
	margin: 0 auto; /* centres block */
	width: 952px; /*narrower than other pages are 980px; */
	text-align: left;
}
/* A block that spans white left and right borders across included within elements */
.layoutblock {
	border-left: 10px solid #fff; 
	border-right: 10px solid #fff;
}
/* A block that spans white left and right borders across included within elements */
div#layoutblock {
	border-left: 10px solid #fff; 
	border-right: 10px solid #fff;
}
.print, .hide {
	display: none;
}
h1 {
	color: #000;
	font-size: 1em;
	margin: 0.4em 0;
	padding-top: 0.6em;
}
h2 {
	color: #01273a;
	font-size: 0.875em;
	margin: 0.4em 0;
	padding-top: 0.6em;
}
h3, h4, h5, h6, th {
	font-size: 0.8125em;
	margin-top: 0.4em;
}
a {
	color: #01324b;
	text-decoration: underline;
}
a:visited {
	color: #2c6389;
}
a:hover, a:focus {
	color: #09f;
}
a img {
	border: 0;
}
p, dl {
	font-size: 0.75em;
	margin: 0.5em 0;
}
li {
	font-size: 0.75em;
	list-style: none;
}
/* below covers block elements inside other common block elements */
li *, dl *, td *, blockquote * {
	font-size: 1em;
}

												/* HEADER */
/* Wrapper for the logo and top nav menu */
#header {
	background-color: #0097db;
	border-top: 10px solid #fff;
	padding: 0.2em 0;
	border-bottom: 8px solid #fff;
}
#header p#logo {
	margin: 5px 20px;
	float: left;
}
#header ul, #header form {
	display: inline;
}
#myaccount, #searchbar {
	text-align: right;
	margin-right: 1em;
	line-height: 35px;
}
/* Nav menu at the top of the page */
#myaccount ul li {
	list-style: none;
	display: inline;
	border-right: 2px dashed #ddd;
	padding: 0 0.9em 0 0.5em;
	font: bold 0.95em Arial, Helvetica, sans-serif;
}
#myaccount ul li:last-child { /* CSS3 selector not supportd by IE8 #myaccount ul li.lastitem,  added to IE9-.css*/
	border-right: none;
	padding-right: 0;
}
#myaccount ul li a {
	color: #fff;
	text-decoration: none;
}
#myaccount ul li a img {
	vertical-align: text-bottom;
}
#myaccount ul li a:hover, #myaccount ul li a:focus {
	border-bottom: #fff 2px dotted;
}
/* The bar containing Site search */
#searchbar {
	margin-top: 6px;
	padding: 0.2em 0;
}
/* Site search wrapper */
#searchbar label {
	color: #fff;
	font: bold 1em Arial, Helvetica, sans-serif;
}
#searchbar input, #searchbar select {
	margin: 0;
	border: none;
	vertical-align: middle;
}
#searchbar select {
	height: 28px;
	padding: 4px 2px;
}
#searchbar input#keywords {
	height: 26px;
	padding: 1px 0.4em;
	width: 300px;
}
#searchbar input#searchbutton {
	margin-left: -5px;
}
/* ----------------------------------- MAIN NAV -------------------------------------------------------- */
/* mainnav is the main site navigation with coloured tabs - new Nov 2012 */
ul#mainnav {
	clear: both;
	height: 50px;
	border-top: #fff 6px solid;
	padding: 0;
	padding-left: 190px;
	overflow: hidden;
	background: #001135 url('/assets/images/header/digital-library-banner.png') left top no-repeat;
}
ul#mainnav li {
	list-style: none;
	display: inline;
}
ul#mainnav li a {
	margin: 0 2px;
	margin-top: 16px;
	width: 70px;
	display: block;	
	height: 24px;
	padding: 4px 0 6px;
	font: bold 1em Arial, Helvetica, sans-serif; 
	text-decoration: none;
	text-align: center;
	text-shadow: 1px 1px 2px #001135;	/* h length, v length, blur radius*/	
	background: transparent url("/assets/images/header/navitembg.png") 0 20px no-repeat;
	color: #fff;
	float: left;
}
ul#mainnav li:first-child a {
	margin-left: 0;	
}
ul#mainnav a:hover, ul#mainnav a:focus {
	background-position: 0 0;
	color: #fff;
}
ul#mainnav a#navI-Rec {
	background-position: -70px 19px;
}
ul#mainnav a#navI-Rec:hover, ul#mainnav a#navI-Rec:focus {
	background-position: -70px 0;
}
ul#mainnav a#navI-Ref {
	background-position: -140px 19px;
}
ul#mainnav a#navI-Ref:hover, ul#mainnav a#navI-Ref:focus {
	background-position: -140px 0;
}
ul#mainnav a#navI-Hist {
	background-position: -210px 19px;
}
ul#mainnav a#navI-Hist:hover, ul#mainnav a#navI-Hist:focus {
	background-position: -210px 0;
}
ul#mainnav a#navI-Teens {
	background-position: -280px 19px;
}
ul#mainnav a#navI-Teens:hover, ul#mainnav a#navI-Teens:focus {
	background-position: -280px 0;
}
ul#mainnav a#navI-Kids {
	background-position: -350px 19px;
}
ul#mainnav a#navI-Kids:hover, ul#mainnav a#navI-Kids:focus {
	background-position: -350px 0;
}
ul#mainnav a#navI-Maori {
	background-position: -420px 19px;
}
ul#mainnav a#navI-Maori:hover, ul#mainnav a#navI-Maori:focus {
	background-position: -420px 0;
}
ul#mainnav a#navI-Comm {
	background-position: -490px 19px;
}
ul#mainnav a#navI-Comm:hover, ul#mainnav a#navI-Comm:focus {
	background-position: -490px 0;
}
ul#mainnav a#navI-Bus {
	background-position: -560px 19px;
}
ul#mainnav a#navI-Bus:hover, ul#mainnav a#navI-Bus:focus {
	background-position: -560px 0;
}
ul#mainnav a#navI-Learn {
	background-position: -630px 19px;
}
ul#mainnav a#navI-Learn:hover, ul#mainnav a#navI-Learn:focus {
	background-position: -630px 0;
}
/* ------------------------------------------------------------------------------------------- */
									/* FOOTER */
div.content-base {
	margin-top: 0;
	height: 7px;
	background: #ccc url(/assets/images/effects/shadowwhite-rev.gif) bottom repeat-x;
	margin-bottom: 10px;
}
/* Page footer */
#footer {
	position: relative;
	height: 60px;
	background-color: #999;
	padding: 0.5em 1em 0.2em;
	border: solid 0px #999999;
    border-radius: 6px;
}
#footer ul {
	margin: 1em 1em 1em 25%;
	color: #fff;
}
#footer li {
	padding: 0 5px;
	font: bold 0.815em Arial, Helvetica, sans-serif;
	float: left;
	list-style: inside;
}
#footer li:first-child {
	list-style: none;
}
#footer li a {
	text-decoration: none;
	color: #fff;
}
#footer li a:hover, #footer li a:focus {
	text-decoration: underline;
}
#footer img#CCClogo {
	float: right; /* 180 wide */
}
/*              --------------- COLUMNS -------------------- */
#homebody {
	position: relative;
	overflow-x: hidden;
	border-top: #fff 20px solid;
	background-color: #fff;
}
#homebody section {
	margin-right: 12px;
	float: left;
	min-height: 400px; /* keep this in line with the twitter widget height */
}
/*              --------------- COLUMN(S) 3 -------------------- */
section#contact {
	width: 180px;
	padding-bottom: 2em;
	background-color:#d0e7f2;	
	background: -moz-linear-gradient(bottom, #fff, #d0e7f2 16%);
	background: -webkit-linear-gradient(bottom, #fff, #d0e7f2 16%);
	background: -o-linear-gradient(bottom, #fff, #d0e7f2 16%);
	background: -ms-linear-gradient(bottom, #fff, #d0e7f2 16%);
	background: linear-gradient(bottom, #fff, #d0e7f2 16%);
	border-radius: 6px;
}
section#contact h2, section#contact h3 {
	color: #0374ad;
	margin-left: 12px;
}
section#contact p, section#contact h4 {
	margin: 0 0.4em 0.3em 12px;
}
.vcard {
	margin: 0 0 1em;
}
.vcard span.type, .vcard .fax /*, .vcard .org*/{ /* we're hiding bits that need to be in the vcard itself but we don't really want visible in the page */
	position: absolute;
	left: 20000px;
}
.vcard .tel, .vcard .email{
	font-weight: bold;
	font-size: 0.85em;
}
.vcard img, img.DBimg {
	border-radius: 4px;
	-o-box-shadow: 4px 4px 3px #999;
	-moz-box-shadow: 4px 4px 3px #999;
    -webkit-box-shadow: 4px 4px 3px #999;
    box-shadow: 4px 4px 3px #999;
}
section#contact ul {
	margin: 0.2em 0.4em 0.2em 0.75em;
}
section#contact li a {
	color: #333;
	text-decoration: none;
	border-bottom: #0374ad 1px dashed;
}
section#contact li a:hover, section#contact li a:focus {
	color: #0374ad;
}
#LiveOnline .libraryh3lp p {
	 text-decoration: none;
	 font-size: 0.7125em;
}
#LiveOnline .libraryh3lp img {
	margin: 1px 0 0 -4px; 
	max-width: 160px;
}
section#community, section#the-source {
	width: 225px;
}
section#community dl {
	margin-top: 0;
	padding-top: 0;
}
section#community dt {
	padding: 1px 2px 4px 0.5em;
	font-weight: bold;
	font-size: 1.1em;
	background-color: #ddd;
	border: 1px solid #ccc;
	border-radius: 6px;
}
section#community dt:hover, section#community dt:focus {
	background-color: #d0e7f2;
	border: 1px solid #0374ad;
}
section#community dt a{
	color: #0374ad;
}
section#community dt a:hover, section#community dt a:focus{
	color: #2c6389;
}
section#community dd {
	margin: 0 0 0.75em 0.5em;
	font-size: 0.95em;
}
section#community dd.flickr-badge-horizontal {
	text-align: center;
}
section#community .flickr-badge-horizontal img {
	margin-right: 16px;
	padding: 1px 1px 12px;
	border: #CCC 1px solid;
	-o-box-shadow: 4px 4px 3px #999;
	-moz-box-shadow: 4px 4px 3px #999;
  -webkit-box-shadow: 4px 4px 3px #999;
  box-shadow: 4px 4px 3px #999;
}
section#community .flickr-badge-horizontal img:hover, section#community .flickr-badge-horizontal img:focus {
	-webkit-transform: rotate(2deg);
  -moz-transform: rotate(2deg);
  -o-transform: rotate(2deg);
	transform: rotate(2deg);
}
section#the-source h2 {
	margin: 0 0 4px;
	padding: 0;
}
section#the-source p {
	font-size: 0.7125em; /* .75 x .9 */
}
section#the-source li {
	margin: 0 0 2px 4px;
	padding-left: 16px;	
	background: url(/assets/images/icons/links/theSource.png) left 0.3em no-repeat;
	line-height: 1.6em;
}
#homebody section#NewBooks {
	margin: 1em 0;
	padding: 0;
	float: left;
	width: 739px;
	min-height: 0;
}
section#NewBooks h3 {
	margin-left: 1em;
}
section#NewBooks ul {
	text-align: center;
}
section#NewBooks li {
	display: inline;
	margin: 0 4px;
}
section#NewBooks li img {
	max-height: 120px;
	max-width: 120px;
	-o-box-shadow: 4px 4px 3px #999;
	-moz-box-shadow: 4px 4px 3px #999;
  -webkit-box-shadow: 4px 4px 3px #999;
  box-shadow: 4px 4px 3px #999;
}
section#NewBooks li img:hover, section#NewBooks li img:focus {
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	transform: rotate(2deg);
}
div#Twitter-Feed, div#NewFeed {
	position: absolute; /* positioned against containing relatively positioned div */
	top: 0px;
	right: 0px;
	width: 260px;
	height: 390px; /* keep this in line with the homebody sections' min-height above. Also may need to be changed on twitter widget page */
	border: #ccc 1px solid;
	border-radius: 6px;
}
/* this is here for noscript option */
div#NewFeed {
	background-color: #eaedef;
	overflow: auto;
	height: 360px;
}
div#feedlist dd {
	display: none;
}
div#feedlist dt {
	margin: 0;
}
div#feedhead, div#feedright{
	display: none;
}
/* ------------------------ JQuery Tools Scrollable --------------------------- */
.scrollable {
  position: relative;
  overflow: hidden;
  width: 940px;
  height: 120px;
  margin-left: -4px; /* to hide the margin-left of 3 on the li below */
  background-color: #fff;
}
.scrollable .items {
  width: 20000em;
  position: absolute;
}
.items li {
  float:left;
  list-style: none;
  margin: 0 4px;
}
a.browse {
	cursor: cursor;
  background: url(/assets/images/Homepage/arrows.png) no-repeat; /* 53 x 28 */
  display: block;
  width: 26px;
  height: 28px;
	position: absolute;
	top: 46px;
	z-index: 1000;
}
a.right { right: -16px; background-position: -27px 0; }
a.left { margin-left: 0px; left: -16px; }
a.disabled { visibility:hidden !important; }

.small {
	font-size: 80%;}
	
/*! jQuery UI - v1.9.0 - 2012-10-17
* http://jqueryui.com
* Copyright (c) 2012 jQuery Foundation and other contributors Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none; }
.ui-helper-hidden-accessible {
	position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
.ui-helper-reset {
	margin: 0; 	padding: 0; border: 0; 	outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:before, .ui-helper-clearfix:after {
	content: ""; display: table; }
.ui-helper-clearfix:after {
	clear: both; }
.ui-helper-clearfix {
	zoom: 1; }
.ui-helper-zfix {
	width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0;	filter:Alpha(Opacity=0); }
/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important; }
.ui-tabs {
	position: relative; padding: 0em; zoom: 1; background-color: #ddd; border: 1px solid #ccc; border-top-left-radius: 6px; 	border-top-right-radius: 6px; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
.ui-tabs .ui-tabs-nav {
	margin: 0; 	padding: .2em .2em 0; }
.ui-tabs .ui-tabs-nav li {
	list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom: 0; padding: 0;	white-space: nowrap; }
.ui-tabs .ui-tabs-nav li a {
	float: left; 	padding: .5em 1em; 	text-decoration: none; }
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px; 	padding-bottom: 1px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-active a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-tabs-loading a {
	cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a {
	cursor: pointer; } 
/* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel {
	display: block; 	border-width: 0; 	padding: 1em 1.4em; 	background: none; }
/* Component containers
---------------------------------- */
.ui-widget-header {
	background: #ddd; 	color: #fff; 	font-weight: bold; 	border-bottom: 1px solid #ccc; }
.ui-widget-header a {
	color: #fff; }
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	border: 1px solid #aaa; 	border-top-left-radius: 4px; 	border-top-right-radius: 4px; 	background: #ccc; 	font-weight: bold; 	color: #2c6389; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
	color: #2c6389; 	text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
	border: 1px solid #bcbcbc; 	font-weight: bold; 	color:#09f; }
.ui-state-hover a, .ui-state-hover a:hover {
	color: #09f; 	text-decoration: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	border: 1px solid #ccc; 	background: #fff; 	font-weight: bold; 	color: #0097db; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
	color: #0097db; 	text-decoration: none; }
/* Interaction Cues
----------------------------------*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
	border: 1px solid #333; 	color: #363636; }
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a {
	color: #363636; }
.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
	border: 1px solid #cd0a0a; 	background: #b81900; 	color: #fff; }
.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a {
	color: #fff; }
.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text {
	color: #fff; }
.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary {
	font-weight: bold; }
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary {
	opacity: .7; 	filter:Alpha(Opacity=70); 	font-weight: normal; }
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
	opacity: .35; 	filter:Alpha(Opacity=35); 	background-image: none; }