/*
Theme Name: Black Gold
Theme URI: http://www.hooves-r-us.com/
Description: The default Hooves-R-Us theme based on Paul Conways cross-country colours
Version: 1.0.0.7
Author: Nick Wallis
Author URI: http://www.akroyd-wallis.co.uk/
Tags: orange, fixed width, ems, XHTML
*/

/*******************************************************************************
** $Id: style.css 90 2010-10-09 20:09:56Z nick $
**
** NOTE: In this theme the terminology used does not relate to the Wordpress 
** concept of page and post.
**
** A page refers to a webpage, irrespective of whether it is a Wordpress page, 
** post, or collection of posts.
**
** An article is an individual story, irrespective of whether it is a Wordpress 
** page or post.
**
** -----------------------------------------------------------------------------
** Colour Summary
**
** Orange:  Pantone 171C  #fa6336
** Grey:  Pantone 5595C   #d9ded4
**
** -----------------------------------------------------------------------------
** Font Summary
** Georgia is more readable than Times so is the default serif font
** Helvetica is the default sans-serif font.
** Sans-serif for items that are to be contrasted.
**
** Sizing is in ems and is based on the article 'How to Size Text in CSS' by Richard Rutter
** [http://www.alistapart.com/articles/howtosizetextincss/]
** Font sizes:
**  1.375em = 20px
**  1.125em = 18px
**  1em = 16px
**  0.75em = 12px
**  0.6875em = 11px
**  0.625em = 10px
** 
*******************************************************************************/

/*******************************************************************************
** HTML Elements
**
** Note: em sizes are based on browsers using a default text size of 16px 
** (see http://www.alistapart.com/articles/howtosizetextincss)
*/
body  {
  font-size:100%;
  font-family: Georgia, Times New Roman, serif;
  line-height:1.125em; /* 18px / 16px = 1.125em */
	background-color:#d9ded4;
}

h1, 
h2, 
h3, 
h4, 
h5, 
h6  {
  font-weight:normal;
}

a   {
  color: #fa6336;
  text-decoration:none;
  border-bottom:1px solid #fa6336;
}

a:hover {
  color: black;
  background: #d9ded4;
  border-bottom:1px solid black;
}

p, 
li {
  font-size:0.875em; /* 14px */
  margin: 1.286em 0;
}

.box-out ul,
.box-out li  {
  clear:none;
}

/* 
** Rather than give the table a font size use contextual selectors to target the
** th and td elements within.
*/
table   {
  border-collapse:collapse;
  clear:left;
}

th  {
  font-weight:normal;
  font-size:0.875em; /* 14 px */
  padding: 0 0.643em 0.571em 0.643em; /* 0.643*14=9px, 0.571*14=8px */  
  border-bottom:0.071em solid #d9ded4;   /* 0.071*14=1px */
}

td {
  font-size: 0.75em; /* 12px */
  padding:0.333em 0.75em 0.417em 0.75em; /* 12*0.333=4px 12*0.75=9px 12x0.417=5px */
  border-bottom:0.083em solid #d9ded4; /* 12x0.083=1px */
  line-height: 1em; /* 12x1=12px */ 
}

code, pre   {
  font-family: 'Courier New', Courier, mono;
}

pre {
  font-weight: normal;
}

sup {
  font-family: 'Courier New', Courier, mono;
}

/* 
** All wordpress pages and posts are classed as articles by this theme.
*/
.article-title p,
.article-title h3,
.article-title h4,
.article-title h5,
.article-title h6,
.article-title a:link,
.article-title a:hover,
.article-title a:visited {
  color:black;
  border:none;
}

/*
** h1 is used for the page title, and article titles.
** Nothing is allowed to float either side of this level of heading.
*/
h1,
.article-title h1 {
  font-size:1.375em; /* 20px */
  line-height:1.636em; /* 36px */
  margin:0;
  border-bottom: 2px solid #fa6336;
  clear:both;

}

/*
** Remove link underlining from where it is not required.
*/
.site-title {
  color: black;
  margin:0 0 0 25em;
  padding: 0.25em;
  text-align:right;
  border-bottom: 2px solid #fa6336;
  text-decoration:none;
}

/* 
** h2 is used for article subheadings.
** search-title is used for article subtitles that are returned in the 
** search results.
** Box outs and images may float either side of this level.
*/
h2,
.search-title a:link,
.search-title a:hover,
.search-title a:visited  {
  color: black;
  font-size:1.125em; /* 18px */
  border-bottom: 1px solid #d9ded4;
  margin:1em 0;
  padding-top: 0.25em;
}

.search-title a:hover  {
  background-color: #d9ded4;
  border-bottom: 1px solid black;
}

/* 
** Lower level headings may appear in articles.
*/
h3  {
  font-size:1.0em; /* 16 px */
  text-decoration:underline;
}

h4  {
  font-size:0.875em; /* 14 px */
  text-decoration:underline;
}

h5,
h6  {
  font-size: 0.75em; /* 12px */
  font-style: italic;
}

