/*  

This style sheet contains all basic styling for the page and its content
Any questions or comments? Get in touch with intouch@monomo.com

*/


* {
	margin:0; 
	padding:0;
} 

html {
	height:100%; 
	font-size:100.01%;
} 

body
{
	text-align: center;
	min-height: 101%;
	font: 100.01%/130% Verdana, Arial, Helvetica, sans-serif;
	color: #322E2A;
	padding: 0 40px 0 40px;
	background-color: #fff;
	background-image: url(../images/backGradient.gif);
	background-repeat: repeat-x;
} 

body * {
	text-align:left;
}

/*
	Credit to Mike Foskett for this nice intro: http://www.websemantics.co.uk
*/




/* General Link Specification */

a, a:link {
	text-decoration:none;
	color:#00A8FF;
	background-color: transparent;
}

a:visited {
	text-decoration:none;
	color:#47B2EA;
}

a:hover, a:active, a:focus {
	text-decoration:none;
	color:#0075B3;
	background-color: transparent;
}

/* The Blog Links */
.ContentBlog a, .ContentBlog a:link {
	text-decoration:none;
	color:#FF00EE;
	background-color: transparent;
}

.ContentBlog a:visited {
	text-decoration:none;
	color:#EA47DF;
}

.ContentBlog a:hover, .ContentBlog a:active, .ContentBlog a:focus {
	text-decoration:none;
	color:#b30091;
	background-color: transparent;
}



/* Opting for different font prioritisation for headlines */

h1, h2, h3, h4, h5, h6 {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-weight:normal;
}


img {
	border:none;
}

hr { 
	display:none;
}






/* The main elements */


div.CenterStage {
	min-width: 710px;
	max-width: 940px;
	margin:4px auto 0 auto;
}


#SkipNavigation {
	width: 100%;
	position: absolute;
	top:0;
	left:0;
}


div.Content {
	width: 56%;
	float: left;
	color:#322E2A;
	background-color:transparent;
}

div.ContentBlog {
	width: 56%;
	float: left;
	color:#322E2A;
	background-color:transparent;
}


div.ColumnOne {
	width:20%;
	float: left;
	margin: 0 0 0 2%;
	color:#4C4643;
	background-color:transparent;
}



div.ColumnTwo {
	width:20%;
	float: right;
	color:#4C4643;
	background-color:transparent;
}



div.Footer {
	width:100%;
	clear: both;
	color:#4C4643;
	background-color:transparent;
	font-size:0.6em;
	padding:3.0em 0 0 0;
}







/* Top Part */

.Content #TopBand {
	border-style: solid;
	border-width:0 1px 1px 1px;
	border-color: #00BBFF;
	padding:12px;
}

.ContentBlog #TopBand {
	border-style: solid;
	border-width:0 1px 1px 1px;
	border-color: #FF00EE;
	padding:12px;
}

div.TopDrawHandle {
	margin-top:12px;
}

#TopBand a {
	border:none;
	background-color:transparent;
}


/* For the JS delivery */
div.TopDraw {
	position:absolute;
	left:-1000px;
}

div.TopDrawNew {
	position:relative;
}


span.TopDrawTrigger {
	float:left;
	border:none;
	font-size:0.1em;
	line-height:1.0em;
}

h1.SiteTitle {
	font-size:0.1em;
	line-height:1.0em;
	text-align:right;
}

.SiteTitle img, .TopDrawTrigger img {
	border:none;
}



/* define here the div for rich media content */
.Content div.TopDrawContent {
	height:200px;
	/*border:solid 1px #00BBFF; IE6 got a problem*/
}

.ContentBlog div.TopDrawContent {
	height:200px;
	/*border:solid 1px #FF00EE;*/
}






/* The Breadcrumb Navigation */

div#BreadCrumbNav {
	height:40px;
}
#BreadCrumbNav p {
	font-size: 0.6em;
	line-height:1.4em;
	padding: 1.0em 12px 0 12px;
	color:#C5BBAA;
	background-color:transparent;	
}









/* The Content */

div#PageContent {

}

#PageContent h2 {
	clear:both;
	padding:0 12px; /*taken from TopDraw */
	font-size: 1.4em;
	line-height:1.4em;
	border-style: solid;
	border-width:0 0 1px 0;
	border-color: #00BBFF;
	margin-top:17px;
	color:#A79F90;
	background-color:transparent;
}

#PageContent h3 { /* used for archives */
	clear:both;
	padding:0 12px; /*taken from TopDraw */
	font-size: 1.2em;
	line-height:1.4em;
	border-style: solid;
	border-width:0 0 1px 0;
	border-color: #00BBFF;
	margin-top:17px;
	color:#A79F90;
	background-color:transparent;
}

.ContentBlog h2, .ContentBlog h3 {
	border-color: #FF00EE !important;

}


/* add all potential nice colours */

h2.CatOne, h3.CatOne {
	border-color: #00BBFF !important;
}

h2.CatTwo, h3.CatTwo {
	border-color: #0066FF !important;
}

