/* CSS Document */
@import "reset.css";

form{
	background-image:url(../images/bg.gif);
	background-repeat:repeat-x;
	margin:0px;
	padding:0px;
	text-align:center;
	background-color:#afcfc3;
	}
	
	/*----------frame (centres site)-----------*/
	
	#frame{
	width:984px;
	margin:0px auto 0px auto;
	padding:0px;
	text-align:center;
	}
		
	/*-------- header ---------*/
	#headerimg{
	background-image:url(../images/header.jpg);
	height:146px;
	width:984px;
	padding:0px;
	margin:0px;
	}
	
	/*-------- logo ---------*/
	
	#logo{
	height:146px;
	width:167px;
	padding:0px;
	margin:0px;
	float:left;
	}
	
	/*-------- navigation ---------*/
	
	#navSearch{
	background-image:url(../images/nav-bg.gif);
	height:82px;
	width:984px;
	padding:0px;
	margin:0px;
	float:left;
	}
	
	#nav {
	margin:0;
	padding:0;
	text-align:left;
	float:left;
	width:894px;
	height:36px;
	color:#ffffff;
	font:12px Arial, Helvetica, sans-serif;
	text-align:left;
	}

	#nav ul {
	padding:0;
	margin:0 0 0 13px;
	list-style:none;
	background-image:url(../images/nav-line.gif);
	background-position:right;
	background-repeat:no-repeat;
	float:left;
	}
	
	#nav li {
	float:left;
	padding-left: inherit;
	background: none;
	background-image:url(../images/nav-line.gif);
	background-position:right;
	background-repeat:no-repeat;
	}
	
	#nav li a {
	display:block;
	color:#fff;
	text-decoration:none;
	font:12px Arial, Helvetica, sans-serif;
	padding:13px 13px 11px 13px;
	}
	
	#nav li a:hover, #nav li.active a {
	color:#afb2b1;
	font:12px Arial, Helvetica, sans-serif;
	}
	
	#rss{
	width:58px;
	height:28px;
	float:right;
	padding:0 20px 0 0;
	margin:0;
	}
	
	#searchSmallHeader{
	width:984px;
	padding:0px;
	margin:0px;
	height:60px}
	
	#search{
	width:400px;
	padding:12px 0 0 100px;
	margin:0;
	float:right;
	text-align:left;
	}
	
	
	/*-------- content (content is the whole area and contentleft, content middle, contentright sit inside content ---------*/
	#content{
	width:984px;
	background-color:#FFFFFF;
	}
	
	#contentLeft{
	padding:0;
	margin:0;
	float:left;
	width:230px;
	}
	
	#contentMiddle{
	padding:0;
	margin:0;
	float:left;
	width:500px;
	}

	
	#contentRight{
	padding:10px 0 0 10px;
	margin:0;
	float:right;
	width:244px;
	}

/*-------- quicklinks ---------*/

	#quicklinks{
	padding:8px 0 0 15px;
	margin:0px;
	width:215px;
	float:left;
	}
	
	#quicklinksTop{
	background-image:url(../images/notepad-top.jpg);
	background-repeat:no-repeat;
	background-position:lef top;
	width:200px;
	height:77px;
	padding:0;
	margin:0;
	}
	
	#quicklinksMiddle{
	background-image:url(../images/notepad-middle.jpg);
	background-repeat:repeat-y;
	width:200px;
	padding:0;
	margin:0;
	color:#3c3c3c;
	text-align:left;
	font:12px Arial, Helvetica, sans-serif;
	}
	
	#quicklinksMiddle h2{
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#89ada0;
	padding: 0 0 0 20px;
	}
	
	#quicklinksMiddle ul{
	padding: 0 0 0 10px;
	margin:0;
	}
		
	#quicklinksMiddle li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	}
	
	#quicklinksBottom{
	background-image:url(../images/notepad-bottom.jpg);
	background-repeat:no-repeat;
	width:200px;
	height:56px;
	padding:0;
	margin:0;
	}
	
	#quicklinksMiddle a:link, #quicklinksMiddle a:visited {
	color:#3c3c3c;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#quicklinksMiddle a:hover{
	color:#000000;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
