/* 
Stylesheet for Smoke Free Bristol web site
Last updated: July 8, 2005
Author: Martin Glancy, ID
*/

/* TEXT AND PAGE ###################### */

/* Cure IE odd scroll bar behaviour ===== */
html {
	overflow-y: scroll;
}

body {
	background-color: #EAEAEA;
	color: #000000;
	margin: 0px;
	text-align: center;
	margin-bottom: 10px;
	}


/* SET FONTS  ###################### */
body, p, div, li, dd, td, th, h1, h2, h3, h4, select, option, blockquote {
	font-family: "Trebuchet MS", Arial, Helvetica, Helv, Geneva, sans-serif;
	}

/* LINK COLOUR  ###################### */

a {
	color: #00365C;
	}
	
/* LAYOUT DIVS ###################### */

/* Print-only info at page top */
#printheader{
	visibility: hidden;
	display: none;
	}

#container {
	background-color: #FFFFFF;
	width: 753px;
	margin: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1px;
	margin-top: 0px;
	padding: 0px;
	text-align: left;
	}

#header {
	margin-bottom: 5px;
	}

#bannertop {
	padding: 0px;
	margin: 0px;
	background-image: url(../images/banner-pagetop.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	height:60px;
	}

#banner {
	padding: 0px;
	margin: 0px;
	}
	
#header p {
	padding: 30px 20px 0px 0px;
	margin: 0px;
	text-align: right;
	}

#menu {
	float: left;
	width: 170px;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	background-color: transparent;
	}

#content {	
	background-color: #FFFFFF;
	margin-left: 180px;
	margin-right: 0px;
	padding: 15px 0px 0px 0px;
	}

	/* IE 3 pixel jog fix  */
* html #content {
	height:1%; margin-left:177px; /* fix 3 pixel jog and account for 3 pixels extra padding*/
	}
* > html #content {
	height:auto;  /* IE mac */
	}

#sidebar {
	float: right;
	width: 170px;
	padding-right: 0px;
	}

#footer {
	clear: both;
	padding: 0px;
	margin: 40px 0px 10px 180px ;
	background-color: #FFFFFF;
	}

#text {
	width: 393px;
	} 

h1, h2, h3 {
	color: #00365C;
	background-color: transparent;
	}

h1 {
	margin: 0px 0px 20px 0px;
	padding: 0px;
	}

h1, h2 {
	border-bottom: 2px dotted #66CEF6;
	}
	
/* MENU ###################### */

#menu h2 {
	padding: 2px 5px 2px 5px;
	background-image: url(../images/menu-but.gif);
	background-repeat:no-repeat;
	background-position: top left;
	border-bottom: 0px;
	margin-bottom: 3px;
	margin-top: 13px;
	}

#menu div {
	background-image: url(../images/menu-but.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	}

#menu p {
	background-image: url(../images/menu-arrow.gif);
	background-repeat:no-repeat;
	background-position: top left;
	padding: 0px;
	margin: 0px;
	padding-left: 18px;
	}

#menu a {
	}

#menu a:link, #menu a:visited {
	text-decoration: none;
	}

#menu a:hover {
	text-decoration: underline;
	}


/* FONT SIZES ###################### */

div, p, h3, h4, th, td, ul, ol, li, dd, address
    {
    font-size : small;
    }

/*/*/a{}

body, body div, body p, body h3, body h4, body th, body td, body ul, body ol, body li, body dd, body address
    {
    font-size : x-small;
    voice-family : "\"}\"";
    voice-family : inherit;
    font-size : small;
    }

html>head:first-child+body div, html>head:first-child+body p, html>head:first-child+body h3, html>head:first-child+body h4, html>head:first-child+body th, html>head:first-child+body td, html>head:first-child+body li, html>head:first-child+body dd, html>head:first-child+body address
    {
    font-size : small;
    }

/* */


/* ================================== */

h1
    {
    font-size : x-large;
    }

/*/*/a{}

body h1
    {
    font-size : large;
    voice-family : "\"}\"";
    voice-family : inherit;
    font-size : x-large;
    }

html>head:first-child+body h1
    {
    font-size : x-large;
    }

/* */

/* ================================== */

h2
    {
    font-size : large;
    }

/*/*/a{}

