/*---------------------------------------------------------------------------
8.css
(c) Copyright 2000-2008 Octave & Octave. All rights reserved.
-----------------------------------------------------------------------------
Author: Matthieu Fauveau (mfauveau@deckmatt.com)
Last update: 06-29-2008
---------------------------------------------------------------------------*/

/*-------------------------------------------------
baseline
-------------------------------------------------*/
body {
	background-color: #FCFBFB;
	font-family: Arial;
	font-size: 100%;	
	line-height: 16px;
}

div#container {	
	float: left;
	width: 883px; /* 970 - 60 - 27 = 883 */
	padding: 27px 0 0 60px;
	margin: 0 0 0 27px;
	/*margin: 0 auto 0 auto;*/
}

.left { float: left; }
.right { float: right; }
.clearfix { clear: both; }

/*-------------------------------------------------
header
-------------------------------------------------*/
div#header {
	float: left;
	width: 100%;
}

div#header img.logo {
	position: absolute;
	left: 32px;
}

div#header div#menu	{ 
	float: right;
	text-align:right; 
	width:794px;
	background: url("../img/h-m-lr-norm.png") repeat-x right bottom;	
}

div#header ul.menu {
	float: right;
	width: auto;

	background: url("../img/h-m-lr-norm.png") repeat-x right bottom;
	margin: 28px 0 0 0;
	text-align:right;
}

div#header ul.menu li {
	float: left;
	font-size: 13px;

}

div#header ul.menu li a {
	display: block;
	padding: 6px 10px;
	color: #000;
	text-decoration: none;
	font-weight:bold;
}

div#header ul.menu li a:hover {
	color: #ff0000;
}

div#header ul.menu li.current {	background: url("../img/h-m-on.png") repeat-x right bottom; }

div#header ul.menu li.current a {

	color: #fff;
}

div#header ul.menu li.current a:hover {	color: #fff; }




/*-------------------------------------------------
footer
-------------------------------------------------*/
div#footer {
	float: left;
	width: 862px;
	margin: 20px 0 0 0;
	padding: 8px 20px 40px 0;
	background: url("../img/footer-bg.png") repeat-x left top;
	font-size: 12px;
}


div#footer div.col {
	float: left;
	background: transparent url("../img/footer-col-bg.png") no-repeat right top;
	width: 162px;
	padding: 12px 0 0 20px;
}

div#footer div.copyright {
    width: 250px;
	background: none;
	color: #7f7e7e;
	font-size: 9px;
	padding: 70px 0 0 20px;
}

div#footer div.copyright a {
    padding: 0;
	background: none;
}

div#footer div.vcard div.org { font-weight: bold; }

div#footer div.vcard div.org,
div#footer div.vcard div.adr,
div#footer div.vcard div.street-address,
div#footer div.vcard div.country {
	margin: 2px 0 2px 0; 
}

div#footer div.vcard span.type { display: none; }

div#footer a {
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 12px;
	color: #ff0000;
	text-decoration: none;
}

div#footer a:hover { text-decoration: underline; }

div#footer p { margin: 5px 0 5px 0; }

div#footer ul {	padding-left: 10px; }

div#footer ul li {
	list-style-type: disc;
	font-size: 10px;
	margin: 0 0 6px 0;
}

div#footer ul li:hover { color: #ff0000; }

div#footer ul li a {
	display: block;
	font-size: 12px;
	background: none;
	color: #000;
	text-decoration: none;	
	padding: 0;
}

div#footer ul li a:hover {
	color: #ff0000;
	text-decoration: none;
}

div#footer #metier {
	margin: 0;
	padding: 10px 20px 0px 20px;
	line-height:17px;
}

div#footer #metier strong { 
	color: #f00; font-weight:bold;
}

div#footer #metier a { 
	color: #000; background:none; padding:0; 
	text-decoration: none;	
}
div#footer #metier a:hover { 
	color: #f00;
}

