/* -------------------------------------------------------------- 
   
   CSS Framework
   Web Design & Development by Studio 24 Ltd
   www.studio24.net - (0870) 241 6159
     
-------------------------------------------------------------- */
@import "reset.css";

/* =CONTAINERS
-------------------------------------------------------------- */
body {
	background: #fff url(../img/layout/bg.jpg) repeat-x 0 0;
}

div#container {
	/* set as 'standard' width, centred container for 1024x768 site */
	position: relative;
	width: 960px;
	margin: 0 auto;
}

/* =BASIC TYPOGRAPHY
-------------------------------------------------------------- */
body {
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-size: 100%; /* Dont resize here, resize text elements below */
	line-height: 1.125em;
}

p,ul,ol,dl,table,form {
	font-size: 0.75em;
	/* 12px - changing this will mean you have to re-calculate all nested font-sizing - just leave it alone! */
}

p {
	margin: 0 0 1em 0;
}

h1,h2,h3,h4,h5,h6 {
	line-height: 1.5em;
}

h1 {
	font-size: 2em; /* 32px */
	color: #018475;
	line-height: 1.1em;
}

h2 {
	color: #333;
	font-size: 1.75em; /* 28px */
	font-size: 1.25em; /* 20px */
}

#content-secondary h2 {
	color: #333;
	font-size: 1em; /* 16px */
}

h3 {
	color: #666;
	font-size: 1.5em; /* 24px */
	font-size: 1.25em; /* 20px */
}

h4 {
	font-size: 1.25em; /* 20px */
	font-weight: bold;
}

h5 {
	font-size: 1em; /* 16px */
	font-weight: bold;
}

#content-tertiary h5 {
	color: #333;
	font-weight: normal;
	margin-top: 175px;
	margin-left: 30px;
	width: 140px;
	line-height: 1.2em;
}

h6 {
	font-size: 0.75em; /* 12px */
	font-weight: bold;
}

/* =NESTED HEADINGS */
ul h1,ol h1,table h1 {
	font-size: 2.67em;
}

ul h2,ol h2,table h2 {
	font-size: 2.34em;
	font-size: 1.67em; /* 20px */
}

ul h3,ol h3,table h3 {
	font-size: 2em;
}

ul h4,ol h4,table h4 {
	font-size: 1.67em;
}

ul h5,ol h5,table h5 {
	font-size: 1.33em;
}

ul h6,ol h6,table h6 {
	font-size: 1em;
}

/* =SITE-TOOLS
-------------------------------------------------------------- */
ul#site-tools {
	list-style-type: none;
}

/* =NAV-PRIMARY
-------------------------------------------------------------- */
ul#nav-primary {
	list-style-type: none;
	margin: 0 auto;
	padding: 10px 0;
	height: 20px;
	width: 100%;
	text-align: center;
	border-top: solid 1px #999;
	border-bottom: solid 1px #999;
	background: url(../img/layout/overlay.png);
}

ul#nav-primary ul { /* hide nested lists on main nav */
	display: none;
}

ul#nav-primary li {
	display: inline;
	font-size: 1.25em;
	padding: 0 12px 0 16px;
	background: transparent url(../img/layout/nav-primary-dot.gif) no-repeat
		0 50%;
}

ul#nav-primary li.first-nav-primary {
	background: none;
}

ul#nav-primary li.last-nav-primary {
	
}

ul#nav-primary li a {
	color: #000;
	text-decoration: none;
}

ul#nav-primary li a:hover,body.home ul#nav-primary li#nav-home a,body.background ul#nav-primary li#nav-background a,body.basic-concepts ul#nav-primary li#nav-basic-concepts a,body.dietary-assessment ul#nav-primary li#nav-dietary-assessment a,body.physical-activity-assessment ul#nav-primary li#nav-physical-activity-assessment a,body.choosing-a-method ul#nav-primary li#nav-choosing-a-method a,body.forum ul#nav-primary li#nav-forum a
	{
	color: #018475;
}