body h2
    {
    font-size : medium;
    voice-family : "\"}\"";
    voice-family : inherit;
    font-size : large;
    }

html>head:first-child+body h2
    {
    font-size : large;
    }

/* */

/* FONT ENDS ###################### */

/* MISC CLASSES ###################### */

p.extlink a, p.pdflink a, p.intlink a, p.toplink a, p.wordlink a {	
	padding-left: 24px;
	}

p.extlink {	
	background-image: url(../images/icon-extlink.gif);
	background-repeat:no-repeat;
	background-position: top left;
	}

p.intlink  {
	background-image: url(../images/icon-intlink.gif);
	background-repeat:no-repeat;
	background-position: top left;
	}

p.pdflink  {
	background-image: url(../images/icon-pdflink.gif);
	background-repeat:no-repeat;
	background-position: top left;
	}
	
p.wordlink  {
	background-image: url(../images/icon-wordlink.gif);
	background-repeat:no-repeat;
	background-position: top left;
	margin-top: -1em;
	}

p.toplink  {
	color: #333366;
	background-image: url(../images/icon-toplink.gif);
	background-repeat:no-repeat;
	background-position: top left;
	margin-top: 10px;
	}

/* RIGHT HAND BOXES ###################### */

p#rbconsult {
	background-image: url(../images/rbox-consult.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbunder18 {
	background-image: url(../images/rbox-under18.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbhomes {
	background-image: url(../images/rbox-home.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbworkplace {
	background-image: url(../images/rbox-workplace.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbpetition {
	background-image: url(../images/rbox-epetition.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbpeople {
	background-image: url(../images/rbox-people.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

p#rbplaces {
	background-image: url(../images/rbox-places.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}
	
p#rbadvice {
	background-image: url(../images/rbox-advice.jpg);
	background-repeat:no-repeat;
	background-position: top left;
	padding-top: 60px;
	font-size: 1.2em;
	}

a.rb {
	display: block;
	background-image: url(../images/rbox-bot.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	padding: 1px 10px 6px 10px;
	font-weight: bold;
	text-decoration: none;
	}
	
a.rbtext {
	display: block;
	background-image: url(../images/rbox-bot.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	padding: 1px 0px 6px 0px;
	font-weight: bold;
	text-decoration: none;
	}

a.rb:hover {
	background-image: url(../images/rbox-bot-on.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	}

.partners {
	font-size: 0.9em;
	color: #999999;
	padding-left: 5px;
	margin-top: 1px;
	}


p.intro {
	font-weight: bold;
	color: #00365C
	}

span.bignumber {
	font-size: 3em;
	line-height: 1em;
	width: 0.7em;
	color: #00365C;
	font-weight: bold;
	float:left; 
	}

* html span.bignumber {
	}


/* QUOTE BOXES ###################### */


div.quotebox {
	background-image: url(../images/quote-box.gif);
	background-repeat:no-repeat;
	background-position: top left;
	padding: 1px 0px 0px 0px;
	}

div.quotebox p {
	background-image: url(../images/quote-box.gif);
	background-repeat:no-repeat;
	background-position: bottom left;
	padding: 0px 20px 40px 10px;
	margin-top: 15px;
	color: #385DAB;
	font-weight: bold;
	}



/* set cite for copyright at page bottom ###################### */
cite { 
	font-style: normal; 
	color: #666666; 
	}

/* COLOUR BOXES USING DIV TAGS ###################### */
/* highlightbox div is for sections that need to be boxed on page */
div.highlightbox { 
	background-color: #F0DBEF; 
	padding: 5px 10px 5px 10px; 
	}



/* ACCESSIBILITY CONVERSIONS ###################### */

em {
	font-style: italic;
	}

strong {
	font-weight: bold;
	}

/* SKIP MENU LINK ###################### */
.skipLink a {
	position: absolute;
	overflow: hidden;
	width: 0;
	height: 0;
}

.skipLink a:active, .skipLink a:focus {
	position: absolute;
	overflow: visible;
	width: auto;
	height: auto;
	/* The rest are purely presentational properties to make the link stand out */
	background-color: yellow;
	color: red;
	top: 5px;
	left: 5px;
	padding: 5px;
	border: 2px solid red;
	font-weight: bold;
}