body	{
	background:	#bccde7 url(background.jpg);
	font-family:	verdana, helvetica, arial, sans-serif;
	font-size:	.80em;
	text-align:	center;
	line-height:	150%;
	color:	#222222;
}
p	{
	margin-bottom:	1em;
	text-indent:	.8em;
}
p.noindent	{
	text-indent:	0;
}
ul	{
	list-style:	disc;
}
#topfade	{
	background:	url(background_fade.jpg);
	background-repeat:	repeat-x;
	padding-top:	62px;
	/* stops the fade from stopping after the horizontal fold. Would be 760px,
	   but the padding on the #dropshadow_right adds extra pixels. */
	min-width:	771px;
}
#container	{
	width:	100%;
	border:	1px solid #3e5872;
	position:	relative;
	background-color:	white;
	background-image:	url(images/container_fade.png);
	background-repeat:	repeat-y;
}
#sidebar	{
	float:	left;
	position:	relative;
	text-align:	center;
	left:	18px;
	top:	-29px;
	width:	216px;
	background-color:	#eef3fa;
	background-image:	url(images/sidebar_sides.png);
	background-repeat:	repeat-y;
}
#sidebar_top	{
	background-image:	url(images/sidebar_top.png);
	background-repeat:	no-repeat;
}
#sidebar_bottom	{
	background-image:	url(images/sidebar_bottom.png);
	background-position:	left bottom;
	background-repeat:	no-repeat;
	padding-top:	10px;
	padding-bottom:	40px;
}
#sidebar_divider	{
	border-top:	1px solid #d4e1ee;
	width:	177px;
	margin:	0 auto 0 auto;
	padding-bottom:	.8em;
}
#sidebar_divider div	{
	height:	12px;
	background-image:	url(images/sidebar_divider.png);
	background-position:	center top;
	background-repeat:	no-repeat;
	/* overlays the parent's top border when images are turned on */
	margin-top:	-1px;
}

h1	{
	background-image: url(images/logo_background.jpg);
	background-repeat:	no-repeat;
	height:	201px;
	width:	200px;
	padding:	0;
	padding-top:	15px;
	font-size:	2em;
	margin: 0 auto 0 auto;
	/* styles image "alt" text in FF, which doesn't show image outlines */
	line-height:	1.5em;
	font-family:	technical, tahoma, arial, sans-serif;
	font-weight:	bold;
}
h1 a	{
	color:	black;
}
h1 span	{
	position:	absolute;
	left:	-999px;
}
h1 img	{
	display:	block;
	margin:	0 auto 0 auto;
}
#content	{
	margin-left:	270px;
	padding:	1em 30px 2em 0;
	text-align:	justify;
	position:	relative;
	line-height:	150%;
	/* ensure text doesn't overlap the smile image too much */
	padding-bottom:	120px;
}
#content ul	{
	list-style-image:	url(images/bullet.gif);
	margin-top:	1.5em;
	margin-bottom:	1.5em;
}
#content ul li	{
	margin-left:	3em;
	padding-bottom:	.5em;
}
#content ol	{
	list-style:	decimal;
}
#content ol li	{
	margin-left:	3em;
	padding-bottom:	.5em;
	font-style:	italic;
}
h2	{
	font-family:	"trebuchet ms", helvetica, sans-serif;
	margin-left:	270px;
	text-align:	left;
	height:	197px;
	font-size:	2.2em;
	font-style:	italic;
	line-height:	150%;
	position:	relative;
	color:	#555555;
}
h2 span	{
	position:	absolute;
	bottom:	.5em;
}
h3	{
	border-bottom:	1px dotted #028ba2;
	margin:	1em 0 .5em -15px;
	font-size:	1.5em;
	font-style:	italic;
	line-height:	150%;
	font-family:	"trebuchet ms", helvetica, sans-serif;
	padding-left:	38px;
	background-image:	url(images/h3_deco.gif);
	background-position:	left center;
	background-repeat:	no-repeat;
}
#content_divider	{
	margin-left:	250px;
	border-top:	1px solid #d4e1ee;
	background:	url(images/content_divider.png);
	background-repeat:	repeat-x;
	height:	12px;
}
#content_divider div	{
	float:	left;
	background:	url(images/content_divider_fade.png);
	background-repeat:	no-repeat;
	width:	79px;
	height:	12px;
	font-size:	0;
	/* overlays the top border of parent element */
	margin-top:	-1px;
}
#footer	{
	margin:	1em auto 0 auto;
	font-size:	.7em;
	color:	#114477;
	text-align:	right;
}
#footer a	{
	color:	#114477;
}
#footer .vcard	{
	margin-right:	17px;
}
#footer #producers	{
	margin-right:	17px;
	color:	#003366;
}
#footer #producers a	{
	color:	#003366;
}
#associations	{
	line-height:	150%;
	text-align:	left;
	width:	250px;
	float:	left;
	clear:	left;
	padding-left:	10px;
}
#associations p	{
	text-indent:	0;
	float:	left;
	clear:	left;
	width:	250px;
}
#associations img	{
	float:	left;
	padding-right:	20px;
	padding-bottom:	5px;
}
#sidebar ul, #sidebar li{
	list-style:	none;
}
#nav	{
	text-align:	left;
	margin:	0 8px 0 8px;
}
#nav a	{
	display:	block;
	width:	180px;
	margin:	0;
	padding:	0;
	padding-left:	20px;
	background-image:	url(images/nav_hover.png);
	background-repeat:	repeat-y;
	font-weight:	bold;
	text-decoration:	none;
	line-height:	200%;
}
#nav a#currentpage	{
	background-position:	-200px;
}
#nav a:link	{
	color:	#222277;
}
#nav a:visited	{
	color:	black;
}
#nav a:hover	{
	background-color:	#d7e3f2;
	background-position:	-200px;
	text-decoration:	underline;
}
#nav li li a	{
	font-weight:	normal;
	text-decoration:	none;
	width:	165px;
	padding-left:	35px;
	line-height:	180%;
}