h2.CatThree, h3.CatThree {
	border-color: #FF0066 !important;
}

h2.CatFour, h3.CatFour {
	border-color: #F23900 !important;
}

h2.CatFive, h3.CatFive {
	border-color: #F26600 !important;
}

h2.CatSix, h3.CatSix {
	border-color: #62D100 !important;
}



div.Posting {
	border-style: solid;
	border-width:0 0 1px 0;
	border-color: #DFD9CE;	
	margin:0 0 12px 0; /* long row of postings */
}

div.TextEntry { /* Contains all posting elements */
	padding:0 12px 12px 12px;
	font-size:0.8em;
}

/* For Headlines within TextEntry */
.PostingContent h2, .PostingContent h3, .PostingContent h4, .PostingContent.h5, .PostingContent h6 {
	padding:0 !important;
	border-color:#DFD9CE !important;
}

/* for images */
.TextEntry img.alignleft {
	float:left;
	padding: 0.4em 12px 0 0;
}
.TextEntry img.alignright {
	float:right;
	padding: 0.4em 0 0 12px;
}

.TextEntry img.fullbleed {
	padding: 0.4em 0;
	width:100%;
}

div.PostMeta {
	padding:0;
	margin:0;
}

div.PostingContent { /* Contains all actual content */
	padding:0.5em 0;
	overflow:hidden; /* hide any excessive content */
}

.PostingContent p {  /* All p within are formatted like that */
	padding:0.5em 0;
}





/* The Footer Containing the link to top of page */

#ContentFooter {
	clear: both;
	color:#C5BBAA;
	background-color:transparent;
	font-size:0.6em;
	text-align:right;
	padding:0 12px 0 12px;
}





/* The Comment Block */

.CommentBlock {
	clear:both;
	padding:0 12px 2.0em 12px;
	font-size:0.8em;
	color:#888;
	background-color:transparent;
}

.CommentBlock h3 {
	margin:0 0 12px 0;
	border:none !important;
	padding:0 !important;
}

.CommentBlock ol {
	list-style-type:none;
}

.CommentBlock ol li {
	padding:12px;
	margin: 0 0 12px 0;
	background-color:#fbfaf9;
	color:#888;
	border:solid 1px #f6f5f4;
}

.CommentBlock ol li.alt {
	background-color:#f8f7f6;
	color:#888;
	border:solid 1px #f3f2f1;
}




.comment_message {
	font-size:0.8em;
	padding:0.5em 12px 0.5em 12px;

}

/* 
	Use that css as a starting point to develop your specific design/layout
	Have fun
*/

#commentform {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	line-height: 1.4em;
}

#commentform fieldset {
	border: none;
	padding: 0;
	margin: 1.0em 0;
}

#commentform legend {
	display:none;
}


.commentFormRow {
	clear:both;
	margin: 0 0 6px 0;
	color:#857760;	
	background-color: transparent;
}


.commentFormRow label {
	float:left;
	width:18em;
	padding:0.1em 0 0 0;
	text-align:right;
}

.commentFormRow span {

}

/* contains the actual form elements */
.commentFormElement {
  	margin-left: 18.5em;
	font-size: 1.0em;
	line-height: 1.5em;
	text-align:left;
}

/* depending on styling the line break can be used to clear floats */
.commentFormRow br {
	display:none;
}



.commentInput {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:1.0em;
	line-height: 1.5em;	
	width:60%; min-width:12em;
	height:1.4em;
	margin:0 0.5em 0 0;

	padding-left: 2px;
	padding-right: 2px;
	border:solid 1px #C5BBAA;
	color:#444;
	background-color:white;
}


.commentInput:hover, .commentInput:active, .commentInput:focus {
	border:solid 1px #857760;
}


#comment {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:1.0em;
	line-height: 1.5em;		
	
	width:85%;
	height:10em;

	color:#444;
	background-color:white;		
}


.Mandatory {
	color:#453720 !important;
}



/* The Submit Button */
.TextSubmit {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:1.0em;
	line-height: 1.2em;
	
	padding:0.1em 0.5em;
	border:solid 1px #C5BBAA;
	text-align:center;
	background-color:#fff;
	color:#C5BBAA;
}

.TextSubmit:hover, .TextSubmit:focus, .TextSubmit:active {
	border:solid 1px #857760;
	background-color:#fff;
	color:#857760;	
}












/* The Footer Content */

.FooterMain {
	width: 56%;
	float: left;
	border-style:solid;
	border-color:#DFD9CE;
	border-width: 1px 0 0 0;	
	padding:1.0em 0 1.0em 0;
}

.FooterColumnOne {
	width:20%;
	float: left;
	margin: 0 0 0 2%;
	text-align:right;
	border-style:solid;
	border-color:#DFD9CE;
	border-width: 1px 0 0 0;
	padding:1.0em 0 1.0em 0;
}

