/*-----
The National Training Network: Main Style Sheet 
-------------------------------------------------------------------------------
Version:1.0
Author: Richard Stephenson
Email: richard@donkeymagic.co.uk
Website: http://www.donkeymagic.co.uk
Date: 24 January 2007
Client: Bluestorm New Media
-------------------------------------------------------------------------------*/
* {
margin:0;
padding:0;
font-family:'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
line-height:1.3em;
list-style:none;
}
body {
font-size:62.5%;
min-width:760px;
background:url(../stat/bg-tile.gif);
text-align:center;
}
a {
color:#000;
text-decoration:none;
}
a:hover {
color:#000;
text-decoration:underline;
}
#container {
background:#FFF url(../stat/container-bg.gif) bottom left repeat-x;
}
#header {
text-align:left;
width:777px;
margin:0 auto;
position:relative;
padding-top:128px;
}
#header h1 {
position:absolute;
top:14px;
left:8px;
}
#header h1 img {
border:none;
}
#header h2 {
position:absolute;
top:45px;
left:386px;
background:url(../stat/header-h2.gif) no-repeat;
width:382px;
height:52px;
}
#navigation {
background-color:#7FC31C;
position:relative;
padding-top:5px;
}
#navigation div {
text-align:left;
margin:0 auto;
position:relative;
width:777px;
}
#navigation ul {
float:left;
background-color:#7FC31C;
padding-left:3px;
padding-bottom:8px;
width:500px;
}
#navigation ul li {
float:left;
padding-right:0.6em;
margin-right:0.6em;
border-right:2px solid #000;
}
#navigation ul li.last {
padding-right:0;
margin-right:0;
border-right:none;
}
#navigation ul li a {
float:left;
font-size:1.2em;
padding:0 3px 2px;
text-decoration:none;
font-weight:bold;
color:#000;
}
#navigation ul li a:hover,
#navigation ul li.selected a:hover,
#navigation ul li.selected a {
background-color:#FFF;
text-decoration:none;
}
#navigation p {
position:absolute;
left:600px;
top:-2px;
background:url(../stat/header-tel.gif) left  no-repeat;
padding-left:30px;
font-size:1.6em;
font-weight:bold;
}
#content {
text-align:left;
width:777px;
margin:0 auto;
position:relative;
background:#FFF url(../stat/content-bg.gif) bottom right no-repeat;
min-height:500px;
}
.homepage #content {
min-height:587px;
}
#site-introduction {
float:left;
width:390px;
background:#FFF url(../stat/homepage-left-80.jpg) bottom left no-repeat;
min-height:587px;
}
#site-introduction p {
padding-left:30px;
font-weight:bold;
font-size:1.2em;
padding-right:15px;
}
#site-introduction p#q1 {
padding-top:439px;
margin-bottom:7px;
}
#site-introduction p#q2 {
margin-bottom:5px;
}
#site-introduction p#q3 {
font-weight:normal;
font-style:italic;
padding-bottom:12px;
font-size:11px;
}
#home-main-content {
float:left;
width:362px;
padding:30px 0 20px 25px
}
#home-main-content h2 {
font-size:1.6em;
padding-right:10px;
margin-bottom:10px;
padding-right:40px;
}
#home-main-content h3 {
font-size:1.4em;
padding-right:10px;
color:#7FC31C;
margin-bottom:15px;
}
#home-main-content p {
font-size:1.2em;
padding-right:10px;
margin-bottom:15px;
}

#training-solutions {
width:353px;
height:169px;
background:#FFF url(../stat/panel-training-solutions.gif) bottom left no-repeat;
}
#training-solutions h3 {
padding-top:24px;
padding-left:35px;
padding-bottom:10px;
margin:0;
}
#training-solutions p {
color:#fff;
padding-left:14px;
font-size:1.1em;
}
#call-to-action {
font-size:1.1em;
margin-top:40px;
padding-left:46px;
padding-right:20px;
background:transparent url(../stat/c2a-arrow.gif) top left no-repeat;
}


/*--- PAGE CONTENT  ---------------------------------------------------------*/

#content-introduction {
padding-top:168px;
background:transparent url(../stat/blank-top.jpg) top left no-repeat;
margin-bottom:20px;
}

