/*
*************************************************
 
Société Nouvelle Régionale du Bâtiment (SNRB)
General Screen Styles
 
Created by Matthieu Fauveau at Deckmatt
 
*************************************************
*/

/*-------------------------------------------------------------
RESET 
v1.0-20080212
http://meyerweb.com/eric/tools/css/reset/
-------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table {
	border-collapse: collapse;
	border-spacing: 0;
} 

/*-------------------------------------------------
COMMON
-------------------------------------------------*/
html, body {
	background: #f5f5f5;
	color: #000;
	font: normal 13px 'Lucida Grande', Arial, Helvetica, sans-serif;
	text-align: center;
}

.clearBoth { clear: both; }
.floatLeft { float: left; }
.floatRight { float: right; }

a { color: #a00916; text-decoration: underline; }
a:hover { text-decoration: none; }

a.arrow {
	color: #a00916;
	background: url('../img/icon_li_arrow_red.png') 0px 6px no-repeat;
	padding: 0 12px;
}

a.arrow.current {
	color: #808080;
	background-image: url('../img/icon_li_arrow_grey.png');
	text-decoration: none;
}

#container {
	text-align: left;
	width: 740px;
	margin: 0 auto;
	background: #eee;
}

/*-------------------------------------------------
IMAGES
-------------------------------------------------*/
p img {
	padding: 0;
	max-width: 100%;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}

.alignright {
	float: right;
}

.alignleft {
	float: left
}

/*-------------------------------------------------
BUTTONS
-------------------------------------------------*/
a.button {
    color: #000;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    display: block;
    float: left;
    height: 22px;
    margin-left: 6px;
    padding-right: 10px; /* sliding doors padding */
    text-decoration: none;    
}
a.button.grey {
	background: transparent url('../img/button-grey_a.png') no-repeat scroll top right;
}
a.button span {
    display: block;
    line-height: 12px;
    padding: 5px 0 5px 9px;
} 
a.button.grey span {
    background: transparent url('../img/button-grey_span.png') no-repeat;
} 
a.button:active {
    background-position: bottom right;
    outline: none; /* hide dotted outline in Firefox */
}
a.button:active span {
    background-position: bottom left;
    padding: 6px 0 4px 9px; /* push text down 1px */
} 

/*-------------------------------------------------
HEADER
-------------------------------------------------*/
#header {
	position: relative;
	height: 157px;
}

#header h1 a {
	display: block;	
	text-indent: -123456px;
	position: absolute;
	top: 15px;
	left: 15px;	
	width: 145px;
	height: 77px;
	background: url('../img/header_logo.png') no-repeat;
}

#header h2 {
	display: block;
	text-indent: -123456px;
	position: absolute;
	top: 55px;
	left: 185px;
	width: 260px;
	height: 16px;
	background: url('../img/header_h2.png') no-repeat;
}

#header .utility {
	position: absolute;
	top: 0;
	right: 0;
}

#header .utility li {
	float: left;
}

#header .utility li a {
	display: block;
	padding: 5px 15px;
	color: #474747;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
}
#header .utility li a:hover {
	color: #000;
}

#header .utility li a.contacts {
	background: url('../img/icon_mail.png') 0 9px no-repeat;
}
#header .utility li a.contacts:hover {
	background-position: 0 -7px;
}

#header .utility li a.sitemap {
	background: url('../img/icon_sitemap.png') 4px 10px no-repeat;
}
#header .utility li a.sitemap:hover {
	background-position: 4px -6px;
}

#header .search {
	position: absolute;
	top: 30px;
	right: 15px;
}

#header .search input {
	float: left;
	margin: 1px 0 0 0;
}

#header .nav {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 35px;	
	background: #c00418;
}

#header .nav li {
	float: left;
}

#header .nav li a {
	display: block;
	color: #FFF;
	text-decoration: none;
	text-transform: uppercase;	
	font-weight: bold;
	font-size: 12px;
	padding: 10px;
	background: url('../img/header-nav_background.png') right center no-repeat;
}

#header .nav li a.last-child {
	background: none;
}

#header .nav li a:hover {
	color: #990000;
}

#header .nav li.home a {
	text-transform: lowercase;
	font-weight: normal;
	text-decoration: underline;
	background: none;
}
#header .nav li.home a:hover {
	color: #FFF;
	text-decoration: none;
}

/*-------------------------------------------------
HEADING
-------------------------------------------------*/
#heading {
	position: relative;	
	background: #9d9fa0;
	height: 100px;
	/* IE 6 */
	_top: -1px;
}

#heading.home {
	height: 215px;
	background: #9d9fa0 url('../img/heading-page_home.jpg') no-repeat;
} 

#heading.qui-sommes-nous {
	height: 215px;
	background: #9d9fa0 url('../img/heading-page_qui-sommes-nous.jpg') no-repeat;
} 

#heading .wrapper {
	padding: 10px 20px;
}

#heading h1 {
	font-size: 32px;
	font-weight: normal;
	text-transform: uppercase;
	border-left: 6px solid #a00916;
	padding: 4px 16px;
}

#heading .breadcrumb {
	position: absolute;
	bottom: 0;
	width: 740px;
	height: 35px;
	background: #FFF;
	filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6; 
    /* IE 6 */
   _bottom: -1px;
}

