/*@import url(reset.css);
@import url(modal.css);
body{font:85% Georgia, Helvetica, Arial, "Courrier sans";}
html{background:url(../../images/clients/fond.jpg) top left repeat-x fixed;}*/

/*h3{width:350px; height:35px; padding:0 0 0 3px; background:url(../../images/clients/separation.png) 0 33px no-repeat;}
h4{color:#52616a; font-size:15px; font-style:italic; font-weight:bold; text-shadow:#fff 0 1px;}
abbr{border-bottom:1px dashed #999;}
label, #submit{cursor:pointer;}
textarea{resize:none;}*/

/*.clear{clear:both;}
.disabled{opacity:.5; filter:alpha(opacity=50);}*/

/*#container{width:811px; margin:0 auto;}*/
#tip{position:absolute; z-index:9; top:100px; left:100px; display:none; width:auto; max-width:130px; padding:10px 7px 5px; color:#fff; font-size:12px; font-family:Tahoma, Verdana, "Courrier Sans"; background:url(../../images/clients/tip.png) top left no-repeat;}
.clients{padding:15px 0 0 55px;}

.clients h3{ color:#333; font-size:15px; padding:40px 0 10px 10px; height:0;  background:url(../../images/clients-seperator.png) no-repeat left top;}


/* English version
---------------------------------------------------------------- */
/* Menu */
#en #left li.about a{background-position:-1px -169px; color:#666;}				   	#en #left li.about a:hover{background-position:-139px -169px;}
#en #left li.creas a{height:42px; background-position:-1px -215px;}		#en #left li.creas a:hover{background-position:-139px -215px;}
#en #left li.contact a{height:43px; background-position:-1px -257px;}	#en #left li.contact a:hover{background-position:-139px -257px;}
#en #left li.blog a{height:38px; background-position:-1px -131px;}		#en #left li.blog a:hover{background-position:-139px -131px;}

/* Titles */
#en #last h3 span{height:22px; background-position:-327px 4px;}
#en #web h3 span{height:22px; background-position:-327px -18px;}
#en #other h3 span{height:22px; background-position:-327px -40px;}
#en #contact h3 span{height:18px; background-position:-327px -63px;}

/* Statut work */
#en .work .statut.new{background-position:0 32px;}
#en .work .statut.maj{background-position:-31px -116px;}


/* Left
---------------------------------------------------------------- */
#left{ width:800px;;}
#left ul{ margin:0; padding:10px 0; list-style-type:none;}
#left ul li{ margin:0; padding:0; display:inline;}
#left ul li a{ display:inline; color:#005799; padding:0 52px; font-size:20px; text-decoration:none;}
#left ul li a:hover{ color:#a5a5a5; text-decoration:none;}

/* Language */
/*#lang{position:fixed; z-index:21; top:3px; margin:0 0 0 420px; text-align:left;}
#lang a{display:block; padding-bottom:2px; color:#7d97a3; background-image:url(../../images/clients/lang.png); background-repeat:no-repeat; text-decoration:none;}
#lang a:hover{color:#3179a4;}
#lang a.en{background-position:98px 0; padding-right:29px;}								      #lang a:hover.en{background-position:98px -19px;}
#lang a.fr{background-position:109px -38px; margin-left:-11px; padding-right:30px;}		#lang a:hover.fr{background-position:109px -57px;}*/

/* Ribbon */
/*#ribbon{position:fixed; z-index:20; top:0; width:603px; margin:0 0 0 -11px; height:122px; background:url(../../images/clients/ribbon.png) top right no-repeat;}
#ribbon h2{float:right; width:550px; padding:34px 43px 0 0; text-align:left; color:#fff; font-size:15px; font-weight:400; font-style:italic; text-shadow:#7f281f 0 2px;}*/


/* Menu */
/*#left ul{clear:both; width:100px; padding:80px 0 0 29px; list-style-type:none;}
#left li a{position:relative; display:block; width:136px; height:45px; text-indent:-9999px; cursor:pointer; background-image:url(../../images/clients/menu.jpg); background-repeat:no-repeat;}
#fr #left li.about a{background-position:-1px 0;}						      #fr #left li.about a:hover{background-position:-139px 0;}
#fr #left li.creas a{height:42px; background-position:-1px -46px;}		#fr #left li.creas a:hover{background-position:-139px -46px;}
#fr #left li.contact a{height:43px; background-position:-1px -88px;}	   #fr #left li.contact a:hover{background-position:-139px -88px;}
#fr #left li.blog a{height:38px; background-position:-1px -131px;}		#fr #left li.blog a:hover{background-position:-139px -131px;}*/
/* Rollovers */
/*.abouth, .creash, .contacth, .blogh{position:absolute; top:0; left:0; width:136px; text-indent:-9999px; background-image:url(../../images/clients/menu.jpg); background-repeat:no-repeat; opacity:0; filter:alpha(opacity=0);}
#fr .abouth{height:45px; background-position:-139px 0;}			      	#en .abouth{height:45px; background-position:-139px -169px;}
#fr .creash{height:42px; background-position:-139px -46px;}		      	#en .creash{height:42px; background-position:-139px -215px;}
#fr .contacth{height:43px; background-position:-139px -88px;}	      	#en .contacth{height:43px; background-position:-139px -88px;}
#fr .blogh{height:38px; background-position:-139px -131px;}		      	#en .blogh{height:38px; background-position:-139px -131px;}*/

/* Player */
/*#player{width:150px; padding:200px 0 0 45px; opacity:.25; filter:alpha(opacity=25);}
#player span{float:left; color:#8eb2cf; font:italic 14px Georgia; text-shadow:#222 0 1px;}
#player p{float:right; padding:0 43px 0 0;}
#player a{float:left; height:15px; text-indent:-9999px; background-image:url(../../images/clients/player.png); background-repeat:no-repeat; opacity:.85; filter:alpha(opacity=85);}
#player a:hover{opacity:1; filter:alpha(opacity=100);}
#player #play{width:10px; background-position:top left;}
#player #pause{width:9px; margin-left:12px; background-position:top right;}
#player #audio{position:absolute; top:0; left:0; visibility:hidden;}*/



/* Contenu
---------------------------------------------------------------- */
#main{position:relative; float:right; width:544px; height:500px; padding:80px 43px 0 0;}

/* ----- About ----- */
/* Intro */
#intro{padding:20px 0 0; line-height:23px; text-align:justify; color:#52616a; font-size:16px; font-style:italic; text-shadow:#fff 0 1px;}
#intro strong{font-weight:400;}
#intro span{display:block; margin:0 0 10px;}
#intro a{color:#4a92bd;}
#intro a:hover{color:#3179a4;}
.area{width:850px; margin-bottom:10px;}
.area ul{list-style-type:none;}
.area-seperator{width:800px; height:71px; background:url(../../images/clients-seperator.png) no-repeat center top;}

/* More */
#more{margin:20px 0 0;}
#more .infos{height:130px;}
#more .link{margin:0 0 35px;}
#more .link a{color:#4a92bd; font-size:16px; font-style:italic; text-shadow:#fff 0 1px; text-decoration:none;}
#more .link a span{text-decoration:underline;}
#more .link a:hover{color:#3179a4;}

/* Presentation */
#more #presentation{float:left; width:340px;}
#more #presentation h4{height:35px; background:url(../../images/clients/separation.png) 0 26px no-repeat;}
#more #presentation p{line-height:21px; text-align:justify; color:#52616a; font-size:15px; font-style:italic; text-shadow:#fff 0 1px;}

/* Skills */
#skills{float:right; width:160px;}
#skills h4{height:35px; background:url(../../images/clients/separation.png) 0 -3px no-repeat;}
#skills li{width:100%; line-height:21px; color:#52616A; font-size:14px; font-style:italic; text-shadow:#fff 0 1px;}
#skills .skill{float:right; width:40px; height:16px; margin:3px 0 0; text-indent:-9999px; background-image:url(../../images/clients/skills.png); background-repeat:no-repeat; }
#skills .skill.lvl5{background-position:0 -80px;}      #skills .skill.lvl10{background-position:0 -64px;}
#skills .skill.lvl15{background-position:0 -64px;}     #skills .skill.lvl20{background-position:0 -48px;}
#skills .skill.lvl25{background-position:0 -32px;}     #skills .skill.lvl30{background-position:0 0;}


/* Available */
#main .available{float:right; width:79px; height:79px; margin:12px 0 0; text-indent:-9999px; background-image:url(../../images/clients/available.png); background-repeat:no-repeat;}
#main .available.no{background-position:top left;}
#main .available.yes{background-position:top right;}
#main .available.yes:hover{background-position:bottom right;}

/* Last work */
#last{padding:45px 0 0; clear:both;}
#last h3{height:35px;}
#fr #last h3 span{height:22px; margin:0 0 2px; background-position:0 0;}

/* Slider */
#slideshow{position:relative; z-index:1000; left:-9px; width:562px; height:249px; margin:20px 0 0; background:url(../../images/clients/slider.png) top left no-repeat;}
#slideshow #control{display:none; position:absolute; z-index:5; top:0; right:0; width:532px; height:22px; margin:16px 12px -23px 0; background:url(../../images/clients/control.png) top left no-repeat;}
#slideshow #control p{float:right; padding:2px 0 0;}
#slideshow #control a{float:left; width:15px; height:15px; margin:0 3px 0 0; text-align:center; color:#fff; font-size:10px; text-decoration:none; background-image:url(../../images/clients/numbers.png); background-repeat:no-repeat;}
#slideshow #control a:hover{background-position:bottom;}
#slide{clear:both; overflow:hidden; position:relative; top:16px; left:3px; width:532px; height:205px; margin:0 auto;}
#slide li{display:inline;}
#legend{padding:21px 0 0 3px; text-align:center; color:#fff; font-size:14px; text-shadow:#356f8f 0 1px;}
#legend a{position:absolute; bottom:5px; right:19px;}


/* ----- Work ----- */
#web{width:850px; clear:both; padding:4px 0 0;}
#dynamic{width:850px; clear:both; padding:4px 0 0;}
#other{clear:both; padding:15px 0 0 0; width:850px;}
#web h3{margin:0 0 12px;}
#fr #web h3 span{height:22px; background-position:0 -22px;}
#fr #other h3 span{height:22px; background-position:0 -44px;}

/* Work */
.list.reduce{position:relative; overflow:hidden; width:850px; height:470px;}
.list li{float:left; width:260px; margin:0 21px 0 0;}

.work{position:relative; float:left; width:260px; height:200px; margin:20px 18px 5px 3px; padding:6px 0 0; text-align:center; background:url(../../images/clients/work.png) top left no-repeat;}
.work .img{opacity:.75; filter:alpha(opacity=75);}
.work .img:hover{opacity:1; filter:alpha(opacity=100);}
.work .statut{position:absolute; z-index:2; top:-5px; right:13px; width:31px; height:116px; text-indent:-9999px; background:url(../../images/clients/statut.png); background-repeat:no-repeat;}
#fr .work .statut.new{background-position:0 0;}
#fr .work .statut.maj{background-position:-31px 0;}
.work .title{color:#fff; text-shadow:#356f8f 0 1px;}
.work .infos{position:absolute; bottom:4px; left:6px; width:243px; height:20px; padding:3px 0 0 5px; text-align:left; color:#fff; font-size:14px; background:  url(../../images/clients/legend.png) bottom left no-repeat;}
.work .links{position:absolute; bottom:0; right:0;}
.work .link{float:left; width:22px; height:19px; padding:3px 1px 0 3px; text-align:center; background:url(../../images/clients/links.png) top left no-repeat;}
.work .role{width:25px; padding-left:3px; padding-right:1px; background-position:top right;}
.work .link:hover.role{background-position:bottom right;}
.work .link:hover{background-position:bottom left;}
.work:hover{background-position:top right;}

/* Pages */
.pages{width:770px; margin:0px; position:relative; left:-8px; display:none; list-style-type:none;}
.pages a{display:block; width:260px; height:23px; padding-top:5px; color:#4a92bd; font:italic 14px Georgia; background-image:url(../../images/clients/pages.png); background-repeat:no-repeat; text-shadow:#fff 0 1px; text-decoration:none;}
.pages a span{display:inline-block; color:#fff; text-shadow:#555 0 1px;}
.pages .prev a{float:left; padding-left:36px; text-align:left; background-position:0 0; height:15px;}
.pages .prev a span{margin:0 10px 0 -29px;}
.pages .prev a:hover{background-position:0 -28px;}
.pages .next a{float:right; padding-right:37px; text-align:right; background-position:270px 0; height:15px;}
.pages .next a span{margin:0 -24px 0 10px;}
.pages .next a:hover{background-position:270px -28px;}
.pages a:hover{color:#3179a4;}
.pages a:hover em{text-decoration:underline;}



/* ----- Contact ----- */
#contact{clear:both; width:548px !important; padding:20px 0 15px;}
#contact h3{color:#52616a; font-size:15px; font-weight:bold; font-style:italic; text-shadow:#fff 0 1px;}
#fr #contact h3 span{height:18px; background-position:0 -66px;}
#en #contact h3 span{height:18px; background-position:-327px -63px;}
#contact p{padding:25px 0 0; line-height:23px; text-align:justify; color:#52616a; font-size:16px; font-style:italic; text-shadow:#fff 0 1px;}

/* Form */
#form{position:relative; float:left; width:260px; padding:65px 0 0;}
#form label{display:block; margin:-23px 0 0;}
#form .text{position:relative; top:-6px; left:-11px; width:246px; height:16px; padding:14px 17px 11px 16px; text-align:left; color:#fff; font:italic 13px Georgia; background:url(../../images/clients/input.png) 0 0 no-repeat; border:none;}
#form .text:hover{background-position:-277px 0;}
#form .text:focus{background-position:-554px 0;}
#form textarea{height:154px !important; padding-bottom:20px !important; background-position:0 -43px !important;}
#form textarea:hover{background-position:-277px -43px !important;}
#form textarea:focus{background-position:-554px -43px !important;}
#form #submit{position:relative; top:-32px; left:-11px; width:271px; height:36px; padding:0 0 3px 4px; text-align:center; font:italic 15px Georgia; color:#fff; text-shadow:#333 0 1px; background:url(../../images/clients/input.png) -2px -231px no-repeat; border:none;}
#form #submit:hover{background-position:-279px -231px;}

/* Errors validation */
#form label.error{display:block; position:relative; float:right; margin:-38px -12px 0 0;}
#form label.error .emsg{position:relative; top:-150px;}

/* Messages */
.message{position:absolute; top:32px; left:0; width:530px; padding:3px 0 3px 26px;}
.message.error{color:#f00; background:url(../../images/clients/bad.png) top left no-repeat;}
.message.sended{color:#1d8d20; background:url(../../images/clients/ok.png) top left no-repeat;}


/* ----- Flayks ----- */
#flayks{float:right; width:215px; padding:70px 0 0;}
#flayks div, #flayks p{text-align:right;}
#flayks p{font-size:15px; text-shadow:#fff 0 1px;}
#flayks p a{color:#4a92bd;}
#flayks p a:hover{color:#3179a4;}
.button a{float:left; background-image:url(../../images/clients/buttons.png); background-repeat:no-repeat;}
.button a span{display:none;}
#perso{position:relative;}

/* CV */
#cv{position:absolute; top:46px; left:13px; width:30px; height:34px; text-indent:-9999px; text-decoration:none; background:url(../../images/clients/buttons.png) -316px -4px no-repeat;}
#cv:hover{background-position:-316px -38px; opacity:1; filter:alpha(opacity=100);}
#cv span{display:none;}

/* Alternatives */
#alternatives{padding:10px 0 0;}
#alternatives li a{margin:5px 0 3px 28px;}
#alternatives li.gtalk a{width:72px; height:37px; background-position:-6px 0;}		#alternatives li.gtalk a:hover{background-position:-6px -37px;}
#alternatives li.skype a{width:75px; height:37px; background-position:-88px -1px;}	#alternatives li.skype a:hover{background-position:-88px -38px;}
#alternatives li.msn a{width:88px; height:35px; background-position:-169px -2px;}	#alternatives li.msn a:hover{background-position:-169px -38px;}
#alternatives li.ichat a{width:40px; height:37px; background-position:-268px 0;}	   #alternatives li.ichat a:hover{background-position:-268px -37px;}

/* Here */
#here{padding:85px 0 0; clear:both;}
#here ul{padding:16px 0 0;}
#here li{float:left; width:36px; height:36px; margin:4px 0 4px 7px;}
#here li a{width:36px; height:36px;}
#here li.linkedin a{background-position:0 -75px;}				#here li.linkedin a:hover{background-position:0 -111px;}
#here li.ziki a{background-position:-36px -75px;} 				#here li.ziki a:hover{background-position:-36px -111px;}
#here li.rss a{background-position:-72px -75px;}				#here li.rss a:hover{background-position:-72px -111px;}
#here li.facebook a{background-position:-108px -75px;}		#here li.facebook a:hover{background-position:-108px -111px;}
#here li.lastfm a{background-position:-144px -75px;}			#here li.lastfm a:hover{background-position:-144px -111px;}
#here li.twitter a{background-position:-180px -75px;}			#here li.twitter a:hover{background-position:-180px -111px;}
#here li.flickr a{background-position:-216px -75px;}			#here li.flickr a:hover{background-position:-216px -111px;}
#here li.delicious a{background-position:-252px -75px;}		#here li.delicious a:hover{background-position:-252px -111px;}
#here li.friendfeed a{background-position:-288px -75px;}		#here li.friendfeed a:hover{background-position:-288px -111px;}
#here li.myspace a{background-position:-324px -75px;}			#here li.myspace a:hover{background-position:-324px -111px;}