/*-------- My Library ---------*/

	#mylibrary{
	padding:8px 0 0 15px;
	margin:0px;
	width:215px;
	float:left;
	}
	
	#mylibraryTop{
	background-image:url(../images/notepad-top.jpg);
	background-repeat:no-repeat;
	background-position:lef top;
	width:200px;
	height:77px;
	padding:0;
	margin:0;
	}
	
	#mylibraryMiddle{
	background-image:url(../images/notepad-middle.jpg);
	background-repeat:repeat-y;
	width:200px;
	padding:0;
	margin:0;
	color:#3c3c3c;
	text-align:left;
	font:12px Arial, Helvetica, sans-serif;
	}
	
	#mylibraryMiddle h2{
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#89ada0;
	padding: 0 0 0 20px;
	}
	
	#mylibraryMiddle ul{
	padding: 0 0 0 10px;
	margin:0;
	}
		
	#mylibraryMiddle li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	}
	
	#mylibraryBottom{
	background-image:url(../images/notepad-bottom.jpg);
	background-repeat:no-repeat;
	width:200px;
	height:56px;
	padding:0;
	margin:0;
	}
	
	#mylibraryMiddle a:link, #mylibraryMiddle a:visited {
	color:#3c3c3c;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#mylibraryMiddle a:hover{
	color:#000000;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	/*-------- Content Middle ---------*/
	
	#fourMiddleBoxes{
	padding:10px 0 0 0;
	margin:0;
	width:500px;
	}
	
	/*- top left box --*/
	
	#topLeftBox{
	padding:0;
	margin:0;
	width:249px;
	border-right: solid 1px #e7e7e7;
	font:11px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	float:left;
	}
	
	#topLeftBox h2{
	padding:0;
	margin:0 0 5px 0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	.photo{
	padding:0 0 10px 0;
	margin:0;
	float:left;
	width:120px;
	
	}
	
	.text{
	padding:0 5px 0 0;
	margin:0;
	float:right;
	width:115px;
	}
	
	/*- top right box --*/
	
	#topRightBox{
	padding:0;
	margin:0;
	width:250px;
	border-bottom:solid 1px #e7e7e7;
	font:11px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	float:right;
	}
	
	#topRightBox h2{
	padding:0;
	margin:0 0 5px 10px;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	.photo1{
	padding:0 0 10px 10px;
	margin:0;
	float:left;
	width:120px;
	
	}
	
	.text1{
	padding:0 0px 0 5px;
	margin:0;
	float:right;
	width:115px;
	}

	/*- bottom left box --*/


	#bottomLeftBox{
	padding:0;
	margin:0;
	width:249px;
	clear: both;
	border-top: solid 1px #e7e7e7;
	font:11px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	float:left;
	}
	
	#bottomLeftBox h2{
	padding:0;
	margin:10px 0 5px 0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	.photo2{
	padding:0 0 10px 0;
	margin:0;
	float:left;
	width:120px;
	
	}
	
	.text2{
	padding:0 5px 0 0;
	margin:0;
	float:right;
	width:115px;
	}
	

	
	/*- bottom right box --*/
	
	#bottomRightBox{
	padding:0 0 0 10px;
	margin:0;
	width:240px;
	border-left:solid 1px #e7e7e7;
	font:11px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	float:right;
	}
	
	#bottomRightBox h2{
	padding:10px 0 0 0;
	margin:0 0 5px 0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	.photo3{
	padding:0 0 10px 10px;
	margin:0;
	float:left;
	width:120px;
	
	}
	
	.text3{
	padding:0 0px 0 5px;
	margin:0;
	float:right;
	width:115px;
	}
	
	
	/*- latest news --*/
	
	#latestnews{
	background-image:url(../images/latest-new-bg.jpg);
	background-repeat:no-repeat;
	padding:0px 0 0 0;
	margin:10px 0 0 0;
	width:500px;
	height:221px;
	float:left;
	font:12px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	
	}
	
	#latestnews h2{
	padding:0;
	margin:15px 0 5px 20px;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#latestnews ul{
	padding: 0 0 0 10px;
	margin:0;
	}
		
	#latestnews li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	text-align:left;
	}
	
	#latestnews a:link, #latestnews a:visited {
	color:#3c3c3c;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#latestnews a:hover{
	color:#000000;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	/*-------- recent releases ---------*/
	

	
	.rightContentArea {
	background: url(../images/greybox-top.gif) no-repeat #cecece;
	width: 206px;
	padding:10px 10px 0 10px;
	margin:0;
	font:13px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	}
	
	.rightContentArea h3{
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:center;
	padding:0;
	margin:0;
	}
	
	.recentReleasesBook{
	text-align:center;
	padding:10px 0 0 0;
	margin:0;
	}
	
	.rightContentAreaBottom {
	background-image:url(../images/greybox-bottom.gif);
	background-repeat:no-repeat;
	width: 226px;
	height:16px;
	padding:0;
	margin: 0 0 10px 0;
	}
	
	
		/*-------- Good Reads ---------*/
	

	.goodReads{
	text-align:center;
	padding:10px 0 0 0;
	margin:0;
	}
	
	
		
		/*-------- footer ---------*/
	
	#footer{
	background-image:url(../images/footer-bg.gif);
	background-repeat:no-repeat;
	width:984px;
	height:107px;
	padding:0;
	margin:0;
	float:left;
	}
	
	#waimakarirLogo{
	width:330px;
	height:89px;
	padding:0;
	margin:0;
	float:right;
	}
	
	/*-------- lower nav ---------*/
	
	#lowerNav{
	font:11px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	padding:5px 0 20px 0;
	margin:0;
	float:left;
	}
	
	#lowerNav a:link, #lowerNav a:visited {
	color:#3c3c3c;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:none;
	}
	
	#lowerNav a:hover{
	color:#000000;
	font:11px Arial, Helvetica, sans-serif;
	text-decoration:none;
	}
	
	
	/*-------------------------------------------------inside template with 2 columns and a small header ------------------------------------------------------*/
	
	#navGreyBox{
	background-image:url(../images/nav-bg-greybox.gif);
	background-repeat:no-repeat;
	width:984px;
	padding:0px;
	margin:0px;
	height:82px;
	}
	
	#smheader{
	width:241px;
	padding:7px 0 0 30px;
	margin:0;
	float:left;	
	}
	
	#contentRightLarge{
	float:right;
	width:720px;
	padding:20px 30px 0 0;
	margin:0;
	font:12px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	}
	
	#contentRightLarge h1{
	padding:0 0 10px 0;
	margin:0;
	font:16px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#contentRightLarge h2{
	padding:0 0 5px 0;
	margin:0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#contentRightLarge ul{
	padding: 0 0 0 10px;
	margin:0;
	}
		
	#contentRightLarge li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	text-align:left;
	line-height:150%;
	}
	
	#contentRightLarge a:link, #contentRightLarge a:visited {
	color:#3c3c3c;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#contentRightLarge a:hover{
	color:#000000;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}

	
	/*-------------------------------------------------inside template with 3 columns and a small header ------------------------------------------------------*/

	#threeColsMiddle{
	float:right;
	width:500px;
	padding:15px 0 0 0;
	margin:0;
	font:12px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	}
	
	#threeColsMiddle h1{
	padding:0 0 10px 0;
	margin:0;
	font:16px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#threeColsMiddle h2{
	padding:0 0 5px 0;
	margin:0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#threeColsMiddle ul{
	padding: 0 0 0 10px;
	margin:0;
	}
		
	#threeColsMiddle li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	text-align:left;
	line-height:150%;
	}
	
	#threeColsMiddle a:link, #threeColsMiddle a:visited {
	color:#3c3c3c;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#threeColsMiddle a:hover{
	color:#000000;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	
	.threeColsRIght {
	background: url(../images/greybox-top.gif) no-repeat #cecece;
	width: 196px;
	padding:20px 15px 0 15px;
	margin:0;
	font:12px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	}
	
	.threeColsRIght h3{
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	padding:0 0 10px 0;
	margin:0;
	}
	
	.greyRightBox{
	text-align:center;
	padding:10px 0 0 0;
	margin:0;
	}
	
	.threeColsRIghtBottom {
	background-image:url(../images/greybox-bottom.gif);
	background-repeat:no-repeat;
	width: 226px;
	height:16px;
	padding:0;
	margin: 0 0 10px 0;
	}
	
	/*-------------------------------------------------inside template with 3 columns and a big header ------------------------------------------------------*/
	
	#bgHeader{
	padding:10px 0 0 0;
	margin:0;
	float:left;
	
	}
        /*-------------------------------------------------inside template for gallery with 2 columns and a small header -----------------------------------------*/
	
	/*
	#navGreyBox{
	background-image:url(../images/nav-bg-greybox.gif);
	background-repeat:no-repeat;
	width:984px;
	padding:0px;
	margin:0px;
	height:82px;
	}
	
	#smheader{
	width:241px;
	padding:8px 0 0 30px;
	margin:0;
	float:left;	
	}
    */
	
	#contentRightLargeGallery{
	float:right;
	width:720px;
	padding:20px 30px 0 0;
	margin:0;
	font:12px Arial, Helvetica, sans-serif;
	color:#3c3c3c;
	text-align:left;
	}
	
	#contentRightLargeGallery h1{
	padding:0 0 10px 0;
	margin:0;
	font:16px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	#contentRightLargeGallery h2{
	padding:0 0 5px 0;
	margin:0;
	font:14px Arial, Helvetica, sans-serif;
	text-transform:uppercase;	
	font-weight:bold;
	color:#3c3c3c;
	text-align:left;
	}
	
	/*
	#contentRightLarge ul{
	padding: 0 0 0 10px;
	margin:0;
	}+
		
	#contentRightLarge li{
	list-style: none;
	padding: 0px 10px 0px 12px;
	margin: 0px 0px 0px 0px;
	background-image:url(../images/small-bullet-arrow.gif);
	background-position:top left;
	background-repeat: no-repeat;
	text-align:left;
	*/
	
	#contentRightLargeGallery a:link, #contentRightLargeGallery a:visited {
	color:#3c3c3c;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}
	
	#contentRightLargeGallery a:hover{
	color:#000000;
	font:12px Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}