/*-------------------------------------------------
heading
-------------------------------------------------*/
div#heading {
	float: left;
	margin: 31px 0 0 0;
	padding: 0 0 20px 0;
	width: 100%;
}

div#heading #title {
	margin:-26px 0 0 0;
	padding:0; 
	text-indent:-9999pt; 
	height:145px; 
	width:883px; 
	background-repeat: no-repeat;
	background-image:url('../img/title.png');
}

div#heading h1 {
	font-weight: 500;
	font-size: 24px;
	line-height:28px;
}

div#heading h2 {
	font-weight: 500;
	font-size: 16px;
	margin: 10px 0 0 0;
}

div#heading p {
	line-height:1.2em;
}

div#heading #metier {
	margin: 0;
	padding: 20px 0 0 0;
	line-height:17px;
	font-size: 12px;
}

div#heading #metier strong { 
	font-weight: bold;
	font-size: 16px;
	padding:2px 7px 0 0;
}

div#heading #metier a { 
	color: #000; background:none; padding:0; 
	text-decoration: none;	
}
div#heading #metier a:hover { 
	color: #f00;
}	
	
div#heading #metier a.viewall {
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 12px;
	color: #000;
	text-decoration: none;
	font-size: 12px;
	margin: 0;
}
div#heading #metier a.viewall:hover {
	color: #f00;
	text-decoration: none;		
}

/*-------------------------------------------------
content
-------------------------------------------------*/
div#content {
	float: left;
	margin: 0 0 0 0;
	font-size: 12px;
	width: 100%;
}

div#content h1 {
	font-weight: bold;
	font-size: 16px;
	padding:2px 0 0 0;
}

div#content h2 {
	color: #ff0000;
	font-weight: 800;
}

div#content h3 {
	color: #292929;
	font-weight: 400;
}

div#content span.pipe {	color: #b4b3b3; }

div#content a { 
	color: #6c6c6c;
	text-decoration: none;	
}
div#content a:hover { 
	color: #f00;
}



/* sort by */
div#content ul.sortby {
	float: left;
	width: 100%; 
	position: relative;
	top: -20px;
	border-bottom: 1px solid #dfdfdf;
	line-height:1em;
}

div#content ul.sortby li {
	float: right;
	background: url("../img/lp-sb-r-norm.png") no-repeat right top;
	margin: 0 4px 0 0;
}

div#content ul.sortby li.first-child { margin: 0; }

div#content ul.sortby li a {
	background: url("../img/lp-sb-l-norm.png") no-repeat left top;
	font-size: 11px;
	font-weight: bold;
	color: #000;
	text-decoration: none;
	display: block;
	padding: 7px 15px 4px 15px;
}

div#content ul.sortby li:hover { background: url("../img/lp-sb-r-over.png") no-repeat right top; }

div#content ul.sortby li:hover a {
	background: url("../img/lp-sb-l-over.png") no-repeat left top;
	color: #656565;	
}

div#content ul.sortby li.current {
	background: url("../img/lp-sb-r-on.png") no-repeat right top;
}

div#content ul.sortby li.current a {
	background: url("../img/lp-sb-l-on.png") no-repeat left top;
	color: #ff0000;	
	padding: 5px 15px 6px 15px;
}

/* view all link */
div#content a.viewall {
	float: left;
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 12px;
	color: #000;
	text-decoration: none;
	font-size: 12px;
	margin: 5px 0 0 10px;
	display: block;
}
div#content a.viewall:hover {
	color: #000;
	text-decoration: underline;	
}

div#content a.viewproject {
	float: left;
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 12px;
	color: #000;
	text-decoration: none;
	font-size: 12px;
	margin: 10px 0 0 0px;
	display: block;
}
div#content a.viewproject:hover {
	color: #000;
	text-decoration: underline;	
}

/* prev/next */
div#content div.prevnext {
	position: relative;
	top: -20px;
	float: right;
}

div#content div.prevnext a.prev,
div#content div.prevnext a.next {
	float: left;
	display: block;
	height: 17px;
	width: 17px;
	text-indent: -9999px;
	overflow: hidden;
}

