/*	*** www.epokhe.com ***
	Code et design : Arnaud Briand
	*** Le code est original ***
	Date : avril/mai 2006
	portfolio.css : feuille de styles du répertoire "portfolio" 
*/


@import url(portfolioColors.css);


/* ------------------------------------------------------------------------------------
styles de mise à plat
------------------------------------------------------------------------------------ */
html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {
margin: 0;
padding: 0;
}

ul, li {
list-style-type: none;
line-height: 15px;
}

fieldset {border: none}

.linkIn {}
.linkOut {}


/* ------------------------------------------------------------------------------------
header
------------------------------------------------------------------------------------ */
div#header {
position: relative;
margin: 10px auto 0px;
height: 69px;
width: 780px;
}

div#header a {
display: block;
height: 69px;
width: 780px;
margin-right: 0px;
}

div#header a span {display: none;}


/* ------------------------------------------------------------------------------------
wrapper
------------------------------------------------------------------------------------ */
div#wrapper {
position: relative;
margin: 0px auto 0px;
width: 672px;
}
html > body div#wrapper {margin: -5px auto 0px;}


/* ------------------------------------------------------------------------------------
colLeft
------------------------------------------------------------------------------------ */
div#colLeft {
position: relative; 
width: 480px;
margin: 0px 0px 0px 0px;
}

div#colLeft h6 {
margin: 5px 0px 0px 20px;
font: normal 11px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft h6 a {
margin: 10px 0px 10px 0px;
font: normal 11px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft h6 a:hover {text-decoration: underline;}

div#colLeft h1 {
margin: 5px 0px 5px 20px;
font: normal 18px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft h1 span {display: none;}

div#colLeft h2 {
margin: 10px 0px 0px 20px;
font: bold 14px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft h2 a {
margin: 10px 0px 0px 0px;
font: bold 14px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft h2 a:hover {text-decoration: underline;}

div#colLeft h3 {
margin: 10px 0px 0px 20px;
font: bold 12px/140% Georgia, "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}

div#colLeft p {
margin: 0px;
padding: 10px 20px 0px 20px;
font: normal 12px/140% "Trebuchet MS", Tahoma, Arial;
}

div#colLeft p.chapo {
margin: 5px 20px;
padding: 5px 10px;
font: bold 12px/130% "Trebuchet MS", Tahoma, Arial;
text-align: left;
background: url(../i/bgChapeau.gif) repeat 0% 0%; 
}

div#colLeft p a {font-weight: bold; text-decoration: none;}
div#colLeft p a:hover {font-weight: bold; text-decoration: underline;}

div#colLeft img.logo {
float: left;
margin: 10px 20px 0px 20px;
padding: 0;
}
div#colLeft a img.logo {border: none;}

div#colLeft blockquote {
margin: 10px 20px 0px 30px;
padding: 15px 35px 0px 10px;
font: italic 12px/140% "Trebuchet MS", Tahoma, Arial;
text-indent: 15px;
background: url(../i/google/bulleRouge.png) no-repeat 10px 0;
}
div#colLeft blockquote a {font-weight: bold; text-decoration: none;}
div#colLeft blockquote a:hover {font-weight: bold; text-decoration: underline;}


div#colLeft p a.noria {
margin: 0px 1px;
padding: 4px 4px;
font: normal 12px/140% "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
}
div#colLeft p a.noriaSynposis {
padding: 4px 4px;
font: normal 12px/140% "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
margin-left: 0px;
}

div#colLeft ul {margin: 10px 0px 0px 0px;}

div#colLeft ul li {
margin: 0px 20px 0px 60px;
padding: 0px 0px 0px 10px;
font: normal 12px/140% "Trebuchet MS", Tahoma, Arial;
text-decoration: none;
list-style-image: url(../i/portfolio/liHomeBlueBis.png);
}
div#colLeft ul li a {text-decoration: none; font-weight: bold;}
div#colLeft ul li a:hover {text-decoration: underline;}
div#colLeft ul li span {display: none;}

div#colLeft ol li {margin: 5px 0px 5px 80px;}

div#colLeft ul li.flash {text-indent: 20px;}
div#colLeft ul li.quicktime {text-indent: 20px;}
div#colLeft ul li.pdf {text-indent: 20px;}

.photoIdentite {
float: right;
margin: 10px 30px 5px 5px;
}

.profil {
float: right;
margin: 10px 10px 5px -5px;
}

.logoIntuiti {
float: left;
margin: 10px 20px 0px 20px;
padding: 0;
border: none;
}

.logoViaduc {
float: left;
margin: 10px 20px 10px 20px;
padding: 0;
}

.logoSitimmo {
float: left;
margin: 10px 20px 0px 20px;
padding: 0;
}

div#colLeft p a.siteIntuiti {margin: 0px 20px 0px 20px;}

