/*--- Main styles ---*/

body {
	text-align: center;
	background: #66C;
	font: 76%/0.2em Arial, Helvetica, sans-serif;
}

html {height:100%}
body {min-height:101%} /*fix for Firefox, Opera scrollbar jump*/

/* body { overflow: -moz-scrollbars-vertical; } alternative fix for scrollbar jump, Firefox only*/

/*--- Main layout divs ---*/

#container {
	width: 740px;
	margin: 60px auto 10px;
	background-color: #FFF;
	color: #333;
	border: 1px solid #CCC;
	line-height: 130%;
	text-align: left;
}

#top {
	padding: .5em;
	background-color: #69C;
	border-bottom: 1px solid gray;
	background-image: url(../images/keyboard.jpg);
	background-repeat: no-repeat;
	background-position: 513px 0px;
}

#top h1 {
	padding: 0;
	margin: 0 0 1em;
}

#leftnav {
	float: left;
	width: 160px;
	margin: 0;
	padding: 1em;
}

#content {
	margin-left: 200px;
	border-left: 1px solid #CCC;
	padding: 1em;
}

#footer {
	clear: both;
	margin: 0;
	padding: 0.5em 0.5em 0.5em 1em;
	color: #333;
	background-color: #F4F4F4;
	border-top: 1px solid #CCC;
	font-size: 90%;
}

#leftnav p {
	margin: 0 0 1em 0;
	font-size: 75%;
}

#leftnav h3 {
	font-size: 100%;
	line-height: 1.5em;
	border-top: 1px solid #CCC;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border-bottom: 1px solid #CCC;
}


/*--- Headings ---*/

#content h1 {
	margin: 0 0 1em;
	font-size: 155%;
}

h2 {
	margin: 0 0 1em;
	font-size: 140%;
}

#content h3 {
	font-size: 130%;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0;
}

#content h4 {
	font-size: 110%;
	margin-right: 0;
	margin-bottom: 1em;
	margin-left: 0;
}

/*--- Navigation ---*/

#navigation {
	width: 160px;
	margin-left: 8px;
	font-size: 125%;
} 

#navigation ul { 
 	list-style: none; 
 	margin: 0; 
 	padding: 0; 
} 

#navigation li {
	border-bottom: 1px solid #CCC;
	border-top: 1px solid #FFF;
} 

#navigation li a:link, #navigation li a:visited  {
	display: block;
	padding: 3px 3px 3px .5em;
	border-left: 1px solid #CCC;
	border-right: 1px solid #CCC;
	background-color: #F4F4F4;
	color: #36C;
	text-decoration: none;
} 

#navigation li a:hover { 
 	background-color: #69C; 
 	color: #FFF; 
} 

/*--- Lists ---*/

#content ul {
	margin-top: 15px;
	margin-bottom: 5px;
	font-size: 100%;
}

#content ol {
	margin-bottom: 5px;
}

#content li {
	margin-top: 5px;
	margin-bottom: 5px;
}

ul {
	margin-top: 15px;
	margin-bottom: 15px;
	font-size: 75%;
	line-height: 1.5em;
}

/*--- Links ---*/

a:link {
	color: #36C;
	text-decoration: underline;
}

