/* Defaults
------- */
html {height: 100%;}
body {background: #546734 url('i/backgrounds/gradient.jpg') 0 0 repeat-x; background-attachment: fixed; height: 100%;}
* {margin: 0; padding: 0; font-size: 1em;}
img, fieldset {border: none;}
ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0; empty-cells: show;}
select > option {padding: 0 16px 0 3px;}
textarea {overflow: auto;}
button {border-style: inset; border-width: 0; border: none; background: none; vertical-align: middle;}
acronym {border-bottom: dotted 1px;}
hr, legend, .wai, .jumpers {display: none;}
:focus {outline: none;}
body, select, input, textarea, button, a {color: #303221;}
a:hover, button:hover {color: #ea5a00;}

/* Typo
------- */
* {font-family: 'Lucida Sans Unicode','Lucida Grande','Trebuchet MS',georgia,arial,FreeSans,verdana,sans-serif;}

body {font-size: 75%; line-height: 1.417;}

sub,
sup {font-size: 0.85em; line-height: 0.5em; text-transform: none;}
sub {vertical-align: -0.3em;}

a {text-decoration: none;}
.content a {text-decoration: underline}

.content ul li {list-style: square;}
.content ul ul li {list-style: disc;}

.content p,
.content ul,
.content ol {max-width: 560px;}

.content h1 {font-size: 2em; margin-bottom: 0.667em; line-height: 1;}
.content h2 {font-size: 1.5em; margin: -0.17em 0 1.115em; line-height: 0.945;}
.content h3 {font-size: 1.333em; margin: -0.14em 0 1.203em; line-height: 1.063;}
.content h4 {font-size: 1.167em; margin: -0.075em 0 1.292em; line-height: 1.217;}
.content p,
.content ul,
.content ol {margin-bottom: 1.417em;}

.content h2 + h3 {margin-top: -1.203em;}
.content h3 + h4 {margin-top: -1.292em;}

.content blockquote {text-indent: -0.72em; display: inline-block;}

.content small {font-size: 0.916em; line-height: 1.464;}


/* Page
---------------------- */
#page {position: relative; min-height: 100%; width: 960px; margin: 0 auto; background: #fff url('i/backgrounds/countryside.jpg') 0 100% no-repeat;}
html>body .left-shadow {display: block; width: 6px; height: 100%; position: absolute; left: -6px; top: 0; background: url('i/backgrounds/left-shadow.png') 0 0 repeat-y;}
html>body .right-shadow {display: block; width: 6px; height: 100%; position: absolute; right: -6px; top: 0; background: url('i/backgrounds/right-shadow.png') 0 0 repeat-y;}
.page-inner {background: url('i/backgrounds/flower-field.jpg') 100% 0 no-repeat;}

/* Header */
#header h1 {width: 207px; height: 170px; overflow: hidden; background: url('i/backgrounds/logo.png') 0 0 no-repeat; margin: 20px 0 3px 16px; float: left;}
#header h1 a,
#header h1 span {display: block; width: 100%; height: 100%; text-indent: -9999px;}

#baseline {width: 398px; height: 89px; margin: 0 0 0 0; background: url('i/backgrounds/baseline.png') 0 0 no-repeat; position: absolute; left: 262px; top: 56px;}
#baseline p {position: absolute; left: -9999px;}

#wrapper {padding: 0 0 3em 0; }

/* Navigation */
#navigation {width: 565px; height: 110px; background: url('i/backgrounds/boards.jpg') 0 0 no-repeat; margin: 0 0 20px 34px; float: left;}

#navigation a {display: block; width: 144px; height: 110px; overflow: hidden; text-indent: -9999px; float: left; background-repeat: no-repeat; background-position: -9999px -9999px; background-image: url('i/backgrounds/boards.jpg');}
#navigation a:focus {outline: none;}
#nav-1 a:hover,
#nav-1 strong a {background-position: 0 -140px;}
#nav-2 a {width: 145px;}
#nav-2 a:hover,
#nav-2 strong a {background-position: -144px -140px;}
#nav-3 a:hover,
#nav-3 strong a {background-position: -289px -140px;}
#nav-4 a {width: 130px;}
#nav-4 a:hover,
#nav-4 strong a {background-position: -433px -140px;}

/* Content */
#content {margin: 0 39px 460px 39px;}

.content h1 {color: #546734; font-weight: normal;}
.content h2 {color: #7f8d67; font-family: 'Trebuchet MS',Helvetica,sans-serif;}
.content h3 {color: #84664c;}

.content .intro {color: #564436;}

.illustration {line-height: 1; margin: 0 0 0.8em 0;}
.illustration img {display: block; padding: 1px;}
html>body .illustration img {background: url('i/backgrounds/6d7e52-85.png'); background: rgba(109,126,82,0.85);}
.illustration .wrap {display: block; padding: 1px; border: solid 1px #6d7e52; border-color: rgba(109,126,82,0.55);}
html>body .illustration .wrap {background: url('i/backgrounds/6d7e52-50.png'); background: rgba(109,126,82,0.5);}
.left {float: left; margin-right: 20px;}
.right {float: right; margin-left: 20px;}
.center {margin: 0 auto 1em auto;}
.third {width: 226px;}
.illustration .legend {line-height: 1.2; margin-top: 0.25em; font-size: 0.9em;}
.illustration .legend * {margin-bottom: 0;}

html>body .shifted {margin-right: -21px;}


.zoom {position: relative;}
.zoom em {display: block; width: 22px; height: 21px;}
.zoom > em {background: url('i/backgrounds/zoom.png') 0 0 no-repeat; position: absolute; bottom: 3px; right: 2px;}

table {margin: 0.5em 0;}
th {padding: 0 15px 3px 0; color: #7f8d67; text-align: left; border-bottom: solid 1px #7f8d67;}
td {padding: 4.05px 15px 11.1px 0; vertical-align: top; border-bottom: solid 1px #ccc; font-size: 0.916em; line-height: 1.464;}
.first-child td {padding-top: 5px;}


.separator {display: block; margin: 20px 0;}

.block {width: 561px; display: table;}

.placeholder {display: block; height: 200px;}

.split {margin: 0 0 0.8em 0;}
.split .odd {width: 260px; float: left; margin-right: 30px;}
.split .even {width: 260px; float: left;}

/* SideBar */
#sideBar {width: 326px; float: right; color: #171515; margin: 0 4px 0 30px; height: 484px; font-size: 0.95em;}
#wrapper > #sideBar {background: url('i/backgrounds/kraft-shadow.png') 0 0 no-repeat;}
.sidebar-b {background: url('i/backgrounds/kraft.jpg'); width: 308px; height: 466px; margin: 4px 0 0 9px;}
#sideBar a {color: #171515;}

#sideBar h2 {text-indent: -9999px; height: 45px; margin-bottom: 10px; background: url('i/backgrounds/me-rencontrer.gif') 0 0 no-repeat;}
#sideBar .innerContent {margin: 0 19px 0 19px; height: 390px; overflow: auto; overflow-x: hidden; color: #171515;}

.sidebar-b h3 {color: #171515; font-size: 1.167em; margin: -0.075em 0 0.075em; line-height: 1.217;}
.sidebar-b h4 {color: #171515; font-size: 1em; margin: 0; line-height: 1.417;}
.sidebar-b p + ul {margin-top: -1.417em;}
.sidebar-b ul li {padding-left: 12px; background: url('i/backgrounds/li.gif') 0 0.79em no-repeat; list-style: none;}
.sidebar-b a {text-decoration: underline;}


/* Overlay
---------------------- */
#overlay {min-height: 100%; min-width: 100%; position: absolute; left: 0; top: 0; z-index: 5000;}
html>body #overlay {background: url('i/backgrounds/b5ba97-75.png'); background: rgba(181,186,151,0.75);}
#overlayContainer {width: 640px; height: 400px; position: absolute; left: 50%; margin-left: -50%; z-index: 5002; top: 0; border: solid 1px #555; font-size: 0.75em; color: #4f513e;}
#overlayContainer h1 {color: #84664c; font-size: 1.3em; margin: 0 125px 0.3em 0; font-weight: normal;}
#overlayContainer .illustration {clear: both;}
#overlayContainer .content {color: #4f513e;}
#overlayContainer img {border: solid 1px #f3f1f1;}
#overlayContainer .diaporama img {border: none;}
#content #overlayInnerContent img {border: solid 1px #f3f1f1;}
#overlayInnerContent {width: 642px;}
#overlayInnerContent.center .illustration {margin-left: auto; margin-right: auto;}
.hidden {display: none;}
.transparent {-moz-opacity: 0; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";}

#overlayNav a {margin: 0 0 0 0; text-align: left; color: #4f513e; font-size: 0.9em; outline: none;}
#content #overlayNav a {color: #4f513e; font-size: 0.9em;}
#overlayNav ul {height: 30px; top: 3px; position: absolute; right: 35px;}
#overlayNav ul li {list-style: none; margin: 0; padding: 0;}
#overlayNav a:hover {text-decoration: underline;}
#overlayNav .closer {background: url('i/backgrounds/overlay-close.gif') 0 0 no-repeat; width: 22px; height: 22px; position: absolute; top: 3px; right: 5px;}

#overlayNav .paging {color: #4f513e; /*font-size: 0.9em; */padding: 0.8em 45px 0 45px;}
#overlayNav .previous {display: block; width: 40px; height: 30px; position: absolute; top: 0; left: 0; overflow: hidden;}
#overlayNav .previous span {display: block; width: 40px; height: 30px; background: url('i/backgrounds/diapo-nav.gif') 0 -48px no-repeat; text-indent: -9999px;}
#overlayNav .previous a {display: block; width: 40px; height: 30px; background: url('i/backgrounds/diapo-nav.gif') 0 -6px no-repeat; text-indent: -9999px;}
#overlayNav .next {display: block; width: 40px; height: 30px; position: absolute; top: 0; right: 0; overflow: hidden;}
#overlayNav .next span {display: block; width: 40px; height: 30px; background: url('i/backgrounds/diapo-nav.gif') -40px -48px no-repeat; text-indent: -9999px;}
#overlayNav .next a {display: block; width: 40px; height: 30px; background: url('i/backgrounds/diapo-nav.gif') -40px -6px no-repeat; text-indent: -9999px;}

#overlayContainer .legend {font-size: 0.85em; text-align: right; display: block;}
#overlayContainer .legend,
#overlayContainer .legend * {color: #595b48;}

#overlayContainer object {display: block;}
#overlayContainer .content {min-height: 29px; font-size: 0.95em;}
#overlayContainer .content a {text-decoration: underline;}

#loader {display: block; width: 32px; height: 32px; margin: -16px 0 0 -16px; opacity: 0.5; position: absolute; left: 50%; top: 50%; z-index: 5001;}

#overlayInnerContent {background: #fff; background: rgba(255,255,255,0.85); padding: 9px; position: relative;}

#content #overlayInnerContent {margin: 0; background: none; padding: 0;}
#content #overlayInnerContent #overlayNav {display: none;}
.plainZoom #content {clear: both;}

/* Diaporama
----- */
.diaporama {position: relative;;}
.diapo .data {margin-bottom: 0.85em; font-size: 1.1em;}
.diaporama .media {background: #151515; background: rgba(0,0,0,0.95); height: 480px; margin-bottom: 1em; overflow: hidden; line-height: 478px; text-align: center; border: solid 1px #000; outline: solid 1px #efefef;}
.diaporama .media img {display: inline; line-height: 480px; vertical-align: middle;}
.diaporama .media a {text-decoration: none;}
.scripted .diapo {position: absolute; top: -9999px;}
.diaporama .current {position: static; top: 0;}
.diapoNav {position: absolute; top: 0; left: 0; height: 480px; width: 100%;}

.diapoNav button {display: block; width: 35%; height: 482px; overflow: hidden; position: absolute; line-height: 480px; text-decoration: none; text-align: center; font-size: 60px; top: 0; z-index: 300; text-indent: -9999px; background: url('i/backgrounds/fff-00.png'); background: rgba(255,255,255,0); text-shadow: rgba(0,0,0,0.25) 1px 1px 5px;}
.diapoNav .prev {left: 0;}
.diapoNav .next {right: 0;}

.diapoNav .playPause {width: 40%; line-height: 486px; font-size: 35px; left: 30%; font-weight: bold; letter-spacing: 0.1em; text-shadow: rgba(0,0,0,0.5) 1px 1px 20px;}

.diapoNav > button:focus,
.diapoNav > button:hover {background: url('i/backgrounds/fff-15.png'); background: rgba(255,255,255,0.15); color: #FFF; color: rgba(255,255,255,0.95); text-indent: 0; outline: none; -webkit-transition: all 0.25s ease;}

.diapoNav span {display: none; text-align: center; width: 44%; position: absolute; bottom: 0; left: 28%; color: #111; color: rgba(0,0,0,0.95); text-shadow: rgba(0,0,0,0.25) 1px 1px 5px; font-size: 1.5em; font-weight: bold;}
.diapoNav:hover span {display: block;}

.diapoNav .reposition {width: 1px; height: 1px; left: 0; outline: none;}
.diapoNav .reposition:focus {outline: none;}

/* Footer */
#footer {font-size: 0.8em; text-align: right; color: #ebe8cf; position: absolute; bottom: 0; right: 10px; padding: 3px; text-shadow: 0 0 0 #ebe8cf; width: 940px;}
#footer a {color: #ebe8cf;}
#footer a:hover {text-decoration: underline;}
#footer .favs {float: left;}


/* Floats */
#header:after,
#navigation:after,
#wrapper:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}