/* =NAV-SECONDARY
-------------------------------------------------------------- */
#content-tertiary ul,ul#nav-secondary {
	list-style-type: none;
	margin: 10px 0 0 0;
	padding: 0;
	font-size: .9em;
}

#content-tertiary ul {
	margin-top: 230px; /* allow space above for background image */
}

#content-tertiary ul li,ul#nav-secondary li {
	line-height: 1.5em;
	margin-left: 12px;
	background: #fff url(../img/layout/submenu-arrow.gif) no-repeat 0 50%;
	padding-left: 18px;
}

#content-tertiary ul li a,ul#nav-secondary li a {
	text-decoration: none;
	color: #000;
}

#content-tertiary ul li a:hover,ul#nav-secondary li a:hover {
	/*	color:#000;*/
	color: #666;
}

/* =NAV-TERTIRARY
-------------------------------------------------------------- */
ul#nav-tertiary {
	list-style-type: none;
}

/* =BREADCRUMB
-------------------------------------------------------------- */
ul#nav-breadcrumb {
	list-style-type: none;
	margin: 0 0 18px 0;
	padding: 0;
}

ul#nav-breadcrumb li a {
	padding-right: 8px;
	margin-right: 6px;
	background: #fff url(../img/layout/breadcrumb-arrow.gif) no-repeat 100%
		50%;
	text-decoration: none;
}

ul#nav-breadcrumb li {
	display: inline;
	color: #666;
}

/* =CONTENT CONTAINERS
-------------------------------------------------------------- */
div#content {
	float: left;
	padding-bottom: 100px;
	background: #fff url(../img/layout/content-bg.jpg) no-repeat bottom left
		;
}

div#content-primary,div#content-primary-wide {
	float: left;
	margin-top: 20px;
	padding-left: 20px;
	padding-right: 40px;
	/*	padding-bottom:65px; */
	width: 425px;
	border-left: solid 1px #ccc;
	background: #fff url(../img/layout/content-primary-bg.jpg) no-repeat
		100% 0;
	/*	outline:solid 1px; */
}

div#content-primary-wide {
	background: none;
	width: 660px;
}

div#content-primary-full-width {
	background: none;
	padding: 20px;
	width: 920px;
}

body.forum div#content-primary {
	background: none;
	border-left: none;
	padding-right: 20px;
	width: 920px;
}

div#content-secondary {
	float: left;
	margin-top: 20px;
	padding: 0 20px 0 0;
	width: 215px;
	background: #fff url(../img/layout/search-bg.jpg) no-repeat 100% 0;
	/*	outline:solid 1px; */
}

div#content-tertiary {
	float: left;
	width: 239px;
}

/* set section background images */
body.background div#content-tertiary {
	background: #fff url(../img/layout/background-bg.jpg) no-repeat -6px 5px
		;
}

body.basic-concepts div#content-tertiary {
	background: #fff url(../img/layout/basic-concepts-bg.jpg) no-repeat -6px
		5px;
}

body.dietary-assessment div#content-tertiary {
	background: #fff url(../img/layout/dietary-assessment-bg.jpg) no-repeat
		-6px 5px;
}

body.physical-activity-assessment div#content-tertiary {
	background: #fff url(../img/layout/physical-tertiary-bg.jpg) no-repeat
		-6px 5px;
}

body.choosing-a-method div#content-tertiary {
	background: #fff url(../img/layout/choosing-a-method-bg.jpg) no-repeat
		-6px 5px;
}

div#content-tertiary {
	background: #fff url(../img/layout/search-tertiary-bg.jpg) no-repeat
		-6px 5px;
}

/* =SITE-INFO
-------------------------------------------------------------- */
ul#site-info {
	clear: both;
	list-style-type: none;
	position: relative;
	top: 4px;
}

ul#site-info li {
	display: inline;
}

p#site-credit {
	float: right;
	text-align: right;
	margin-right: 24px;
	display: inline; /* for IE */
	position: relative;
	top: -26px;
}

/* =LINKS
-------------------------------------------------------------- */
a:link,a:visited,a:focus,a:active {
	color: #000;
}

