/* RESET */
html,body,div,p,h1,h2,h3,h4,h5,h6,strong,em,dd,dl,dt,ul,ol,li,form,textarea,input {margin:0;padding:0;font-weight:inherit;font-style:inherit}

/* MAIN */
html{background:#f4f4f4 url(../img/texture.png);height:100%}
body {text-align:center;line-height:24px;background:url(../img/fade.png) top left repeat-x;height:100%}

body,#photos h4 {font-family:Georgia,sans-serif;font-size:16px}
h1 em,h4,#photos dd {font-family:Baskerville,Palatino,"Palatino Linotype",Georgia,serif;font-style:italic;font-weight:normal}
h2,h3,#contact label,#submit-button,.adresse,.page-top,#nav li,#footer,input,textarea,div.tooltip,#description {font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
h2,h3,#contact label,#submit-button,.adresse,.page-top,#nav li,div.tooltip {font-weight:bold}

.no-helvetica #nav,.no-helvetica  h3 {letter-spacing:-0.05em}
.no-baskerville h1 em,.no-baskerville  #portfolio h4,.no-baskerville  #contact h4,.no-baskerville  #photos dd {letter-spacing: -0.05em}

h1 {font-size:64px}
h1 em {font-size:21px}
#nav,#nav li,h4,#photos dd,#contact label,#submit-button,.adresse,.page-top a {font-size:18px}
h3 {font-size:24px;line-height:24px}
#footer,.page-top {font-size:12px}
#description {font-size:16px}

p {margin-bottom:24px}

.hr {display:none}

a {color:#cf0421;text-decoration:none;outline:0}
a:hover {color:#cf0421;border-bottom:1px solid #c36a76;padding-bottom:1px}
a:active {color:#000}

abbr {font-variant:small-caps;letter-spacing:1px;text-transform:lowercase}

.lettrine {float:left;position:relative;left:-0.3em;margin-right:-0.2em;font-size:48px;line-height:48px;color:#cf0421}
.espacefine {display:inline-block;width:0.10em}

#header,#main {text-align:left;margin:0 auto;padding:0;width:100%;position:relative}

#header {background:url(../img/roule_2.png) no-repeat center 24px;padding:0;margin:0;height:100%;text-shadow:0 1px 1px #fff;min-height:600px}
#header .section {background:none;border:0;position:relative;top:192px}
h1 {position:relative;line-height:96px;margin-bottom:0}
h1 span {float:left;display:block;width:352px;height:120px;background:url(../img/h1-sign.png) no-repeat 0 15px;text-indent:-9999px}
h1 em {float:left;display:block;padding-top:40px;height:48px;color:#000;vertical-align:baseline;line-height:48px;font-weight:normal}
#made-by {display:block;width:270px;text-align:right}
#description {color:#333;font-weight:normal;clear:both;position:relative;top:48px;left:270px;margin:0;line-height:24px;text-align:left;width:420px}
h1 em {color:#222}

#nav,#nav li {list-style-type:none}
#nav li {display:inline;padding:0;margin:0 60px 0 0}
#nav {position:relative;height:24px;top:24px;left:0;width:420px;text-align:left;padding:0;margin:0;clear:both;left:270px}
#nav a {border:0;color:#000;display:inline-block;height:24px}
#nav a:hover {border:0;padding:0}
#nav a:active {color:#cf0421}
.down-arrow {display:none;width:7px;height:12px;margin:0 -12px 0 5px}

.section {padding:48px 0;background:url(../img/ombre2.png) repeat-x top left;position:relative}
.container {width:960px;margin:0 auto}
.container div {width:420px;margin:0 auto;padding:0;position:relative}
.section h4,#contact label,#photos dd {position:absolute;width:250px;left:-270px;text-align:right}
.section h3 {margin-bottom:24px}

.page-top {font-weight:normal;position:relative;top:54px;height:24px;left:420px;width:200px;text-align:left;margin:-24px 0 0 0;text-transform:uppercase;font-weight:bold;clear:both}
			.page-top a {border:0}
#portfolio	.page-top a {color:#40404f}
#photos		.page-top a {color:#b8b8ba}
#contact	.page-top a {color:#1d1f2b}

#portfolio {z-index:1;background-color:#f2f2f2;border-top:1px solid #aaa;padding-top:47px}
#portfolio h4 {color:#666}
#portfolio ul,#portfolio li,#photos ul,#photos li {padding:0;margin:0;list-style-type:none}
#portfolio li,#photos dt {margin-bottom:48px;max-height:264px}
#portfolio li li {margin:0}
#portfolio img,#photos img {margin-bottom:-2px;border:1px solid #c8c8d2;-webkit-box-shadow:0 4px 20px rgba(0,0,0,0.2);-moz-box-shadow:0 4px 20px rgba(0,0,0,0.2);box-shadow:0 4px 20px rgba(0,0,0,0.2);-webkit-transition:all 0.08s ease-out}
#portfolio img:hover,#photos img:hover {-webkit-box-shadow:0 6px 20px rgba(0,0,0,0.5);-moz-box-shadow:0 6px 20px rgba(0,0,0,0.5);box-shadow:0 8px 20px rgba(0,0,0,0.5)}
#portfolio li li a:hover {padding:0}

.portfolio-url {display:block}
.portfolio-description {position:absolute;left:450px}
#portfolio div.tooltip {position:absolute;top:110px;left:198px;padding:0;border:0;width:25px;height:25px}
#portfolio div.tooltip img {border:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}

#photos {z-index:2;background-color:#47474f;border-top:1px solid #40404f;padding-top:47px;color:#f2f2f2}
#photos h4 {position:static;width:auto;text-align:left;color:#f2f2f2;font-style:normal;margin:120px 0 24px 0}
#photos h4.photos-first-title {margin:24px 0}
#portfolio ul ul a,#photos a {border:0}
#photos dd {float:left;margin-top:-312px}
#photos dt {clear:both}
#photos img {-webkit-box-shadow:0 4px 20px rgba(0,0,0,0.3);-moz-box-shadow:0 4px 20px rgba(0,0,0,0.3);box-shadow:0 4px 20px rgba(0,0,0,0.3)}

#contact {z-index:3;background-color:#f0f0f2;border-top:1px solid #b8b8ba;padding-top:47px}
#titre-contact {margin-top:48px}
#contact ol,#contact li {list-style-type:none;padding:0;margin:0}
#contact li {margin-bottom:24px;height:24px}
li#contact-message-container {height:auto;padding:0;line-height:auto}
#contact label {color:#707077}
#contact-form {margin:24px 0 48px 0}
#contact-merci {margin:96px 0 48px 0}
.input-text {width:200px;height:14px}
textarea {width:400px;height:134px;padding:0;border:0;text-align:left}
.vcard {font-weight:bold}
div.tel {letter-spacing:1px;margin-bottom:24px}
.input-text,textarea {padding:4px;font-size:13px;vertical-align:top;border:1px solid #e2e2e2;outline:0}
.beingTypedIn .input-text,.beingTypedIn textarea {border:1px solid #444}

#footer {background-color:#1d1f2b;padding:0;color:#fff;text-align:right}
#footer .container {padding:12px 0}
#footer p {margin:0}
#footer a {color:#fff;border-color:#fff}

.required-star,.required-ok {position:absolute;display:inline;margin-left:4px;margin-top:3px}
.empty input,.empty input.input-text,.empty textarea {border:1px solid #cf5768}
.empty.beingTypedIn input,.empty input.input-text.beingTypedIn,.empty textarea.beingTypedIn {border:1px solid #f00}
#contact .beingTypedIn label {color:#000}
#contact .empty label {color:#cf5768}
#contact .beingTypedIn.empty label {color:#cf0421}

#lightbox {display:none;position:absolute;top:0;bottom:0;left:0;right:0;text-align:center;background:url(../img/opacityblack08.png);z-index:9999;font-family:Baskerville,Palatino,"Palatino Linotype",Georgia,serif}
div#lightbox-enlarge {position:absolute;display:block;width:25px;height:25px;background:url(../img/lb-zoom.png);float:none;z-index:9999}
#lightbox-container {display:block;position:relative;background:#fff url(../img/lb-loading.gif) center center no-repeat;width:100px;height:100px;margin:0 auto;padding:0}
#lightbox-close {position:absolute;left:-16px;top:-62px;text-indent:-9999px;width:33px;height:33px;background:url(../img/lb-close.png)}
#lightbox-close a {display:block}
#lightbox-image {display:none;margin:0}
#lightbox-image img {display:none;margin:0;-ms-interpolation-mode:bicubic}
#lightbox-caption {display:none;text-align:left;position:absolute;top:48px;left:0;width:240px;padding:10px 20px 10px 10px;margin:0;color:#fff;background:#000;font-size:14px;opacity:0.8;filter:alpha(opacity=80)}
.lightbox-title {display:block;width:192px;position:relative;left:58px;font-size:18px;margin:0;line-height:24px;font-family:Helvetica;font-size:24px;font-weight:bold;max-width:100%}
#lightbox a,#lightbox a:hover{border:0;}
#lightbox-controls {display:block;position:absolute;width:48px;height:100%;padding:0 10px 0 0}
#lightbox-prev,#lightbox-next {display:inline;position:relative;top:2px;padding:0 4px}
#lightbox-prev a, #lightbox-next a,#lightbox-controls img {border:0}
#lightbox-prev a,#lightbox-next a{}
#lightbox-prev a:hover, #lightbox-next a:hover {}
#lightbox-prev a:active, #lightbox-next a:active {outline:0;border:0}
.lightbox-disabled img {opacity:0.3;filter:alpha(opacity=30)}
.modalbox #lightbox-close {top:-18px;left:-18px}
.modalbox #lightbox-container {text-align:left;padding:40px 40px 20px 40px;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px}
