/*
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: 0.0.0.3
Author: Nick Wallis
Author URI: http://www.akroyd-wallis.co.uk/
Tags: orange, fixed width, ems, XHTML
*/

/*******************************************************************************
**
** 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
** Georiga 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 */
    margin:0;
    float:left;
    width:50em;
}

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-left: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: #f0e07d;
    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
*/
#masthead {
    background: url("./images/blenheim-2005.jpg") no-repeat top left;
    color: black;
    margin: 0;
    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-left:25em;
    font-size:1.125em; /* 18px */
    text-align:right;
    font-style:italic;
}

#content{
    float:left;
}

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

/* 
** 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  {
    margin: 0.5em 1em 0 0.5em;
    float:left;
    font-size:0.6875em; /* 11 px */
    text-align:left;
    width:10em;
    clear:none;
    position: absolute;
    left:0px;
    top:190px; /* height of masthead */
    padding-top:2em; /* room for internal links */
}

#articles   {
    margin-left: 8em;
    padding: 1em 0 0 1em;
    width: 40em;
    border-left:1px solid #d9ded4;
}

#credits {
    clear:both;
    color: black;
    font-size:0.6875em; /* 11 px */
    text-align:center;
    padding: 0.5em;
    margin-left:10em;
    margin-right:10em;
}

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

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