/******************************************************************************* @copyright Copyright (c) 2009, lewebconcret.ch @author Jose Malvarez ******************************************************************************** Fichier : /www.hok.ch/data/files/model/website_dog.css Encodage : UTF-8 Description : Date : 03 sept. 09 ******************************************************************************** Notes : Bleu : 008ed0 Brun : DFD1C3, BFB3A7, 3F1F00, 804000, 2F1700, 1F0F00 Orange : FFA500 -webkit-box-shadow: 1px 1px 5px #000; -moz-box-shadow: 0px 1px 8px #000; -webkit-border-top-left-radius: 1em; -moz-border-radius-topleft: 1em; *******************************************************************************/ /******************************************************************************* s t r u c t u r e *******************************************************************************/ html { background-color: #C7C78F; } body { float: left; color: #000;} body * { } div.bodyBlock { width: 60em; margin: 0 auto; margin: 2em auto; } div.pageElement { width: 100%; } #pageBlock { float: left; border: 0.5em solid #FFFFEA; width: 59em; background-image: url("/img/header3.png"); background-repeat: no-repeat; -moz-border-radius-topleft: 3em; -webkit-border-top-left-radius: 3em; -moz-border-radius-topright: 3em; -webkit-border-top-right-radius: 3em; -webkit-box-shadow: 1px 1px 5px #000; -moz-box-shadow: 0px 1px 8px #000; } div.pageBlockElement { } #headerBlock { height: auto; -moz-box-shadow: inset 0px 1px 8px #000; -moz-border-radius-topleft: 2.7em; -webkit-border-top-left-radius: 3em; -moz-border-radius-topright: 2.7em; -webkit-border-top-right-radius: 3em; } div.headerBlockElement { width: 100%; clear: both; } #userBar { text-align: right; height: 2em; font-size: 0.8em; font-weight: bold; } #userBar ul { text-align: right; } #userBar ul li { display: inline; text-align: center; padding: 0 0.5em; list-style: none; line-height: 2em; height: 2em; } #userBar ul li.sep { color: #fff; } #userBar ul li a { text-align: center; color: #fff; } #bannerBar { height: 9em; cursor: pointer; } #menuBar { height: 3.2em; } #pubBlock { float: left; background-color: #FFFFEA; } div.pubBlockElement { float: left; clear: both; height: auto; } #enteteBlock { min-height: 0em; text-align: center; width: 100%; font-size: 1.4em; font-weight: bold; line-height: 1.5em; height: 1.5em; padding-top: 2em; padding-bottom: 2em; } #leftBlock { clear: left; width: 12em; -moz-border-radius-topleft: 1em; -moz-border-radius-bottomleft: 1em; -webkit-border-top-left-radius: 1em; -webkit-border-bottom-left-radius: 1em; } #mainBlock { position: relative; width: 46.9em; margin-left: auto; margin-right: auto; clear: none; } #headerBlock h1 { clear: both; } div.mainBlockElement { width: 100%; } #adBlock { max-height: 7.5em; -moz-border-radius: 1em; -webkit-border-radius: 1em; } #dataBlock { border-left: 1px solid transparent; } div.dataBlockElement { width: 100%; } #messageBar { margin-top: 2px; } #dataBar { margin-left: auto; margin-right: auto; } div.dataBarElement { width: 100%; } div.centerDiv { width: 100%; } div.contentContainer { padding: 1em 1em 1em 6em; } #rightBlock { float: right; clear: right; border-left-style: dashed; border-left-color: #C7C78F; border-left-width: 1px; width: 12em; -moz-border-radius-bottomright: 1em; -moz-border-radius-topright: 1em; -webkit-border-bottom-right-radius: 1em; -webkit-border-top-right-radius: 1em; } #rightBlock img.ad { max-width: 10.83em; margin: 0 0.5em; } #piedBlock { min-height: 0em; clear: both; padding-top: 1em; padding-bottom: 2em; } #footerBlock { float: left; clear: both; padding-bottom: 5em; border-top: 1px solid #2F1700; } div.footerBlockElement { width: 100%; float: left; clear: both;} #copyrightBar { float: none; width: 60em; } #etiquette { float: right; width: 90px; } #etiquette div { width: 100%; } /******************************************************************************* m e n u *******************************************************************************/ ul#menu { padding-top: 0.5em; line-height: 2em; height: 2em; font-weight: bold; } ul#menu a { text-transform: lowercase; text-decoration: none; float: left; position: relative; z-index: 75; padding-left: 0.5em; padding-right: 0.5em; text-shadow: 0px 1px 1px #000; color: #fff; border: 1px solid transparent;} ul#menu a:first-letter { text-transform: capitalize; } ul#menu li { float: left; position: relative; z-index: 74; padding-right: 1px; padding-left: 1px; } ul#menu li.current a { color: #90FF5A; border-bottom: 1px solid #fff; } ul#menu li:hover a { color: #90FF5A; border-bottom: 1px solid #fff; } /******************************************************************************* s l i d e s *******************************************************************************/ fieldset.slide { background-color: #005200; border-color: #85B99D; -moz-border-radius: 0.8em; -webkit-border-radius: 0.8em; -moz-box-shadow: 1px 1px 100px #000 inset; -webkit-box-shadow: 0px 0px 4px #000; } fieldset.slide div.titleContainer { color: #fff; border-color: #fff; } fieldset.slide div.contentContainer { background-color: #c2e0d0; -moz-box-shadow: 0px 0px 5px #000 inset; -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; } fieldset.slide div.contentContainer div.contentElement { } /******************************************************************************* l a y o u t s *******************************************************************************/ div.layout_labelData { padding-left: 1em; padding-right: 1em; } div.layout_labelData ul { } div.layout_labelData li { clear: both; padding-bottom: 0.5em; } div.layout_labelData li span { color: #2F1700; } div.layout_labelData li span.label { float: left; width: 15em; } div.layout_labelData li span.data { font-weight: bold; } div.layout_table { padding-left: 1em; padding-right: 1em; } div.layout_table table { color: #3F1F00; } div.layout_table td, div.layout_table td:empty { border-color: #BFB3A7; } div.layout_table td.evidence { background-color: #DFD1C3; color: #3F1F00; } div.layout_table tbody { border-color: #BFB3A7; } div.layout_thumbnails { padding-left: 2.3em; padding-right: 2.3em; } div.layout_thumbnails ul { clear: both; } div.layout_thumbnails#albums ul { text-align: center; } div.layout_thumbnails li { display: inline-block; vertical-align: top; } div.layout_thumbnails li a { text-decoration: none; background-color: #fff; float: left; margin: 2.3em; padding: 0.6em; border-width: 1px; border-style: solid; border-color: #999; -moz-box-shadow: 0px 0px 3px #000; -webkit-box-shadow: 0 1px 4px #666; -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; } div.layout_thumbnails#albums li a { background-color: #000; margin: 1.2em; padding: 1em; -moz-box-shadow: none; -webkit-box-shadow: none; } div.layout_thumbnails li a img { width: 15em; margin: 0em; border-width: 1px; border-color: #999; border-style: solid; filter: alpha(opacity=80); opacity: 0.8; -khtml-opacity: 0.8; -moz-box-shadow: inset 0px 0px 2px #000; } div.layout_thumbnails li a p { line-height: 1em; font-size: 0.8em; text-align: center; height: 3em; margin:0; font-family: Arial; color: #666; width: 18.75em; overflow: hidden; text-overflow: ellipsis; } div.layout_thumbnails#albums li a img { width: 12em; border-color: #fff; } div.layout_thumbnails li a img:hover { filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; -khtml-opacity: 1; } div.layout_thumbnails li a div.titre { width: 13.3333em; font-family: Arial; padding-top: 0.5em; font-size: 0.9em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: bold; color: #3F1F00; } div.layout_thumbnails#albums li a div.titre { font-weight: bold; color: #fff; } div.layout_shadow_thumbnails li a img { height: 6.6666em; border-width: 0px; background-position: 50%; -moz-box-shadow: inset 0px 0px 4px #000; } div.bigForm li { clear: both; min-height: 2.5em; } div.bigForm li div { } div.bigForm li div.label { width: 100%; text-align: center; font-size: 1.3em; } div.bigForm li div.data { width: 100%; line-height: 2em; min-height: 2em; text-align: center; padding-bottom: 2em; padding-top: 1em; } div.bigForm li div.data span { width: 100%; font-weight: bold; padding-left: 0.7em; } div.bigForm li div.data span.error { color: red; float: left; width: 100%; font-weight: normal; } div.bigForm li div.data select { width: 100%; } div.bigForm li div.buttons { width: 100%; } div.layout_form li div.data input, div.layout_form li div.data select, div.layout_form li div.data textarea, div.layout_form li div.buttons div.button { font-size: 1em; line-height: 2em; padding: 0.25em 0.5em; height: 1.3em; float: left; width: 30em; background-image: url("/img/backgrounds/voileleger.png"); border-width: 1px; font-weight: bold; -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; -moz-box-shadow: inset 0px 1px 2px #aaa;} div.layout_form li div.data input:focus, div.layout_form li div.data select:focus, div.layout_form li div.data textarea:focus, div.layout_form li div.buttons div.button:focus { border-color: #0099FF; } div.bigForm li div.data input, div.bigForm li div.data select, div.bigForm li div.data textarea, div.bigForm li div.buttons div.button { font-size: 1.5em; float: none; margin-left: auto; margin-right: auto; width: 10em; height: 2em; border-width: 3px; border-color: #873300; } div.bigForm li div.buttons div.button { background-color: #FF0000; width: 15em; text-align: center; margin-top: 2em; margin-bottom: 2em; padding: 0 0.5em; cursor: pointer; } div.layout_form li div.data textarea { height: 6em; padding-top: 0; } div.layout_form li div.data select { width: 31.16em; height: 2em; } div.layout_form li div.data option { -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; height: 1.3em; line-height: 1.3em; padding: 0.4em 0.6em; margin: 0.15em 0.3em; border-width: 1px; border-color: transparent; font-size: 0.9em; } div.layout_form li div.data option:checked, div.layout_form li div.data option:hover { background-color: #999 !important; border-color: #000 !important; color:#fff !important; } div.layout_form li div.data optiongroup { height: 2.0em; line-height: 2.0em; padding: 0 0.5em;} div.layout_form li div.data option.titre { text-align: center; font-weight: bold; border-bottom: 1px solid #eee; } div.layout_form li div.data option.titre:hover { background-color: silver; } /******************************************************************************* i m a g e s *******************************************************************************/ div.photo { width: 100%; text-align: center; float: left; border: 0px solid #3F1F00; margin: 0.5em auto; padding: 0.7em; -moz-border-radius: 0.6em; -webkit-border-radius: 0.6em; background-color: transparent; } div.photo img { border: 1em solid #fff; max-width: 53em; max-height: 50em; } div.photoBanner img { max-width: 53em; max-height: 50em; } div.photo div.titre { width: 80%; text-align: center; margin: 0 auto; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-family: Arial; text-shadow: 0px 1px 1px #000; font-weight: bold; color: #fff; } div.photo span.ellipsis { font-family: Arial; text-shadow: 0px 1px 1px #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 600px; display: block; padding: 0; margin: 0; font-weight: bold; color: #fff;} /******************************************************************************* c o n t r o l s *******************************************************************************/ /* slider --------------------------------------------------------------------*/ span.slider_values { color: #fff; background-color: #CC6600; -webkit-border-radius: 1em; -moz-border-radius: 1em; } div.slider { width: 20em; background-color: #DFD1C3; border-color: #804000; } div.slider div.handle { } div.topSlider#loadingDiv { } ul.circle { list-style-type: disc; padding-left: 1.5em; } #lightboxImage { } #outerImageContainer { -webkit-border-top-left-radius: 0em; -moz-border-radius-topleft: 0em; -webkit-border-top-right-radius: 0em; -moz-border-radius-topright: 0em; } #imageDataContainer { -webkit-border-bottom-left-radius: 1em; -moz-border-radius-bottomleft: 1em; -webkit-border-bottom-right-radius: 1em; -moz-border-radius-bottomright: 1em; }