/* Start of CMSMS style sheet 'mb_reset' */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

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;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* End of 'mb_reset' */

/* Start of CMSMS style sheet 'mb_styles_generaux' */
/* Start of CMSMS style sheet 'mb_styles_generaux' */
/*---------------------------------------------------
COULEURS
gris clair fond #F5F5ED
gris très foncé #263F5C
gris foncé #868986
rose #FD2787
bleu #00ECFF
vert #51FF1A
---------------------------------------------------*/



/*---------------------------------------------------*/
/*--- BASE ---*/
html{
width: 100%;
height: 100%;
}

body{
width: 100%;
height: 100%;
background-color: #F5F5ED;
}

#conteneur{
width:100%;
}

#conteneur_mosaique{
width:100%;
height:auto;
}

#mosaique{
position:relative;
top:-10px;
width:100%;
height:100%;
background-image:url(uploads/images/template/mb_mosaique_fond.gif);
background-repeat: repeat;
}

#footer{
width:100%;
clear:both;
background-color:#F5F5ED;
padding-top:72px;
padding-bottom:25px;
}


/*---------------------------------------------------*/
/*--- HEADER ---*/

#header_base{
position:relative;
z-index: 1;
background:url(uploads/images/template/header_base.png) repeat-x;
height:155px;
}

#header_image{
height:143px;
}

#header_image.bureau{
background:url(uploads/images/template/header_bureau.gif) repeat-x;
}

#header_image.contact{
background:url(uploads/images/template/header_contact.gif) repeat-x;
}


h1{
width: 280px;
height:48px;
position: absolute;
left: 25px;
top: 25px;
}

#titre_print{
display:none;
}

/*---------------------------------------------------*/
/*--- MENU ---*/

#menu{
position:absolute;
right:0px;
}

#menu dfn{
display:none;
}

#menu ul{
width:155px;
}

#menu li{
height:47px;
}

#menu.clair li.bureau{
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
}

#menu.sombre li.bureau{
border-top: 1px solid #868986;
border-bottom: 1px solid #868986;
}

#menu.bureau li.bureau{
border-top: 1px solid #868986;
border-bottom: 1px solid #868986;
}

#menu a{
display:block;
padding-top:15px;
height:100%;
}

/*--- COULEURS MENU ---*/

#menu.sombre a{
color: #868986;
}

#menu.clair a{
color: #fff;
}

#menu.bureau a{
color: #868986;
}


/*---------------------------------------------------*/
/*--- SOUS MENU ---*/

#sous_menu{
position: absolute;
bottom: 12px;
left: 25px;
}

#sous_menu dfn{
display:none;
}

#sous_menu ul{
width:100%;
}

#sous_menu li{
width:auto;
display: inline;
}

#sous_menu a{
display:block;
float:left;
width:auto;
height:30px;
margin-right: 1.125em;
}

/*--- COULEURS SOUS MENU ---*/
#sous_menu li a#architecture.menuactive, #sous_menu li a#architecture.menuactive2{
background-color: #FD2787;
color: #fff;
}

#sous_menu li a#urbanisme.menuactive, #sous_menu li a#urbanisme.menuactive2{
background-color: #00ECFF;
color: #fff;
}

#sous_menu li a#amenagement.menuactive,#sous_menu li  a#amenagement.menuactive2{
background-color: #ffcc00;
color: #fff;
}

#sous_menu li a#paysage.menuactive,#sous_menu li  a#paysage.menuactive2{
background-color: #51FF1A;
color: #fff;
}


#sous_menu.bureau li .menuactive{
background-color: #868986;
color: #fff;
}



#sous_menu.sombre a{
color: #868986;
}

#sous_menu.sombre a:hover{
color: #fff;
}

#sous_menu.clair a{
color: #fff;
}

#sous_menu.bureau a{
color: #868986;
}

#sous_menu.bureau a:hover{
background-color: #868986;
color: #fff;
}

#sous_menu a#architecture:hover{
background-color: #FD2787;
}

#sous_menu a#urbanisme:hover{
background-color: #00ECFF;
}