a:hover {
	color: #018475;
}

#skipLink {
	position: absolute;
	left: -9000px;
	top: 0;
	z-index: 20;
}

/* icon links */
.pdf,a.pdf,a.pdf:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/pdf.gif) no-repeat 0 0;
}

.word,a.word,a.word:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/word.gif) no-repeat 0 0;
}

.excel,a.excel,a.excel:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/excel.gif) no-repeat 0 0;
}

.txt,a.txt,a.txt:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/txt.gif) no-repeat 0 0;
}

.flash,a.flash,a.flash:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/flash.gif) no-repeat 0 0;
}

.video,a.video,a.video:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/video.gif) no-repeat 0 0;
}

.podcast,a.podcast,a.podcast:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/podcast.gif) no-repeat 0 0;
}

.pub,a.pub,a.pub:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/pub.gif) no-repeat 0 0;
}

.rss,a.rss,a.rss:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/rss-feed.gif) no-repeat 0 0;
}

.print,a.print,a.print:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/print.gif) no-repeat 0 0;
}

.friend,a.friend,a.friend:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/friend.gif) no-repeat 0 0;
}

.help,a.help,a.help:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/help.gif) no-repeat 0 0;
}

.info,a.info,a.info:hover {
	padding: 2px 0 4px 20px;
	background: #fff url(../img/icons/info.gif) no-repeat 0 0;
}

p#top-link a:link,p#top-link a:visited,p#top-link a:focus,p#top-link a:active
	{
	background: url(../img/icons/top.gif) no-repeat 100% 0;
	clear: both;
	float: right;
	padding-right: 20px;
}

/* =LISTS
-------------------------------------------------------------- */
ul {
	margin: 0 0 1em 2em;
}

ol {
	margin-left: 2.4em;
	/* larger left margin to line up numeral with bullets on unordered lists */
}

ol.alpha {
	list-style-type: lower-alpha;
}

dl {
	margin: 0 0 1em 2em;
}

dt {
	font-weight: bold;
}

dt,dd {
	margin: 0 0 0.5em 0;
}

/* =NESTED ELEMENTS - resetting the font-sizes */
ul ul,ol ol,ul ol,ol ul,dd ul,dd ol,table ul,table ol,ul table,ol table,ul p,ol p,dl p,table p,p code,p pre,form ul,form ol,form dl,form table,form code,form pre,form p
	{
	font-size: 100%;
}

ul ul,ol ol,ul ol,ol ul,dd ul,dd ol {
	margin-bottom: 0;
}

ul#forum-feed {
	margin: 0 0 0 -10px;
	padding: 0;
	list-style-type: none;
	/*	outline:solid 1px; */
}

ul#forum-feed li {
	margin: 0;
	padding-left: 10px;
	line-height: 2em;
	background: #fff url(../img/layout/forum-arrow.gif) no-repeat 0 8px;
	/*	outline:solid 1px red; */
}

/* =OTHER TEXT ELEMENTS
-------------------------------------------------------------- */
blockquote {
	
}

pre,code {
	font-size: 0.85em;
	margin: 0 0 1em 0;
}

/* =TABLES
-------------------------------------------------------------- */
	/* NOTE: tables still need 'cellspacing="0"' in the markup for browser reset consistency */
table {
	width: auto;
	margin: 0 0 1em 0;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}

