/**
 * Styles for High Moor Cottage v2.
 *
 * @package highMoorCottage
 * @author Jim Noble | jimnoble@xjjz.co.uk
 * @copyright Jim Noble | XJJZ | designed communications
 * @version 1.0
 */

/*@import url(http://fonts.googleapis.com/css?family=Droid+Serif:regular,bold&v1);*/
@import url(http://fonts.googleapis.com/css?family=Brawler&v1);

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.7.0
*/
/* RESET */ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{font-size:100%;}

/* LAYOUT */
html
{
  background:#eee;
}

html, body
{
  height:100%;
}

body
{
  width:960px;
  margin:0 auto;
  text-align:center;
}

#wrapper
{
    min-height: 65em;
    margin-top:10px;
    background: #666;
    position: relative;
    -webkit-box-shadow: 2px 2px 10px #aaa;
    -moz-box-shadow: 2px 2px 10px #aaa;
    box-shadow: 2px 2px 10px #aaa;
    text-align: left;
}

/* TYPOGRAPHY */

address
{
    font-size:1.4em;
}
body
{
  font-family: 'Droid Serif', 'Brawler', Georgia, sans-serif;
  font-size:62.5%;
  line-height:1.6;
  color:#000;
}

h1, h2, h3, h4 ,h5 ,h6
{
  font-family: 'Brawler', Georgia, sans-serif;
  font-weight:normal;
}

h1
{
  font-size:2em;
}

h2
{
  font-size:1.4em;
}

h3
{
  font-size:1.8em;
}

h4
{
  font-size:1.2em;
}

p
{
  font-size:1.1em;
  margin-bottom:1em;
}

.great-primer
{
    font-size: 1.8em;
}

.two-line-brevier
{
    font-size: 1.6em;
}

.augustin
{
    font-size: 1.4em;
}

/* HEADER */
h1,
h2
{
    display: none;
}

/* GLOBAL NAV */
.horizontal-nav
{
    position: absolute;
    z-index:1000;
    width:954px;
    height:2.4em;
    background: url('../images/nav-bg.gif') repeat-x;
    top:3px;
    left:3px;
    font-size: 1.2em;
    padding-top:6px;
}

.horizontal-nav li
{
	list-style-type: none;
	display: inline;
}

.horizontal-nav li a.no-border,
.horizontal-nav li span.no-border
{
	border-right: none;
}

.horizontal-nav li a
{
	border-right: 1px solid #ccc;
	display: inline-block;
	padding: 0 10px 0 10px;
	color: #666;
	text-decoration: none;
}

.horizontal-nav li a:hover,
.horizontal-nav li a:focus
{
	color: #c8452b;
}

.horizontal-nav li.selected
{
	color: #97000b;
}

.horizontal-nav li span
{
	border-right: 1px solid #ccc;
	padding: 3px 10px 2px 10px;
}

/* CONTENT */
#content
{
    min-height: 65em;
}

.content-pane
{
    position: absolute;
}

.left
{
    left: 0;
}

.middle
{
    left: 320px;
}

.right
{
    left: 640px;
}

.single-col
{
    width: 320px;
}

.double-col
{
    width: 640px;
}

/* ACCORDION STYLES (DYNAMIC) */
ul.accordion li.collapsed * {
	position: absolute;
	left: -10000px;
}

ul.accordion li.collapsed h4,
ul.accordion li.expanded h4,
ul.accordion li.collapsed h4 a:link,
ul.accordion li.collapsed h4 a:visited,
ul.accordion li.expanded h4 a:link,
ul.accordion li.expanded h4 a:visited {
	position: static;
}

/* CONTACT */
.contact
{
    background: url('../images/backgrounds/contact.gif') no-repeat 0 0;
}

.contact .left p,
.contact .left div
{
    font-size: 1.4em;
    color: #fff;
    margin-bottom: 1em;
}

form
{
    margin: 70px 0 0 40px;
    font-size: 1.2em;
    color:#333;
}

input[type="text"],
input[type="email"]
{
    width:556px;
    margin-bottom: 5px;
    padding: 2px;
}

input[type="submit"]
{
    float: right;
    font-family: tahoma, sans-serif;
    font-size:1em;
    cursor:pointer;
    color:#333;
    margin-top:5px;
    margin-right: 10px;
    padding:2px;
}

textarea
{
    width:550px;
    padding: 5px;
    margin-bottom: 12px;
    overflow: auto;
    resize:none;  /*Get rid of resize handle */
}

.warning
{
    color:#a22126;
}

#fatal-error,
    #confirm
{
    text-align: center;
    background: #fff;
}

#fatal-error h3,
#confirm h3
{
    color: #a22126;
    font-size: 1.8em;
    margin-top: 296px;
    margin-bottom:0;
}

#fatal-error p,
#confirm p
{
    font-size: 1.4em;
    color:#333;
}

/* DIRECTIONS */
.directions
{
    background: url('../images/backgrounds/map.gif') no-repeat 0 0;
}

/* ACCORDION STYLES (APPEARANCE) */
.accordion a
{
    color:#fff;
    text-decoration: none;
    padding-left: 12px;
    background: url('../images/arrows.png') 0 8px no-repeat;
}

.accordion li.collapsed a
{
    background: url('../images/arrows.png') 2px -22px no-repeat;
}

.accordion h4
{
font-size: 1.6em;
    }

.accordion li ul li
{
font-size: 1.2em;
padding: 10px 0 10px 10px;
color:#eee;
    }

#google-satnav
{
    position: absolute;
    width:260px;
    border-top: 1px solid #333;
    top:560px;
    left:0;
    padding:20px 30px;
    font-size:0.9em;
}

#google-satnav p
{
    margin-bottom: 0.5em;
}

#google
{
    margin-left: -20px;
    padding-left:20px;
    background: url('../images/red-blank-sml.png') no-repeat 0 3px;
}
/* PRICES AND CONDITIONS */
.prices-and-conditions
{
    background: url('../images/backgrounds/flakebridge.jpg') no-repeat 0 0;
}

.prices-and-conditions a,
.contact a,
#google-satnav a
{
    color:#fff;
    text-decoration: none;
    border-bottom: 1px #fff solid;
}

.prices-and-conditions a:hover,
.contact a:hover,
#google-satnav a:hover
{
    color:#fff;
    border-bottom: 1px #fff dotted;
}

/* FEATURES */
.features
{
    background: url('../images/backgrounds/horses.jpg') no-repeat 0 0;
}

.features li
{
    margin-bottom: 0.5em;
    padding-left: 15px;
    background: url('../images/bullet.png') no-repeat 0 7px;
}

/* SIDE PANELS */
.about-the-cottage,
.testimonials,
.the-local-area,
.things-to-do,
.features,
.prices-and-conditions,
.directions,
.contact
{
    color: #fff;
}

.about-the-cottage .left,
.testimonials .left,
.the-local-area .left,
.things-to-do .left,
.features .left,
.prices-and-conditions .left,
.directions .left,
.contact .left
{
    background: url('../images/70-black-transparent-bg.png') repeat;
    padding: 70px 30px 0 30px;
    width:260px;
    height: 58em;
}

.about-the-cottage .left p,
.testimonials .left p,
.the-local-area .left p,
.things-to-do .left p,
.features ul,
.prices-and-conditions .left p,
.directions .left p
{
    font-size: 1.4em;
    color:#fff;
}

.about-the-cottage h3,
.testimonials h3,
.the-local-area h3,
.things-to-do h3,
.features h3,
.prices-and-conditions h3,
.directions h3,
.contact h3
{
    color: #fff;
    margin-bottom: 1em;
}

/* ABOUT THE COTTAGE */
.about-the-cottage
{
    background: url('../images/backgrounds/snow.jpg') no-repeat 0 0;
}

#facebook
{
    position:absolute;
    top:580px;
    left:40px;
    width:32px;
    height:32px;
    overflow: hidden;
}

#facebook span
{
    position:absolute;
    top:0;
    left:0;
    height:32px;
    width:32px;
    background: url('../images/facebook.png') no-repeat 0 0;
}

#facebook a:hover span,
#facebook a:focus span
{
    top:1px;
}

/* TESTIMONIALS */
.testimonials
{
    background: url('../images/backgrounds/testimonials.jpg') no-repeat 0 0;
}

.testimonials #controls
{
    position: absolute;
    width:280px;
    padding:0 20px;
    top:70px;
    left:0;
}

.testimonials #prev
{
    position: absolute;
    right:50px;
}

blockquote
{
    font-size:1.4em;
    text-indent: -.5em;
    padding-left:.5em;
    margin-bottom: 1em;
}

cite
{
    display: block;
    font-size: 1.2em;
    padding-left:.6em;
}

/* THE LOCAL AREA */
.the-local-area
{
    background: url('../images/backgrounds/local-area-01.jpg') no-repeat 0 0;
}

/* THINGS TO DO */
.things-to-do
{
    background: url('../images/backgrounds/cycling.jpg') no-repeat 0 0;
}

/* HOMEPAGE */
.homepage
{
    background: url('../images/backgrounds/hare.jpg') no-repeat 0 0;
}

.homepage .left
{
    padding-top: 60px;
}

.homepage .left p
{
    padding: 0 40px;
    line-height: 1.4;
    margin-bottom: 20px;
}

.homepage .right
{
    background: url('../images/dark-vertical-blend.png') repeat-x;
    min-height:65em;
}

/* LIGHTBOX */

/* THUMBNAILS */
#thumbnails li
{
    position: absolute;
    height: 44px;
    width: 64px;
    overflow: hidden;
    background: #fff;
    text-indent: -9999px;
    -webkit-box-shadow: 2px 2px 8px #333;
    -moz-box-shadow: 2px 2px 8px #333;
    box-shadow: 2px 2px 8px #333;
}

#thumbnails li:hover,
#thumbnails li:focus
{
    background: #b3be87;
}

#thumbnails li.selected,
#thumbnails li.selected:hover,
#thumbnails li.selected:focus
{
    background: #5B7999;
}

#thumbnails li span
{
    position: absolute;
    top:2px;
    left:2px;
    width:60px;
    height:40px;
}

#img_1
{
    top:75px;
    left:15px;
}

#img_1 span
{
    background: url('../images/thumbnails/cottage.jpg') no-repeat;
}

#img_2
{
    top:75px;
    left:89px;
}

#img_2 span
{
    background: url('../images/thumbnails/master-bedroom.jpg') no-repeat;
}

#img_3
{
    top:75px;
    left:163px;
}

#img_3 span
{
    background: url('../images/thumbnails/dining-table.jpg') no-repeat;
}

#img_4
{
    top:75px;
    left:239px;
}

#img_4 span
{
    background: url('../images/thumbnails/kitchen-oven.jpg') no-repeat;
}

#img_5
{
    top:131px;
    left:15px;
}

#img_5 span
{
    background: url('../images/thumbnails/kitchen-table.jpg') no-repeat;
}

#img_6
{
    top:131px;
    left:89px;
}

#img_6 span
{
    background: url('../images/thumbnails/twin-beds.jpg') no-repeat;
}

#img_7
{
    top:131px;
    left:163px;
}

#img_7 span
{
    background: url('../images/thumbnails/wood-burner-tv.jpg') no-repeat;
}

#img_8
{
    top:131px;
    left:239px;
}

#img_8 span
{
    background: url('../images/thumbnails/bathroom.jpg') no-repeat;
}

img
{
    position:absolute;
    top:220px;
    left:-15px;
    padding: 10px;
    background: #fff;
    -webkit-box-shadow: 2px 2px 8px #333;
    -moz-box-shadow: 2px 2px 8px #333;
    box-shadow: 2px 2px 8px #333;
}

#caption
{
    color:#fff;
    padding: 20px;
    font-size:1.2em;
    position: absolute;
    top:480px;
    left:0;
}

#controls
{
    position: absolute;
    width:280px;
    padding:0 20px;
    top:450px;
    left:0;
}

#image-title
{
    width:200px;
    position: absolute;
    top:456px;
    left:60px;
    color:#fff;
    font-size: 1.2em;
}

#next
{
    position: absolute;
    right:20px;
    top:0;
    width:33px;
    height:33px;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
}

#next span
{
    position: absolute;
    width:33px;
    height:33px;
    top:0;
    left:0;
    background: url('../images/controls.gif') -33px 0 no-repeat;
}

#next:hover span,
#next:focus span
{
    background: url('../images/controls.gif') -33px -33px no-repeat;
}

#prev
{
    position: relative;
    width:33px;
    height:33px;
    display: block;
    overflow: hidden;
    text-indent: -9999px;
}

#prev span
{
    position: absolute;
    width:33px;
    height:33px;
    top:0;
    left:0;
    background: url('../images/controls.gif') 0 0 no-repeat;
}

#prev:hover span,
#prev:focus span
{
    background: url('../images/controls.gif') 0 -33px no-repeat;
}

/* FOOTER */
#footer
{
    position: absolute;
    bottom: -25px;
    left: 10px;
    color:#666;
    font-size: .9em;
    font-family: tahoma, sans-serif;
}

#footer a
{
    text-decoration: none;
    color: #666;
}

#footer a:hover
{
    border-bottom: 1px solid #000;
    color: #000;
}