/* ======================================================
Filename:	stylesheet-main-pages.css
Website:	www.detoxmedia.co.uk
Function:	Styles components specific to all of the main
			pages.
Detox Media - Purifying The Web :: www.detoxmedia.co.uk
====================================================== */

/* =================================================== */
/* ----------------- HTML Tag Styles ----------------- */
/* =================================================== */

/* =================================================== */
/* --------------------- General --------------------- */

span.lowlight {
	color: #BBBBBB;
}

/* =================================================== */
/* --------------------- Headings -------------------- */

h1, h2, h3, h4 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	text-align: left;
	margin-bottom: 20px;
	color: #555555;
}

h1 {
	font-size: 14pt;
}

h2 {
	font-size: 13pt;
}

h3 {
	font-size: 12pt;
}

h4 {
	font-size: 11pt;
}

.page-content .main-content h1, 
.page-content .main-content h2, 
.page-content .main-content h3, 
.page-content .main-content h4, {
	padding-right: 5px;
}

h2#what-we-offer {
	background-image: url(../images/icon-what-we-offer.jpg);
	background-repeat: no-repeat;
	padding-left: 30px;
}

h2.question {
	background-image: url(../images/icon-question.jpg);
	background-repeat: no-repeat;
	padding-left: 30px;
}

h2.costs {
	background-image: url(../images/icon-costs.jpg);
	background-repeat: no-repeat;
	padding-left: 30px;
}

h2.email {
	background-image: url(../images/icon-email.jpg);
	background-repeat: no-repeat;
	padding-left: 30px;
}

h2.contact-form {
	background-image: url(../images/icon-contact-form.jpg);
	background-repeat: no-repeat;
	padding-left: 30px;
}

/* =================================================== */
/* -------------------- Paragraphs ------------------- */



/* =================================================== */
/* ---------------------- Images --------------------- */

.page-content .main-content img {
	float: left;
	margin-right: 10px;
	margin-bottom: 15px;
}

.page-content .alternative-content img {
	margin-bottom: 15px;
}

/* =================================================== */
/* ---------------------- Lists ---------------------- */



/* --------------------- Content --------------------- */

.page-content .main-content ul {
	list-style-image: none;
	list-style-position: inside;
	list-style-type: square;
	margin-left: 25px;
	margin-bottom: 20px;
}

.page-content .main-content ul li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	text-align: left;
	color: #666666;
}

.page-content .main-content ol {
	list-style-image: none;
	list-style-position: inside;
	list-style-type: decimal;
	margin-left: 25px;
	margin-bottom: 20px;
}

.page-content .main-content ol li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	text-align: left;
	color: #666666;
}

/* --------------- Alternative Content --------------- */

.page-content .alternative-content ul {
	list-style-image: none;
	list-style-position: inside;
	list-style-type: none;
	margin-bottom: 20px;
	*margin-left: -16px;	/* Hack for IE7 and below - removes left margin */
}

.page-content .alternative-content ul li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	text-align: left;
}

/* =================================================== */
/* ---------------------- Anchors -------------------- */

/* ------------------ Main Content ------------------- */

.page-content .main-content ul li a,
.page-content .main-content ul li a:visited {
	text-decoration: none;
	color: #40c7e9;
}

.page-content .main-content ul li a:hover,
.page-content .main-content ul li a:focus {
	text-decoration: underline;
	color: #40c7e9;
}

/* --------------- Alternative Content --------------- */

.page-content .alternative-content ul li a,
.page-content .alternative-content ul li a:visited {
	display: block;
	width: 235px;
	_width: 215px;	/* Hack for IE6 - make width smaller */
	height: auto;
	background-color: #ffffff;
	background-image: url(../images/list-icon.gif);
	background-repeat: no-repeat;
	background-position: center left;
	padding-bottom: 5px;
	padding-top: 4px;
	padding-left: 20px;
	vertical-align: middle;
	text-decoration: none;
	color: #666666;
}

.page-content .alternative-content ul li a:hover,
.page-content .alternative-content ul li a:focus {
	color: #40c7e9;
	background-color: #ffffff;
	background-image: url(../images/list-icon-rollover.gif);
	background-repeat: no-repeat;
	background-position: center left;
}

/* =================================================== */
/* ---------------------- Tables --------------------- */

.page-content .main-content table {
	border: 1px solid #666666;
	border-collapse: collapse;
	margin-bottom: 20px;
	margin-left: 25px;
	margin-right: 10px;
}

.page-content .main-content table tr th,
.page-content .main-content table tr td {
	border: 1px solid #666666;
	border-collapse: collapse;
	padding: 3px;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	text-align: left;
	color: #666666;
}

/* =================================================== */
/* -------------------- Form Items ------------------- */



/* =================================================== */
/* ------------------ Layout Classes ----------------- */
/* =================================================== */

.main-content {
	position: relative;
	float: left;
	width: 510px;
	height: auto;
}

.alternative-content {
	position: relative;
	float: right;
	width: 235px;
	height: auto;
	padding-left: 15px;
}