/* ---------------------------------------------------------------
--
-- MonBouc.com
-- CSS ecran layout + typographie
--
-- octobre 2006
-- bug a rapporter a aurelien point ferlito chez free point fr
--
--------------------------------------------------------------- */

* {
	margin: 0;
	padding: 0;
}
body {
	font-family: Arial, "Bitstream Vera Sans", Helvetica, sans-serif;
	font-size: 11px;
	background-color: #fff;
}
div#wrap { /* conteneur global */
	margin: 0 auto;
	width: 875px;
}
p#penseBete {
	position: absolute;
	bottom: 70px;
	right: 40px;
	width: 200px;
	z-index: 20;
	background-color: #FF5580 !important;
	color: #fff;
	padding: 2em;
	border: 1px solid #FF3366;
	filter: Alpha(Opacity=80);
	opacity: 0.8;
	display: none;
}
p#penseBete span {
	display: block;
	clear: both;
	font-weight: bold;
	font-size: 12px;
	padding-bottom: 10px;
}

/* header et menus, derniers dans le flux
--------------------------------------------------------------- */
div#header {
	background: white;
	width: 875px;
	height: 296px;
	position: absolute;
	top: 0;
	background-image: url(../img_layout/monbouc_headerbg2.png);
	background-position: top left;
	background-repeat: no-repeat;
}
/* a supprimer
div#langues {
	position: absolute;
	top: 5px;
	right: 25px;
	z-index: 10;
}
div#langues a {
	color: #fff;
	text-decoration: none;
	padding-left: 9px;
	display: block;
	clear: both;
	text-align: right;
	line-height: 16px;
	display: none;
}
div#langues a:hover {
	background-color: #ff1e24;
	color: #fff;
}
*/
a img#headerLogo {
	border: none;
	display: block; /* oblige IE a correctement positionner */
}
div#headerNavi { /* puis choisir la tapisserie */
	width: 256px;
	height: 296px;
	background-position: top left;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 618px;
}
.tapisserie01 {
	background-image: url(../img_layout/monbouc_headernavibg9.png);
}
.tapisserie02 {
	background-image: url(../img_layout/monbouc_headernavibg10.png);
}
.tapisserie03 {
	background-image: url(../img_layout/monbouc_headernavibg11.png);
}
.tapisserie04 {
	background-image: url(../img_layout/monbouc_headernavibg12.png);
}
div#headerNavi ul {
	list-style-type: none;
	position: absolute;
	top: 108px;
	right: 0;
	text-align: right;
}
div#headerNavi ul li {
	padding: 5px 0;
}
div#headerNavi li a img {
	border: none;
	background-image: url(../img_layout/monbouc_navi_bg2.gif);
	background-repeat: repeat;
	padding: 5px;
}
div#headerNavi li a {
	padding: 2px 14px 2px 0;
	display: block;
}
div#headerNavi li a:hover {
	background-image: url(../img_layout/monbouc_papillonhover.png);
	background-repeat: no-repeat;
	background-position: right 4px;
}
div#headerNavi li a.courant {
	background-image: url(../img_layout/monbouc_papillon.png) !important;
	background-repeat: no-repeat;
	background-position: right 4px;
}

/* contenu
--------------------------------------------------------------- */
div#contenu { /* wrap colGauche et colDroite */
	background-image: url(../img_layout/monbouc_contenubg2.png);
	background-position: left top;
	background-repeat: repeat-y;
	width: 875px;
	top: 297px;
	position: absolute;
}