div#content div.prevnext a.prev {
	background: url('../img/nav-arrow-prev.png') 0px 0px no-repeat;
	margin: 0 5px 0 0;
}

div#content div.prevnext a.next {
	background: url('../img/nav-arrow-next.png') 0px 0px no-repeat;
}

div#content div.prevnext a.prev:hover,
div#content div.prevnext a.next:hover {
	background-position: 0 -17px;	
}

/* list */
div#content ul.list {
	clear: left;
	float: left;
	width: 180px;
	border-bottom: 1px dashed #dddcdc;
	padding: 3px 0 0 0;
	margin: 0 16px 0 0;
}

div#content ul.list li { border-top: 1px dashed #dddcdc; }
div#content ul.list li.first-child { border-top: 0; }

div#content ul.list li a {
	display: block;
	line-height: 16px;
	font-size: 12px;
	color: #000;
	text-decoration: none;
	padding: 3px 20px 3px 4px;
}

div#content ul.list li a:hover {
	color: #ff0000;
	text-decoration: none;
}

div#content ul.list li.current a {
	background: #ff0000 url("../img/link-arrow-white.png") 165px 6px no-repeat;
	color: #fff;
}

div#content ul.list li ul { padding-left: 25px; }

div#content ul.list li ul li,
div#content ul.list li.current ul li {
	list-style-type: disc;
	font-size: 8px;
	color: #717070;	
}

div#content ul.list li ul li:hover,
div#content ul.list li.current ul li:hover { color: #ff0000; }

div#content ul.list li ul li a,
div#content ul.list li.current ul li a {
	background: none;
	color: #717070;
	margin-left: -5px;
}

div#content ul.list li ul li a:hover,
div#content ul.list li.current ul li a:hover {
	color: #ff0000;
}

div#content ul.list li ul li.current { list-style-type: none; }

div#content ul.list li ul li.current a {
	background: #ff0000 url("../img/link-arrow-white.png") 145px 6px no-repeat;
	color: #fff;
}

div#content ul.list li ul li.current a:hover {
	color: #fff;
}	




/*-------------------------------------------------
pages
-------------------------------------------------*/
div#content .page {
	float: left;
	width: 686px;
}

div#content .pagewide {
	clear: left;
	float: left;
	width: 100%;	
}


/* home */
div#content .home {
	clear: left;
	float: left;
	/* width: 668px;	*/
}

div#content .home div.items { 
	margin: 20px 0 0 0; 
}

div#content .home div.item {
	float: left;
	margin: 0 7px 0 0;
	width: 215px;
	overflow: hidden;
}

div#content .home div.item a.screenshot img { border: 1px solid #d8d7d7; }

div#content .home div.item a.screenshot:hover img { border: 1px solid #ff0000; }

div#content .home div.last-child { margin: 0; }

div#content .home div.item h1,
div#content .home div.item h2 {
	color: #ff0000;
	font-size: 17px;
	font-weight: 600;
	margin: 20px 0 0 0;
}

div#content .home div.item h2 {
	color: #000;
	margin: 5px 0 0 0;
}

div#content .home div.item h3 {
	color: #292929;
	margin: 10px 0 0 0;
	font-size: 13px;
}

div#content .home div.item a.screenshot:hover h1, 
div#content .home div.item a.screenshot:hover h2,
div#content .home div.item a.screenshot:hover h3 { color:#ff0000; }

div#content .home div.item div.desc {
	margin: 15px 0 0 0;
	padding: 10px 0 10px 0;
	border: 1px dashed #cfcece;
	border-left: 0;
	border-right: 0;
	font-size: 12px;
}

div#content .home div.item div.desc h4 {
	font-size: 12px;
	font-weight: normal;
}

div#content .home div.item div.desc p {
	margin: 8px 0 0 0;
	line-height: 16px;
}


/* news */
div#content div.news {
	padding: 20px 0 0 0;
}

