/* cadreblanc.css // 20090312 */

html, body { height: 100%; overflow: hidden; }
body, input, select, textarea { font: 12px "Lucida Bright", Georgia, serif; background: white; color: #758582; }
body { background: white url(white/layout/cadreblanc3.png) no-repeat 5% 95%; }
a, a:visited, a:active { color: #7acdb5; }
a:hover { color: #758582; }

/** Access **/
#access { display: none; }

/** Header **/
#header { position: absolute; z-index: 2; left: 5%; top: 5%; height: 120px; width: 300px; background: white url(white/layout/flower.tl2.png) no-repeat top left; }
#header h1 { margin-left: 70px; padding-top: 21px; }
#header h1 a { display: block; width: 181px; height: 99px; background: url(white/layout/title3.png) no-repeat bottom; }
#header h1 a:hover { background-position: top; }
#header h2 { width: 117px; height: 15px; background: url(white/layout/subtitle.png) no-repeat center; margin-left: 140px; position: relative; top: -25px; }
#header * span { display: none; }

/** Langs **/
#langs { position: absolute; top: 5px; right: 5px; font-size: 0.8em; }
#langs a { display: block; float: right; width: 16px; height: 11px; margin-left: 5px; border: 2px white solid; }
#langs a:hover { border-color: #7acdb5; }
#langs a.fr { background: url(white/icons/fr.png); }
#langs a.en { background: url(white/icons/gb.png); }
#langs span { display: none; }

/** Menu **/
#menu { float: right; width: 200px; margin-left: 30px; }
#menu * a { display: block; background: transparent no-repeat bottom; }
#menu * a span { display: none; }
#menu * li.active a,
#menu * a:hover { background-position: top; }
/* French */
body.fr #menu * a.home { width: 103px; height: 39px; background-image: url(white/menus/fr/home.png); margin-left: 45px; margin-top: 18px; }
body.fr #menu * a.prestations { width: 148px; height: 37px; background-image: url(white/menus/fr/services.png); margin-left: 15px; margin-top: 6px; }
body.fr #menu * a.couleur { width: 116px; height: 36px; background-image: url(white/menus/fr/color.png); margin-top: 15px; }
body.fr #menu * a.noirblanc { width: 166px; height: 36px; background-image: url(white/menus/fr/blackwhite.png); margin-left: 5px; margin-top: 18px; }
body.fr #menu * a.temoignages { width: 161px; height: 50px; background-image: url(white/menus/fr/thanks.png); margin-left: 5px; margin-top: 15px; }
body.fr #menu * a.contact { width: 114px; height: 37px; background-image: url(white/menus/fr/contact.png); margin-left: 60px; margin-top: 14px; }
body.fr #menu * a.liens { width: 74px; height: 38px; background-image: url(white/menus/fr/links.png); margin-left: 40px; margin-top: 6px; }
/* English */
body.en #menu * a.home { width: 107px; height: 46px; background-image: url(white/menus/en/home.png); margin-left: 45px; margin-top: 18px; }
body.en #menu * a.prestations { width: 117px; height: 40px; background-image: url(white/menus/en/services.png); margin-left: 15px; margin-top: 6px; }
body.en #menu * a.couleur { width: 98px; height: 38px; background-image: url(white/menus/en/color.png); margin-top: 15px; }
body.en #menu * a.noirblanc { width: 174px; height: 44px; background-image: url(white/menus/en/blackwhite.png); margin-left: 0; margin-top: 18px; }
body.en #menu * a.temoignages { width: 162px; height: 41px; background-image: url(white/menus/en/thanks.png); margin-left: 5px; margin-top: 15px; }
body.en #menu * a.contact { width: 108px; height: 38px; background-image: url(white/menus/en/contact.png); margin-left: 60px; margin-top: 14px; }
body.en #menu * a.liens { width: 82px; height: 32px; background-image: url(white/menus/en/links.png); margin-left: 40px; margin-top: 6px; }

/** Main **/
#main { position: absolute; top: 5%; left: 5%; height: 90%; width: 90%; overflow: hidden; background: url(white/layout/flower.br2.png) no-repeat bottom right; }

/** Body **/
#body { position: relative; margin-left: 50px; padding-bottom: 50px; overflow: hidden; visibility: hidden; }
#body h2,
#body h3,
#body h4 { margin-top: .5em; }
#body h1,
#body h2,
#body h3,
#body h4,
#body p,
#body ul,
#body ol,
#body dl { margin-bottom: .5em; }
#body h1 { font-size: 1.8em; color: #888; margin-top: 1em; }
#body h2 input { font-size: 1.2em; color: #7acdb5; }
#body h2 { font-size: 1.5em; color: #7acdb5; margin-top: 1em; }
#body h3 { font-size: 1.3em; }
#body h4 { font-size: 1.2em; }
#body ul { list-style: square inside; padding-left: 1em; }
#body ol { list-style-position: inside; padding-left: 1em; }
#body dt { font-weight: bold; font-size: 1.2em; }
#body dd { display: block; margin-bottom: .5em; }
#body address { font-style: normal; }

/** Arrows **/
#arrows { display: none; }
#arrows a { position: absolute; z-index: 3; width: 48px; height: 24px; background: transparent no-repeat; left: 50%; bottom: 5%; margin-bottom: -14px; }
#arrows a.up { background-image: url(white/icons/up.png); margin-left: -150px; background-position: top; }
#arrows a.up:hover { background-position: bottom; }
#arrows a.down { background-image: url(white/icons/down.png); margin-left: -100px; background-position: bottom; }
#arrows a.down:hover { background-position: top; }
#arrows a span { display: none; }

/** Titles **/
#body h1.title { visibility: hidden; height: 40px; padding-top: 150px; margin: 0; background: no-repeat bottom left; }
#body h1.title span { display: none; }
#body h1.presta { background-image: url(white/titles/presta.png); }
#body h1.contact { background-image: url(white/titles/contact.png); }
#body h1.links { background-image: url(white/titles/links.png); }
#body h1.thanks { background-image: url(white/titles/thanks.png); }

/** Elements **/
#body big { font-size: 1.4em; line-height: .8em; color: #7acdb5; }
#body p.chapo { font-size: 1.3em; }
#body div.links { margin-top: 2em; }
#body div.links a { display: block; width: 200px; height: 60px; float: left; padding: 10px 20px; color: #758582; }
#body div.links a.small { width: 140px; }
#body div.links * h3 { margin: 0; font-size: 1.4em; }
#body div.links * p { font-size: 1.1em; }
#body div.links a:hover h3,
#body div.links a:hover address { color: #758582; }
#body div.thanks { margin-top: 2em; }
#body div.thanks div { display: block; width: 80%; padding: 30px 10px 10px 30px; color: #758582; background: url(white/icons/thank.png) no-repeat top left; margin-bottom: 1.5em; }
#body div.thanks * h2 { margin: 0; }
#body div.thanks * h3 { margin-top: 0; font-size: 1.2em; }
#body div.thanks * p { font-size: 1.1em; text-align: justify; }
#body div.thanks * address { font-style: normal; color: #7acdb5; }
#body div.photos { margin-top: 2em; }
#body div.photos a { display: block; width: 180px; height: 180px; float: left; padding: 10px; text-align: center; color: #758582; }
#body div.photos a:hover { background: url(white/icons/square.png); }
#body div.photos * h2 { margin: 0; }
#body div.photos * p { margin: 0; font-size: 1.1em; }
#body div.photos * img { border: 4px white solid; }
#body div.photos * address { font-size: 0.9em; margin: 0; }
#body div.photos a:hover h2,
#body div.photos a:hover address { color: black; }
#body div.photos * address { font-style: normal; }
#body div.album { height: 130px; padding: 10px; background: #eee; margin-top: 20px; }
#body div.album a.left,
#body div.album a.right { display: block; height: 80px; background: transparent no-repeat left; width: 10px; margin: 20px 0; }
#body div.album * span { display: none; }
#body div.album a.left { float: left; margin-right: 5px; background-image: url(white/icons/left.png); }
#body div.album a.right { float: right; margin-left: 5px; background-image: url(white/icons/right.png); }
#body div.album a.left:hover,
#body div.album a.right:hover { background-position: right; }
#body div.album * ul { display: block; height: 130px; list-style: none; padding: 0; overflow: hidden; }
#body div.album * li { float: left; display: block; height: 130px; width: 130px; }
#body div.album * img { border: 5px #eee solid; }
#body div.album * a.active img { border-color: white; }
#body div.description { display: none; }
#photosPreview { height: 370px; margin-right: 10px; }
#photosPreview img { float: right; border: 1px #eee solid; padding: 14px; }
#photosBox { height: 130px; width: 620px; overflow: hidden; }
#body div.bk { background: url(white/icons/block.png) no-repeat bottom left; padding: 20px; float: left; margin: 0 20px 10px 0; }
#body div.ff1 { width: 40%; }
#body div.ff2 { width: 40%; margin-top: 20px; }
#body div.ac1 { width: 40%; margin-top: 30px; }
#body div.ac2 { width: 40%; }
#body div.ac3 { width: 40%; margin-top: 10px; }
#body div.fc { width: 500px; margin: 0 auto; margin-bottom: 2em; font-size: 1.1em; }
#body div.fc p { font-size: 1.2em; }

/** Footer **/
#footer { position: absolute; z-index: 2; left: 5%; bottom: 5%; width: 90%; font-size: 0.8em; text-align: right; padding-bottom: 10px; }
#copyright { float: right; margin-left: 10px; padding-right: 180px; }
#credits,
#credits a { color: #eee; }