a:visited {
	color: #36C;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

/*--- Paragraphs and other divs---*/

p {
	margin: 0 0 1.7em;
	line-height: 1.5em;
}

.psmall {
	margin: 0 0 1em 0;
	font-size: 90%;
}

.pleft {
	margin: 0 0 1em;
	background-color: #D1E0EF;
	padding: 1em;
}

.pform {
	margin-left: 10px;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 80%;
}

.pcentre {
	text-align: center;
}

.pdot, .pdot2 {
	margin: 0px 0px 1em;
	padding: 0px;
	border-bottom: 1px dashed #CCC;
}

.pdot {
	width: 468px;
}

.pdot2 {
	margin: 0px 0px 0.8em;
}

.pzero {
	margin: 0px;
	padding: 0px;
}

.pblue {
	margin: 0 0 1em;
	background-color: #D1E0EF;
	padding: 0.6em;
}

.google {
	padding: 0.5em;
	margin-bottom: 1em;
	border-bottom: 1px solid #A4D046;
}

.exhow {
	margin-bottom: 1em;
	margin-right: 1.5em;
	margin-left: 1.5em;
	padding: 0.5em 0.5em 0em 0.3em;
	border-top: 1px dashed #CCC;
	border-bottom: 1px dashed #CCC;
}

.dblue {
	margin: 0 0 1em;
	background-color: #D1E0EF;
	padding: 0.8em 0.6em;
}

.dleft {
	margin: 0 0 1em;
	padding: 1em 0.5em 1em 0.7em;
	font-size: 75%;
	border: 1px solid #99AFE1;
	background: #D6DEF3;
}

hr {
	margin: 1em 0;
	background:#DBDBDB;
	height:1px;
	color:#DBDBDB;
	border:none;
}

.info {
	border-top: 3px double #99AFE1;
	border-bottom: 3px double #99AFE1;
	padding: 0.5em 0.5em 0.5em 0.7em;
	width: 230px;
	background: #D6DEF3;
	line-height: 1.5em;

}

/*--- Forms ---*/

label {
	font-size: 75%;
	margin: 0em;
}

#contact2  {
	position:relative;
	border: 4px solid #E1E1E1;
	padding-left: 1em;
	padding-top: 1em;
	padding-bottom: 2em;
}

#contact2  input, #contact2 select, #contact2 textarea {
	position: absolute;
	left: 12em;
}

#contact2 label {
	font-size: 100%;
	margin: 0em;
}

#contact2 textarea{ /*for Firefox, IE rule is in IEonly.css*/
	left: 12.3em;
}

.textarea {
margin-top: 5em;
}

#contact2 div {
margin-bottom: 1em;
}

/*--- Images ---*/

img {
	border: 0px none;
 }

.img1 {
	margin: 0.5em;
	border: 1px solid #CCC;
}

.imgr {
	margin: 0.5em;
	border: 0px none;
	float: right;
}

.imgr2 {
	margin: 0.5em 1.5em 0.5em 0.5em;
	border: 0px none;
	float: right;
}

.imgex {
	margin: 1em 0em 0em 2.6em;
	border: 0px none;
}

.fleft {
	float: left; 
}

.fright {
	float: right;
	margin-left: 10px;
}

/*--- Rounded corners ---*/

.mid {
	background-color: #E7F3CF;
	margin: 0em 2em 0em 1em;
	padding: 0.5em 1em 1em;
}

.top {
	margin-right: 2em;
	margin-left: 1em;
	text-align: right;
	margin-top: 2em;
	background: #E7F3CF url(../images/tleftg.gif) no-repeat left top;
}

.bot {
	text-align: right;
	margin-right: 2em;
	margin-left: 1em;
	background: #E7F3CF url(../images/bleftg.gif) no-repeat left bottom;
}

/*--- Others --*/

.ora {
	color: #F90;
	font-weight: bold;
}

.switchcontent {
	margin: 0 1em 1.4em;
	line-height: 1.5em;
	padding: 0.5em;
	background: #D2D5F0;
}

.clearright {
	clear: right
}

/*Microformat hcard details*/

.vcard {
	margin: 2em 0 0;
	background-color: #D1E0EF;
	padding: 0.5em 0.5em 0.5em 1em;
	font-size: 75%;
}

.vcard span {
	display: block;
}

.org {
	font-weight: bold;
}

/*---Others ---*/

.skiplink {
	display: none;
}

#content .demo-show h2 {
	font-size: 110%;
cursor: pointer;
}

#content .demo-show div ul {
	margin-top:0;
}

/*--- Message box ---*/

.message {
	position: absolute;
	top: 0;
	left: 0;
	text-align: center;
	width: 100%;
	border-bottom: 1px solid #FFF;
	font-weight: normal;
	z-index: 10;
	background: #CAE7C9;
	padding-bottom: 20px;
	padding-top: 20px;
}
.message img {

}