/* STYLE SHEET FOR JUICE DIGITAL WEB SITE
Created by Richard Clark
http://www.kmp.co.uk

/* ================ TABLE OF CONTENTS ======================

0. COMMON RESET
1. COMMON SITE FRAMEWORK
2. BRANDING BLOCK
	xx. H1 Logo Replacement
3. STANDARD TYPOGRAPHY
	3.1. Links	
4. NAVIGATION
	4.1. Primary Navigation
	xx. Breadcrumbs
5. FOOTER BLOCK
	5.1. Footer Navigation 
6. SIDEBAR COMPONENTS
7. COLOUR1
8. COLOUR2
9. COLOUR3
10. COLOUR4
11. COLOUR5
12. TABLES
13. VCARD
14. CONTACT FORM
15. HOMEPAGE FEEDS

/* =============== NOTES =======================


/* ====================
COLOUR REFERENCE SHEET
-----------------------
#about-us: color:#c0e20e;
#what-we-do: color:#e41b5b;
#who-use-it: color:#8adbff;
#got-seconds: color:#ffb515;
#contact-us: color:#666;
===================== */

/*=======================
0. COMMON RESET
=========================*/

/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
/*ol, ul {
	list-style: none;
	}*/
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

hr {
    display: block;
    height: 1px;
    border-top: 1px solid #cccccc;
    border-left: 0 none;
    border-right: 0 none;
    border-bottom: 0 none;
    margin: 1em 0;
    padding: 0;
}

input {
	vertical-align:middle;
}

/* http://www.positioniseverything.net/easyclearing.html */

.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	visibility: hidden;
	height: 0;
}
.clearfix {
	display: inline-block;
}
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

/*=======================
1. COMMON SITE FRAMEWORK
=========================*/

html {
	position:relative;
}

body {
	font-size:62.5%;
	line-height:1.5;
	background:#5c514e;
	font-family:Arial, Helvetica, sans-serif;
	color:#5c514e;
}

#skipLink {
	display: block;
	padding: 10px 20px;
	position: absolute;
	top:0;
	left: -999px;
}
#skipLink:focus {
	left: 0; 
}

#header, #footer, body>.section {
	width:960px;
	margin:0 auto;
	background:#f6f9e7 url(../img/body-rpt.gif) top right repeat-y;
	clear:both;
	font-size:1.2em;
}

#header {
	background:#f6f9e7 url(../img/b-head.gif) top right no-repeat;
	min-height:185px;
	text-align:left;
	margin-top:30px;
}

#footer {
	background:#f6f9e7 url(../img/b-foot.gif) bottom right no-repeat;
	min-height:110px;
	text-align:left;
}

#footer div {
	margin:20px 40px 0 20px;
	border-top:1px dotted #5c514e;
	width:900px;
	padding-top:10px;
	float:left;
}

.section, .aside {
	text-align:left;
}

.article {
	width:555px;
	float:left;
	padding:0 20px 0 20px;
	border-right:1px dotted #5c514e;
	margin:20px 0 0 0;
}

.aside {
	width:300px;
	float:right;
	padding:0 40px 0 0;
	margin:20px 0 0 0;
}

.partners {
	padding:20px 40px 0 20px;
	clear:both;
}

/*=======================
2. HEADER BLOCK
=========================*/

/*-----------------------
2.1. H1 Logo Replacement
-------------------------*/

.logo { 
	letter-spacing : -1000em;
} 

/* Just for Opera, but hide from MacIE */ 
/*\*/html>body .logo { 
	letter-spacing : normal; 
	text-indent : -999em; 
	overflow : hidden;
} 
/* End of hack */ 

h1.logo, h2.logo {
	background: url(../img/logo.gif) top left no-repeat;
	float:left;
	border:none;
	height:145px;
	width:230px;
	margin:20px 0 20px 20px;
}

h1.logo a, h2.logo a {
	display:block;
	height:145px;
	border-bottom:0;
}

h1.logo a:hover, h2.logo a:hover {
	background:0;
	border-bottom:0;
}