#content-introduction h2 {
background:#000 url(../stat/arrow-black.gif) left no-repeat;
padding:9px 0 12px 55px;
color:#7FC31C;
font-size:1.8em;
font-weight:normal;
}
.about-us #content-introduction {
background:transparent url(../stat/about-us-top.jpg) top left no-repeat;
}
.training #content-introduction {
background:transparent url(../stat/training-top.jpg) top left no-repeat;
}
.funding #content-introduction {
background:transparent url(../stat/funding-top.jpg) top left no-repeat;
}
.employers #content-introduction {
background:transparent url(../stat/employers-top.jpg) top left no-repeat;
}
.contact-us #content-introduction {
background:transparent url(../stat/contact-us-top.jpg) top left no-repeat;
}
#main-content {
width:375px;
padding-left:35px;
padding-bottom:70px;
padding-right:10px;
float:left;
}
#main-content h3 {
color:#7FC31C;
font-size:1.8em;
margin-bottom:14px;
}
#main-content p {
font-size:1.1em;
}
#main-content ul  {
margin-bottom:20px;
margin-top:20px;
}
#main-content ul li {
margin-bottom:7px;
padding-left:30px;
}
#main-content ul li a {
background:transparent url(../stat/bullet.gif) top left no-repeat;
padding-left:20px;
text-transform:uppercase;
font-weight:bold;
}
#main-content .section {
width:333px;
margin-bottom:20px;
border-bottom:1px dotted #000;
padding:0 10px 5px;
background:transparent url(../stat/section-bar.gif) top left no-repeat;
}
#main-content .section h3 {
font-size:1em;
font-weight:bold;
padding-left:20px;
padding-top:4px;
text-transform:uppercase;
margin-bottom:14px;
color:#000;
}

#main-content .section p {
font-size:1.1em;
}
#main-content .section .back-to-top {
margin-top:10px;
}
#main-content .section .back-to-top a {
background:transparent url(../stat/back-to-top.gif) top left no-repeat;
padding-left:20px;
text-transform:lowercase;
font-weight:bold;
}



#secondary-content {
width:355px;
float:left;
}

#secondary-content div.panel {
background:url(../stat/panel-training.gif) no-repeat;
width:345px;
height:139px;
margin-bottom:20px;
}
#secondary-content div.panel p {
color:#FFF;
padding:20px 97px 0 18px;
font-size:1.2em;
}
#secondary-content div.panel p strong {
font-size:1.6em;
}
#secondary-content div.panel p em {
font-weight:bold;
font-style:normal;
}

