/* 

STYLE SHEET FOR AJSKIPS.CO.UK
Created by Jonathan Boutall
www.groovemedia.co.uk

ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images
	6. tables
	7. forms
	8. other
	
Notes
- Needs to be used in association with YUI grids (http://yui.yahooapis.com/2.2.2/build/reset-fonts-grids/reset-fonts-grids.css )
- Some of the classes in this file override the YUI classes
- See http://kryogenix.org/code/browser/lir/ for image replacement technique
- IE specific classes prefixed with '* html'
- compressed using http://www.cssdrive.com/compressor/compress.php

*/
/* --------- 1. defaults  --------- */
/* -------------------------------- */
#pod {
	background-color: #ffffff;
	background-image: url(/images/bg-pod.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	width: 175px;
	border: 3px solid #000066;
	float:right;
	margin:0.4em;
	padding:0.3em;
	}

.yui-u img {
	border: 1px solid #000066;
	padding:3px;
	margin:0.4em;
	float:right;
	clear:right;
	}


.hide {
	height:0px;
	overflow: hidden;
	display:none;
	}
	
html {
	background-color:#03adde;
	background-image: url(/images/bg-test.jpg);
	background-repeat: repeat-none;
	background-position: top;
} 

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.75em;
}

h1 {
	font-size:2em;
	font-weight:bold;
	padding:0.1em;
	}

h2 {
	font-size:1.2em;
	font-weight:bold;
	}
	
h3 {
	font-size:1.1em;
	font-weight:bold;
	padding-top:0.3em;
	}	

p {
	padding-bottom:0.4em;
	padding-top:0.2em;
	}

#main-content ul li {
	padding-left:2em;
	padding-bottom: 0.2em;
	background-image: url(/images/li-tick.gif);
	background-repeat: no-repeat;
	}

#main-content ul{
	padding-bottom:0.7em;
	padding-left:1.1em;
	}		
	
#main-content ol li {
	list-style-type: decimal;
	margin-left:2.5em;
	list-style-position: outside;
	}	
	
#main-content ol{
	padding-bottom:0.3em;
	}	

/* --------- 2. structure --------- */
/* -------------------------------- */
.banner {
	float:right;
	clear:right;
	}

.first {
	min-height: 20em;
	}

#bd {
	background-color:#010a55;
	}


.vcard {
	position: absolute;
	bottom: 0px;
	padding:1.1em;
	}


#main-content {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #213677;
	}

.yui-gf {
	background-color:#FFFFFF;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFFFFF;	
	}

.yui-g {	
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #213677;
	border-left-color: #213677;
	}

.yui-u {
	background-color:#FFFFFF;
	border-right-color: #CCCCCC;
	border-right-width:1px;
	border-right-style: solid;
	border-bottom-color: #CCCCCC;
	border-left-color: #CCCCCC;
}


#ft {
	background-color:#FFFFFF;
	background-image:url(/images/ft-bg.gif);
	background-repeat: repeat-x;
	background-position: top;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #213677;
	height:3em;
	padding:0.6em;
	padding-top:1em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #213677;
	border-right-color: #213677;
	border-left-color: #213677;
	min-height:5em;
}


#hd {
	background-image:url(/images/banners/header-banner.jpg);
	background-position:left;
	background-repeat:no-repeat;
	height:200px;
} 


#lh-nav {
	position:relative;
	background-image:url(/images/left-hand-bg.gif);
	background-color: #FFFFFF;
	background-repeat: repeat-y;
	background-position: right top;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #213677;
}

#ft img {
	float:right;
	vertical-align: top;
}

/* --------- 3. links and nav --------- */
/* -------------------------------- */

/* Primary nav */
/*  --- start: PRIMARY NAV: these rules use the body id selector to highlight the current tab --- */
/*  --- if new tabs are added, these rules need to be updated --- */
#item1 #primary-item-1,#item2 #primary-item-2, #item3 #primary-item-3, #item4 #primary-item-4, #item5 #primary-item-5, #item6 #primary-item-6
{ 
      background:  url("/images/primary-nav-left.gif") no-repeat left -150px;
      border-width:0;
      }
	  