/*=======================
3. STANDARD TYPOGRAPHY
=========================*/

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 5px;
	line-height:1;
	clear:both;
	font-weight:normal;
}

h1 {
	font-size: 2.4em;
}

h2 {
	font-size: 2.2em;
	color:#e21350;
}

h3 {
	font-size: 1.8em;
	color:#784f56;
}

h4 {
	text-transform:uppercase;
	color:#784f56;	
}
		
h4, h5, h6 {
	font-size:1.4em;
}

p, .article ul, .article ol {
	padding-bottom:15px;
	font-size:1.4em;
}

.article ul, .article ol {
	margin-left:40px;
}

p.to-top {
	text-align:right;
}

hr {
    border-top: 1px solid #cccccc;
}

blockquote {
	padding:0 30px 0 10px;
	padding-bottom:0;
	margin:0 0 10px 0;
	width:40%;
	font-size:1.4em;
	font-style:italic;
	background:url(../img/bkgd/bkgd-blockquote.gif) 50% 50% no-repeat;
	float:left;
}

blockquote p {
	background:url(../img/bkgd/bkgd-blockquote-p.png) 0 0 no-repeat;	
	padding:5px 0 0 30px;
}

blockquote p.author {
	text-align:right;
	font-weight:bold;
	color:#E41B5B;
	background:none;
}

blockquote p.author a {
	color:#E41B5B;
	text-decoration:none;
}


/*-----------------------
3.1. Links
-------------------------*/

a {
	text-decoration:none;
	color:#e21350;
	border-bottom:1px dotted #e21350;
}

a:link {
}

a:active {
}

a:hover {
	border-bottom:1px solid #e21350;
	background:#e21350;
	color:#fff;
}

a:visited {
}

.section img {
	text-align:left;
}

/* ================ 
4. NAVIGATION
===========================*/

/*-----------------------
4.1. Primary Navigation
-------------------------*/

#nav {
	float:right;
	width:auto;
	margin:20px 40px 0 0;
	font-size:1.8em;
	font-weight:bold;
}

#nav li {
	display:block;
	float:left;
	padding:0 10px;
	border-left:1px solid #5c514e;
}

#nav li:first-child {
	border-left:0;
}

.home #home a, .priorities #priorities a, .contact #contact a {
	background:#E21350;
	border-bottom:1px solid #E21350;
	color:#fff;
}

/* ================ 
5. FOOTER BLOCK
===========================*/

#footer p {
	font-size:1em;
	padding-bottom:10px;
}

/*=======================
12. STANDARD TABLES
=========================*/

table {
	text-align:left;
	border-bottom:5px solid #eee;
	margin:0 0 10px 0;
}
		
caption {
	text-align:left;
	padding:5px 10px;
	font-size:1.4em;
	font-weight:bold;
	background:#8ADBFF;
}
		
th {
	padding:5px 10px;
	background:#eee;
}

tr {
}

td {
	padding:5px 10px;
}


/*=======================
ASIDE
=========================*/

.aside h2 {
	margin-bottom:15px;
}

.aside ul {
	list-style:none;
}

.aside li {
	border-bottom:1px dotted #5c514e;
	margin-bottom:15px;
	padding-left:75px;
	overflow:hidden;
	position:relative;	
}

.aside li img { 
	float:left;
	position:relative;
	left:-75px;
	margin-right:-65px;
}

.aside li p, .aside li h3, .aside li h4 { 
	clear:none;
	padding-left:10px;
}
.aside li p{
	font-size:1.1em;
}


/*=======================
Partner
=========================*/

.partners ul {
	list-style:none;
}

.partners li {
	display:block;
	float:left;
	width:210px;
	padding:0 15px 15px 0;
}

.partners a {
	border:0;
}

.partners a:hover {
	background:0;
}


#map {
	width:550px;
	height:400px;
	margin-bottom:20px;
}

#map a {
	border:0;
}

#map a:hover {
	border:0;
	background:0;
}