/* 	Styles for Body Detox Clinic
		Styles by www.axxesssolutions.net
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Sets the colours of the search forms & inputs */
#searchbox .submit {
	border: 1px outset #9cc;
	background-color: #eee;
	color: #333;
}
checkbox:focus, input:focus, input.text:focus, radio:focus, select:focus, textarea:focus, input.submit:focus {
	background-color: #EBF5F5;
	border-color: #9cc;
	color: #000;
}

/* Reformat the default tag's appearance
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
html {background: #f3f3f3;}
body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
 font-family: Arial, Helvetica, sans-serif;
} 

/* Headings */
h1, h2, h3, h4, h5, h6 {	
	color: #555;
	font-family: Tahoma, "Lucida Sans", sans-serif;
	clear: both;
}
h1 { font-size: 130%; color: #399; font-weight: normal; }
h2 { font-size: 110%; text-indent: 16px; color: #399; }
h3 { font-size: 100%; text-indent: 16px; }
h4 {  }
h5 {  }
h6 {  }

h2, h3, h4 { border-bottom: 1px solid #555; }


/* Default Hyperlinks */
a:link 		{color: #399;}
a:visited {color: #399;}
a:active 	{color: #f33;} 
a:hover 	{color: #f33;}

blockquote {
	border: 1px solid #399;
	background-color: #F0F7F7; /*fefefe*/
	padding: 2px;
	font-style: oblique;
	font-weight: bold;
	color: #399;
	font-size: 1.2em;
	margin: 4px; 
}
blockquote:before { content: open-quote; }
blockquote:after  { content: close-quote;}

/* keep table borders for users without stylesheets
 & hide the "ugly" borders for those with */
table[border="1"] { border: 0; }

fieldset legend { color: #000; }

/* Block Level Items (The buidling Blocks)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#pagewidth {width:769px; text-align:left; margin-left:auto; margin-right:auto; background: #EBF5F5;} /* 767px */
#pageframe {	border: 1px solid #ddd; }

/* Head Content
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#header{
	background: #DAECEC url('images/bg_banner.jpg') no-repeat;
	position:relative; 
	height:134px; 
/*  background-color:#fff;  */
	width:100%;
	clear: both;
} 
#header #sitelogo {
	width: 284px;
	float: left;
	position:relative;
}
#header2 {background: #daecec url('images/menutop.gif') no-repeat;height: 50px; clear: both; }
#header3 {background: #daecec url('images/bodyrow2.gif') no-repeat;height: 31px; clear: both; text-align: right; font-size: 11px; color: #555; padding-right: 2px; }
#shadow {background: url('images/topshadow.gif') no-repeat;height: 13px; clear: both }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*        The Main Body (Page column & Side Menu)        */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Left Column
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#leftcol {
	width:166px; /* was 168 */
	float:left; 
	position:relative; 
	background-color:#fff; 
	min-height: 200px;
	background: url(images/sidebg.gif) 100% 0 no-repeat;
}

#leftcol .padding { /* stops the overlap in firefox when fonts are scaled up */
	overflow: auto;
}

#leftcol ul { 
	padding: 3px;
	margin: 10px;
	font-size: .8em;
	line-height: 1.2em;
}
#leftcol li { margin-top: 5px; }

#leftcol ul ul { padding-top: .2em; margin: 0; padding: 0px 0px 0px 5px; }

/* Customise Sub Navigation Links */
#leftcol a:link 		{}
#leftcol a:visited 	{}
#leftcol a:active 	{} 
#leftcol a:hover 		{}

/* Left column boxes */
#leftcol #searchbox {text-align: center;}
#leftcol #searchbox label {display:none;}
#leftcol fieldset { margin: 2px; margin-bottom: 16px; padding: 6px; border: 1px solid #ddd; text-align: center;}
#leftcol fieldset ul { text-align:left;}
#leftcol fieldset:hover {border-color: #399;}
#leftcol legend {font-weight: bold; color: #399; font-size: 10px;}

fieldset.administrator {font-size: .8em;text-align:left;}
#leftcol.administrator form {text-align: left;}
#leftcol #newsletter {font-size: .8em;text-align:left;}

#leftcol input.inputwidth, #leftcol input.search_string {width: 100px;}

/* Main Column
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#maincol { /* max width of images = 590px */
	/*background-color:;   fff*/
	float: right; 
	display:inline; 
	position: relative; 
	width:600px; /* 620 */
	background: url(images/bodybg.gif) no-repeat 10px 10px;
	min-height: 162px;
	
}
#maincol .padding {
	padding: 8px 5px 5px 8px;
	font-size: .9em;
}

#maincol ul li { padding-top: .5em; }


#maincolb { 
/*	background-color: #fff;  */
	float: right; 
	display:inline; 
	position: relative; 
	width:772px; /* 620 */
	background: url(images/bodybg.gif) no-repeat 10px 10px;
	min-height: 162px;
}
#maincolb .padding {
	padding: 8px 5px 5px 8px;
	font-size: .9em;
}


