@import url(reset.css);
@import url(jscrollpane.css);
@import url(modalbox.css);
body{background:#333330; font:100% Arial, Helvetica, "Sans Serif";}

/* Global styles */
h2{padding:0 0 10px; color:#fff; font:400 16px Georgia, Courier, Serif; text-shadow:0 1px #333;}
p{color:#e7e6e5; font-size:12px; line-height:17px; text-shadow:0 1px #444;}
p a{color:#fff; text-decoration:underline;}
p a:hover{color:#e7e6e5;}
.clear{clear:both;}

#container{width:981px; height:620px; margin:-325px 0 0 -502px; padding:22px 0 0 21px; position:absolute; top:50%; left:50%; background:url(../img/global/container.png) top left no-repeat;}

/* Position and priority of blocs */
#header, #main{position:relative; z-index:10;}
#slideshow, #slideshow #blank{position:absolute; z-index:1; top:22px; left:21px; overflow:hidden; width:960px; height:600px;}
#slideshow #blank{top:0; left:0; z-index:2;}


/* Header
---------------------------------------------------------------- */
#header{padding:14px 0 0 10px;}

/* Title */
#header h1{padding:0 0 9px;}
   #header h1 a{color:#fff; font:25px Georgia, Times, Serif; text-decoration:none;}
   #header h1 a:hover{color:#d8d8d8;}

/* Description */
#header p{width:310px; color:#cdcecd; font-size:14px; line-height:17px;}

/* Menu */
#menu{position:relative; top:23px; left:-10px; width:961px;}
#menu li{float:left; margin:0 1px 0 0;}
   #menu li a{float:left; height:24px; padding:8px 9px 0; color:#afaeaa; font-size:13px; background:url(../img/global/menu.png) 0 0 repeat-x; text-decoration:none;}
   #menu li a:hover{color:#d8d8d8; background-position:0 -32px;}
   #menu li a:active, #menu li.active a{color:#fff; background-position:0 -64px;}
   /* Home */
   #menu .home a img{opacity:0.4; filter:alpha(opacity=40);}
   #menu .home a:hover img{opacity:0.7; filter:alpha(opacity=70);}
   #menu .home a:active img{opacity:1; filter:alpha(opacity=100);}
   /* Contact */
   #menu .contact a{background-position:0 -96px;}
   #menu .contact a:hover{background-position:0 -128px;}
   #menu .contact a:active, #menu .contact.active a{background-position:0 -160px;}
   /* C.V */
   #menu .cv a{background-position:0 -192px;}
   #menu .cv a:hover{background-position:0 -224px;}
   #menu .cv a:active, #menu .cv.active a{background-position:0 -256px;}
   /* Brusan */
   #menu .brusan{float:right;}
   #menu .brusan a{display:block; width:50px; padding:8px 0 0 30px; background-position:0 -288px;}
   #menu .brusan a:hover{background-position:0 -320px;}
   #menu .brusan a:active, #menu .brusan.active a{background-position:0 -352px;}
   
/* Lang */
#lang{position:absolute; top:0; right:21px;}
   #lang a{display:block; width:35px; height:24px; padding:8px 0 0; color:#afaeaa; font-size:13px; text-align:center; background:url(../img/global/lang.png) 0 0 no-repeat; text-decoration:none;}
   #lang a:hover{background-position:0 -32px;}
   #lang a:active{background-position:0 -64px;}


/* Contenu
---------------------------------------------------------------- */
#main{clear:both; margin:55px 0 0; width:960px; background:url(../img/global/main.png);}

/* ----- Videos ----- */
#main.videos{max-height:459px;}
#main.videos #content, #main.videoview #content, #main.cv #content, #main.galleries #content, #main.photos #content, #main.galleryview #content{overflow:auto; max-height:440px; padding-top:14px; padding-bottom:5px;}

.video, .gallery{position:relative; float:left; width:176px; height:108px; margin:4px 1px 11px 10px;}
   .video a, .gallery a{display:block; width:100%; height:100%; background:url(../img/global/video.png) top left no-repeat; text-decoration:none;}
   .video a img, .gallery a img{margin:3px 0 0 3px;}
   .video a:hover, .gallery a:hover{background-position:bottom left;}
   .video a .black, .gallery a .black{display:none; position:absolute; z-index:2; top:0; left:0; width:170px; height:102px;}
   .video a:hover .black, .gallery a:hover .black{display:block;}
   .video a:active .black, .gallery a:active .black{background:#000;}
   /* Title */
   .video a .title, .gallery a .title{display:none; position:absolute; z-index:3; top:3px; left:3px; width:160px; padding:4px 0 0 6px; color:#fff; font-size:16px;}
   .video a:hover .title, .gallery a:hover .title{display:block;}
   /* Infos */
   .video a .infos, .gallery a .infos{display:none; position:absolute; z-index:3; bottom:3px; left:3px; width:160px; padding:0 0 4px 6px; color:#c0c0c0; font-size:13px;}
   .video a:hover .infos, .gallery a:hover .infos{display:block;}
   
   
/* ----- Video page ----- */
#player{position:relative; z-index:12; float:left; width:582px; height:435px; padding:5px 0 0 10px;}

/* Infos */
#infos{position:relative; z-index:12; float:left; width:335px; padding:2px 0 0 15px;}
   #infos h3{padding:0 0 15px; color:#fff; font-size:18px; font-weight:400; text-shadow:0 1px #000;}
   #infos p{padding:3px 0 7px; color:#fff; line-height:17px; font-size:13px; text-shadow:0 1px #333;}
   
   /* Back link */
   #back{position:relative; z-index:12; float:left; width:335px; padding:20px 0 0 15px;}
   #back a{color:#fff; text-decoration:none;}
   #back a:hover{color:#d8d8d8; text-decoration:underline;}
   
/* Light */
#light{position:relative; z-index:12; float:left; width:335px; padding:15px 0 0 15px; display:none;}
   #light a{padding:2px 0 2px 20px; color:#ffd75e; background:url(../img/ic/light.png) 0 -24px no-repeat; text-decoration:none;}
   #light .active{color:#fff;background-position:0 0px;}
/* Black */
#black{position:fixed; z-index:1; top:0; left:0; width:100%; height:100%; background:url(../img/black.png);}


/* ----- Photos ----- */
.gallery{width:301px; height:121px;}
   .gallery a{background-image:url(../img/global/gallery.png);}
   .gallery a .black{width:295px; height:115px;}
   .gallery a .title{width:280px;}
   .gallery a .infos{width:280px;}
   
   
/* ----- Gallery page ----- */
#main.galleryview{height:459px;}
   #photo{position:relative; z-index:12; float:left; width:582px; height:422px; padding:5px 0 0 10px; text-align:center;}
   #photo #picture{position:relative; z-index:12; height:422px;}
   #photo #load{position:absolute; z-index:11; top:40%; left:50%; padding:12px; background:#000; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;}
   #thumbnails{position:relative; z-index:12; float:left; width:340px; overflow:hidden; padding:20px 0 0 15px;}
   #thumbnails a{float:left; margin:0 7px 3px 0;}
   #thumbnails a img{height:55px; border:2px solid rgba(0,0,0, 0.4); opacity:0.9; filter:alpha(opacity=90);}
   #thumbnails a:hover img{opacity:1; filter:alpha(opacity=1);}




/* ----- Galleries ----- */
.gallerie{overflow:hidden; padding:2px 0 10px 10px;}
   .gallerie h2{position:relative; left:-10px; display:inline; margin:0 0 10px; padding:3px 5px 4px 10px; line-height:30px; background:url(../img/gray.png);}
   .gallerie a{float:left; margin:0 10px 10px 0; width:106px; height:73px; background:url(../img/global/gallerie.png) top left no-repeat;}
   .gallerie a:hover{background-position:bottom;}
   .gallerie a img{padding:3px; opacity:0.8;}
   .gallerie a:hover img{opacity:1;}
   .gallerie .clear{display:block; padding:15px 0 0;}



/* ----- CV ----- */
#main.cv{background-image:url(../img/black.png);}
   #cv{padding:0 10px 0 10px;}
   #cv p, #cv li{padding-left:15px; color:#e7e6e5; font-size:12px; line-height:17px; text-shadow:0 1px #444;}
   #cv p{clear:both; margin:5px 0 0; padding-bottom:15px; color:#e7e6e5; font-size:12px; line-height:17px; text-shadow:0 1px #444;}
   #cv h2{position:relative; left:-10px; display:inline; margin:10px 0 0; padding:2px 5px 3px 10px; line-height:30px; background:url(../img/black.png);}
   #cv ul{padding:0 0 15px;}



/* ----- Contact ----- */
#contact{float:left; width:310px; padding:15px 0 0 10px;}
   #contact p .padding{padding:0 0 0 39px;}

/* Form */
#form{width:300px; float:left; padding:21px 0 0 0;}
   #form .text{margin:0 0 10px; padding:4px 5px; color:#444; font:12px Arial, Helvetica, "Sans Serif"; background:url(../img/html/input.png); border:none;}
   #form .text:hover{background:#fff;}
   #form input.text{width:160px;}
   #form textarea.text{width:240px; height:150px;}
   #form #submit{margin:0 0 15px; padding:3px 5px; color:#d8d8d8; font:12px Arial, Helvetica, "Sans Serif"; background:url(../img/html/submit.png); border:none; cursor:pointer;}
   #form #submit:hover{background:#000;}
   /* Errors */
   .error{display:inline; margin:0 0 10px; padding:3px 4px; color:#fff; font-size:12px; text-shadow:none;}
   .error.bad{background:#af0000;}
   .error.good{background:#005f04;}
   #form .clear{display:block; height:11px;}


/* Other pages (errors, maintenance, etc) */
#main.other #content{padding:15px 0 0 10px;}
#main.other #content p{padding-bottom:10px;}
#main.other #content p.en{font-style:italic;}


/* Footer
---------------------------------------------------------------- */
#footer{clear:both; position:absolute; bottom:-2px; right:21px; width:960px;}
   #footer p{color:#656562; font-size:13px; text-shadow:none;}
   #footer #left{position:absolute; bottom:0; left:0; text-align:left;}
   #footer #right{text-align:right;}
   #footer p img{padding:0 0 0 3px;}