/* colonne gauche
--------------------------------------------------------------- */
div.spacer {
	clear: both;
	display: block;
	border-bottom: 1px dotted #d9d9d9;
	margin: 10px 0 18px 0;
}
div.spacerBas {
	clear: both;
	display: block;
}
hr {
	clear: both;
	display: block;
	height: 0;
	border-bottom: 1px solid #E8E8E8;
}
div#colGauche {
	float: left;
	width: 578px; /* total 618px */
	padding: 0 20px 5px 20px;
}
div#colGauche.portfolio div.portfolioItem {
	background-color: #f5f5f5;
}
div#colGauche.portfolio blockquote,
div#colGauche.accueil blockquote {
	line-height: 135%;
	font-size: 23px;
	font-weight: bold;
	color: #666;
	margin: 20px 0 20px 0;
	letter-spacing: 0.005em;
}
div#colGauche.accueil blockquote#annonce { /* annonce jQuery */
	display: none;
}
div#colGauche.portfolio blockquote span,
div#colGauche.accueil blockquote span {
	color: #FF3366;
}
div#colGauche div.col01 {
	float: left;
	width: 275px;
}
div#colGauche div.col02 {
	float: right;
	width: 275px;
}
div#colGauche.contacts div.col02 {
	padding: 0 0 0 8px; /* top: 29 old */
}
div#colGauche h1 {
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background-color: #8aaad9;
	color: #fff;
	clear: both;
	height: 22px; /* pour FF */
	padding: 8px 0 7px 20px;
	margin-left: -20px; /* annule le padding-left colGauche */
	margin-right: -20px;
	margin-bottom: 15px;
}
div#colGauche.contacts h1 {
	background-color: #FF3e42;
}
div#colGauche.portfolio h1 {
	background-color: #000;
}
div#colGauche.apropos h1 {
	background-color: #E6B800;
	color: #000;
}
div#colGauche h2 {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #000;
	padding: 5px 0;
	margin: 15px 0 5px 0;
}
div#colGauche.portfolio h2 {
	margin: 15px 0 0 0;
}
div#colGauche.portfolio h2+h3 {
	margin-top: 10px;
}
div#colGauche div.col02 h2 {
	margin: 15px 0 5px 0;
}
div#colGauche.apropos div.col02 h2 {
	margin: 26px 0 5px 0;
}
div#colGauche h3 {
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 0.01em;
	color: #555;
	margin: 15px 0 10px 0;
}
div#colGauche.contacts h3 span {
	padding: 3px 10px;
	color: #fff;
	background-color: #FF6A6F;
}
div#colGauche.portfolio h3 {
	margin: 5px 0 !important;
}
div#colGauche.portfolio h3 span {
	padding: 3px 10px;
	color: #fff;
	background-color: #444;
}
div#colGauche.apropos h3 span {
	padding: 3px 10px;
	color: #000;
	background-color: #FFCC33;
}
div#colGauche.contacts h4 {
	font-size: 11px;
	margin: 5px 5px 3px 15px;
}
div#colGauche.portfolio h4 {
	font-size: 11px;
	margin: 0 0 3px 0;
}
div#colGauche.portfolio p+h4,
div#colGauche.portfolio ul+h4 { /* a revoir */
	font-size: 11px;
	margin: 11px 0 3px 0;
}
div#colGauche.apropos h4 {
	color: #555;
	font-size: 10px;
	margin: 11px 0 1px 0;
	font-family: Georgia, "Times New Roman", Times, serif;
}
div#colGauche h4 sup {
	color: #555;
}
div#colGauche ul {
	line-height: 150%;
	list-style-position: inside;
	list-style-type: disc;
	padding-left: 15px;
	margin: 0 0 2px 0;
}
div#colGauche.portfolio ul.projetNavi,
div#colGauche.portfolio ul.projetPages {
	line-height: 150%;
	list-style-position: outside;
	list-style-type: none;
	margin: -5px 0 25px 0;
	padding: 0 0 10px 0;
	border-bottom: 1px dotted #ccc;
	clear: both;
}