#item1 #primary-item-1 a,#item2 #primary-item-2 a, #item3 #primary-item-3 a, #item4 #primary-item-4 a, #item5 #primary-item-5 a, #item6 #primary-item-6 a
{
      background:  url("/images/primary-nav-right.gif") no-repeat right -150px;
      color:#000000;
	  font-weight:bold;
      padding-bottom:5px;
	  	
      }

.yui-g ul {
	padding-left:13.8em;
	}

*html .yui-g ul {
	padding-left:10.8em;
	}

.yui-g li {
	float:left;
	background:  url("/images/primary-nav-left.gif") no-repeat left top;
	margin:0 0 0 15px;
	padding:0 0 0 15px;
	font-size: 0.9em;
      }
	  
.yui-g li a {
      float:left;
      display:block;
      background:  url("/images/primary-nav-right.gif") no-repeat right top;
      padding:3px 15px 4px 6px;  
      text-decoration:none;
      color:#999999;
      }	  

#lh-nav li {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #d9d8d8;
	background-image: url(/images/lh-nav-normal.gif);
	background-repeat: repeat-x;
	background-position: right;
	}

#lh-nav li a {
	padding:0.5em;
	color:#000000;
	text-decoration:none;
	display: block;
	}

#lh-nav li a:hover {
	color: #FFFFFF;
	background-color:#000066;
	background-image: url(/images/lh-nav-hover.gif);
	background-repeat: repeat-y;
	background-position: right;
	}   


#ft li, #ft p
{
	display: inline;
	list-style-type: none;
	padding-right: 20px;
	font-size: 0.8em;
}


#ft a, #ft p {
	color:#8d8d8d;
	text-decoration:none;
}

#ft ul {float:left;}


/* --------- 4. fonts --------- */
/* -------------------------------- */
.adr span, .adr a, .vcard a  {
	font-size: 0.7em;
	color: #999999;
		}

.adr a, .vcard a {
	color: #999999;
	}

/* --------- 5. images --------- */
/* -------------------------------- */
.banner {
	border:0px;
	margin:20px;
	}


#hd a img {
	padding: 0px;
	padding-top:10px;
	padding-left:10px;
	margin-top:0px;
	padding-right:10px;
	float:left;
}

#hd img {
	float:right;
	padding:20px;}

.float-right {
	float:right;
	padding:0.3em;
	}

/* ----------- 6. tables --------- */
/* -------------------------------- */

/* ----------- 7. forms --------- */
/* -------------------------------- */
#pod form {
	clear:left;
	}

#pod textarea {	
	margin-left:15px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}


#contact-errors p, #pod #contact-errors p {
	float:left;
	clear:left;
	}

#contact-errors .error {
	width:40em;
	font-weight:bold;
	color:#FF0000;
	text-align:left;
	}

#pod #contact-errors .error {
	width:180px;
	font-weight:bold;
	color:#FF0000;
	text-align:left;
	font-size:0.8em;
	}

#contact-form	{
clear:left;
float:left;
	}
	
.clearboth{clear:both; border-bottom:1px #999 solid; visibility:hidden; line-height:0px}	
	
label
{
width: 8em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block}

#pod label {
	width:5em;
	}

	

input, select, textarea {background-color:#CCCCCC;
	border-color:#000099;
	border-width:1px;
	}

.submit input {
	background-color:#FF6600;
	border-color:#000000;
	border-width:1px;
	padding:0.1em;
	margin-left:8.5em;
	}
	
#pod .submit input {
	margin:1px;
	float:right;
	}	

/* ----------- 8. other ----------- */
/* -------------------------------- */
/* image substitutions */

#hd h1 {
	visibility:hidden;
	height: 0px !important;
	}

/* sifr */
/* sifr styles */
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */


.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h3.sifr {
	visibility: hidden;
	letter-spacing: -3px;
	font-size: 25px;
}

h3.sifr {
	font-size:1.3em;
	font-weight: bold;
}


.sIFR-hasFlash h2.sifr {
	visibility: hidden;
	letter-spacing: -0px;
	font-size: 55px;
}