.hrBlue {display: none;}
html > body .hrBlue {
display: block;
margin: 0px 20px 0px 20px;
width: 440px;
height: 20px;
background: url(../i/portfolio/hrSeparateur.gif) repeat 0% 0%; 
border: none;
}

.hrPortfolioRight{
display: block;
margin: 10px 20px 0px 20px;
color: #000;
width: 440px;
height: 20px;
background: url(../i/portfolio/hrSeparateurRight.png) repeat 0% 0%; 
border: none;
}

div#colLeft p.cv {
margin: 5px 20px 0px 20px;
padding: 5px 10px 5px 20px;
font: normal 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}

div#colLeft p.cv:hover {font: normal 11px/140% Tahoma, Arial, "Trebuchet MS";}

div#colLeft p.cv a {
font: normal 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
padding-left: 20px;
}

div#colLeft p.cv a:hover {
font: normal 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: underline;
}

div#colLeft a img.projets-web  {
margin: 10px 20px 0px 20px; 
padding: 0px;
width: 440px;
height: 100px;
}

div#colLeft #currentProjects {
/* background: url(../i/portfolio/comments.png) no-repeat 20px 10px;  */
margin: 0px 20px 20px 0px;
padding: 0px 0px 0px 0px;
}

.12-7 {display: none}

/* ------------------------------------------------------------------------------------
table
------------------------------------------------------------------------------------ */
table {
margin: 0px 20px 10px 40px;
width: 400px;
font: normal 12px/140% "Trebuchet MS", Tahoma, Arial;
}
caption {
margin: 10px 20px 0px 40px;
font: bold italic 11px/140% "Trebuchet MS", Tahoma, Arial;
text-align: left;
}
th {
text-align: left;
background: url(../i/bgChapeau.png) repeat 0% 0%; 
}
td {width: 10%;}
caption, th, td {padding: 4px;}

table .descriptionLibelleTableColLeft {font-weight: normal;}

.descriptionTableColRight {
text-align: center;
text-decoration: underline;
}

table a {text-decoration: none;}
table a:hover {text-decoration: underline;}


/* ------------------------------------------------------------------------------------
colRight
------------------------------------------------------------------------------------ */
div#colRight {
position: absolute;
top: 0px;
left: 480px;
width: 190px;
}

div#rosace {
float: left;
margin: 0px 8px 5px 0px;
width: 82px;
height: 69px;
background: url(..i/portfolio/rosaceBlanche.png) no-repeat 0% 0%;
}

div#colRight p {
margin: 0px;
padding: 10px 10px 10px 20px;
font: bold 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}

div#colRight p.questioning {
margin: 0px;
padding: 10px 10px 10px 20px;
font: bold 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}

div#colRight h6 {
margin: 10px 0px 0px 20px;
font: bold 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}

div#colRight h6 a.linkOut {text-decoration: none;}
div#colRight a.linkOut {text-decoration: none;}
div#colRight h6 a:hover.linkOut {text-decoration: underline;}
div#colRight a:hover.linkOut {text-decoration: underline;}

div#colRight ul {padding: 10px 10px 10px 10px;}

div#colRight ul li {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
}
* html div#colRight ul li {height: 16px;} /* IE WIN HACK */

div#colRight ul li a {
display: block;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: 500;
overflow: hidden;
margin: 0px 0px 0px 0px;
padding: 4px 0px 4px 10px;
text-decoration: none;
}
* html div#colRight ul li a {height: 16px;} /* IE WIN HACK */

div#colRight ul li a:hover {
display: block;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: 500;
overflow: hidden;
margin: 0px 0px 0px 0px;
padding: 4px 0px 4px 10px;
text-decoration: none;
}


/* ------------------------------------------------------------------------------------
portfolio
------------------------------------------------------------------------------------ */
div#portfolio {
margin: 0px 0px 0px 0px;
padding: 10px 10px 10px 5px;
}
html > body div#portfolio {padding: 10px 10px 10px 10px;}

a img.projetIcon {
display: block;
float: left;
margin: 0px 8px 0px 8px;
width: 34px;
height: 34px;
border: none;
}
html > body a img.projetIcon {
margin: 5px 8px 5px 8px;
}

div#mainpic {
margin: 0px 0px 0px 0px;
padding: 30px 0px 10px 20px;
width: 150px;
height: 100px;
}


/* ------------------------------------------------------------------------------------
footer
------------------------------------------------------------------------------------ */
div#footer {
margin: 0px auto 20px;
height: 76px;
width: 684px;
background: url(../i/portfolio/waveBottomRosace.gif) transparent no-repeat 0 0;
clear: both;
}

div#footer p {
padding: 20px 0px 0px 40px;
font: bold 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}
div#footer p a {
font: bold 11px/140% Tahoma, Arial, "Trebuchet MS";
text-decoration: none;
}
div#footer p  a:hover {text-decoration: underline;}


/* ------------------------------------------------------------------------------------
Mesure d'audience : Spywords, Xiti
------------------------------------------------------------------------------------ */
div#audience {display: none;}