div#colGauche.portfolio ul.projetPages {
	margin: 3px 0 25px 0;
	padding: 0 0 10px 0;
}
div#colGauche.portfolio ul.projetPages.basPage {
	border-top: 1px dotted #ccc;
	border-bottom: none;
	margin: 0 0 0 0 !important;
	padding: 7px 0 0 0;
}
div#colGauche.portfolio ul.projetNavi li,
div#colGauche.portfolio ul.projetPages li {
	margin-right: 25px;
}
div#colGauche.portfolio ul.projetNavi a,
div#colGauche.portfolio ul.projetPages a {
	color: #666;
	padding: 0 20px;
	background-image: url(../img_layout/monbouc_fleche_retour.gif);
	background-repeat: no-repeat;
	background-position: left 2px;
}
div#colGauche.portfolio ul.projetPages a {
	background-image: url(../img_layout/monbouc_fleche_pages.gif);
}
div#colGauche p {
	line-height: 160%;
	margin-bottom: 7px;
}
div#colGauche.portfolio p.portfolioWeb {
	background-image: url(../img_layout/monbouc_client_fleche.gif);
	background-repeat: no-repeat;
	background-position: left 4px;
	padding-left: 18px;
}
div#colGauche.portfolio p.portfolioZoom {
	background-image: url(../img_layout/monbouc_notes_puces.gif);
	background-repeat: no-repeat;
	background-position: left 6px;
	padding-left: 12px;
}
div#colGauche.contacts div.col01 p {
	margin: 0 5px 10px 15px;
}
div#colGauche cite {
	line-height: 200%;
	font-family: Georgia, "Times New Roman", Times, serif;
	width: 115px;
	padding: 10px 15px;
	color: #fff;
	background-color: #666;
	font-style: italic;
	font-weight: bold;
	float: right;
	display: none;
}
div.flottantGauche {
	padding: 8px 10px 5px 0;
	float: left;
}
div.flottantCentre {
	padding: 8px 0 12px 0;
	clear: both;
}
img.head { /* pour les images en tete de colonne */
	margin-top: -8px !important;
}
div.flottantDroite {
	padding: 8px 0 10px 10px;
	float: right;
}
div#colGauche.portfolio div.flottantCentre {
	background-image: url(../img_layout/monbouc_portfoliobg2.png); /* ombrage */
	background-repeat: no-repeat;
	background-position: center bottom ;
	/*padding: 8px 0 5px 4px;*/
	margin-bottom: 10px;
}
div#colGauche.portfolio div.flottantCentre.noBg {
	background: none;
}
div#colGauche.portfolio div.flottantCentre img {
	position: relative;
	bottom: -4px;
	left: 4px;
	display: block; /* pouet pouet IE */
}
div#colGauche.portfolio div.flottantCentre a img {
	border: none;
}
div#colGauche.portfolio div.flottantCentre.noBg img {
	margin: 0 auto;
}
div#colGauche img.citation {
	margin: 0 10px 15px 0;
	display: block;
}
span.couleurbg01 {
	background-color: #8aaad9;
	color: #fff;
	padding: 0 7px;
}
span.couleurbg02 {
	background-color: #ff7573;
	color: #fff;
	padding: 0 7px;
}
div#colGauche a {
	color: #333;
}
div#colGauche a:hover {
	color: #000;
	text-decoration: none;
}
acronym {
	border-bottom: dotted 1px #999999;
	cursor: help;
}

/* notes (colonne gauche)
--------------------------------------------------------------- */
div.notes {
	margin: 15px 0 0 0;
	color: #666;
}
div.notes:hover {
	color: #000;
}
div.notes h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px !important;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin: 0 0 5px 0 !important;
	padding: 4px 0 4px 8px;
	background-color: #C6D6EC;
	border-bottom: 3px solid #999;
}
div.notes ul {
	list-style-type: none !important;
	list-style-position: outside !important;
	margin: -5px 0 0 0 !important;
	padding-left: 12px !important;
	line-height: 140% !important;
}
div.notes li {
	background-image: url(../img_layout/monbouc_notes_puces.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	padding-left: 15px;
}
div.notes a {
	color: #666 !important;
}
div.notes a:hover {
	color: #000 !important;
}

/* formulaire de contact (colonne gauche)
--------------------------------------------------------------- */
div#colGauche.contacts form {
    margin: 22px 0;
	width: 270px;
}
div#colGauche.contacts fieldset {
    border: 1px dotted #ccc;
    margin: 0 5px 16px 0;
	padding: 11px 12px 22px 22px;
}
div#colGauche.contacts legend {
    margin: 0 0 0 5px;
    padding: 0 11px;
    background-color: white;
	font-weight: bold;
	color: #666;
}
div#colGauche.contacts label.labelUneLigne {
	font-size: 11px;
	/* color: #EAAF00; */
	/* color: #8aaad9; */
	color: #333;
    display: block;
    margin: 12px 0 3px;
	letter-spacing: 0 !important;
}
div#colGauche.contacts input.inputUneLigne {
	font-size: 11px;
	color: #4d4d4d;
    height: 18px;
    width: 95%;
    display: block;
    padding-top: 4px;
    border: 1px inset #dccfd3;
}
div#colGauche.contacts label span {
	padding-left: 5px;
	color: #ff6a6f;
	font-style: italic;
	font-size: 10px;
	font-family: Georgia, "Times New Roman", Times, serif;
}
div#colGauche.contacts textarea {
	height: 100px;
	width: 95%;
	border: 1px inset #dccfd3;
}
div#colGauche.contacts input.inputUneLigne:focus,
div#colGauche.contacts textarea:focus {
	background-color: #F3F1F3;
}
input.casecarree {
	margin: 10px 0 0 0;
	float: left;
}
label.labelFlottantcase {
	font-size: 11px;
	color: #333;
	line-height: 20px;
	padding: 0 0 0 25px;
	margin: 8px 0 0 0;
	display: block;
}
div#colGauche.contacts input.boutonEnvoyer {
	margin-top: 15px;
	display: block;
	clear: both;
}
div#alerte {
	color: #ff6a6f;
}

