@import url(reset.css); 
@import url(konami.css); 
body{font:100% Helvetica, Arial, "Sans Serif"; background:#171612 url(../img/global/bg.jpg) top left repeat-x !important;}

/* Global styles */
h1, h2{font-weight:bold; font-family:"YanoneKaffeesatzRegular", Helvetica, Arial; letter-spacing:0.2px;}
.clear{clear:both;}


#container{width:800px; margin:0 auto; padding:25px 0 0;}
@font-face {
	font-family: 'YanoneKaffeesatzRegular';
	src: url('../lib/fonts/YanoneKaffeesatz-Regular.eot');
	src: local('☺'), url('../lib/fonts/YanoneKaffeesatz-Regular.woff') format('woff'), url('../lib/fonts/YanoneKaffeesatz-Regular.ttf') format('truetype'), url('../lib/fonts/YanoneKaffeesatz-Regular.svg#webfontWwdcWBsW') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* Header
---------------------------------------------------------------- */
#header{}

/* Title */
#header h1{padding:0 0 0 12px;}
   #header h1 a{color:#dbdada; font-size:24px; text-decoration:none;}
   #header h1 a:hover{color:#fff;}
   /* Intro */
   #intro{padding:8px 0 20px 12px; color:#b0b0b0; font-size:13px;}

/* Menu */
#menu{width:800px; height:33px; padding:10px 0 0 10px; background:url(../img/global/menu.png) top left no-repeat;}
   #menu li{position:relative; float:left; height:32px; margin:0 10px 0 0;}
   #menu li a{position:relative; float:left; height:32px; background:url(../img/global/menu-link.png) 0 0 no-repeat; text-decoration:none;}
   #menu li a span{display:block; height:23px; margin-left:7px; padding:9px 15px 0 7px; color:#9e9e9e; font-size:13px; background:url(../img/global/menu-link.png) right -33px no-repeat; text-decoration:none; text-shadow:0 1px #0b0a09;}
   #menu li a em{float:left; margin-right:7px; background-image:url(../img/ic/menu.png); background-repeat:no-repeat;}
   #menu li a:hover{top:5px; background-position:0 -66px;}
   #menu li a:hover span{color:#f1f1f1; background-position:right -99px;}
   #menu li a:active, #menu li.active a{background-position:0 -132px;}
   #menu li a:active span, #menu li.active a span{color:#888; background-position:right -165px;}
   /* Specifics */
   #menu li.active a{top:5px;}
   #menu li.active a:hover{top:5px;}
   #menu li.home a em{width:13px; height:13px; background-position:0 0;}
   #menu li.random a em{width:17px; height:14px; background-position:0 -13px;}
   #menu li.archives a em{width:9px; height:15px; background-position:0 -26px;}
   #menu li.about a em{width:17px; height:14px; background-position:0 -42px;}
   
   /* Old
   #menu li{float:left; margin:0 8px 0 0;}
   #menu li a{float:left; width:80px; height:23px; padding:8px 0 0; text-align:center; color:#424242; font-size:13px; background:url(../img/global/menu-link2.png) top left no-repeat; text-decoration:none; text-shadow:0 1px #dedede;}
   #menu li a:hover{color:#2f2f2f; background-position:top center;}
   #menu li a:active{background-position:top right;}
   */


/* Contenu
---------------------------------------------------------------- */
#main{clear:both; padding:35px 0 0;}

/* Photo */
#photo{position:relative; width:810px; height:100%;}
#photo .completion{position:relative; z-index:9; left:-12px; clear:both; display:block; width:830px; height:25px; background:url(../img/global/picture.png) bottom left no-repeat;}


/* ----- Picture ----- */
#picture{position:relative; left:-12px; width:806px; padding:25px 0 0 25px; background:url(../img/global/picture.png) top left no-repeat;}

/* Img */
#img{width:780px; height:100%; background:#000;}
   #img .photo{width:100%; margin:0 0 -4px;}
   #img .blank{position:absolute; z-index:2; top:17px; left:17px; width:779px; height:100%;}

/* Load */
#load{display:none; position:absolute; z-index:100; top:386px; left:50%; width:32px; height:32px; padding:16px; background:#000 url(../img/load.gif) center center no-repeat; -moz-border-radius:7px; -webkit-border-radius:7px;}

/* Legend */
#legend{overflow:hidden; position:absolute; z-index:60; bottom:0; width:770px; height:30px; padding:0 0 0 10px; color:#fff; font-size:13px; background:url(../img/global/black30.png);}
#legend a{color:#fff; text-decoration:none;}
   
   /* Text */
   #legend #text{width:75%; height:21px; padding:9px 0 0 0;}
   
   /* Links */
   #legend #links{display:none; position:absolute; bottom:0; right:0; height:30px;}
   #picture:hover #links{display:block;}
   #legend #links a{position:relative; float:left; height:21px; padding:9px 0 0 10px; background:url(../img/global/black30.png);}
   #legend #links a span{margin-right:7px; background-image:url(../img/ic/links.png); background-repeat:no-repeat;}
   #legend #links a:hover{background-image:url(../img/global/black60.png);}
   #legend #links a:active{background-image:url(../img/global/black80.png);}
   /* Permalink */
   #legend #links .link span{padding-right:27px; background-position:right 3px;}
   #legend #links .link:hover span{background-position:right -15px;}
   /* Flickr */
   #legend #links .flickr{margin-left:1px;}
   #legend #links .flickr span{padding-right:27px; background-position:right -45px;}
   #legend #links .flickr:hover span{background-position:right -65px;}

/* Pagination */
#pagination{overflow:hidden; position:absolute; z-index:50; top:24px; left:0; width:100%; height:94%;}
   #pagination a{position:relative; z-index:100; display:block; width:44%; height:100%; padding:52px 0 0; cursor:pointer; text-decoration:none; cursor:pointer;}
   #pagination a span{display:none; height:22px; padding:8px 12px 0 12px; color:#cecdce; font-size:13px; background:url(../img/global/black60.png); text-decoration:none; cursor:pointer;}
   #pagination a span:hover{background-image:url(../img/global/black80.png);}
   #pagination a:hover span{display:block;}
   
   /* Directions */
   #pagination .prev{float:left; margin-left:25px;}
   #pagination .prev span{float:left;}
   #pagination .next{float:right; margin-right:26px;}
   #pagination .next span{float:right;}
   
   /* Arrows */
   #pagination a em{position:absolute; z-index:100; top:217px  ; width:10px; height:31px; background-image:url(../img/global/controls.png); background-repeat:no-repeat;}
   #pagination .prev em{left:-17px; background-position:top left;}
   #pagination .prev:hover em{background-position:bottom left;}
   #pagination .next em{right:-17px; background-position:top right;}
   #pagination .next:hover em{background-position:bottom right;}



/* ----- Infos ----- */
#infos{clear:both; padding:12px 12px 0;}
#infos h2, #infos h3{color:#a1a1a1; font-size:18px; letter-spacing:0.3px;}

/* Boxes */
.box{float:left; width:100%; margin:0 10px 0 0;}
.box h2, .box h3{padding:0 0 8px; font-size:16px;}
.box p{width:94%; padding:5px 0 10px; color:#616161; font-size:12px; line-height:17px;}
.box p a, .box li a{color:#999; text-decoration:none;}
.box p a:hover, .box li a:hover{color:#d8d8d8;}
.box li{list-style:none; color:#616161; font-size:12px; line-height:17px;}

   /* Specifics */
   .box.desc{width:335px;}
   .box.tech{width:195px;}
   .box.rights{width:210px;}

/* Archives page */
.archives #infos{width:805px;}
   .archives #infos h2{font-size:24px; padding:0 0 30px;}
   
   /* Box */
   .box.archive{width:178px; margin-right:20px; padding-bottom:20px;}
      .box.archive ul{color:#484745; padding-left:0;}
      .box.archive li{list-style:none; padding-left:27px; line-height:18px; font-size:12px;}
      .box.archive li a{color:#666; text-decoration:none;}
      .box.archive li a span{float:left; width:20px; height:15px; margin:0 6px 0 -27px; line-height:17px; text-align:center; color:#666; font-size:11px; background:url(../img/global/date.png) top left no-repeat;}
      .box.archive li a:hover{color:#c0c0c0;}
      .box.archive li a:hover span{color:#c0c0c0; background-position:bottom;}
      
/* About page */
.about #infos p{color:#494949 ;}


/* Footer
---------------------------------------------------------------- */
#footer{padding:65px 12px 35px;}
   #footer p{color:#444; font-size:12px; text-align:center;}
   #footer p a{color:#777; text-decoration:none;}
   #footer p a:hover{color:#d8d8d8; text-decoration:none;}