#sous_menu a#amenagement:hover{
background-color: #FFcc00;
}

#sous_menu a#paysage:hover{
background-color: #51FF1A;
}


/*---------------------------------------------------*/
/*--- MOSAIQUE ---*/

#mosaique div.projet_sommaire{
position:relative;
margin:0;
padding:0;
width: 143px;
height: 143px;
float:left;
}

#mosaique a{
display:block;
width: 143px;
height: 143px;
}


#mosaique a img{
width: 143px;
height: 143px;
}

#mosaique a.architecture img:hover{
width:133px;
height:133px;
border:5px solid #FD2787;
}

#mosaique a.urbanisme img:hover{
width:133px;
height:133px;
border:5px solid #00ECFF;
}

#mosaique a.amenagement img:hover{
width:133px;
height:133px;
border:5px solid #FFCC00;
}

#mosaique a.paysage img:hover{
width:133px;
height:133px;
border:5px solid #51FF1A;
}

#mosaique img.nouveau_projet{
position:absolute;
right:0px;
bottom:0px;
}

/*---------------------------------------------------*/
/*--- BANDEAU D'IMAGES ---*/


.bandeau{
width:100%;
height:286px;
position: relative;
top:-10px;
display: flex;
overflow-x:auto;
}

#photo_print{
display:none;
}

/*---------------------------------------------------*/
/*--- ZONE DE TEXTE ---*/

#projet_texte{
position: relative;
width:100%;
top:15px;
background-color: #F5F5ED;
z-index:50;

}

#projet_detail{
width:44%;
max-width:35em;
float:left;
}

#specifications{
width:22%;
float:left;
}

#exergue{
float:left;
width:34%;
}

/*---------------------------------------------------*/
/*--- TYPO TEXTES ---*/

html{
font-family: Arial, sans-serif;
color: #263F5C;
}

body{
font-size:90%;
line-height:1.125em; /* 16x1.125=18px */
}

h1 {
font-size: 2em; /* 16x1.375=22px */
line-height: 1.636em;/* 16x1.636=36px */
}

h2{
font-family: "Arial Rounded MT", Arial, sans-serif;
font-weight: normal;
padding-left:25px;
font-size: 1.8em; 
line-height: 1em;
}

div.architecture h2{
color: #FD2787;
}

div.urbanisme h2{
color: #00ECFF;
}

div.amenagement h2{
color: #FFCC00;
}

div.paysage h2{
color: #51FF1A;
}


h3{
font-family: "Arial Rounded MT", Arial, sans-serif;
font-weight:normal;
padding-left:25px;
padding-right:2em;
font-size:1.25em;
line-height:0.9em;
margin-top:0.625em;
margin-bottom:0.625em;
}

ul+h3{
margin-top:2.25em;
}

div.architecture h3{
color: #FD2787;
}

div.urbanisme h3{
color: #00ECFF;
}

div.amenagement h3{
color: #FFCC00;
}

div.paysage h3{
color: #51FF1A;
}

div.bureau h3{
color: #868986;
}

#projet_texte p{
padding-left:25px;
padding-right:2em;
margin-top:0.625em;
margin-bottom:0.625em;
}

#projet_texte ul{
padding-left:25px;
margin-right:2em;
margin-top:0.625em;
margin-bottom:0.625em;
}

#projet_detail ul li p{
margin-top:0;
}

#projet_texte li{
margin-left:15px;
list-style-type: disc;
list-style-image: url(uploads/images/template/mb_puce.gif);
margin-top:0.625em;
margin-bottom:0.625em;
}

#projet_texte li ul li{
margin-left:0px;
padding-left:0px;
list-style-type: disc;
list-style-image: url(uploads/images/template/mb_puce2.gif);
}

#projet_texte ol{
padding-left:30px;
margin-right:2em;
margin-top:0.625em;
margin-bottom:0.625em;
}

#projet_texte ol li{
margin-left:15px;
list-style-type: decimal;
list-style-image: none;
margin-top:0.625em;
margin-bottom:0.625em;
}