/* colonne droite : langues, fil news...
--------------------------------------------------------------- */
div#colDroite {
	float: right;
	margin: 0 14px 0 1px;
	padding: 0 0 0 15px;
	width: 227px; /* total 242px (l217+m14+m1+p10+p15) */
	background-image: url(../img_layout/monbouc_coldroitebg.gif);
	background-position: top;
	background-repeat: no-repeat;
}
div#colDroite h1 {
	font-size: 15px;
	font-style: italic;
	padding: 8px 10px 10px 15px;
	margin: 0 0 25px -15px;
	color: #fff;
	font-family: Georgia, "Times New Roman", Times, serif;
}
div#colDroite h2 {
	font-size: 11px;
	color: #000;
	margin-bottom: 10px;
}
div#colDroite p {
	font-size: 11px;
	color: #333;
	margin: 0 0 7px 0;
	line-height: 160%;
}
div#colDroite a {
	color: #333;
}
div#colDroite a:hover {
	text-decoration: none;
}
div#colDroite blockquote {
	line-height: 150%;
	font-size: 16px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	color: #666;
	margin-top: -7px;
	background-image: url(../img_layout/monbouc_blockquote.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 0 10px 0 30px;
}
div#colDroite.portfolio ul {
	list-style-type: none;
	line-height: 150%;
}
div#colDroite.portfolio li {
	margin: 0 0 12px 0;
	list-style-position: outside;
	background-image: url(../img_layout/monbouc_flechebleue.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
	padding-left: 15px;
}
div#colDroite.actu ul {
	list-style-type: none;
	line-height: 140%;
	color: #333;
	width: 90%;
}
div#colDroite.actu li {
	list-style-position: outside;
	padding-left: 20px;
}
div#colDroite.actu li.actuDate {
	background-image: url(../img_layout/monbouc_client_fleche.gif);
	background-repeat: no-repeat;
	background-position: left 2px;
	color: #5A87C9;
}
div#colDroite.actu li.actuNom {
	/* rien */
	font-weight: bold;
}
div#colDroite.actu li.actuDetails {
	color: #333;
	margin-bottom: 15px;
}
div#colDroite q {
	color: #666;
	quotes: '\0000ab\0000a0' '\0000a0\0000bb' '\00201c\0000a0' '\0000a0\00201d';
}

/* footer
--------------------------------------------------------------- */
div#footer {
	clear: both;
	width: 861px;
	height: 50px;
	background-color: #8aaad9;
	background-image: url(../img_layout/monbouc_footer.png);
	background-position: top;
	background-repeat: no-repeat;
}
div#footer a {
	text-decoration: none;
	color: #fff;
	padding: 2px 10px;
	position: absolute;
	bottom: 11px;
}
div#footer a:hover {
	background-color: #fff;
	color: #000;
}
a#footerImprimer {
	left: 4px;
}
a#footerPlansite {
	left: 545px;
	display: none;
}
a#footerContact {
	left: 619px;
}
a#footerHautdepage {
	left: 773px;
}