#heading .breadcrumb ul {
	padding: 0 0 0 20px;	
}

#heading .breadcrumb ul li {
	float: left;
	color: #000000;
	font-size: 12px;
	font-weight: bold;
}

#heading .breadcrumb ul li span {
	display: block;
	padding: 10px 0;
}

#heading .breadcrumb ul li a {	
	display: block;
	padding: 10px 15px 10px 10px;
	color: #000000;
	background: url('../img/icon_arrow_breadcrumb.png') center right no-repeat;;
}

#heading .breadcrumb ul li a.current {
	text-decoration: none;
}

/*-------------------------------------------------
CONTENT
-------------------------------------------------*/
#content {
	position: relative;
	background: #FFF url('../img/content-wrap_background.png') repeat-x;
	padding: 0 0 20px 0;
	/* IE 6 */
	_zoom: 1;
	_top: -1px;
}

#content hr {
	border: 0;
	color: #c9c9c9;
	background-color: #c9c9c9;
	height: 2px;
	margin: 20px 0;
	/* IE 6 */
	_margin: 10px 0;
	/* IE 7 */
	*margin: 5px 0;
}

#content h1,
#content h2 {
	color: #af0917;
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	padding: 10px 0;
}

#content h2 {
	font-size: 16px;
	color: #000;
}

#content h3 {
	font-size: 14px;
	font-weight: normal;
}

#content h1 span,
#content h2 span {
	font-weight: bold;
}

#content p {
	margin: 10px 0;
}

#content blockquote {
	background: transparent url('../img/quote-red_left.png') top left no-repeat;
	color: #000;
	font-style: oblique;
	margin: 0;
	padding: 0 0 0 20px;
	text-align: left;

}

#content blockquote div {
	background: transparent url('../img/quote-red_right.png') right bottom no-repeat;
	padding: 0 15px 0 0;
	font-size: 14px;
	line-height: 20px;
}

#content p.author {
	text-align: right;
}

#content ul {
	color: #000;
	margin: 10px 0;
	padding: 0 0 0 20px;
	list-style-type: disc;
}

#content ul li {
	margin: 0 0 10px 0;
}

#content .wrap {
	padding: 20px;
	min-height: 180px;
	height: auto !important;
	height: 180px;	
}

#content .main {
	float: left;
	width: 420px;
	padding: 0 20px 0 0;
}

#content .sidebar {
	float: right;
	background: #c9c9c9 url('../img/sidebar_background.png') center bottom no-repeat;
	width: 240px;
	padding: 10px 10px 140px 10px;
}

#content .sidebar ul {
	list-style-type: none;
	padding: 0;
}

#content .sidebar ul li {
	font-size: 14px;	
}

#content .qualibat {
	color: #FFF;
	background-color: #0198d5;
	margin: 20px 0 0 0;
	padding: 5px 5px 5px 10px;
	font-size: 11px;
	
}

#content .qualibat img.logo {
	display: inline;
	float: right;
	padding: 10px;
}

#content a.top {
	position: absolute;
	bottom: 5px;
	right: 20px;
	color: #959595;
	text-decoration: none;
	font-size: 11px;
	padding: 0 0 0 15px;
	background: url('../img/icon_top.png') 0 6px no-repeat;
}
#content a.top:hover {
	text-decoration: underline;
}

/* Home */
#content.home .main ul {
	list-style-type: square;
}

#content.home .sidebar,
#content.home .sidebar .holder {
	min-height: 400px;	
	height: auto !important;
	height: 400px;	
}	

#content.home .sidebar a.refresh {
	position: absolute;
	top: 10px;
	right: 10px;
}

#content.home .sidebar .picture img {
	border: 1px solid #FFF;
}

#content.home .sidebar h3 {	
	color: #000;
	font-size: 13px;
	font-weight: normal;
	margin-top: 10px;
}

#content.home .sidebar h3 span {
	font-weight: bold;
}

/* Clients */
#content.clients .main ul {
	list-style-type: none;
	padding: 0;
	color: #000;
	text-transform: uppercase;
}

#content.clients h4 {
	border-bottom: 1px solid #000;
	margin-bottom: 20px;
	margin-left: 20px;
}

#content.clients h4 span {
	position: relative;
	top: 8px;
	left: -25px;
	background-color: transparent;
	padding: 5px;
}

/* Contacts */
#content.contacts .vcard span.type {
	display: none;
}

#content.contacts .vcard a.org {
	color: #000;
	font-weight: bold;
	text-decoration: none;
}

#content.contacts .address {
	float: left;
}

#content.contacts .map {
	float: right;
}

/*-------------------------------------------------
FOOTER
-------------------------------------------------*/
#footer {
	background: #121212;
	color: #FFF;
	height: 35px;
	font-size: 11px;
}

#footer ul li {
	float: left;	
}

#footer ul li.first-child {
	margin: 0 10px 0 0;
	padding: 10px;
}

#footer ul li a {	
	display: block;
	padding: 10px;
	color: #959595;
}
#footer ul li a:hover {
	text-decoration: none;
}

/*-------------------------------------------------
CREDITS
-------------------------------------------------*/
#credits {	
	float: right;	
	padding: 10px;
	color: #b5b5b5;
	font-size: 11px;
}	

#credits a {
	color: #b5b5b5;
}