/* manual clears */
.clear	{
	clear:	both;
}
.clearright	{
	clear:	right;
}
.clearleft	{
	clear:	left;
}

#container #corner_topleft	{
	width:	6px;
	height:	6px;
	background:	url(images/corners.gif);
	font-size:	0;
	position:	absolute;
	top:	-1px;
	left:	-1px;
}
#container #corner_topright	{
	width:	12px;
	height:	6px;
	background:	url(images/corners.gif);
	background-position:	-6px 0;
	font-size:	0;
	position:	absolute;
	top:	-1px;
	right:	-7px;
	/* draw above later-in-the-flow background image */
	z-index:	1;
}
#container #corner_bottomleft	{
	width:	6px;
	height:	12px;
	background:	url(images/corners.gif);
	background-position:	0 -6px;
	font-size:	0;
	position:	absolute;
	bottom:	-7px;
	left:	-1px;
}
#container #corner_bottomright	{
	width:	12px;
	height:	16px;
	background:	url(images/corners.gif);
	background-position:	-6px -6px;
	font-size:	0;
	position:	absolute;
	bottom:	-11px;
	right:	-7px;
}
/* width settings for main elements */
#dropshadow_right, #footer	{
	min-width:	760px;
	max-width:	900px;
	width:	90%;
}

#dropshadow_right	{
	background:	url(images/container_dropright.gif);
	background-position:	right top;
	padding-right:	10px;
	background-repeat:	repeat-y;
	text-align:	left;
	margin-left:	auto;
	margin-right:	auto;
	position:	relative;
}
#dropshadow_right_fade	{
	position:	absolute;
	right:	-1px;
	top:	0;
	height:	130px;
	width:	8px;
	background:	url(images/container_dropright_fade.gif);
}
#dropshadow_bottom	{
	background:	url(images/container_dropbottom.gif);
	padding-bottom:	8px;
	background-position:	left bottom;
	background-repeat:	repeat-x;
}
#smile	{
	background:	url(images/background_smile.jpg);
	background-position:	right bottom;
	background-repeat:	no-repeat;
}
.enhance	{
	color:	#11407b;
}
.nodecoration	{
	text-decoration:	none;
}
strong	{
	font-weight:	bold;
}
em	{
	font-style:	italic;
}
strong em	{
	font-weight:	bold;
	font-style:	normal;
	text-decoration:	underline;
}
address	{
	display:	inline;
}
abbr	{
	border-bottom:	1px dotted white;
}
/* navigation and content skip links */
.skip	{
	position:	absolute;
	left:	-999em;
}


