/* -------------------------------------------------------------- * screen.css - monsite.com * @type: Screen * @langue: Commun * @year: 2008 * @author: CyberGénération * @note: background; float; display; z-index; position(TRBL); width; height; margin:(TRBL); padding:(TRBL); border:(TRBL); others; --------------------------------------------------------------- */ /* Default setting. --------------------------------------------------------------- */ body { font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 11px; color: #fff; background: #aacc96 url(img/bg_tile.jpg) center top repeat-y; } #container1 { position:relative; width:100%; background: url(img/bg_body.jpg) center bottom no-repeat; min-width:972px; } #container2 { position:relative; width:100%; background: url(img/bg_pageContent.jpg) center top no-repeat; min-width:972px; } #pageContainer { position:relative; width:974px; margin:0 auto;} #container2>/**/#pageContainer {width:972px; min-width:972px;} a { color:#5d1c1d; text-decoration:none; font-weight:bold; } a:hover { color:#888; text-decoration:underline; } h4, h5, body #pageContent .title { font-family: "Lucida Sans Unicode", Arial, Helvetica, sans-serif; color:#5d1c1d; font-size:1.2em; font-weight:normal; line-height:normal} h5 {margin:15px 0;} h3.sIFR_bookantiqua { background:url(img/bg_pageTitle.gif) bottom no-repeat; padding-left:5px; font-family: Georgia, "Times New Roman", Times, serif; color:#1D3938; font-size:24px; font-weight:normal; padding-bottom:33px; margin-top:5px} /* globalClass. --------------------------------------------------------------- */ body div#pageContainer .hide { position:absolute; top:0; left:0; overflow: hidden; height: 1%; width: 0; } body div#pageContainer .right { float:right; } body div#pageContainer .left { float:left; } body div#pageContainer .clear { clear:both; } body div#pageContainer .none { display:none; } body div#pageContainer .first { margin-left:0; padding-left:0; } body div#pageContainer .last { margin-right:0; padding-right:0; } body div#pageContainer .top { margin-top:0; padding-top:0; } body div#pageContainer .bottom { margin-bottom:0; padding-bottom:0; } body div#pageContainer .bold { font-weight:bold } body div#pageContainer .italic { font-style:italic } body div#pageContainer .normal { font-style:normal } body div#pageContainer .important { font-size:1.2em;} body div#pageContainer .small { font-size:10px; } body div#pageContainer .dotBorder { border-bottom:#ccc 1px dotted; padding-bottom:15px; margin-bottom:15px;} body div#pageContainer .noBorder { border:none } body div#pageContainer .lienDroite { display:block; float:right; background:url(img/listBullets/doubleArrowBullet_blue_8px.gif) no-repeat; background-position: 0 7px; padding:0 0 0 18px; } body div#pageContainer .lienDroite a.more { display:inline-block; color:#999999; background:url(img/icons/readMore.gif) no-repeat; background-position: right 0; height:auto !important; height:16px; min-height:16px; padding:0 32px 0 0; font-size:10px; line-height:18px} body div#pageContainer a.back {color:#5d1c1d; text-transform:uppercase; list-style-type: none; background:url(img/listBullets/doubleArrowBullet_rouge_8px.gif) no-repeat; background-position: 0 4px; padding:0 0 0 18px;} body div#pageContainer .lienFleche {list-style-type: none; background:url(img/listBullets/doubleArrowBullet_blue_8px.gif) no-repeat; background-position: 0 4px; padding:0 0 0 18px; } body div#pageContainer a.redArrowsBullet {color:#5d1c1d;} /* Success, notice and error boxes -------------------------------------------------------------- */ .error, .notice, .success { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; } .error { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; } .notice { background: #FFF6BF; color: #514721; border-color: #FFD324; } .success { background: #E6EFC2; color: #264409; border-color: #C6D880; } .error a { color: #8a1f11; } .notice a { color: #514721; } .success a { color: #264409; } /* customClass for list tag -------------------------------------------------------------- */ .noBullet li, ul li.noBullet { list-style-type: none; background: none; padding-left:0;} .dotBullet li { list-style-type: none; background:url(img/listBullets/dotBullet_bw_4px.gif) no-repeat; background-position: 0 center; padding:0 0 0 15px;} .plusBullet li { list-style-type: none; background:url(img/listBullets/plusBullet_bw1_9px.gif) no-repeat; background-position: 0 center; padding:0 0 0 15px; } .arrowsBullet li { list-style-type: none; background:url(img/listBullets/arrowsBullet_bw_11px.gif) no-repeat; background-position: 0 center; padding:0 0 0 22px; } .doubleArrowsBullet li { list-style-type: none; background:url(img/listBullets/doubleArrowBullet_blue_8px.gif) no-repeat; background-position: 0 5px; padding:0 0 0 18px; } .redArrowsBullet {list-style-type: none; background:url(img/listBullets/doubleArrowBullet_rouge_8px.gif) no-repeat; background-position: 0 4px; padding:0 0 0 18px;} a.doubleArrowsBullet {list-style-type: none; background:url(img/listBullets/doubleArrowBullet_blue_8px.gif) no-repeat; background-position: 0 5px; padding:0 0 0 18px;} ol li {margin-left:20px; } /* customClass for list tag -------------------------------------------------------------- */ .dotLink { background:url(img/listBullets/dotBullet_bw_4px.gif) no-repeat; background-position: 0 center; padding:0 0 0 15px;} .plusLink { background:url(img/listBullets/plusBullet_bw2_9px.gif) no-repeat; background-position: 0 center; padding:0 0 0 15px; } .arrowLink { background:url(img/listBullets/arrowBullet_blue_9px.gif) no-repeat; background-position: 0 center; padding:0 0 0 10px; } body div#pageContainer a.pdf { display:inline-block; color:#999999; background:url(img/icons/pdf.gif) no-repeat; background-position: right 0; height:auto !important; height:16px; min-height:16px; padding:0 32px 0 0; font-size:10px; line-height:18px} a.rss {background-image: url(/css/commun/img/icons/feed.png);padding:2px 22px 2px 0;margin:-2px 0 0;background-repeat: no-repeat;background-position: right center;} a.rss span {display:none;} .icons a { display:block; height:21px; padding:0; background-repeat: no-repeat; background-position: right top; } .icons a:hover {background-position: right -21px;} .icons a span {display:none;} .icons a.audio { background-image: url(img/icons/audio.gif); width:63px; } .icons a.video { background-image: url(img/icons/video.gif); width:62px; } .icons a.diapo { background-image: url(img/icons/diapo.gif); width:88px; } .icons a.pdfbtn { background-image: url(img/icons/btn_pdf.gif); width:46px; } .url a { list-style-type: none; background:url(img/listBullets/doubleArrowBullet_rouge_8px.gif) no-repeat; background-position: 0 4px; padding:0 0 0 18px;} /* fontResize control --------------------------------------------------------------- */ .size1 { font-size: 14px; } .size2 { font-size: 16px; } /* pageNavigator --------------------------------------------------------------- */ .pageNavigator { height:22px; z-index:5; font-size:12px; margin:10px 0; display:block; clear:both;} .pageNavigator div { float:right; right:30px; } .pageNavigator div span, .pageNavigator div a { float:left; font-size:11px; padding:3px; display:block; color:#000; font-weight:normal; } .pageNavigator div a:hover { color:#5d1c1d; } .pageNavigator div a.selected { font-size:16px; color:#5d1c1d; font-weight:bold; } /* pageHeader --------------------------------------------------------------- */ /* If the menu is below the pageHeader add 'margin-bottom' equal to the menuTop 'height' for clearing space */ #pageHeader { height:200px; padding-bottom:41px; } #pageHeader h1 a { background: url(img/logo_pageHeader.gif) no-repeat; height:96px; width:234px; position:absolute; top:62px; left:5px; } #pageHeader h2 { background: url(img/tagline.gif) no-repeat; position:absolute; top:136px; right:214px; overflow:hidden; width:344px; height:35px; } /* pageMenu --------------------------------------------------------------- */ /* quickMenu --------------------------------------------------------------- */ #quickMenu { position:absolute; top:10px; right:5px; } #quickMenu li { display: inline; padding:0 6px 0 10px; border-left:1px solid #997171; } #quickMenu a { font-weight:normal; font-size:10px; color:#997171; } /* pageUtils --------------------------------------------------------------- */ #pageUtils { position:absolute; top:241px; right:5px; width:271px;} #pageUtils a span { display:none;} #pageUtils #btn_share, #pageUtils #btn_fontResize, #pageUtils #btn_print {display:block; height:43px; float:left;} #pageUtils a {background-position:0 0;} #pageUtils a:hover {background-position:0 -43px;} /* mainMenu --------------------------------------------------------------- */ #mainMenu { position:absolute; top:200px; left:6px; width:100%;} #mainMenu ul { width:100%; display:block; height:41px; } #mainMenu li { float:left; position:relative; text-align:center } #mainMenu a { display:block; padding:0; height:41px; } #mainMenu a span {display:none;} #mainMenu a.selected, #mainMenu a.selected:active, #mainMenu a:hover { background-position:0 -82px; } #mainMenu a:active { background-position:0 -41px; } /* leftlinkList --------------------------------------------------------------- */ #leftlinkList {display:block; position:relative; width:300px; height:auto !important; height:200px; min-height:200px; padding:8px 0 20px 0; background:url(img/bg_subMenu.jpg) bottom no-repeat;} #leftlinkList ul {margin:0; padding:8px 8px 0 8px; background:url(img/bg_subMenu_title.png) 4px top no-repeat;} #leftlinkList h4 {margin:37px 0 0 18px; font-family: Georgia, "Times New Roman", Times, serif; color:#1D3938; font-size:20px; font-weight:normal; padding-bottom:3px } /* normal */ #leftlinkList li {display:block; width:282px; background:url(img/bg_subMenu_a_dots.gif) 28px bottom no-repeat;} #leftlinkList li a {display:block; font-weight:bold; text-decoration:none; color:#1d3938; width:270px; padding:6px 0 6px 12px;} #leftlinkList li a span {display:block; padding-left:17px;} /* selected */ #leftlinkList li.selected {background: url(img/bg_subMenu_a_top.png) top no-repeat; margin-top:-1px; padding-top:5px;} #leftlinkList li.selected a {background: url(img/bg_subMenu_a_bottom.png) bottom left no-repeat; padding-top:1px;} #leftlinkList li.selected a span {background: url(img/listBullets/doubleArrowBullet_rouge_8px.gif) 0 5px no-repeat; } /* hover */ #leftlinkList li a:hover, #leftlinkList li.selected a {color:#6b3030; text-decoration:none;} /* quickSearch --------------------------------------------------------------- */ #quickSearch { position:absolute; top:10px; right:25px; width:172px; height:19px; background:url(img/bg_quickSearch.gif) no-repeat; padding:1px 0 1px 4px;} #quickSearch fieldset { border:none; margin:0; padding:0 } #quickSearch .holder .field { float:left; width:143px; background:#f7f5ef; border:#f7f5ef solid 1px; color:#adaba7; font-size:11px;} #quickSearch_btn { background:url(img/btn_quickSearch.gif) no-repeat; width:13px; height:13px; margin:3px 3px 0 3px; border:none; cursor:pointer; } /* pageContent --------------------------------------------------------------- */ /* overflow:hidden pour forcé le wrappin dans FF - overflown:visible pour forcé le wrappin avec IE6 */ #pageContent { overflow:hidden !important; overflow:visible; color:#333;} #pageContent a { color:#5d1c1d} #pageContent a:hover { color:#888; text-decoration:underline } #pageColumn1 { width:301px; padding:0 7px 30px 7px; float:left; position:relative; } #pageColumn2 { width:650px; margin:30px 0 0 0; float:left; height:auto !important; height:755px; min-height:755px;} #pageColumn1 .courbe { background: url(img/guigui.gif) no-repeat; display:block; width:300px; height:36px; position:absolute; top:0; left:1px; z-index:10;} #pageColumn1>/**/.courbe {left:0px;} .contentHolder { padding:10px 10px 0 20px;} .separator { border-bottom:1px dotted #c8c9c8; padding-bottom:25px; margin-bottom:10px;} .bdTop { border-top:1px dotted #c8c9c8; padding:15px 0; display:block; clear:both;} /* pageFooter --------------------------------------------------------------- */ #pageFooter { display:block; clear:both; background:url(img/bg_footer.jpg) center bottom no-repeat; display:block; width:912px; height:52px; color:#333; font-weight:bold; padding:40px 30px 0;} #pageFooter a { color:#333; font-weight:normal; text-decoration:none;} #signatureCyber { text-align:right; padding:4px 0 0 0; margin:8px 0 0 0; border-top:1px dotted #c5c5c5;} /*//////// CONTENUS COLONNES ////////////////////////////////// */ /*------------------------------------------------------------- */ /* Répertoire: formulaire de recherche ------------------------------------------------------------- */ #repertoire {display:block; position:relative; width:260px; height:auto !important; height:242px; min-height:242px; padding:18px 20px 20px; background:url(img/bg_repertoire_general.jpg) bottom no-repeat; margin-top:10px;} #repertoire h3 {margin:0 0 8px 0;} #repertoire label {color:#855b38; display:block; clear:both; margin: 3px 0 3px 12px;} #repertoire .row {display:block; clear:both; margin:0 0 0 12px; color:#435b56; font-weight:bold; } #repertoire .radio {vertical-align:middle;} #repertoire #keyword {position:absolute; left:26px; bottom:60px; border:1px solid #f7f5ef; background:#f7f5ef; font-size:14px; color:#7a7976; width:180px;} #repertoire #btn_trouver {position:absolute; left:20px; bottom:15px; border:0; display:block; width:259px; height:31px; cursor:pointer;} /* PAGE D'ACCUEIL */ #pageAccueil #repertoire {height:auto !important; height:266px; min-height:266px; padding:8px 20px 20px; background:url(img/bg_repertoire.jpg) bottom no-repeat; margin-top:0;} #pageAccueil #repertoire h3 {margin:35px 0 0 0 !important; margin:42px 0 0 0;} /* Temoignages ------------------------------------------------------------- */ #temoignages {display:block; position:relative; width:300px; background:url(img/bg_temoignages_bottom.jpg) bottom left no-repeat; margin:10px 0 0 0; height:auto !important; height:183px; min-height:183px;} #temoignages h3 {display:block; position:absolute; width:300px; height:10px; background:url(img/bg_temoignages_top.gif) no-repeat;} #temoignages img {position:absolute; left:0; bottom:0 !important; bottom:-1px;} #temoignages p {display:block; width:160px; position:relative; left:110px; top:20px; font-weight:bold; color:#0a2b2c;} #temoignages span {display:block; width:280px; color:#0a2b2c; text-align:right; padding:10px 20px 0 0;} /* CTA ------------------------------------------------------------- */ #pageColumn1 a.pub {position:relative; top:10px;} /*//////// CONTENUS SECTIONS ////////////////////////////////// */ /*------------------------------------------------------------- */ /* Page d'accueil / nouvelles ------------------------------------------------------------- */ #nouvelles { position:relative; } #nouvelles .nouvelle { display:block; clear:both; border-bottom:1px dotted #c8c9c8; padding:0 0 25px 0; margin:0 0 10px 0;} #nouvelles .nouvelle h4 { margin:0; padding:0;} #nouvelles .nouvelle h4 a { color:#5d1c1d; font-weight:normal; text-decoration:none; } #nouvelles .nouvelle .date { color:#5d1c1d; margin:0 0 15px 0; padding:0; font-size:10px;} #nouvelles .rss { position:absolute; right:18px; top:19px; width:20px; height:20px;} /* Page de détails d'une nouvelle ------------------------------------------------------------- */ #nouvelle_detail .titre { border-bottom:1px dotted #cbd0ce; padding-bottom:6px;} #nouvelle_detail .left { float:left; width:270px; } #nouvelle_detail .right { float:left; width:340px; } #nouvelle_detail .icons { display:block; width:100%; clear:both; margin:10px 0; background:url(img/bg_icons.jpg) top right no-repeat; height:30px; padding:4px 0 0;} #nouvelle_detail .icons li { list-style-type:none;display:inline} #nouvelle_detail .icons a { display:block; float:right; margin-right:5px; padding:0;} #nouvelle_detail .url {padding:10px 0;} #nouvelle_detail .url a {float:right;} /* Page equipe ------------------------------------------------------------- */ #equipe { position:relative; } #equipe .membre { display:block; clear:both; position:relative; border-bottom:1px dotted #c8c9c8; padding:0 0 25px 0; margin:0 0 10px 0; height:auto !important; height:170px; min-height:170px;} #equipe .membre .infos { width:445px; position:relative; left:180px;} #equipe .membre .img_holder { position:absolute; float:none; background: url(img/templates/img_bg_topx170.gif) 0 0 no-repeat; width:170px;} #equipe .membre .img_holder span { background: url(img/templates/img_bg_bottomx170.png) left bottom no-repeat; } #equipe .membre .nom { color:#5d1c1d; font-weight:bold; font-size:1.1em; margin-bottom:0;} #equipe .membre .titre { color:#5d1c1d; font-size:1.1em; margin-bottom:0;} #equipe .membre .courriel { color:#5d1c1d; font-weight:normal; text-decoration:underline; margin-bottom:10px;} #equipe .membre .details { margin:10px 0;} /* Styles génériques contenu central ------------------------------------------------------------- */ .img_holder { float:none; margin:0 10px 5px 0; background: url(img/templates/img_bg_top.gif) 0 0 no-repeat; padding-top:6px; width:266px;} .img_holder span { display: block; background: url(img/templates/img_bg_bottom.png) left bottom no-repeat; text-align: center; padding-bottom:10px;} * html .img_holder span {padding-bottom:13px;} .standard .img_holder {position:relative; float:left; } #bulletin {margin-top:10px;} .caption { font-style:italic; text-align:center; padding: 0;} .listingNews { margin:-20px 0 20px 0;} .listingNews li { display:block; clear:both; list-style-type:none; border-top:1px dotted #c8c9c8; padding-top:25px; margin-top:10px;} .listingNews li.noBorder {border-top:0;} .listingNews .date { color:#5d1c1d; margin:0 0 15px 0; padding:0; font-size:10px;} .projets h4 { color:#183738; padding-bottom:5px;border-bottom:1px dotted #c8c9c8;} .projets .listingNews { margin-left:20px;} .projets #pageContent .listingNews .title { font-size:13px; font-weight:bold; } /* Forms ------------------------------------------------------------- */ .form { background:url(img/bg_fieldset_top.gif) top left no-repeat; padding-top:6px;} .form .fieldset { background:url(img/bg_fieldset_bottom.gif) bottom left no-repeat; padding:8px 20px 10px;} .form .select { width:249px;height:25px; margin:2px 0 0 2px; padding:1px; border:1px solid #ccc;} .form .select option { height:20px; } .fieldset { border:0; padding:0; margin:0; position:relative;} .fieldset .legend { color:#5d1c1d; font-weight:bold; font-size:16px; margin:0; } .fieldset label { width:100px; display:block; clear:left; margin:9px 0 0 0; color:#7f8282;} .form .row { display:block; clear:both; padding:8px 0;} .form .col { width:48%; float:left; position:relative} .textarea, .input input { border:1px solid #fff; background:#fff; color:#7f8282;} .textarea { display:block; padding:1px 25px 3px 6px;} .input { width:249px; height:27px; background:url(img/bg_input.gif) no-repeat; } .input input { margin:2px 0 0 2px; height:18px; width:230px; padding:3px 0 0 3px;} .submit { background: url(img/bg_btn.gif) no-repeat; display:block; padding:2px 6px 3px 8px; margin:0; border:0; width:169px; text-align:center; height:27px; font-weight:bold; font-size:11px; cursor:pointer; } .submit span { display:none;} .send { background: url(img/bg_btn-send.jpg) no-repeat; display:block; padding:2px 6px 3px 8px; margin:0; border:0; width:169px; text-align:center; height:27px; font-weight:bold; font-size:11px; cursor:pointer; } .send span { display:none;} p.nbDocs { margin:0; color:#5d1c1d;} /* Page bibliotheque ------------------------------------------------------------- */ #bibliotheque_form { margin-bottom:20px;} #bibliotheque_form.form .fieldset { padding-bottom:40px; height:170px;} #bibliotheque_form .submit { position:relative; left:80px; top:24px;} /* Page statistiques ------------------------------------------------------------- */ #stats_form { margin-bottom:20px; } #stats_form .submit { position:relative; left:80px; top:24px;} #stats_form p.lienFleche { display:block; clear:both; margin:0 0;} /* Page envoyer a un ami ------------------------------------------------------------- */ #sendtofriend .fieldset { margin:20px 0;} #sendtofriend label, #sendtofriend input { width:200px;} #sendtofriend .submit { float:right; margin:20px 0;} #submitnewsletter { position:relative; left:358px;} #diapo-player, #audio-player, #video-player { background:#000; } #diapo-player #container { padding: 10px 39px 0;} #audio-player #container, #video-player #container { padding: 10px 25px 0; } #audio-player #container .text, #video-player #container .text { padding: 5px 0; } #diapo-player #princ { height: 366px; width: 620px; text-align: center; margin: 0 auto;} #diapo-player .nav { border-bottom: 1px solid #fff; padding-top: 50px; padding-bottom: 5px; } #diapo-player .credit { padding-right: 150px;} #diapo-player h4, #video-player h4, #audio-player h4 {color:#c4c4c4;} #diapo-player .photo {color:#fff; border-bottom: 1px solid #fff;}