/* /////////////////////////////////
PA HARAKEKE CSS
by Benek Lisefski
http://www.benekdesign.com
///////////////////////////////// */
/* reset whitespace */
* {
margin:0;
padding:0;
}
/* /////////////////////////////////
LAYOUT
///////////////////////////////// */
body {
font: normal 14px georgia, "palatino linotype", "times new roman", times, serif;
color: #000;
background: #e5e1ce url('../i/bg.gif') repeat-y center top;
line-height: 22px;
}
.center {
width: 960px;
margin: 0 auto;
}
.left {
float: left;
}
.right {
float: right;
}
.clear {
clear: both;
height: 0;
line-height: 0px;
font-size: 0px;
text-indent: -500px;
}
.hidden {
display: none;
}
#header {
height: 110px;
background: #e5e1ce url('../i/bg-header.jpg') repeat-x center top;
}
#banner {
height: 340px;
background: #4d3f28 url('../i/bg-banner.jpg') repeat-x center top;
overflow: hidden;
text-align: center;
}
#edge {
height: 50px;
background: #e5e1ce url('../i/bg-edge.jpg') repeat-x center top;
}
#content {
background: #b19559 url('../i/bg-content.jpg') repeat-x center top;
}
.mainCol {
width: 640px;
padding: 0 30px 20px 30px;
background: transparent url('../i/bg-maincol.jpg') no-repeat 2px top;
margin-top: 11px;
}
.sideCol {
width: 242px;
}
.prime {
width: 400px;
padding-right: 20px;
margin-top: -21px;
}
.second {
width: 220px;
margin-top: -21px;
}
#footer {
clear: both;
height: 80px;
background: transparent url('../i/bg-footer.jpg') repeat-x center top;
color: #c5b890;
font: normal 12px arial, tahoma, verdana;
}
/* /////////////////////////////////
TEXT + HTML
///////////////////////////////// */
h1 {
font: bold 20px arial, tahoma;
margin: 11px 0px 28px 0px;
color: #2e271b;
}
h1 .subText {
font: bold 13px georgia, "palatino linotype", "times new roman", times, serif;
font-style: italic;
margin-left: 20px;
color: #645130;
position: relative;
top: -2px;
}
h2 {
height: 34px;
background: transparent url('../i/bg-h2.gif') no-repeat left top;
font: bold 20px arial, tahoma;
color: #2e271b;
margin: 24px -30px 18px -25px;
padding: 11px 0 0 25px;
}
h3 {
font: bold 16px arial, tahoma;
margin: 22px 0px 12px 0px;
color: #2e271b;
}
h4 {
font: bold 16px arial, tahoma;
margin: 22px 0px -8px 0px;
color: #2e271b;
}
p, ul, ol {
margin: 12px 0px 12px 0px;
}
ul {
list-style-type: none;
}
/* /////////////////////////////////
LINKS
///////////////////////////////// */
a img { border: none }
a,
a:visited {
color: #00648b;
text-decoration: none;
}
a:hover {
color: #004f6e;
text-decoration: underline;
}
a:focus {
outline: 0;
}
/* /////////////////////////////////
HEADER
///////////////////////////////// */
#logo {
display: block;
/*width: 557px;*/
width: 632px;
height: 64px;
background: transparent url('../i/logo.png') no-repeat left top;
text-indent: -5000px;
float: left;
/*margin: 32px 136px 0 30px;*/
margin: 32px 61px 0 30px;
display: inline;
}
#cart {
width: 207px;
height: 22px;
padding: 12px 0 0 0;
overflow: hidden;
background: transparent url('../i/bg-cart.gif') no-repeat left top;
float: left;
margin: 54px 0 0 0;
font: normal 11px arial, tahoma, verdana;
text-transform: uppercase;
}
#viewCart {
margin-left: 21px;
}
#checkout {
padding: 1px 0 1px 33px;
margin: 0 0 0 10px;
background: transparent url('../i/icon-leaf.gif') no-repeat left 1px;
}
/* /////////////////////////////////
NAV
///////////////////////////////// */
ul#nav {
margin: 14px 0px 24px 0px;
list-style-type: none;
font: normal 12px arial;
}
ul#nav li {
display: block;
}
ul#nav li a,
ul#nav li a:visited {
display: block;
width: 242px;
height: 30px;
text-indent: -5000px;
overflow: hidden;
}
#navHome a { background: transparent url('../i/nav-home.gif') no-repeat left 0px }
#navAbout a { background: transparent url('../i/nav-about.gif') no-repeat left 0px }
#navTours a { background: transparent url('../i/nav-tours.gif') no-repeat left 0px }
#navEco a { background: transparent url('../i/nav-eco.gif') no-repeat left 0px }
#navNursery a { background: transparent url('../i/nav-nursery.gif') no-repeat left 0px }
#navGinseng a { background: transparent url('../i/nav-ginseng.gif') no-repeat left 0px }
#navStories a { background: transparent url('../i/nav-stories.gif') no-repeat left 0px }
#navHistory a { background: transparent url('../i/nav-history.gif') no-repeat left 0px }
#navAttractions a { background: transparent url('../i/nav-attractions.gif') no-repeat left 0px }
#navGallery a { background: transparent url('../i/nav-gallery.gif') no-repeat left 0px }
#navProduct a { background: transparent url('../i/nav-product.gif') no-repeat left 0px }
#navAccomodation a { background: transparent url('../i/nav-accomm.gif') no-repeat left 0px }
#navCycle a { background: transparent url('../i/nav-cycle.gif') no-repeat left 0px }
#navPureora a { background: transparent url('../i/nav-pureora.gif') no-repeat left 0px }
#navTimber a { background: transparent url('../i/nav-timber.gif') no-repeat left 0px }
#navPackages a { background: transparent url('../i/nav-packages.gif') no-repeat left 0px }
#navCycle a:hover,
#navHome a:hover,
#navAbout a:hover,
#navTours a:hover,
#navEco a:hover,
#navNursery a:hover,
#navGinseng a:hover,
#navStories a:hover,
#navHistory a:hover,
#navAttractions a:hover,
#navGallery a:hover,
#navProduct a:hover ,
#navAccomodation a:hover ,
#navPureora a:hover,
#navTimber a:hover,
#navPackages a:hover
{
background-position: 0px -30px;
}
body#maraeroa-cycleway #navCycle a,
body#home #navHome a,
body#about #navAbout a,
body#guided-tours #navTours a,
body#eco-plantings #navEco a,
body#native-plant-nursery #navNursery a,
body#ginseng-plantation #navGinseng a,
body#stories-myths-legends #navStories a,
body#local-history #navHistory a,
body#other-attractions #navAttractions a,
body#photo-gallery #navGallery a,
body#online-shop #navProduct a ,
body#accommodation #navAccomodation a,
body#pureora-shuttle-service #navPureora a,
body#the-timber-trail #navTimber a,
body#timber-trail-packages #navPackages a {
background-position: 0px -60px;
}
#nav li .subNav,
#nav li #nav-sub {
margin: 1px 12px 1px 16px;
background: transparent url('../i/bg-subnav.gif') no-repeat left top;
padding: 3px 0 3px 20px;
}
#nav li .subNav li,
#nav li #nav-sub li {
display: block;
margin: 6px 20px 6px 0;
}
#nav li .subNav li a,
#nav li .subNav li a:visited,
#nav li #nav-sub li a,
#nav li #nav-sub li a:visited {
display: block;
width: 170px;
height: auto;
text-indent: 0;
overflow: visible;
background: none;
color: #d4caab;
}
#nav li .subNav li a:hover,
#nav li #nav-sub li a:hover {
color: #fff;
text-decoration: none;
}
#nav li .subNav li.current a,
#nav li .subNav li.current a:hover,
#nav li #nav-sub li.here a,
#nav li #nav-sub li.here a:hover {
color: #fff;
text-decoration: none;
}
/* /////////////////////////////////
BANNER
///////////////////////////////// */
#flashBanner {
margin: 0 auto;
}
/* /////////////////////////////////
CONTENT
///////////////////////////////// */
.photoLeft,
.photoRight,
.photoWide,
.photoSuperwide {
background: #e7e3d1;
padding: 14px 14px 9px 14px;
}
.photoLeft img,
.photoRight img,
.photoWide img,
.photoSuperwide img {
display: block;
padding-bottom: 5px;
}
.photoLeft em,
.photoRight em,
.photoWide em,
.photoSuperwide em {
font-size: 11px;
color: #715c3a;
}
.photoLeft {
float: left;
clear: left;
margin: 6px 20px 12px 0px;
}
.product_content{
float:right;width:529px;
}
.photoRight {
float: left;
clear: both;
margin: 6px 0px 12px 0px;
margin-right:20px;
}
.photoWide {
float: none;
margin: 24px 0;
}
.photoSuperwide {
float: none;
margin: 24px -22px 24px -22px
}
.divider {
clear: both;
height: 3px;
line-height: 0px;
font-size: 0px;
text-indent: -5000px;
background: transparent url('../i/divider.gif') no-repeat left top;
margin: 18px -30px 18px -20px;
}
.searchResults {
margin: 0px -30px 0px -20px;
}
.mainCol .searchResults li {
background: transparent url('../i/divider.gif') no-repeat left bottom;
padding: 0 30px 18px 20px;
margin-bottom: 18px;
}
.mainCol ul li {
margin-bottom: 12px;
padding-left: 24px;
background: transparent url('../i/bullet.gif') no-repeat left 6px;
}
object {
outline: none;
}
#trees img.left {
margin: 0 18px 18px 0;
}
#trees h3 {
margin-top: 0;
}
.products {
margin-top: 24px
}
.mainCol .products li {
background: transparent url('../i/divider.gif') no-repeat left top;
padding: 18px 30px 0px 20px;
margin-bottom: 18px;
}
.products h3 {
margin-top: 0px;
}
.products .photoLeft p {
display: inline;
margin: 0;
}
.products .price {
font: bold 18px georgia, "palatino linotype", "times new roman", times, serif;
font-style: italic;
margin-right: 24px;
color: #0f7436;
}
a.addCart,
a.addCart:visited {
font-size: 12px;
font-weight: bold;
color: #fff;
background: #2c951b;
padding: 2px 8px;
}
a.addCart:hover {
background: #0f7436;
text-decoration: none;
color: #fff;
}
/* /////////////////////////////////
FORMS
///////////////////////////////// */
#searchForm {
width: 241px;
height: 90px;
background: transparent url('../i/bg-search.gif') no-repeat left top;
margin: 24px 0;
}
#contactForm {
margin: 18px 0;
}
fieldset {
border: 0;
}
label {
display: block;
float: left;
width: 70px;
font: bold 11px arial, tahoma;
text-transform: uppercase;
color: #645130;
margin: 5px 0 3px;
}
.input {
font: normal 14px georgia, "palatino linotype", "times new roman", times, serif;
background: #d4caab;
border: 0;
border-bottom: solid 1px #c1b184;
padding: 3px;
width: 300px;
margin-bottom: 4px;
}
select {
font: normal 14px georgia, "palatino linotype", "times new roman", times, serif;
background: #d4caab;
border: 0;
border-bottom: solid 1px #c1b184;
padding: 3px;
width: 200px;
margin-bottom: 4px;
}
.input:focus {
outline: 0;
border-color: #b19559;
background: #e1d9bc;
}
input.button {
background: #467219;
border: 0;
font: normal 11px arial, tahoma;
text-transform: uppercase;
color: #e7e3d1;
padding: 3px 7px;
}
input.button:hover {
cursor: pointer;
background: #366121;
}
#contactForm .button {
margin: 0 0 18px 70px;
}
#searchForm input {
font: normal 14px georgia, "palatino linotype", "times new roman", times, serif;
background: #d4caab;
border: 0;
color: #000;
width: 155px;
float: left;
margin: 53px 0 0 24px;
}
#searchForm input:focus {
border: 0;
outline: 0;
}
#submitSearch {
display: block;
float: left;
width: 25px;
height: 25px;
overflow: hidden;
text-indent: -5000px;
background: transparent url('../i/button-search.gif') no-repeat left top;
margin: 49px 0 0 7px;
}
#submitSearch:hover {
background-position: left -25px;
}
#bookingForm {
margin-bottom: 24px;
}
#bookingForm label {
width: 120px;
text-align: right;
padding-right: 12px;
}
#bookingForm .button {
margin-left: 132px;
}
/* /////////////////////////////////
FOOTER
///////////////////////////////// */
#footer p {
margin: 0 12px 0 0;
padding: 34px 0 0 32px;
}
#vo2 {
margin-top: 34px;
float: right;
width: 225px;
color: #c5b890;
}
a.button,
a.button:visited {
display: block;
float: left;
background: transparent url('../i/button-left.gif') no-repeat left top;
color: #c5b890;
margin-top: 30px;
margin-left: 8px;
font-size: 11px;
}
a.button span {
display: block;
padding: 5px 12px 6px;
background: transparent url('../i/button-right.gif') no-repeat right top;
}
a.button:hover {
text-decoration: none;
color: #e4dfcc;
}
ul#chalet-images {
list-style: none;
padding:0;
margin:0;
}
ul#chalet-images li {
background:none;
float:left;
width:130px;
}
/* Kinson's Table CSS */
table th {
text-align:left;
}
table {
border-collapse: collapse;
border-color: #4d3d26;
}
table th, table td{
padding: 5px 10px;
}
table th {
background-color: #6b5736;
}
table th h3{
font-size: 14px;
margin:5px 0;
color:#c5b890;
font-weight:normal;
}