div#content div.news h1 {
	color: #ff0000;
	font-size: 17px;
	font-weight: 600;
	margin: 20px 0 0 0;
}

div#content div.news h2 {
	font-size: 17px;
	font-weight: 600;
	color: #000;
	margin: 0 0 5px 0;
}

div#content div.news p {
	margin:0 0 10px 0;
	padding:0;
}

div#content div.news p.date {
	font-size: 10px;
	font-weight: normal;
	color: #666;
	margin: 0 0 5px 0;
}



div#content div.news a {
	text-decoration: underline;
}

div#content div.news a:hover {
	text-decoration: none;
}


/* project */

div#content .project {
	width:680px;
	margin-left:6px;
}
div#content .project h2 {
	float: left;
	font-size: 23px;	
}

div#content .project span.pipe {
	float: left;
	font-size: 25px;
	margin: -3px 5px 0px 5px;
}

div#content .project h3 { font-size: 23px; }

div#content .project a.screenshot img {	border: 1px solid #d8d7d7; }

div#content .project div.description {
	float: left;
	width: 680px;
	border-bottom: 1px solid #dfdfdf;
	padding: 0 0 20px 0;
}

div#content .project div.description dl {
	float: left;
	width: 50%;
}

div#content .project div.description dl dt {
	font-size: 12px;
	font-weight: 600;
	color: #505050;
	margin: 12px 0 6px 0;
}

div#content .project .description dd {
	font-size: 12px;
	line-height: 16px;
}

div#content .project .description dd a {
	/*border-bottom: 1px dashed #000;*/
	color:#777;
	text-decoration:underline;
}
div#content .project .description dd a:hover {
	color:red;
}

div#content .project div.description dl dd ul {
	list-style-type: disc;
	padding: 0 0 0 15px;
	font-size: 10px;
}

div#content .project div.description dl dd ul li,
div#content .project div.description dl dd ul li span {
	font-size: 12px;
	line-height: 16px;
}

div#content .project div.rel {
	float: left;
	margin: 20px 0 0 0;	
}

div#content .project div.rel .items {
	float: left;
	width: 340px;
}
div#content .project div.rel .items-right {
	width: 334px;
	padding-left:6px;
}

div#content .project div.rel h4 {
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 22px;
	font-size: 14px;
}

div#content .project div.rel a.item {
	float: left;
	margin: 6px 6px 0 0;
	width: 164px;
	height: 150px;
	text-decoration: none;
	color: #000;	
}

div#content .project div.rel a.item span.screenshot img { border: 1px solid #d8d7d7; }

div#content .project div.rel a.item:hover span.screenshot img { border-color: #ff0000; }

div#content .project div.rel a.item:hover {
	color: #ff0000;
	cursor: pointer;
}

div#content .project div.rel a.item span.description {
	float: left;
	margin: 5px 0 15px 0;
}

div#content .project div.rel a.item span.description h5 {
	padding-top:2px;
	color:#8f8f8f;
}
div#content .project div.rel a.item:hover span.description h5 {
	color:#ff0000;
}

/* projects */
div#content .projects div.items {
	float: left;
}	

div#content .projects div.item {
	float: left;
	margin: 0 0 35px 0;
	width: 100%;
}

div#content .projects div.item h2 {
	float: left;
	font-size: 18px;
}

div#content .projects div.item h3 {
	font-size: 18px;	
}

div#content .projects div.item span.pipe {
	float: left;
	font-size: 20px;
	margin: -3px 5px 0px 5px;
}

div#content .projects div.item a.screenshot {
	float: left;	
	margin: 20px 10px 0 0; 
}

div#content .projects div.item a.screenshot img { border: 1px solid #d8d7d7; }

div#content .projects div.item a.screenshot:hover img { border-color: #ff0000; }

div#content .projects div.item div.description {
	position: relative;
	float: left;
	border-bottom: 1px solid #dfdfdf;	
	height: 128px;
	width: 463px;
	margin: 20px 0 0 0;	
}

