/* CSS Document */

/* DOCUMENT INFORMATION -----------------------------------

TITLE:			Default screen display styles
LAST UPDATED:	01 May 2007
AUTHOR:			John Arnfield <ja@cleverclover.co.uk>

-- CONTENTS -----------------------------------------------

	=1:		[HTML & BODY, UNDOHTML]
	=2:		[LINKS]
	=3:		[COMMON ELEMENTS]
	=4:		[TOP ELEMENTS]
	=5:		[NAVIGATION]
	=6:		[MAIN COLUMN]
	=7:		[SIDEBAR COLUMN]
	=8:		[FOOTER]
	=9:		[LISTS]
	=10:	[FORMS]
	=11:	[IMAGES]
	=12:	[MISC]
	
-----------------------------------------------------------

NOTES:	Default CSS Template for CleverClover.com..
		Contains a list of default CSS styles for a generic
		site. Uses verdana 10pt by default with an 11pt line
		height.

/*	=1:	[HTML & BODY] -------------------------------------*/

html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, 
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	vertical-align: baseline;
	font-family: inherit;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	outline: 0;
	padding: 0;
	margin: 0;
	border: 0;
}
link,:visited { text-decoration:none }
ul { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:12pt; }
a img,:link img,:visited img { border:none }
address { font-style:normal }

html {height: 100%; margin-bottom: 1px;}

strong { font-weight: bold; }

body {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Verdana, sans-serif;
	font-size: 10pt;
	text-align: left;
	line-height: 11pt;
	color: #000;
	background-color: #FFF;
}
	
/*	=2:	[LINKS] -------------------------------------------*/	

/* NOTES: remember LoVe HAte */

a:link {color: #b00e23; text-decoration: none;}
a:visited {color: #b00e23; text-decoration: none;}
a:hover {color: #8e0b1c; text-decoration: underline;}

a.catLink {
	margin-left: 14px;
	text-transform: uppercase;
	font-size: 7pt;
}

a.archiveLink {
	text-transform: uppercase;
	color: #999999;
	font-weight: bold;
}


/*	=3:	[COMMON ELEMENTS] ---------------------------------*/

div.redbar {
	height: 4px;
	width: 100%;
	background: url('../images/bg-redbar.gif') top left repeat-x;
}

h1 {
	text-transform: uppercase;
	font-size: 11pt;
	font-family: Century Gothic, Arial, Verdana, sans-serif;
	margin-bottom: 10px;
}

h2 {
	text-transform: uppercase;
	font-size: 9pt;
	font-family: Century Gothic, Arial, Verdana, sans-serif;
	margin-bottom: 5px;
}

p {
	text-align: justify;
	margin-bottom: 12px;
	padding: 2px;
	margin : 0px;
}

p.firstPara {
	font-weight: bold;
}

a#createdBy {
	float: right;
	color: #999999;
	line-height: 32px;
	font-size: 8pt;
}

ul {
	list-style-type: disc;
	/*list-style-position: outside;*/
	margin-bottom: 10px;
	
	line-height: 2em;
	
	list-style-position: outside;

	margin-left: 20px;
}

li {

	padding: 3px 0px 3px 10px;
}
/*	=4:	[TOP ELEMENTS] ------------------------------------*/

#pageTop {
	height: 34px;
	width: 100%;
	background: url('../images/bg-topbar.gif');
}

div.page {
	width: 751px;
	margin: 0 auto;
}

#pageBottom {
	background: url('../images/bg-bottombar.gif');
	width: 100%;
	height: 32px;
	clear: both;
}

#header {
	width: 751px;
	height: 212px;
	float: left;
	background: url('../images/bg-header.jpg') top left no-repeat;
	margin-top: 2px;
	position: relative;
}

#logo {
	position: absolute;
	bottom: 29px;
	left: 0;
	z-index:99;
}

#sub-heading {
	position: absolute;
	bottom: 8px;
	left: 11px;
	z-index:98;
	font-size: 15px;
	letter-spacing: 0.5pt;
}	
	#sub-heading strong {
		color: #A80716;
		font-size: 16px;
		font-weight: bold;
		letter-spacing: 1pt;
		padding-left: 5px;
	}

/*	=5:	[NAVIGATION] --------------------------------------*/	

