/* ----------------------- page -----------------------  */

body {
margin: 0;
padding: 0;
border: 0;
}

#global {
margin: 0;
padding: 0;
border: 0;
width: 700px;
height: 520px;
position: absolute;
left: 50%; 
margin-left: -350px; /* moitié de la largeur */
/* hack IE 5 */
top: 50%;
margin-top: -260px; /* moitié de la hauteur */
/* fin hack */
}


/* ----------------------- mailing -----------------------  */

#globalmailing {
margin: 20px auto 0 auto;
padding: 0;
border: 0;
width: 700px;
height: 520px;
}

.typomailing {
margin: 2px;
font: normal 10px helvetica, arial, sans-serif;
letter-spacing: 0.1em;
color: #666;
}


/* ----------------------- partie image -----------------------  */


#image {
margin: 0 0 10px 0;
padding: 0;
border: 0;
width: 700px;
height: 460px;
text-align: center;
display: table-cell;
vertical-align: middle;
}

#image img {
position: relative;
margin: 0;
padding: 0;
border: 0;
}

#bloctexte {
margin: 0 202px 10px 202px;
padding: 45px 0 0 0;
border: 0;
width: 296px;
height: 365px;
}

#bloctexte p {
width: 220px;
margin: 0;
padding: 0 0 15px 0;
text-align: left;
font: normal 9px helvetica, arial, sans-serif;
letter-spacing: 1px;
line-height: 11px;
color: #f00;
}

#bloctexte p.tel {
letter-spacing: 0;
}

#bloctexte p.textegris {
color: #999;
width: 200px;
padding: 0 0 2px 0;
}

#bloctexte p.telgris {
color: #999;
letter-spacing: 0;
padding: 0 0 2px 0;
}

#bloctexte p a {
text-decoration: none;
color: #bb2300;
}

#bloctexte p a:hover {
text-decoration: underline;
color: #bb2300;
}

#bloctexte p.email a {
padding: 0;
margin: 10px 0 15px 0;
display: block;
width: 128px;
height: 12px;
background: url(joan_imports/joan_email.png) 0 0 no-repeat;
text-decoration: none;
}

#bloctexte p.email a:hover {
background: url(joan_imports/joan_email.png) 0 12px no-repeat;
text-decoration: none;
}

#bloctexte p.email2 a {
padding: 0;
margin: 0 0 0 0;
display: block;
width: 128px;
height: 12px;
background: url(joan_imports/joan_email.png) 0 0 no-repeat;
text-decoration: none;
}

#bloctexte p.email2 a:hover {
background: url(joan_imports/joan_email.png) 0 12px no-repeat;
text-decoration: none;
}

#index {
margin: 0;
padding: 0 0 0 0;
border: 0;
width: 700px;
text-align: center;
}

#index h1 {
margin-bottom: 2px;
font: normal 16px helvetica, arial, sans-serif;
letter-spacing: 0.2em;
color: #666;
}

#index h1 a {
color: #666;
text-decoration: none;
}

#index h1 a:hover {
color: #999;
}

#index h2 {
margin: 0;
font: normal 9px helvetica, arial, sans-serif;
letter-spacing: 0.2em;
color: #666;
}



/* ----------------------- pied de page -----------------------  */



#footer {
margin: 10px 202px 0 202px;
}

#footer.home {
margin: 15px 120px 0 100px;
}

#footer.carre {
margin: 10px 150px 0 150px;
}

#footer.verticale300 {
margin: 10px 201px 0 201px;
}

#footer.verticale340 {
margin: 10px 180px 0 180px;
}

#footer.horizontale530 {
margin: 10px 86px 0 84px;
}

#footer.horizontale455 {
margin: 10px 122px 0 122px;
}

#footer.horizontale435 {
margin: 10px 132px 0 132px;
}



#footer a.mail {
display: block;
float: left;
width: 18px;
height: 11px;
background: url(joan_imports/mail.png) 0 0 no-repeat;
}

#footer a.mail:hover {
background: url(joan_imports/mail.png) 0 12px no-repeat;
}

#footer a {
height: 11px;
line-height: 11px;
float: right;
padding: 0 0 0 4px;
margin: 0;
text-decoration: none;
font: normal 9px helvetica, arial, sans-serif;
letter-spacing: 0.1em;
color: #666;
}

#footer a:hover {
color: #f00;
}

hr, span.invisible {
visibility: hidden;
}