/* couleurs :
#ededed		gris clair (fond page)
#959595		gris 1
#777777		gris 2 (texte par défaut)
#bebebe		gris (bordures blocs)
#b22a2d		rouge bordeau
#f7d0d3		rouge clair (bg pour menu actif)
*/

* {margin: 0; padding: 0;}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #777777;
	background: #ededed;
}

ul {list-style: none;}

a {color: #959595; text-decoration: underline; font-weight: bold;}
a:visited {color: #959595; font-weight: normal;}
a:hover {color: #b22a2d; text-decoration: none;}

#page {
	position: relative;
	width: 800px;
	margin: 25px auto;
	padding: 35px 0 0;
}

/* bloc HEADER contenant le logo hsolutions et le menu du site */
#header {width: 200px; position: absolute; left: 0; top: 0; z-index: 5;}
#header img {margin: 0 50px 20px; border: none;}

#lang {text-align: center; margin-bottom: 17px; padding-top: 15px; border-top: 1px solid #b22a2d;}
#lang li {display: inline;}
#lang li a {text-decoration: none; color: #959595; font-weight: normal;}
#lang li a.active {text-decoration: underline; font-weight: bold;}
#lang li a:hover {text-decoration: none; color: #b22a2d;}
#lang {display: none;}

#menu {font-weight: bold; margin-bottom: 50px; z-index: 5; margin-top: 17px;}
#menu li {position: relative;}
#menu a {
	display: block;
	width: 188px;
	margin: 5px 0;
	padding: 3px 5px;
	color: #959595;
	text-decoration: none;
	border: 1px solid #bebebe;
	background: #fff url(../img/menu_arrow.png) no-repeat right 8px scroll;
}
#menu a:visited {font-weight: bold;}
#menu a.active {color: #b22a2d; border: 1px solid #b22a2d; background-color: #f7d0d3; background-image: url(../img/menu_arrow_active.png);}
#menu a:hover {color: #b22a2d; background: #b22a2d url(../img/menu_arrow_hover.png) no-repeat right 8px scroll; border-color: #b22a2d; color: #fff;}
#menu a.nosub {background-image: none;}
#menu a.nosub:hover {background-image: none;}
#menu .sub a {background: transparent url(../img/sub_bg.png) no-repeat 3px 11px scroll; width: 180px; padding-left: 15px; margin: 0; border: none;}
#menu .sub a.active {background-image: url(../img/sub_bg_active.png);}
#menu .sub a:hover {color: #b22a2d; background-image: url(../img/sub_bg_active.png); background-color: transparent; background-position: 3px 11px;}
#menu .sub a span {color: #b22a2d; font-weight: normal; font-style: italic; display: block; display: none;}
#menu .sub a:hover span {color: #000; display: block;}
#menu li:hover .sub {display: block;}

#infos {position: relative; padding: 3px 5px; background: #fff; border: 1px solid #bebebe; border-bottom-width: 3px; z-index: 3; display: none;}
#infos h2 {font-size: 1.5em; color:#b22a2d; text-align: right; margin: -17px -13px -10px 0;}
#infos p {margin: 0 0 5px;}
#infos strong {color: #b22a2d;}
#infos ul li {list-style: square inside;}

/* bloc MAIN contenant la bannière, la navigation, le bloc principal (qui contient la toolbox) */
#main {
	width: 580px;
	margin-left: 220px;
	z-index: 2;
	background: transparent url(../img/main_bg.png) no-repeat 25px 68px scroll;
}

#navi {margin-left: 10px; text-align: right;}
#navi li {display: inline; position: relative;}
#navi a {color: #959595; text-decoration: underline;}
#navi a:hover {color: #b22a2d; text-decoration: none;}
#navi i {color: #b22a2d; font-style: normal;}

