/* 
    Document   : style
    Created on : 4 nov. 2010, 12:09:54
    Author     : Jocelyn
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
html{
    background:#0e0e0e;height:100%;
}
body{
    font:normal 15px/1.4em Helvetica,Arial,sans-serif;height:100%;
/*    text-align: center;*/
}

.clear{
    clear:both;
    height:0;
}
.center{
    text-align:center;
}
p{padding:5px 0;}
*{color:#777;}
h1,h2,h3,h4,h5,h6{font:normal 15px/1.4em 'MgOpenModataRegular',Helvetica,Arial,sans-serif;}
h1{font-size:28px;}
h2{font-size:24px;}
h3{font-size:22px;}
h4{font-size:20px;}
h5{font-size:18px;}
h6{font-size:16px;}

#header{
    background:#f6f6f6 url('../images/bg-menu.png') repeat-x 0 0;
    display:block;
    height:70px;
    top:0;
    width:100%;
    z-index:999;
}
#header-menu{
    margin:0 auto;
    width:960px;
}
#wrap-slider{
    background:#010101 url('../images/bg-couch2.jpg') no-repeat top center;
    height:425px;
    margin-top:5px;

}
#logo{
    background:url('../images/logo.png') no-repeat 10% 50%;
    float:left;
    height:70px;
    width:296px;
}
#logo a{
    display:block;
    min-height:70px;
}

ul#menu{float:right;
        height:70px;
        list-style-type:none;
        padding:0 10px 0 0;
}
ul#menu li{
    display:block;
    float:left;
}
ul#menu li a{
    color:#999;
    display:block;
    height:20px;
    line-height:15px;
    margin-top:15px;
    padding:12px 20px 8px 20px;
    text-decoration:none;
}
ul#menu li a:hover{
    color:#09bbf6;
    background:#f6f6f6;
    border:#c3c3c3 1px solid;
}

.wrap-section-header{
    background: #fffff url('../images/bg-page-header.png') repeat-x 0 0;
    height:100px;
    margin:5px 0;
}
.section-header{
    margin:0 auto;
    width:960px;
}
.section-header h1{
    color:#f6f6f6;
    font:normal 64px/1.75em 'Josefin Sans Std Light',Helvetica,Arial,sans-serif;
    float:left;
    padding-left:10px;
    text-transform:uppercase;
    width:870px;
}
ul.section-nav{
    float:left;
    list-style-type:none;
    padding:0;
    width:80px;
}
.section-nav li a{
    display:block;
    height:50px;
}
.section-nav li a.up{
    background:url('../images/bg-up-arrow.png') no-repeat 50% 75%;
}
.section-nav li a.down{
    background:url('../images/bg-down-arrow.png') no-repeat 50% 25%;
}
.wrap-section-body{
    background:#f6f6f6 url('../images/bg-hd-page.png') repeat-x 0 0;
    border-top:1px solid #f1f1f1;
}
#info,#portfolio,#about,#contact{
    margin:0 auto;
    width:960px;
}
#info{
    padding:35px 0 40px 0;
}
#info h1{
    color:#666;font:normal 64px/1.3em 'Josefin Sans Std Light',Helvetica,Arial,sans-serif;
    padding:0 10px;
    text-transform:uppercase;
}
#info .box-320{
    margin:0;
}
#info p{
    padding:10px 0 5px 0;
}
.v-separator{
    background:url('../images/bg-v-sep.png') repeat-y 100% 0;
}
.g-separator{
    background:url('../images/bg-g-sep.png') repeat-x 0 100%;
}
.column-240,.column-320,.column-480,.column-640,.column-720,.column-960{
    float:left;
    margin:0 0 30px 0;
    padding:0 20px 0 10px;
}
.column-240{width:210px;}
.column-320{width:290px;}
.column-480{width:450px;}
.column-640{width:610px;}
.column-720{width:690px;}
.column-960{width:930px;}

#about{
    padding:40px 0 10px 0;
    min-height:700px;
}