#specifications p{
font-size:.8em;
line-height:1.125em;
padding-left:0;
margin-left:2em;
margin-right:2em;
margin-top:0;
margin-bottom:1.125em;
}

#specifications ul{
font-size:.8em;
line-height:1.125em;
padding-left:0;
margin-left:2em;
margin-right:2em;
margin-top:0;
margin-bottom:1.125em;
}

div #specifications li{
list-style-type: disc;
list-style-image: url(uploads/images/template/mb_puce2.gif);
margin-top:0;
margin-bottom:0;
}

div.architecture #specifications p, div.architecture #specifications ul{
border-bottom:1px solid #FD2787;
}

div.urbanisme #specifications p, div.urbanisme #specifications ul{
border-bottom:1px solid #00ECFF;
}

div.paysage #specifications p, div.paysage #specifications ul{
border-bottom:1px solid #51FF1A;
}

div.amenagement #specifications p, div.amenagement #specifications ul{
border-bottom:1px solid #FFcc00;
}


div.bureau #specifications p, div.bureau #specifications ul{
border-bottom:1px solid #868986;
}

div#specifications p.details_couleur{
border: none;
margin-bottom:0px;
}

div.architecture a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

div.architecture a:hover{
background-color:#FD2787;
}

div.urbanisme a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

div.urbanisme a:hover{
background-color:#00ECFF;
}

div.amenagement a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

div.amenagement a:hover{
background-color:#FFCC00;
}

div.paysage a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #51FF1A;
}

div.paysage a:hover{
background-color:#51FF1A;
}

div.bureau #projet_detail a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

div.bureau #projet_detail a:hover{
background-color:#868986;
}

div.bureau #specifications a{
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

div.bureau #specifications a:hover{
background-color:#868986;
}

#exergue p, #exergue ul{
position:relative;
top:-0.625em;
font-family: Arial Rounded MT, Arial, sans-serif;
font-style: italic;
letter-spacing:1px;
color: #868986;
font-size:1.25em;
line-height:1.125em;
}

#exergue li{
list-style-type: square;
list-style-image: none;
}

.details_couleur{
color:#868986;
display:block;
}

sup{
font-size:80%;
vertical-align:text-top;
}
/*---------------------------------------------------*/
/*--- TYPO MENU ---*/
#menu a{
font-family:Arial Rounded MT, Arial, sans-serif;
text-decoration:none;
text-transform:uppercase;
font-size: 1em;
letter-spacing:1px;
}

#menu a:hover{
font-family:Arial Rounded MT Bold, Arial Bold, sans-serif;
padding-left:10px;
}

#menu a.menuactive{
font-family:Arial Rounded MT Bold, Arial Bold, sans-serif;
}

#sous_menu a{
font-family:Arial Rounded MT, Arial, sans-serif;
text-decoration:none;

font-size: 1em;
letter-spacing:1px;
}

/*---------------------------------------------------*/
/*--- FOOTER ---*/
#footer{
font-size:75%;
}

#footer p{
padding-left:25px;
line-height:150%;
}

#footer a{
display:inline;
color:#263F5C;
text-decoration:none;
border-bottom:1px dashed #263F5C;
}

#footer a:hover{
background-color:#868986;
}

#footer_print{
display:none;
}

/*---------------------------------------------------*/
/*--- LANGUES ---*/

.francais{
}

.allemand{
}

.bouton_bilingue{
position:relative;
margin:2em;
font-size:.8em;
top: 3em;
}

div.architecture a.bouton_bilingue{
color: #FD2787;
}

div.architecture a.bouton_bilingue:hover{
color: #263F5C;
}

div.urbanisme a.bouton_bilingue{
color: #00ECFF;
}

div.urbanisme a.bouton_bilingue:hover{
color: #263F5C;
}

div.amenagement a.bouton_bilingue{
color: #51FF1A;
}

div.amenagement a.bouton_bilingue:hover{
color: #263F5C;
}

div.paysage a.bouton_bilingue{
color: #FFCC00;
}

div.paysage a.bouton_bilingue:hover{
color: #263F5C;
}
/* End of 'mb_styles_generaux' */