#content {
	width: 480px;
	margin: 58px 0 0 50px;
	padding: 10px;
	background: #fff;
	border: 1px solid #bebebe;
	border-bottom-width: 3px;
	text-align: justify;
}
#content h1 {font-size: 2em; color:#b22a2d; text-align: right; margin: -30px -20px 50px 0;}
#content p {margin: 20px 0; text-indent: 25px; line-height: 140%;}
#content .access {font-weight: bold; color: #b22a2d;}
#content ul {list-style: square outside; margin: 20px 0 20px 38px;}
#content form ul {list-style: none; margin: 0;}
#content .contactus {margin-top: 50px !important; margin-bottom: 0; text-align: right;}

#content iframe#gmaps {border: 1px solid #959595;} /* google maps */

#contact_us li {margin: 10px 25px; position: relative;}
#contact_us label {color: #b22a2d; display: block; position: absolute; left: 0; top: 0; width: 150px;}
#contact_us input[type=text], form textarea {border: 1px solid #959595; width: 260px; height: 18px; margin-left: 160px; color: #000; padding: 0 4px;}
#contact_us textarea {height: 150px;}
#contact_us textarea:hover, #contact_us input[type=text]:hover {border-color: #b22a2d;}
#contact_us textarea:focus, #contact_us input[type=text]:focus {background: #eee; border-color: #000;}
#contact_us input[type=submit] {padding: 0 10px; float: right;}

#content #footer {
	position: absolute; 
	left: 0;
	bottom: -50px;
	width: 500px;
	font-size: .8em;
	text-align: center;
	color: #bbb;
}

/* styles propres à certaines pages */

.home #content {padding-bottom: 150px;}
.home #content ul#slideshow {margin: 25px -10px 0;}
.home #content ul#slideshow li {list-style: none; border-top: 1px solid #bebebe;}

.about #content ul#slideshow {display: none;}

#situation #content p {text-indent: 0; margin-left: 25px; margin-right: 25px;}

#contact #content p, .contact #content p {text-indent: 0; margin-left: 25px; margin-right: 25px;}

#works #content {padding-bottom: 25px;}
#works #content h2 {font-size: 1em;}
#works #content h3 {font-size: 1em; margin: 25px 0 0 0; color: #000;}
#works #content h3 span {color: #b22a2d;}
#works #content p {text-indent: 0; margin: 0 0 0 25px;}

#others #content {padding-bottom: 25px;}
#others #content h2 {font-size: 1em;}
#others #content h3 {font-size: 1em; margin: 25px 0 0 0; color: #000;}
#others #content h3 span {color: #b22a2d;}
#others #content p {text-indent: 0; margin: 0 0 0 25px;}
#others #content ul {margin: 0 0 0 50px;}

#private form {margin-bottom: 25px;}
#private form li {margin: 5px 0; position: relative; height: 25px;}
#private form label {color: #b22a2d;}
#private form input {position: absolute; left: 150px; top: 0; width: 150px; border: 1px solid #959595; padding: 0 4px;}
#private input:focus {background: #eee; border-color: #000;}
#private form button {position: absolute; right: 170px; top: 0; padding: 0 10px;}
/*
#clients #content ul {list-style: none; margin: 20px;}
#clients #content ul li {border-top: 1px solid #dcdcdc; position: relative; min-height: 50px; margin-bottom: 10px;}
#clients #content ul li span {display: block; width: 225px; text-align: right; position: absolute; right: 0; top: 0; color: #b22a2d; font-style: italic; border-right: 1px solid #dcdcdc; padding-right: 4px;}
#clients #content ul li img {border-left: 1px solid #dcdcdc; }
*/
#clients #content ul {list-style: none; margin: 20px 20px 20px 0;}
#clients #content ul li {border-top: none; position: relative; background: #fff url(../img/client_shadow.png) no-repeat left top scroll; padding: 15px 0 0 20px; margin-bottom: 10px;}
#clients #content ul li span {display: block; width: 240px; text-align: right; position: absolute; right: 0; top: 15px; color: #b22a2d; font-style: italic; border-top: 1px solid #dcdcdc; padding: 0 4px 0 20px;}
#clients #content ul li img {border-left: 1px solid #dcdcdc; border-top: 1px solid #dcdcdc;}