@charset "UTF-8";
/* CSS Document */
a {
color: #FFFFFF;
text-decoration: none;
border: none;
}

img {
border: none;
}

.navigation {
margin-left: 100px;
margin-top: 100px;
padding: 0;
list-style-type: none;
color: #FFFFFF;
width: 200px;
font: 1.2em "Trebuchet MS", sans-serif;
}
.navigation a, .navigation span {
display: block;
padding: 4px 10px;
text-decoration: none;
}

#perso {
background: url(images/perso_gris.png) no-repeat;
}

#perso:hover {
background: url(images/perso_rouge.png) no-repeat;
}

#home {
background: url(images/home_gris.png) no-repeat;
}

#home:hover {
background: url(images/home_rouge.png) no-repeat;
}

#portfolio {
background: url(images/portfolio_gris.png) no-repeat;
}

#portfolio:hover {
background: url(images/portfolio_rouge.png) no-repeat;
}

#a_propos {
background: url(images/a_propos_gris.png) no-repeat;
}

#a_propos:hover {
background: url(images/a_propos_rouge.png) no-repeat;
}

#contact {
background: url(images/contact_gris.png) no-repeat;
}

#contact:hover {
background: url(images/contact_rouge.png) no-repeat;
}

#video {
background: url(images/video_gris.png) no-repeat;
}

#video:hover {
background: url(images/video_rouge.png) no-repeat;
}

#MC {
background: url(images/mc_gris.png) no-repeat;
}

#MC:hover {
background: url(images/mc_rouge.png) no-repeat;
}

#UP {
background: url(images/drag_gris.png) no-repeat;
}

#UP:hover {
background: url(images/drag_rouge.png) no-repeat;
}

#MG {
background: url(images/mg_gris.png) no-repeat;
}

#MG:hover {
background: url(images/mg_rouge.png) no-repeat;
}

#OW {
background: url(images/VC_gris.png) no-repeat;
}

#OW:hover {
background: url(images/VC_rouge.png) no-repeat;
}

#showreel {
background: url(images/showreel_gris.png) no-repeat;
}

#showreel:hover {
background: url(images/showreel_rouge.png) no-repeat;
}

#graphisme {
background: url(images/graphisme_gris.png) no-repeat;
}

#graphisme:hover {
background: url(images/graphisme_rouge.png) no-repeat;
}

#photo {
background: url(images/photo_gris.png) no-repeat;
}

#photo:hover {
background: url(images/photo_rouge.png) no-repeat;
}

.ssmenu1 {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 350px;
}

.ssmenu2 {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 500px;
}

.ssmenu3 {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 650px;
}

.ssmenu4 {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 800px;
}

.ssmenu3c {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 650px;
display : none;
}

.ssmenu4c {
height: 14px;
width: 120px;
position: absolute; 
margin-top: 5px;
margin-left: 800px;
display: none;
}

.navigation a:hover, .navigation a:focus, .navigation a:active {
text-decoration: underline;
}

.navigation .subMenu {
font-size: .8em;
font-size: .9em;
margin: 0;
padding: 0;
list-style-type: none;
}
.navigation ul.subMenu a {
background: none;
padding: 3px 20px;
}

.subMenu2 {
margin-left: -40px;
list-style-type: none;
}

.man {
position: absolute;
margin-top: 30px;
margin-left: 50px;
height: 308px;
width: 538px;
overflow: hidden;
}

.man img {
position: relative;
top: -50px;
}

.flecheg {
position: absolute;
margin-top: 320px;
margin-left: 500px;
width: 74px;
height: 48px;
}

.fleched {
position: absolute;
margin-top: 320px;
margin-left: 600px;
width: 74px;
height: 48px;
}

.video2 {
position: absolute;
margin-top: 40px;
margin-left: 320px;
}
.show {
font-family: helvetica, arial, sans-serif;
font-size: 18px;
}

.expl {
font-family: helvetica, arial, sans-serif;
font-size: 14px;
color: #666666;
}

.gallerie {
position: absolute;
margin-top: 50px;
margin-left: 300px;
height: 300px;
width: 600px;
}
.comment {
position: absolute;
margin-top: 280px;
margin-left: 300px;
width: 600px;
height: 50px;
}
.comment2 {
position: absolute;
margin-top: 280px;
margin-left: 300px;
width: 600px;
height: 50px;
}
.comment3 {
position: absolute;
margin-top: 280px;
margin-left: 300px;
width: 600px;
height: 50px;
}
.comment a {
position: absolute;
margin-left: 483px;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
color: #DE0000;
}
.comment p {
margin-top: 0px;
position: absolute;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #5b5b5b;
}


.comment2 a {
position: absolute;
margin-left: 515px;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
color: #DE0000;
}
.comment2 p {
position: absolute;
margin-top: 0px;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #5b5b5b;
}

.comment3 a {
position: absolute;
margin-left: 485px;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
color: #DE0000;
text-align: right;
}
.vlf {
position: absolute;
height: 20px;
width: 100px;
margin-top: 295px;
margin-left: 785px;
}
.vlf a {
position: absolute;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.9em;
color: #DE0000;
text-align: right;
}
.comment3 p {
position: absolute;
margin-top: 0px;
font-family: Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #5b5b5b;
}

.divphoto {
position: absolute;
margin-top: 5px;
margin-left: 300px;
height: 300px;
width: 600px;
}

.divphoto img {
border: none;
}

form {
position: absolute;
margin-top: 0px;
margin-left: 450px;
}