th,td {
	padding: 0.3em 0.4em 0.2em 0.4em;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

th {
	font-weight: bold;
}

table .alt {
	/* use this class on every other <tr> for a zebra effect - change colour as suits */
	background: #edf3fe;
	background: #fff;
}

/* -------------------------------------------------------------- 
   -------------------------------------------------------------- 
	     				FORMS
   -------------------------------------------------------------- 
   -------------------------------------------------------------- */
	/* =DEFAULT-FORM-STYLES
----------------------------------------------- */
form.default-form {
	
}

form.default-form fieldset {
	margin: 1em 0 0 0;
	padding: 0;
	border: 1px solid #EEE;
}

form.default-form fieldset.actions {
	border: none;
}

form.default-form legend {
	font-weight: bold;
	padding: .5em;
	margin-left: 1em;
}

form.default-form p {
	
}

form.default-form div {
	display: block;
	width: 100%;
	float: left;
	padding: 0.5em 0 0.5em 0;
	border-top: 1px solid #EEE;
}

form.default-form div.alt {
	background: #edf3fe;
	/* example background colour for optional 'zebra' effect */
}

form.default-form label {
	position: relative;
	top: 0.15em;
	padding: 0 0 0 1em;
	width: 15em;
	/* change this width according to your site design to line things up */
	float: left;
}

form.default-form label em {
	position: absolute;
	right: 0.5em;
	color: red;
	font-weight: bold;
}

form.default-form .radio,form.default-form .checkbox {
	position: relative;
	top: 0.2em;
	float: left;
	margin: 0 0.5em 0 0.5em;
	width: auto;
}

form.default-form #day,form.default-form #month,form.default-form #year
	{
	position: relative;
	top: 0;
	width: 4.8em; /* small width set for date selection dropdowns */
}

form.default-form fieldset.actions {
	border: none;
	text-align: right; /* set right or left as suits your design */
}

form.default-form fieldset.actions p {
	display: inline;
}

form.default-form #submit {
	width: auto;
}

form.default-form input,form.default-form textarea,form.default-form select
	{
	width: 15em;
}

form.default-form .error {
	/* example highlighting style for form validation */
	border: 1px solid red;
	background: #FFCCCC;
}

/* ---------- search form ---------- */
form#search {
	position: relative;
	top: -5px;
	left: 15px;
	width: 255px;
	margin-left: -20px;
}

form#search fieldset {
	border: none;
}

form#search label {
	color: #333;
	position: relative;
	left: -5px;
}

input#search-input {
	color: #666;
}

#search-button {
	position: relative;
	top: 7px;
}

/* =SEARCH RESULTS PAGE
-------------------------------------------------------------- */
dl#search-results-list {
	list-style-type: none;
	margin: 10px 40px 0 0;
	padding: 0;
	line-height: 1.2em;
}

dl#search-results-list dt a {
	font-size: 1.2em;
	margin: 20px 0 0 0;
	padding-left: 10px;
	background: #fff url(../img/layout/forum-arrow.gif) no-repeat 0 50%;
	text-decoration: none;
}

dd.search-highlight {
	color: #666;
	font-style: italic;
	padding-left: 10px;
}

dd.search-url {
	padding-left: 10px;
	border-bottom: solid 1px #ddd;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

dd.search-url a {
	text-decoration: none;
}

/* =ERROR MESSAGES
----------------------------------------------- */
div#error {
	padding: 18px 0 0 52px;
	margin: 1em 0 1em 0;
	border: 1px solid red;
	background: #FFCCCC url(../img/icons/icon-alert-warning.gif) no-repeat
		10px 10px;
}

/* =IMAGES
-------------------------------------------------------------- */
img#logo {
	margin: 17px 0 17px 776px;
}

/* =HOMEPAGE
-------------------------------------------------------------- */
body.home div#content {
	background: transparent url(../img/layout/content-bg.jpg) no-repeat
		bottom left;
}

body.home div#container {
	background: #fff url(../img/layout/home-bg.jpg) no-repeat 0 0;
}

body.home div#content {
	padding-bottom: 65px;
}

body.home h1 {
	font-size: 1.25em; /* 20px */
	color: #000;
	margin-top: 58px;
	margin-left: 484px;
}

body.home h2 {
	color: #000;
	font-size: 1.75em; /* 28px */
}

body.home p.home-intro {
	margin-left: 484px;
	width: 440px;
	font-size: .9em;
	line-height: 1.6em;
	color: #333;
}

body.home form#search {
	position: absolute;
	top: 410px;
	right: 0;
	text-align: right;
	width: auto;
	margin-left: 0;
}

body.home form#search label {
	color: #fff;
}

ul#homepage-features {
	margin: 145px 0 0 0;
	padding: 0;
	list-style: none;
}