#topNav {
	font-family: Century Gothic, Arial, Verdana, sans-serif;
	float: right;
}

#topNav, #topNav a {
	color: #FFF;
	text-transform: uppercase;
	line-height: 34px;
}

#bottomNav, #bottomNav a {
	color: #FFF;
	line-height: 32px;
	font-size: 8pt;
}

#mainNav {
	height: 32px;
	width: 518px;
	position: absolute;
	bottom: 1px;
	right: 0;
}

#mainNav #mnBackground {
	position: absolute;
	top: 0;
	left: 0;
	width: 517px;
	height: 32px;
	background-color: #fff;
	filter:alpha(opacity=65);
	opacity: 0.65;
	-moz-opacity:0.65;
	z-index: 1;
}

#mainNav #mnContent {
	position: absolute;
	top: 0;
	left: 0;
	width: 517px;
	height: 32px;
	z-index: 2;
}

#mainNav p {
	font-family: Century Gothic, Arial, Verdana, sans-serif;
	float: right;
	margin-right: 5px;
}

#mainNav p, #mainNav p a {
	line-height: 28px;
	color: #000;
	font-weight: bold;
	text-transform: uppercase;
}

#mainNav p a:hover {
	text-decoration: none;
	color: #8e0b1c;
}

#categories {
	width: 751px;
	height: 199px;
	margin-top: 1px;
	float: left;
	background: url('../images/bg-category.gif') top left repeat-x;
}

#categories div.imgPreview {
	width: 165px;
	height: 165px;
	border: 2px solid #d3d3d3;
	float: left;
	margin: 13px 0 0 14px;
	position: relative;
}

#categories div.imgPreview p {
	position: absolute;
	bottom: 5px;
	left: 5px;
	color: #fff;
	text-transform: uppercase;
	font-size: 8pt;
}

#categories div.imgPreview img.prvIm {
	width: 165px;
	height: 165px;
}

#categories div.imgPreview a,#categories div.imgPreview a:visited {
	text-decoration: none;
	color: #FFF;
	font-size: 9pt;
}
#categories div.imgPreview a:hover {
	text-decoration: underline;
}


/*	=6:	[MAIN COLUMN] -------------------------------------*/

#bodywrap {
	float: left;
	padding-bottom: 8px;
	width:751px;
}

#bodyLHS {
	float: left;
	width:751px;
}

#blContent {
	min-height: 350px;
	float: left;
	width: 728px;
	padding: 10px;
	padding-bottom: 10px;
	border: 1px solid #dadada;
	border-right: 3px solid #dadada;
	border-top: 1px solid #f2f2f2;
	margin-top: 1px;
	position: relative;
}

#blAddBg {
	float: left;
	height: 20px;
	background: url('../images/bg-pagewrap.gif') top left no-repeat;
}

#bodyLHS p, #mainContentPg p {
	/*margin-bottom: 10px;*/
	line-height: 18px;
}

#bodyLHS img#bodySpacer {
	float: right;
	width: 200px;
	height: 150px;
}

#map {
	width: 250px;
	height: 250px;
	border: 1px solid #ccc;
}

#bodyMainContent {
	
}

#mainContentPg {
	width: 730px;
	padding: 10px;
	padding-bottom: 60px;
	border: 1px solid #dadada;
	border-top: 1px solid #f2f2f2;
	margin-top: 1px;
	position: relative;
	background: url('../images/bg-bodylhs.gif') top right no-repeat;
}

.links li a strong {
	padding: 0 20px 0 0;
	width: 140px;
	display: block;
	float: left;
	color: #585858;
	font-size: 110%;
}
/*	=7:	[SIDEBAR COLUMN] ----------------------------------*/

#bodyRHS {
	float: left;
	width: 197px;
}

#brContent {
	float: left;
	padding: 10px;
	width: 175px;
	background: url('../images/bg-rhs.gif') bottom left repeat-x;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
	border-top: 1px solid #f2f2f2;
	margin-top: 1px;
	position: relative;
}

#brAddBg {
	float: left;
	width: 187px;
	padding: 5px;
}

img.rhscorner {
	position: absolute;
	bottom: -1px;
	right: -1px;
	z-index: 2;
}

img.lhscorner {
	position: absolute;
	bottom: -1px;
	left: -1px;
	z-index: 2;
}