.flo {
	position: absolute;
	color: #666666;
	font-family: Helvetica, Geneva, Arial, sans-serif;
	margin-left: 305px;
	margin-top: 345px;
	font-size: 11px;
	left: -33px;
	top: 3px;
}

.avoir {
position: absolute;
color: #666666;
font-family: Helvetica, Geneva, Arial, sans-serif;
margin-left: 50px;
margin-top: 10px;
font-size: 13px;
}

strong {
color: #FF0000;
}

.fb {
position: absolute;
margin-top: 0px;
margin-left: 300px;
height : 235px;
width : 138px;
}

.fb2 {
position: absolute;
margin-top: 0px;
margin-left: 450px;
height: 185px;
width : 319px;
}
.mail {
position: absolute;
height: 20px;
width: 300px;
margin-top: 180px;
margin-left: 455px;
}

.mail p {
font-family: Helvetica, Geneva, Arial, sans-serif;
color: #000000;
font-size: 13px;
}

em {
font-family: Helvetica, Geneva, Arial, sans-serif;
color: #DE0000;
font-style: italic;
font-size: 13px;
font-weight: normal;
}

.liens {
	position: absolute;
	height: 60px;
	width: 250px;
	margin-top: 275px;
	margin-left: 320px;
}

.liens a {
color: #000000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 13px;
}

.liens a:hover, .liens a:focus, .liens a:active {
color: #DE0000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 13px;
}

.liens em {
font-style: normal;
color: #000000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 15px;
font-weight: bold;
}

.liens2 {
	position: absolute;
	height: 60px;
	width: 250px;
	margin-top: 275px;
	margin-left: 575px;
}

.liens2 a {
color: #000000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 13px;
}

.liens2 a:hover, .liens2 a:focus, .liens2 a:active {
color: #DE0000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 13px;
}

.liens2 em {
font-style: normal;
color: #000000;
font-family: Helvetica, Geneva, Arial, sans-serif;
font-size: 15px;
font-weight: bold;
}

.traits {
position: absolute;
margin-top: 268px;
margin-left: 530px;
}

.traits2 {
position: absolute;
margin-top: 212px;
margin-left: 416px;
}

#opac1{
position: absolute;
margin-top: 340px;
margin-left: 300px;
}

#opac3{
position: absolute;
margin-top: -88px;
}

#opac4{
position: absolute;
margin-top: -5px;
}

#opacb3{
position: absolute;
margin-top: -172px;
}

#opacb4{
position: absolute;
margin-top: -88px;
}

#opacb5{
position: absolute;
margin-top: -5px;
}

.apropos {
position: absolute;
margin-top: 0px;
margin-left: 300px;
height: 397px;
width: 600px;
}

.apropos #vimeo{
position: absolute;
margin-top: -2px;
margin-left: 0px;
}

.apropos #flickr{
position: absolute;
margin-top: 29px;
margin-left: 0px;
}

.apropos #deviant{
position: absolute;
margin-top: 60px;
margin-left: 0px;
}

.apropos #twitter{
position: absolute;
margin-top: 91px;
margin-left: 0px;
}

.apropos #facebook{
position: absolute;
margin-top: 122px;
margin-left: 0px;
}

.apropos .bio #sujet{
margin-top: -3px;
float: left;
}

.apropos .bio {
position: absolute;
margin-top: -155px;
margin-left: 100px;
font-family: helvetica, arial, sans-serif;
font-size: 13px;
}

.apropos .bio strong {
color: #000000;
font-weight: normal;
}

.bio2 {
position: absolute;
height: 40px;
width: 600px;
margin-top: 0px;
margin-left: 0px;
font-family: helvetica, arial, sans-serif;
font-size: 13px;
}

#logiciels {
position: absolute;
height: 160px;
width: 289px;
margin-top: 50px;
margin-left: 300px;
}

.valid {
position: absolute;
height: 20px;
width: 600px;
margin-top: 220px;
margin-left: 90px;
font-family: helvetica, arial, sans-serif;
font-size: 13px;
color: #999999;
}

.apropos .represent {
position: absolute;
margin-top: 220px;
margin-left: 40px;
font-family: helvetica, arial, sans-serif;
font-size: 13px;
}

.apropos .represent strong {
color: #000000;
font-weight: normal;
}

h1{
position: absolute;
margin-top: 400px;
margin-left: 0px;
font-size: 1px;
color: white;
display: none;
}
h2{
position: absolute;
margin-top: 400px;
margin-left: 0px;
font-size: 1px;
color: white;
display: none;
}
h3{
position: absolute;
margin-top: 400px;
margin-left: 0px;
font-size: 1px;
color: white;
display: none;
}
h4{
position: absolute;
margin-top: 400px;
margin-left: 0px;
font-size: 1px;
color: white;
display: none;
}
.qt {
background-image: url(images/qt.png);
height: 64px;
width: 64px;
margin-top:70px;
margin-left:120px;
position:absolute;
}
.apropos .qtdownload {
font-family:helvetica,arial,sans-serif;
font-size:12px;
margin-left:75px;
margin-top:150px;
position:absolute;
text-align:center;
}

.qtsr .qtshow {
	font-size:12px;
	font-family:helvetica,arial,sans-serif;
	color:#999;
}

.qtsr .qtshow a {
	font-size:12px;
	font-family:helvetica,arial,sans-serif;
	color:#999;
}

.qtsr .qtshow a:hover {
	font-size:12px;
	font-family:helvetica,arial,sans-serif;
	color:#F00;
}

.apropos .qtdownload em {
color:#000000;
font-style:normal;
font-weight:normal;
}
.index {
position: absolute;
margin-left: 250px;
height: 400px;
width: 600px;
}