/* The Footer
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#footer{
	margin-bottom: 16px;
	margin-top: 10px;
 	min-height: 20px; 
	background-color: #fff;
	color: #333; 
	clear: both;
  background: url(images/footerbg.gif) 0 0 no-repeat;
	font-size: .9em;
} 
#footer ul { margin: 0; padding: 0; clear: right;}
#footer ul li {list-style: none; float: left; padding: 0px 4px 2px 2px; border-right: 1px solid #ddd;}
#footer p {clear: left; }

/* Generic Styles (Reusable Classes)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.story				{ font-size: 1.1em; letter-spacing: 0.1em; }
.padding 			{	padding: 4px; }

.floatright 	{ float: right; display: inline; }
.floatleft		{ float: left; display: inline; }
html>body .floatlist  { margin: 0; padding: 0;}
html>body .floatlist li {	float: left; display: inline;	 }
html>body .floatlist li:before { content: "*";}
html>body .floatlist li:after { content: ',';}

/* Change the size of certain paragraphs */
.small 		{ font-size: small; }
.smaller 	{ font-size: smaller; }
.large		{ font-size: 1em }
.larger		{ font-size: larger; }


.imageBox	{ float: right; display: inline; font-size: small; border: 1px solid #ddd; text-align: center; padding: 2px; }


.infoBox {
	border: 1px solid #ddd; /*ddd*/
	padding: 4px;
	margin: 6px;
	font-style: italic;
	background: #F0F7F7;
}
.infoBoxCenter {
	border: 1px solid #ddd;
	padding: 4px;
	margin: 6px;
	background: #fefefe;
	text-align: center;
}
.infoBoxWiki {
	border: 1px solid #ddd;
	padding: 20px 130px 4px 4px;
	margin: 6px ;
	font-style: italic;
	background: #fff url('images/Wikipedia-logo-en.png') no-repeat top right;
	height: 155px;
}

/* CM SIMPLE STYLES */
.icon_sitemap 	{ padding-left: 16px; background-image: url(menu/doc_sitemap.gif); background-repeat: no-repeat; }
.icon_mailform	{ padding-left: 16px; background-image: url(menu/doc_mailform.gif); background-repeat: no-repeat; }
.icon_login			{ padding-left: 16px; background-image: url(menu/doc_login.gif); background-repeat: no-repeat; }
.icon_print			{ padding-left: 16px; background-image: url(menu/icon_print.gif); background-repeat: no-repeat; }
.locator 				{ border: 1px solid #ddd; padding: .2em; font-size: .8em; }

/* Customise the Memorials Page Tables
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.column2 td { width: 50%; }
.column3 td { width: 33%; }
.column4 td { width: 25%; }

/* Table for larger cells */
.data { color: #666; }
.data th {	font-size: 0.9em;	padding: 10px; border: 1px solid #ccc; background: #f0f0f0; }
.data td {
	font-size: 0.8em;	line-height: 1.4em; padding: 2px; text-align: center;	
	border: 1px solid #f0f0f0;	background: #fcfcfc; color: #333; }
.data th img, .data td img { border: 1px solid #fff; }	/* img border */

/* Used to make the td's hover effect in mozilla based browsers */
.data tr:hover td { border: 1px solid #fee;	background: #fee; color: #000; }
.data tr:hover th { border: 1px solid #fee;	background: #fee; color: #000; }
.data td:hover img,.data th:hover img { border: 1px solid #000; } /* img border hover (td) */
.data th img:hover, .data td img:hover { border: 1px solid #f00; } /* img border hover (img) */

/* Table for smaller cells */
.data2 { color: #333; font-size: 0.9em;}
.data2 th {	font-size: 0.9em;	padding: 1px; border: 1px solid #333; background: #f0f0f0; text-align: center;}
.data2 td {
	font-size: 0.8em; padding: 1px; text-align: center;	
	border: 1px solid #333;	background: #fcfcfc; color: #333; }
.data2 th img, .data2 td img { border: 1px solid #fff; }	/* img border */

/* Used to make the td's hover effect in mozilla based browsers */
.data2 tr:hover td { border: 1px solid #fee;	background: #fee; color: #000; }
.data2 tr:hover th { border: 1px solid #fee;	background: #fee; color: #000; }
.data2 td:hover img,.data2 th:hover img { border: 1px solid #000; } /* img border hover (td) */
.data2 th img:hover, .data2 td img:hover { border: 1px solid #f00; } /* img border hover (img) */


code {color:#080; font:1.1em courier-new, courier, monospace; margin-left: 20px; display: block}
code.inline {display: inline; margin:0}
code strong {color:#840}
strong code {font-weight:bold}
.uppercase { text-transform: uppercase; }

.fauxColumn2 {	float: left; position: relative;	width: 49%; }
.fauxColumn3 {	float: left; position: relative;	width: 32%; }
.fauxColumn4 {	float: left; position: relative;	width: 23%; text-align: center; display: inline;}

div.fauxColumn4 img  { text-decoration: none; margin-bottom: 10px; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }
.centerSmall { text-align: center; font-size: smaller; }
.centerSmall p { margin-top: 0; padding-top: 0 }

#authors {
	text-align: right; 
	font-size: .9em;
	color: #777;
	border: 1px solid #eee;
/*	background: #fefefe; */
}
#authors a:link			{ color: #399; text-decoration: none; }
#authors a:visited	{ color: #399; text-decoration: none;}
#authors a:active		{ color: #f33; }
#authors a:hover		{ color: #f33; text-decoration: underline;}

/*  Float containers fix:
		http://www.csscreator.com/attributes/containedfloat.php  
		~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  */ 
.clearfix:after {
 content: "."; 
 display: block; 
 height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  

body.print {
	background: #fff;
	text-align: left;
	margin: .5em;
}
body.print * {background: #fff;	color: #000;}

/* printer styles @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

@media print{ 
	/*hide the left column when printing*/ 
	#leftcol{display:none;} 
	#twocols, #maincol{width:100%; float:none;}
}