div#content .projects div.item div.description dt {
	font-size: 12px;
	font-weight: 600;
	color: #505050;
	margin: 6px 0 3px 0;
}

div#content .projects div.item div.description dt.first-child {	margin-top: 0; }

div#content .projects div.item div.description dd {
	font-size: 12px;
	line-height: 16px;
}

div#content .projects div.item div.description dd a {
	color:#8f8f8f;
}
div#content .projects div.item div.description dd a:hover {
	color:#ff0000;
}

div#content .projects div.item div.description a.more {
	position: absolute;
	bottom: 5px;
	background: transparent url("../img/link-arrow.png") 0px 4px no-repeat;
	padding: 0 0 0 12px;
	color: #ff0000;
	text-decoration: none;
	font-size: 12px;
}

div#content .projects div.item div.description a.more:hover { text-decoration: underline; }

/* listing */
div#content .listing h2,
div#content .listing h2 a {
	clear: left;
	float: left;
	color: #ff0000;
	font-size: 17px;
	font-weight: 800;
}

div#content .listing div.items { 
	clear: left;
	float: left; 
	margin: 0 0 30px 0;
	width: 100%;
}

/*
div#content .sector a.item,
div#content .clients a.item {
	float: left;
	margin: 8px 8px 0 0;
	border: 1px solid #d8d7d7;
}

div#content .sector a.item:hover,
div#content .clients a.item:hover {
	background-color: #ff0000;
	border: 1px solid #ff0000;
}
*/

div#content .sector a.item,
div#content .clients a.item {
	float: left;
	margin: 8px 8px 0 0;
}

div#content .sector a.item:hover,
div#content .clients a.item:hover {
	
}

div#content .sector a.item span.screenshot img,
div#content .clients a.item span.screenshot img {
	border: 1px solid #d8d7d7;
}

div#content .sector a.item:hover span.screenshot img,
div#content .clients a.item:hover span.screenshot img {
	border: 1px solid #ff0000;
}

div#content .projects div.items a.item {
	display: block;
	float: left;
	margin: 10px 10px 0 0;
	/*width: 164px;*/
	width: 213px;
	text-decoration: none;
	color: #000;
}

div#content .projects div.items a.item span.screenshot img { border: 1px solid #d8d7d7; }
/*div#content .projects div.items a.item span.screenshot img { border: 1px solid #FCFBFB; }*/

div#content .projects div.items a.item:hover span.screenshot img { border-color: #ff0000; }

div#content .projects div.items a.item:hover {
	color: #ff0000;
	cursor: pointer;
}

div#content .projects div.items a.item span.description {
	float: left;
	margin: 5px 0 15px 0;
}

div.static h1, div.static h2, div.static h3 {
	margin-bottom:1em;
}
div.static h3 {
	font-size:1.3em;
	font-weight:bold;
}
div.static ul {
	margin:1em 0 1em 1em;
	list-style-type: disc;
}
div.static ul li, div.static ul ul li {
	margin:0.5em 0;
	line-height: 16px;
}
div.static ul ul {
	margin:0.5em 0 0.5em 2em;
	list-style-type: circle;
}

div#content a.linkarrow {
	display:block;
	color:#6c6c6c;
	background: transparent url("../img/link-arrow.png") 0px 9px no-repeat;
	padding: 5px 0 0 12px;
}
div#content a.linkarrow:hover {
	color:#f00;
}

div#content div.contentLeft23 {
	float:left;
	width:640px;
	margin-right:20px;
}
div#content div.contentRight13 {
	float:right;
	width:220px;
}

div#content div.contentLeft23 p,
div#content div.contentRight13 p,
div.static p {
	margin-bottom:1em;
	line-height:16px;
}

div#content div.jobs ul {
	list-style-type: circle;
	padding-left: 2em;
	margin-bottom:1em;
	line-height:16px;
}

div#content div.static p {
	line-height:16px;
}

ul.level1 {}
ul.level2 { margin-left:20px; }