.strapline  {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 0.6875em; /* 11px */
}

img.image-link,
a.image-link, 
a.image-link:hover {
  border:1px solid white;
}

/* 
** Grey boxes with black text, to the right of the content.
** The white border ensures that if displayed next to a header the header border 
** does not run into the box.
*/
.box-out  {
  border-left: 0.5em solid white;
  color: black;
  background-color: #d9ded4;
  margin: 0.5em 0 0 0;
  padding:0.5em;
  width:20em;
  float:right;
}

.box-out h2 {
  font-size:0.875em; /* 14 px */
  border-bottom: 1px solid #fa6336;
  padding-top: 0;
  margin-top:0;
}

/* 
** Orange boxes with black text, inline with the content.
*/
.announcement  {
  color: black;
  background-color: #fa6336;
  margin: 0.5em 0;
  padding:0.5em;
}

.announcement h2 {
  font-size:0.875em; /* 14 px */
  border-bottom: 1px solid #d9ded4;
  padding-top: 0;
  margin-top:0;
}

.caption  {
  color:#fa6336;
  font-weight:bold;
  /*
  font-family: Helvetica, Arial, sans-serif;
*/
}

.thumbnail,
.portrait  {
  float:left;
  text-align:center;
  font-size: 0.6875em; /* 11px */
  margin: 0em 0.5em 0em 0em;
}

.aligncenter  {
  text-align:center;
}

img.thumbnail,
img.portrait,
img.white {
  border:1px solid black;
}

.thumbnail .caption,
.portrait .caption {
  color: black;
  font-weight:normal;
}

blockquote  {
  background-color: #d9ded4;
  color: black;
  text-align:left;
  display: block;
  padding: 1em 1em 0.5em 1em;
  width: 33em;
}

blockquote:before, blockquote:after {
	color:#fa6336;
  display: block;
  width: 50px;
  font-size: 3em;
}

blockquote:before {
  content:open-quote;
  height: 0;
  margin-top: 0em;
  margin-left: -0.45em;
}
blockquote:after {
  content: close-quote;
  height: 50px;
  margin-top: -1.5em;
  margin-left: 11em;
}

/*******************************************************************************
** Named regions
*/
#wrapper {
	border:1px solid #999;
  margin:1em auto;
  width:50em;
  background-color:white;
}

#masthead {
  background: url("./images/blenheim-2005.jpg") no-repeat top left white;
  color: black;
  margin: 0 auto;
  padding: 0;
  height:190px;
}

/* 
** Horizontal ruiles are hidden on screen, but will display in print media.
*/
hr  {
  visibility:hidden;
  height: 0px;
  margin:0;
  padding:0;
  border:0;
}

/*
** The page-title is displayed on is not related to whether it is a Wordpress
** page or post.
*/
#page-title  {
  margin:0 0 0 25em;
  font-size:1.125em; /* 18px */
  text-align:right;
  font-style:italic;
  padding:0.5em;
}

#content{
  margin:0 auto;
  background-color:white;
}

#internal-links {
  margin:0 auto;
  background-color: #d9ded4;
  color: black;
  text-align:center;
  padding: 0.5em 0;
}

/* 
** The internal links on the menu bar.
*/
.box-out a:link,
.box-out a:hover,
.box-out a:visited,
#internal-links a:link,
#internal-links a:hover,
#internal-links a:visited {
  color:black;
  border:none;
}

#internal-links a:hover {
  color: black;
  background-color: #fa6336;
  border-bottom: 1px solid black;
}

/* 
** Links in box-outs.
*/
.box-out a:link,
.box-out a:hover,
.box-out a:visited  {
  color: #fa6336;
  background-color: #d9ded4;
  border-bottom:1px solid #fa6336;
}

.box-out a:hover {
  color: black;
  background-color: #fa6336;
  border-bottom: 1px solid black;
}

/* 
** Links in announcements.
*/
.announcement a:link,
.announcement a:hover,
.announcement a:visited  {
  background-color: #fa6336;
  color: black;
  border-bottom:1px solid black;
}

.announcement a:hover  {
  background-color: #d9ded4;
  color: black;
  border-bottom:1px solid black;
}

/* 
** External links panel is to the left of the main content, so to allow it to
** be included in the HTML after the main content of the page, it is positioned
** absolutely.
*/ 
#external-links  {
  padding: 0.5em;
  font-size:0.6875em; /* 11 px */
  text-align:left;
  width:10em;
}

#articles   {
  float:right;
  padding: 0.5em;
  width: 40em;
  border-left:1px solid #d9ded4;
}

#credits {
  clear:both;
  color: black;
  font-size:0.6875em; /* 11 px */
  text-align:center;
  padding: 0.25em 0;
  border-top: 1px solid #d9ded4;
}

/* 
** The Akroyd|Wallis logo 
*/
.aw-logo {
  clear:both;
  font-family: Garamond, Georgia, serif;
  font-weight:normal;
  border:none;
}

.aw-bar {
  color:#78b3e0;
}