/* floated content images with captions */
.left	{
	float:	left;
	/* we can't use clear:left here, since elements will display below the
	   left-floated sidebar. Ensure a reasonable amount of content seperates them. */
	padding-right:	20px;
	margin:	0 0 8px 0;
	text-align:	center;
	background:	white;
}
.right	{
	float:	right;
	clear:	right;
	padding-left:	20px;
	margin:	0 0 8px 0;
	background:	white;
	text-align:	center;
}
.left a, .right a	{
	display:	block;	
	padding:	0;
	margin-bottom:	20px;
}
.left img, .right img	{
	background-color:	white;
	padding:	1px;
	border:	1px solid black;
}
.left .caption, .right .caption	{
	line-height:	120%;
	display:	block;
	font-size:	.8em;
	margin-bottom:	10px;
}
/* this should be done with first-child, but IE <7 doesn't support it */
.left .hascaption, .right .hascaption	{
	margin-bottom:	6px;
}

/* image container classes */
.imagecontainer	{
	text-align:	center;
	font-size:	.9em;
	font-variant:	small-caps;
	margin-left:	auto;
	margin-right:	auto;
}
.imagecontainer	img{
	margin:	10px;
}


/* img link hover border effect */
a.imagelink img	{
	padding:	1px;
	border:	1px solid black;
}
/* normal browsers -- applies hover border to the img. */
a.imagelink img:hover	{
	padding:	0;
	border:	2px solid blue;	
}


/* floats with no margin (used primarily for the zoom lamp images */
.rightnobreak	{
	margin:	0;
	padding:	0;
	float:	right;
	clear:	right;
	/* stops adjacent element borders from showing underneath.
	   I wish there was a better fix for this. */
	border-left:	10px solid white;
	background-color:	white;
}


/* definition lists */
dl	{
	margin:	1em 0 1em 0;
}
dt	{
	padding-left:	28px;
	background-image:	url(images/questionmark.gif);
	background-position:	left top;
	background-repeat:	no-repeat;
	min-height:	30px;
	font-weight:	bold;
	margin-bottom:	.5em;
	font-style:	italic;
}
dd	{
	margin-left:	28px;
	padding:	0 0 0 11px;
	border-left:	1px solid #547aa3;
}

/* contact form elements */
form	{
	text-align:	left;
}
form p label	{
	color:	#114477;
	text-indent:	0;
	font-weight:	bold;
}
form input	{
	display:	block;
}
form #formemail	{
	width:	250px;
	background-color:	#EBF3FC;
	margin-left:	20px;
	padding:	2px;
	border:	1px solid #B3C4E2;
}
form #formtext	{
	width:	400px;
	background-color:	#EBF3FC;
	margin-left:	20px;
	padding:	2px;
	height:	10em;
	border:	1px solid #B3C4E2;
}
form #upload	{
	width:	400px;
	background-color:	#EBF3FC;
	margin-left:	20px;
	border:	1px solid #B3C4E2;
}
form #submit	{
	margin-left:	20px;
}

/* elements created upon return from form send */
#success	{
	background-color:	#eeffee;
	border:	2px solid green;
	color:	black;
	padding:	1em;
	margin-bottom:	2em;
}
#failure	{
	background-color:	#ffeeee;
	border:	2px solid red;
	color:	black;
	padding:	1em;
	margin-bottom:	2em;
}
#success p, #failure p	{
	text-indent:	0;
}

/* new feature colouring */
.newfeature	{
	font-weight:	bold;
	color:	blue;
}
.newfeature strong	{
	background-color:	red;
	padding:	0 .2em;
	font-weight:	bold;
	color:	white;
	font-size:	1em;
}

#feedbacklink	{
	padding-bottom:	8px;
	margin:	0;
}
#feedbacklink a	{
	padding-left:	10px;
	font-size:	.7em;
	color:	#114477;
}

/* page-specific headers */
h2	{
	background-position:	right top;
	background-repeat:	no-repeat;
	padding-right:	225px;	
}
#heading_home	{	background-image:	url(images/header_home.jpg);}
#heading_services	{	background-image:	url(images/header_home.jpg);}
#heading_painfreedentistry	{	background-image:	url(images/header_painfreedentistry.jpg);}
#heading_toothwhitening	{	background-image:	url(images/header_toothwhitening.jpg);}
#heading_whitefillings	{	background-image:	url(images/header_whitefillings.jpg);}
#heading_implants	{	background-image:	url(images/header_implants.jpg);}
#heading_smilemakeovers	{	background-image:	url(images/header_smilemakeovers.jpg);}
#heading_dentalhygienist	{	background-image:	url(images/header_dentalhygienist.jpg);}
#heading_healthfunds	{	background-image:	url(images/header_healthfunds.jpg);}
#heading_interestfree	{	background-image:	url(images/header_interestfree.jpg);}
#heading_about	{	background-image:	url(images/header_about.jpg);}
#heading_contact	{	background-image:	url(images/header_contact.jpg);}