ul#homepage-features li {
	position: relative;
	float: left;
	width: 215px;
	height: 322px;
	padding: 0 12px 5px 12px;
	border-left: solid 1px #ccc;
}

ul#homepage-features li#dietary-promo {
	border-left: solid 1px #fff;
	background: transparent url(../img/layout/dietary-promo-bg.jpg)
		no-repeat 24px 35px;
}

ul#homepage-features li#physical-promo {
	background: transparent url(../img/layout/physical-promo-bg.jpg)
		no-repeat 12px 30px;
}

ul#homepage-features li#choosing-promo {
	background: transparent url(../img/layout/choosing-promo-bg.jpg)
		no-repeat 12px 20px;
}

ul#homepage-features li#forum-promo {
	background: transparent url(../img/layout/forum-promo-bg.jpg) no-repeat
		12px 20px;
}

ul#homepage-features li a {
	display: block;
	height: 205px;
	background: transparent url(../img/layout/promo-button.gif) no-repeat 0
		180px;
	margin-bottom: 5px;
	vertical-align: text-bottom;
}

ul#homepage-features li a:hover {
	background: transparent url(../img/layout/promo-button-roll.gif)
		no-repeat 0 180px;
}

/* =DECISION MATRIX
-------------------------------------------------------------- */
table#matrix {
	border-collapse: collapse;
	font-size: 0.9em;
	width: 700px;
}

table#matrix tr th {
	padding: 5px;
	background: #a09f7d;
}

table#matrix tr th,table#matrix  tr td {
	border: 1px solid black;
	text-align: center;
	
}

table#matrix tr td{
	height: auto;
	}

table#matrix tr td .info_img,table#matrix tr th .info_img{
margin:0;
padding:0;
float:right;
}

table#matrix tr td div {
	width:20px;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	font-weight: bold;
	position: relative;
}

table#matrix th.subheader {
	padding: 5px;
	background: #d4dda2;
	text-align: left;
}

/*Links in the left column*/
table#matrix tr.row-even th,table#matrix tr.row-odd th {
	cursor: pointer;
	color: #206860;
}

/* Even rows background color */
table#matrix tr.row-even th,table#matrix tr.row-even td {
	background: #fff;
}

/* Odd rows background color */
table#matrix tr.row-odd th,table#matrix tr.row-odd td {
	background: #f7f6e4;
}

/* Color of the link in the left column when hoverd */
table#matrix tr.row-odd th:hover,table#matrix  tr.row-even th:hover {
	color: #023d36;
}

/* Color of the background row when X are displayed */
table#matrix tr#display th,table#matrix tr#display td {
	background: #ededed;
	color: #000;
}

/* Color of the background column when X are displayed */
table#matrix tr th.colselected {
	background: #78c8c0;
}

table#matrix tr td.colselected {
	background: #78c9b0;
}

ul#table-legend {
	font-size: 0.9em;
	padding: 4px;
	list-style: none;
	text-align: left;
}

table#matrix tr th,table#matrix  tr td {
	border: 1px solid black;
	text-align: center;
}

/* =ADMIN LOGIN / FORGOTTEN PASSWORD
-------------------------------------------------------------- */
body.login div#content {
	padding-bottom: 50px;
}

body.forgotten div#content {
	padding-bottom: 250px;
}

img#s24-logo {
	position: absolute;
	top: 10px;
	left: 20px;
}

body.login h1,body.login h2,body.forgotten h1,body.forgotten h2 {
	text-align: center;
}

body.login #content p {
	font-size: 1.4em;
}

body.login #content p.small {
	font-size: 1em;
	text-align: left;
	padding: 0 9.8em;
}

div#login-wrapper {
	border: solid 1px #ddd;
	width: 600px;
	margin: 20px auto;
}

body.login table,body.login tr,body.login td {
	border: none;
	margin: 20px auto;
}

ul#login-links {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul#login-links li {
	line-height: 2em;
	margin: 0;
	padding-left: 10px;
	background: #fff url(../img/layout/forum-arrow.gif) no-repeat 0 9px;
}