img.rhscornerthick {
	position: absolute;
	bottom: -1px;
	right: -3px;
	z-index: 2;
}

div.news {
	border: 1px solid #e6e6e6;
	padding: 5px;
	background-color: #FFF;
}

div.news p {
	font-size: 8pt;
}

div.news img {
	float: right;
	margin-bottom: 5px;
	margin-left: 5px;
}


ul#formErrors {
	list-style-image: url('../images/icon-exclamation.gif');
}

ul#formSuccess {
	list-style-image: url('../images/icon-tick.gif');
}

/*	=8:	[FOOTER] ------------------------------------------*/	

#footer {
	background: url('../images/bg-logos.jpg') center no-repeat;
	height: 79px;
	width: 728px;

	margin: 0 auto;
}

#floatingFooter {
	background: url('../images/bg-logos.gif') top left no-repeat;
	height: 35px;
	width: 550px;
	position: absolute;
	bottom: 0;
	left: 0;
}
 
/*	=9:	[LISTS] -------------------------------------------*/	

/*	=10: [FORMS] ------------------------------------------*/	

form {margin-bottom: 0px;}

label {
	width: 140px;
	font-weight: bold;
	font-size: 12px;
	margin: 6px 0 0 0;
	padding: 4px 10px 0 0;
	text-align: right;
}

input, textarea, select, label {
	float: left;
}

input {
	margin: 7px 0 0 0;
	width: 240px;
}

select {
	margin: 7px 0 0 0;
	width: 240px;
}

textarea {
	margin: 7px 0 0 0;
	width: 240px;
}

sup {
	color: red;
}

.checkbox {
	float: left;
}
	.checkbox label {
		width:140px;
	}
	.checkbox input {
		width: auto;
		margin: 9px 0 0 0;
	}
	
.radio {
	float: left;
}
	.radio label {
		width:20px;
	}
	.radio input {
		width: auto;
		margin: 9px 0 0 0;
	}

.security {
	float: left;
	margin: 7px 0 0 0;
}

.notText {
	width: auto;
}

.buttons {
	margin: 20px 0 0 150px;
}

label.error {
	color: #cc0000;
}

/*	=11: [IMAGES] -----------------------------------------*/	

img {border: 0px; display: block;}	
img.inline { display: inline; }

/*	=12: [MISC] -------------------------------------------*/	

.red { color: #cc0000; }
.blue { color: #00FF00; }
.green { color: #0000FF; }
.black { color: #000000; }
.white { color: #FFFFFF; }
.grey { color: #CCCCCC; }

	.imgbox {
		position: relative;
		height: 65px;
		cursor: pointer;
	}
	p.header {
		position: absolute;
		left: 5px;
		bottom: 5px;
		color: #000;
		background: #FFF;
		padding: 5px;
		opacity: .8;
		font-weight: bold;
	}
	.moreTxt {
    font-weight: bold;
    color: #ae2c41;
}

p.sider {
	font-weight: bold;
	margin: 5px 0px 10px 0px;
	padding: 0px;
	font-size: 8pt;
	text-align: left;
}

.floatLeft { float:left; }
.clearLeft { clear:left; }
.floatRight { float:right; }
.clearRight { clear:right; }
.clearBoth { clear:both; }
.padMe { padding:10px; }

.pLayout img {
	float:right;
	clear:right;
	padding:10px;
}
	
.pLayout img.reset {
	float:none;
	padding:0 0 0 0;
	display:inline;
}	

.pLayout tr.head {
	background-color:#ccc;
}

.pLayout td {
	border:1px solid #000;
	padding:5px;
	font-size:11px;
}			

.portfoliotechnology td {
	vertical-align: top;
}

.middle {
	
}

.twitter {
	float:left;
	margin:10px 0px;
	display:block;
	width:209px;
	height:87px;
	background:url(../images/twitter.jpg) no-repeat;
}

.facebook {
	float:left;
	margin:10px 0px;
	display:block;
	width:99px;
	height:30px;
	background:url(../images/facebook-sml.jpg) no-repeat;
}

.download {
	float:left;
	margin:10px 0px 0px 10px;
	display:block;
	width:111px;
	height:30px;
	background:url(../images/download-but.jpg) no-repeat;
}