/* Reset CSS: */
html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,th{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
abbr,acronym {border:0;font-variant:normal;}
sup{vertical-align:text-top;} sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
legend{color:#000;}

html { background: #ccc; }
body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 100%; /* 16px across browsers */
	line-height: 1.25em; /* 20px */
	background: #ccc url(../images/background.png) left top repeat-x;
}

strong { font-weight: bold; color: #333; }
em { font-style: italic; }
.green { color: #719d06; }

p, #content ul {
	font-size: 0.875em; /* 14px */
	margin: 0.714em 0; /* 10px */
}

sub, sup { font-size: 0.8em; line-height: 0.8em; }

a:link, a:visited { color: #719d06; text-decoration: underline; }
a:hover, a:active { color: #c63e16; }

h1 {
	font-size: 1.625em; /* 26px */
	line-height: 1.1538em; /* 30px */
	font-weight: bold;
	color: #333;
}

h2 {
	font-size: 1.25em; /* 20px */
	color: #333;
}

#sidebar h2, #intro h2, #contactdetails h2 { line-height: 1.5em; /* make it line up with H1 */ }

#content ul li {
	background: transparent url(../images/green-bullet.png) left top no-repeat;
	padding-left: 16px;
}

#sidebar ul {
	font-size: 0.9375em; /* 15px */
	font-weight: bold;
	color: #333;
}

#sidebar ul li { margin-bottom: 0.6667em; /* 10px */ }

#footer p {
	font-size: 0.6875em;
	color: #555;
}


/* =structure
 * =================================== */
#wrapper {
	margin: 0 auto;
	width: 794px;
	background: transparent url(../images/bkgd-page.png) center top repeat-y;
}

#page {
	background: transparent url(../images/bkgd-page-top.png) center top no-repeat;
}

#mainnav {
	padding: 31px 7px 0 27px;
}

#logo { float: left; display: block; width: 208px; height: 91px; }

#mainnav ul {
	float: right;
	width: 521px;
	margin-top: 70px;
}

#mainimage {
	clear: both;
	padding: 0 7px 0 7px;
	/* top padding overriden for IE, that needs 4px */
}

#mainimage img { 
	display: block;
/*	border-top: 7px solid #bf3c15; */
}

#contentwrap {
	clear: both;
	padding: 0 7px;
}

.home #contentwrap { padding-top: 1px; } /* On the homepage, the orange top border comes from #mainimage */

#content {
	background: #fff url(../images/bkgd-sidebar.jpg) right top no-repeat;
	overflow: auto;
	width: 100%;
	border-top: 7px solid #bf3c15;
}

.home #content { border-top-width: 0; }
.diagram #content { background-image: none; }

#main {
	width: 501px;
	float: left;
}

#main .inner {
	padding: 20px 0 20px 20px;
}

.diagram #main { width: auto; float: none; }
.diagram #main .inner { padding-right: 20px; }

#sidebar {
	float: right;
	width: 240px;
}

#sidebar .inner {
	padding: 20px 20px 20px 0px;
}

.technology #sidebar .inner { padding-right: 0; }

#footer {
	clear: both;
	background: transparent url(../images/bkgd-footer.png) center bottom no-repeat;
	height: 46px;
}

#footer p { padding: 10px 20px 0px 20px; margin: 0; }





/* =buttons & tabs
 * ========================================== */

#mainnav li {
	display: block;
	float: left;
	height: 29px;
	margin-right: 7px;
	background-position: center top;
	width: 169px;
}

#mainnav li#contactnav { margin-right: 0; }

#mainnav li a {
	display: block;
	height: 29px;
	text-indent: -999em;
}

#mainnav li a:link, #mainnav li a:visited { background-position: center bottom; }
#mainnav li a:hover, #mainnav li a:active,
#mainnav li.current a:link, #mainnav li.current a:visited { background-position: center top; outline: none; }
#mainnav li a:focus { outline: none; }

#overviewnav, #overviewnav a { background-image: url(../images/tab-overview.png); }
#technologynav, #technologynav a { background-image: url(../images/tab-technology.png); }
#contactnav, #contactnav a { background-image: url(../images/tab-contact.png); }

.button, .button a {
	display: block;
	height: 28px;
	line-height: 28px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: -999em;
}

.button a:link, .button a:visited { background-position: left bottom; }
.button a:hover, .button a:active { background-position: left top; outline: 0; }
.button a:focus { outline: none; }

#moredetails, #moredetails a { background-image: url(../images/btn-moredetails.png); width: 128px; }
#viewdiagram, #viewdiagram a { background-image: url(../images/btn-viewdiagram.png); width: 135px; }
#findoutmore, #findoutmore a { background-image: url(../images/btn-findoutmore.png); width: 139px; }
#back, #back a { background-image: url(../images/btn-back.png); width: 85px; }
#close, #close a { background-image: url(../images/btn-close.png); width: 85px; }

#back { float: right; }


#diagramthumb {
	display: block;
	margin: 10px 0;
	outline: 0;
}

#processdiagram {
	display: block;
	margin: 20px 0;
}


/* =contact page
 * ========================================= */

#intro {
	float: left;
	width: 45%;
	padding-bottom: 20px;
}

#contactdetails {
	float: right;
	width: 50%;
	padding-bottom: 20px;
}

.fn, .street-address, .locality, .country-name {
	display: block;
}

.dialcode { color: #888; }

.tel { font-weight: bold; color: #333; }

.type {
	font-size: 0.7857em; /* 11px */
	text-transform: uppercase;
	font-weight: normal;
}

p#vcard {
	background: transparent url(../images/vcard.png) left center no-repeat;
	padding-left: 30px;
}

label {
	display: block;
	text-transform: uppercase;
	font-size: 0.6875em; /* 11px */
	line-height: 1.3636em; /* 15px */
	margin-top: 5px;
}

input.textbox {
	width: 208px;
}

textarea {
	width: 208px;
	margin-bottom: 10px;
}

.error {
	background-color: #FFE409;
	padding: 2px 4px;
}