.button{
    cursor:pointer;
}
.button:link,.button:visited{
    background:#fff url('../images/bg-input-textarea-rev.png') repeat-x 0 100%;
    border:#ccc 1px solid;
    color:#b1b1b1;
    display:block;
    float:left;
    height:25px;
    margin:1px;
    padding:6px 15px 0 15px;
    text-decoration:none;
}
.button:hover, .button:focus, .button:active{
    background:#eee url('../images/bg-input-textarea.png') repeat-x 0 100%;
    border:#aaa 1px solid;
    color:#999;
}
#portfolio{
    padding:40px 0 30px 0;
    min-height: 700px;
}
#portfolio h2{
    display:inline;
    padding:0 10px;
}
.img_portfolio{
    border:#ccc 3px solid;
    padding: 2px;
    width:210px;
    text-decoration:none;
}
.img_portfolio:hover{
    border:#aaa 3px solid;
}
.source {
    overflow: hidden;
}
.source li {
    display: block;
    float: left;
}
ul#filter{
    display:block;
    float:left;
    list-style-type:none;
    margin-bottom:25px;
    padding:0 0 0 10px;
}
ul#filter li{
    display:inline;
}
ul#filter li a:link,ul#filter li a:visited{background:#fff url('../images/bg-input-textarea-rev.png') repeat-x 0 100%;border:#ccc 1px solid;color:#b1b1b1;display:block;float:left;height:25px;margin:1px;padding:6px 15px 0 15px;text-decoration:none;}
ul#filter li a:hover,ul#filter li.selected a{background:#eee url('../images/bg-input-textarea.png') repeat-x 0 100%;border:#aaa 1px solid;color:#999;}
ul.image-grid{height:100%;list-style-type:none;padding:0;width:960px;}
ul.image-grid:after,ul.image-grid li span.information:after{clear:both;content:"";display:block;height:0;overflow:hidden;}
ul.image-grid li{float:left;min-height:180px;padding:10px;width:220px;}
ul.image-grid li a.prettyPhoto{display:block;float:left;height:165px;position:relative;width:220px;}
ul.image-grid li a span.thumbPortfolio{background:url('../images/bg-thumb-p.png') no-repeat 50% 50%;display:block;height:165px;position:absolute;top:0;width:220px;}
ul.image-grid li div.information{float:left;}
ul.image-grid li div.information h4{color:#999;font:15px/1.4em Helvetica,Arial,sans-serif;margin-top:-6px;}
ul.image-grid li div.information p{display:none;width:100%;}
ul.full-width li{background:url('../images/bg-g-sep.png') repeat-x 0 100%;padding-top:15px;width:940px;}
ul.full-width li div.information h4{font:22px/1.4em 'MgOpenModataRegular',Helvetica,Arial,sans-serif;margin:0 0 5px 20px;width:700px;}
ul.full-width li div.information p{display:block;margin:0 0 5px 20px;padding:5px 0;text-align:justify;word-spacing:-0.3ex;width:700px;}
#contact{padding:40px 0 10px 0;min-height:700px;}
ul#contact-info{list-style-type:none;padding:10px 0 0 0;}
.contact-addthis{padding:20px 0 0 0;}
#contact-form ul{list-style-type:none;padding:0;}
#contact-form label{color:#999;display:block;float:left;font:normal 14px/1.4em Helvetica,Arial,sans-serif;margin-top:10px;}
#contact-form label.error{float:right;font:italic 10px/1em Helvetica,Arial,sans-serif;color:#c00;padding:6px 5px 0 5px;}
#contact-form input,#contact-form textarea{background:#fff url('../images/bg-input-textarea.png') repeat-x 0 0;border:#ccc 1px solid;padding:10px;width:428px;}
#contact-form textarea{height:250px;}
#contact-form input.button{background:#fff url('../images/bg-input-textarea-rev.png') repeat-x 0 100%;color:#b1b1b1;height:35px;margin-top:15px;padding:0;width:130px;}
#contact-form input.button:hover{background:#eee url('../images/bg-input-textarea.png') repeat-x 0 100%;border:#aaa 1px solid;color:#999;}
#map{border:5px solid #eee;height:310px;margin:5px 0;width:440px;}
#copyrights,#information{color:#999;font:normal 12px/1.4em Helvetica,Arial,sans-serif;height:40px;padding-top:30px;}#copyrights{float:left;padding-left:10px;}

.section {
  width: 950px;
  margin: 0 auto;
  padding: 20px 0;
  overflow: hidden;
}
.ligne{
    background: url('../images/line.png') repeat-x 0 bottom;
}

.section h2 {
  width: 160px;
  padding-right: 30px;
  float: left;
  padding-top: 0;
  line-height: 22px;
}

.section h3 {
  line-height: 22px;
  margin-bottom: 24px;
  font-style: italic;
}

.section h4 {
  font-weight: normal;
  font-style: normal;
  margin-bottom: 20px;
  margin-top: -20px;
}

.section .date {
  position: absolute;
  top: 6px;
  right: 0;
}

.section .item {
  width: 710px;
  padding-left: 50px;
  float: right;
  padding-top: 0;
  margin-bottom: 9px;
  position: relative;
  padding-bottom: 5px;
  background: url(../images/separator.png) no-repeat 0 bottom;
}

.section .description {
  width: 510px;
}