#secondary-content .quote {
background:url(../stat/open-quotes.gif) top left no-repeat;
padding:20px 0 0 50px;
}
#secondary-content .quote p {
color:#7FC31C;
font-style:italic;
font-size:1.4em;
font-weight:bold;
padding-right:30px;
padding-bottom:15px;
}
#secondary-content .quote p.last {
padding-bottom:0px;
}
#secondary-content .quote p.ref {
background:url(../stat/close-quotes.gif) top right no-repeat;
color:#000;
font-size:1.1em;
font-style:normal;
font-weight:normal;
padding-top:42px;
padding-right:20px;
margin-right:16px;
margin-top:-18px;
}
#content-col {
width:700px;
margin-left:39px;
padding-bottom:60px;
}
#content-col .intro {
color:#7FC31C;
font-size:1.6em;
margin-bottom:20px;
font-weight:bold;
}
#content-col ul li {
float:left;
}
#content-col ul li#logo1 {
margin-right:5px;
}
#content-col ul li#logo2 {
margin-right:19px;
}
#content-col ul li#logo3 {
margin-right:10px;
}
#content-col ul li#logo4 {
margin-right:17px;
}
#content-col ul li#logo5 {
padding-top:19px;
}
#content-col ul li img {
border:none;
}
p.help {
clear:both;
padding-top:5px;
padding-bottom:20px;
text-align:center;
margin-bottom:40px;
overflow:hidden;
}
#content-col .employer {
margin-bottom:30px;
border-bottom:1px dotted #000;
padding:0 10px 5px;
background:transparent url(../stat/long-bar.gif) top left no-repeat;
width:664px;
margin-left:6px;
}
#content-col .employer h3 {
font-size:1em;
font-weight:bold;
padding-left:20px;
padding-top:4px;
text-transform:uppercase;
margin-bottom:14px;
color:#000;
}
#content-col .employer img {
float:left;
margin-right:20px;
}
#content-col .employer  p {
font-size:1.1em;
margin-bottom:1em;
}
#content-col .employer  p em {
font-size:1.1em;
font-style:italic;
padding-right:3px;
}
#content-col .employer p.back-to-top {
margin-top:10px;
margin-bottom:0;
}
#content-col .employer p.back-to-top a {
background:transparent url(../stat/back-to-top.gif) top left no-repeat;
padding-left:20px;
text-transform:lowercase;
font-weight:bold;
}
#content-col p {
font-size:1.2em;
margin-bottom:1em;
}
#content-col h3 {
padding-top:1.4em;
font-size:1.6em;
margin-bottom:0.6em;
}
#content-col div.panel {
background:url(../stat/panel-training.gif) no-repeat;
width:345px;
height:139px;
margin-bottom:60px;
float:right;
margin-left:20px;
margin-right:-26px;
_margin-right:0;
overflow:visible;
}
#content-col div.panel p {
color:#FFF;
padding:20px 105px 0 18px;
font-size:1.2em;
}
#content-col div.panel p strong {
font-size:1.6em;
}
#content-col div.panel p em {
font-weight:bold;
font-style:normal;
}
/*--- FOOTER  ---------------------------------------------------------*/
#footer-holder {
background-color:#7FC31C;
width:100%;
border-bottom:40px solid #FFF;
}
#footer {
text-align:left;
width:777px;
margin:0 auto;
position:relative;
}
#footer p {
padding:10px 0;
font-size:1em;
}
#footer p a {
margin-left:1em;
padding-left:1em;
border-left:2px solid #FFF;
color:#000;
text-decoration:none;
}
#footer p a:hover {
text-decoration:underline;
}
/*--- TEXT-INDENT  ---------------------------------------------------------*/
#header h2
{
overflow:hidden;
text-indent:-3000px;
text-decoration:none;
}
/*--- FORM  ----------------------------------------------------------*/
form fieldset {
border:none;
padding:2px;
width:600px;
padding:20px 0 0 40px;
}
form p {
clear:both;
position:relative;
margin:0;
padding-bottom:9px;
overflow:hidden;
}
form label {
width:100px;
display:block;
padding-bottom:3px;
float:left;
text-align:left;
padding-right:10px;
font-size:1em;
}
form p span {
margin-left:0.4em;
color:#c03;
}
form em {
font-weight:bold;
font-style:normal;
color:#c03;
font-size:1em;
padding:3px 0 0;
display:block;
position:absolute;
left:415px;
top:-5px;
width:160px;
}
form input {
border:1px solid #8B8F92;
width:280px;
display:block;
color:#333;
float:left;
font-size:1em;
padding:1px 2px;
}
form textarea {
border:1px solid #8B8F92;
width:280px;
height:100px;
display:block;
padding:1px 2px;
color:#333;
float:left;
font-size:1em;
}
form select {
border:1px solid #8B8F92;
float:left;
padding:1px 2px;
font-size:1em;
}
form input.error,
form textarea.error,
form select.error
{
border:1px solid #c03;
}
form input.short {
width:80px;
}
form input.medium {
width:170px;
}

form select.medium {
width:256px;
}
form p.accessory {
margin-top:1em;
}
form p.optin {
margin-top:1em;
}
form p.optin span {
display:block;
padding-top:5px;
}
form p.optin label {
width:auto;
display:inline;
float:none;
padding:0;
padding-top:5px;
font-size:1em;
font-weight:normal;
}
form p.optin input {
width:auto;
display:inline;
float:none;
padding:0;
margin:0;
border:none;
}
form p.note {
clear:both;
position:relative;
margin:0;
padding-bottom:9px;
overflow:hidden;
margin-left:110px;
padding-right:130px;
}
form div.form-buttons {
padding-top:1em;
margin-top:20px;
margin-left:110px;
}
div.form-buttons input {
width:auto;
padding:3px 1.5em;
font-weight:bold;
color:#FFF;
background-color:#666;
font-size:1.4em;
}

/*--- CLEARFIX  ---------------------------------------------------------*/
#navigation,
#navigation ul,
#navigation ul li,
#navigation ul li a,
#content
{
overflow:hidden;
}
legend {
height:0;
font-size:0;
}
/*--- HIDE STUFF COS ITS MORE ACCESSIBLE THAN DISPLAY:NONE;  ---------------------------------------------------------*/
#navigation p span,
#navigation h2,
#accessibility,
.hidevis,
hr
{
position:absolute;
top:0;
left:-90000px;
visibility:hidden;
height:0;
width:0;
}