.FooterColumnTwo {
	width:20%;
	float: right;
	border-style:solid;
	border-color:#DFD9CE;
	border-width: 1px 0 0 0;	
	padding:1.0em 0 1.0em 0;
}

.FooterMainLeft {
	width:40%;
	float:left;
}
	
.FooterMainRight {
	width:40%;
	float:right;
	text-align:right;
}

.FooterMainRight p {
	padding:0.2em 12px;
	text-align:right;
	line-height:1.4em;
}

.FooterMainLeft p {
	padding:0.2em 12px;
	line-height:1.4em;
}

.FooterColumnOne p {
	padding:0.2em 12px;
	text-align:right;
	line-height:1.4em;
}

.Footer a, .Footer a:link, .Footer a:visited {
	color:#A79F90;
	background-color:transparent;
}


.Footer a:active, .Footer a:hover, .Footer a:focus {
	color:#757065;
	background-color:transparent;
}


a.HighContrast:link, a.HighContrast:visited {
	color:#333;
	background-color:transparent;	
}

a.HighContrast:active, a.HighContrast:hover,  a.HighContrast:focus {
	color:#000;
	background-color:transparent;		
}

/* The Style within Edit Area */



.TextEntry ul
{
	padding: 0 1.5em;
	margin: 0.5em 1.5em;
	list-style-type: disc !important;
	list-style-position: outside !important;
	
}

.TextEntry ol
{
	padding: 0 1.5em;
	margin: 0.5em 1.5em;
	list-style-type: decimal !important;
	list-style-position: outside !important;
}
			
.TextEntry li
{
	padding: 0.3em;
	margin: 0 0.5em;
}

code {
	font-size:1.0em;
	color:black;
}


/* Tag Cloud */

		#PageContent ul.cosmos {
			margin: 1em 0;
			list-style: none;
			font-size: 140%;
			}
			
		#PageContent li.cosmos {
			display: inline;
			padding: 0;
			margin: 4px;
			line-height: 2em;
			}
		
		#PageContent li.keyword1 { font-size: 0.7em; }
		#PageContent li.keyword2 { font-size: 0.9em; }
		#PageContent li.keyword3 { font-size: 1.0em; }
		#PageContent li.keyword4 { font-size: 1.1em; }
		#PageContent li.keyword5 { font-size: 1.2em; }
		#PageContent li.keyword6 { font-size: 1.3em; }
		#PageContent li.keyword7 { font-size: 1.4em; }
		#PageContent li.keyword8 { font-size: 1.5em; }
		#PageContent li.keyword9 { font-size: 1.6em; }
		#PageContent li.keyword10 { font-size: 1.7em; }
		#PageContent li.keyword11 { font-size: 1.8em; }
		#PageContent li.keyword12 { font-size: 1.9em; }
		#PageContent li.keyword13 { font-size: 2.0em; }
		#PageContent li.keyword14 { font-size: 2.1em; }
		#PageContent li.keyword15 { font-size: 2.2em; }





/* Contact Form */

	#pxs_mailForm {
		margin-top:1em;
	}
	
	#pxs_mailForm fieldset {
		border:none;
	}
	
	#pxs_mailForm legend {
		display:none;
	}
	
	.pxs_row {
		clear:both;
		margin: 0 0 6px 0;
	}
	
	.pxs_row br {
		clear:both;
	}
	
	.pxs_label {
		width:24%;
		float:left;
		text-align:right;
	}
	
	.pxs_fieldContainer {
		width:74%;
		float:right;
	}
	
	/* Text Inputs */
	.pxs_input {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		width:65%; 
		font-size:1.0em;
		line-height: 1.5em;
		padding:0.1em;
		border:solid 1px #C5BBAA;
		color:#444;
		background-color:white;		
	}
	
	.pxs_input:hover, .pxs_input:active, .pxs_input:focus {
		border:solid 1px #857760;
	}
	
	/* Select Box */
	#w_recipient {
		border:solid 1px #C5BBAA;	
		padding:0.1em;
	}
	
	/* Check Box */
	#y_ccme {

	}
	
	/* Submit Button */
	#psx_submit {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size:1.0em;
		line-height: 1.2em;
		padding:0.1em 0.5em;
		border:solid 1px #C5BBAA;
		text-align:center;
		background-color:#fff;
		color:#C5BBAA;		
	}
	
	#psx_submit:hover, #psx_submit:focus, #psx_submit:active {
		border:solid 1px #857760;
		background-color:#fff;
		color:#857760;	
	}	
	
	div.pxs_error_message {
		color:#ff3300;
		padding:0 0 0.5em 0;
	}
	
	.pxs_error_message h3, .pxs_success h3 {
		padding:0 !important;
		border:none !important;
	}
	
	input.pxs_error, input.pxs_error:focus, input.pxs_error:hover, textarea.pxs_error, textarea.pxs_error:focus, textarea.pxs_error:hover {
		border:solid 1px #ff6600;
	}	
	
	span.pxs_error {
		color:#ff6600;
	}
	
	div.pxs_success {
		padding:0 0 0.5em 0;
	}