/* ---[ master.css ]-------------------------------------------- SITE : www.centrephilou.org RÉALISATION : CAP (www.capprod.com) CONTENU : - Reset CSS - Fonts - Utils - Links - Layout - Menu - Text - Form - Blocs - Color Picker - ReMooz CODES COULEURS : - titres bleu : #249bed - titres rouge : #d71827 - texte principal : #04274b - liens : #0567cb - bread crumb : #fff FONT : - Menus, Footer, Boites autopromo... : Arial - Grands titres : FontOnAStick - Contenu uniquement : Verdana ----------------------------------------------------------------- */ /*** RESET CSS ***/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;margin:0;padding:0;} :focus {outline: 0;} ol, ul {list-style: none;} table {border-collapse: separate; border-spacing: 0;} caption, th, td {text-align: left; font-weight: normal;} hr {display:none;} /*** FONTS - relative 62.5% = 10 px ***/ html {background:#fe8a03;} body {font:68.75% arial,sans-serif; color:#04274b;} table {font-size:inherit; font:100%} select,input,button,textarea {font:99% arial,sans-serif} pre,code,kbd {font:115% monospace; word-spacing:1px; letter-spacing:1px; font-size:100%} h1,h2,h3,h4,h5,h6 {font-size:100%} /*** UTILS ***/ a.externalLink, span.externalLink {background:transparent url(../images/externalBlue.gif) center right no-repeat; padding: 2px 15px 2px 0;} a.whiteExternalLink {background:transparent url(../images/externalWhite.gif) center right no-repeat;} .clearFix {font-size:0; width:100%; height:0; clear:both;} /*** LINKS ***/ a {text-decoration:none; color:#0567cb} a:hover {text-decoration:underline} a:visited {color:#0567cb} a.chevrons {background:transparent url(../Images/chevrons.gif) center left no-repeat; padding: 2px 0 2px 11px;} .imgLink a img {border-bottom:solid 1px transparent; padding-bottom:2px;} .imgLink a:hover img{ border-bottom:solid 2px #0567cb;} /*** LAYOUT ***/ #container {width:990px; margin:0 auto; position:relative;} * #header {display:none;} * #main {width:815px;float:left; clear:left; margin:225px 0 0; position:relative;} * * #banner {width:100%; height:140px; position:absolute; top:0;} * * #menuTop {width:100%; height:65px; position:absolute; top:142px;} * * #breadcrumb {width:550px; height:25px; position:absolute; top:206px; left:255px; } * * #search {height:25px; margin:0 0 5px; position:absolute; top:206px; right:16px;} * * #center {width:560px;float:right;} * * #left {width:245px;float:left;} * * * #menuLeft {float:left; margin:30px 0 0;} * * #right {width:175px;float:right;margin:239px 0 0;} * * #footer {clear:both;width:635px; height:55px; margin:0 0 20px 228px; padding:35px 20px 0 15px; color:#fff; text-align:center; position:relative;} * * #sitemap {display:none;} /*** MENU ***/ /* Top menu */ #menuTop {background:transparent url(../images/background_menu.png) no-repeat 1px 1px;} *html #menuTop {background:transparent url(../images/ie6/background_menu.gif) no-repeat 1px 1px;} .menu_parent {cursor:default; margin:0 auto;} .menu_parentItem, .menu_parentItemHover {color:#fff; font-size:1.5em; font-weight: bold; text-align:center; cursor:pointer;} .menu_parentItemHover nobr {border-bottom:solid 1px #fff;} .menu_parentItemSelected, .menu_parentItemSelectedHover {color:#fff; font-size:1.5em; font-weight: bold; cursor:pointer; text-align:center; background: transparent url(../images/menuTop_arrow.png) no-repeat center bottom; } *html .menu_parentItemSelected, *html .menu_parentItemSelectedHover {background: transparent url(../images/ie6/menuTop_arrow.gif) no-repeat center bottom; } .menu_parentItemSelectedHover nobr {border-bottom:solid 1px #fff;} .menu_parentBreak {width:2px; background: transparent url(../images/menuTop_separator.gif) no-repeat center 13px;} /* Left menu */ .menu_level2Item, .menu_level2ItemHover { background: url(../images/menuLeft_background.png) repeat-y 2px 0; padding:0; display:block; cursor:pointer;} *html .menu_level2Item, *html .menu_level2ItemHover { background: url(../images/ie6/menuLeft_background.gif) repeat-y 0;} .menu_level2Item .text, .menu_level2ItemHover .text {font-size:1.5em; font-weight:bold; color:#fff;} .menu_level2Item .selected, .menu_level2ItemHover .selected {display:none;} .menu_level2ItemHover .text {border-bottom:solid 1px #fff;} .menu_level2Selected { background: url(../images/menuLeft_background.png) repeat-y 2px 0; display:block; cursor:pointer; position:relative;} *html .menu_level2Selected { background: url(../images/ie6/menuLeft_background.gif) repeat-y 0;} .menu_level2Selected .text {font-size:1.5em; font-weight:bold; color:#b00310; z-index:9; position:relative;} .menu_level2Selected .selected img {width:222px; position:absolute; top:0; left:10px; z-index:0;} *html .menu_level2Selected .selected img {visibility:hidden;} .menu_level2Selected .arrow { display:block; position:absolute; width:47px; height:100%; background: url(../images/menuLeft_arrow.png) no-repeat left center; z-index:11; top:-3px; right:-20px;} *html .menu_level2Selected .arrow {visibility:hidden;} .menu_level2Top { height:25px; background: url(../images/menuLeft_top.png) no-repeat 2px top;} .menu_level2Bottom { height:76px; background: url(../images/menuLeft_bottom.png) no-repeat 2px top;} /*** FORMULAIRES ***/ /* .form input[type=text] {padding: 3px; color:#04274b; font-size:1.1em;} .form textarea {padding: 3px; color:#04274b; font-size:1.1em;} .form select {padding: 0; color:#04274b; font-size:1.1em; border:solid 1px #B2B3B5;} .form select:focus {border:solid 1px #0567cb;} .form input[type=submit], .form .submit {padding: 3px 6px; color:#04274b; font-size:1.1em; font-weight:bold;} */ table.form td.label { width:110px; vertical-align:top; padding: 12px 10px 2px 0; font-weight:bold;} table.form td.input { width:250px; vertical-align:top; padding: 6px 0;} table.form td.error { padding: 2px 0 0 10px;} table.form td.error * { font-weight:bold; color:Red; font-size:11px !important;} table.form td td {padding:0; vertical-align:top;} table.form a.submit {padding:4px 15px; border:solid 1px #BBB; background-color:#fff; color:#0567cb; font-weight:bold; font-size:1.1em; display:inline;} table.form a:hover.submit {background-color:#0567cb; color:#fff; text-decoration:none;} .form input[type=text],.form input[type=password] {padding: 3px; color:#666; font-size:1.1em; border: solid 1px #ccc;} .form input[type=text]:focus, .form input[type=password]:focus, .form input[type=radio]:focus {border: solid 1px #ccc; outline: solid 1px #0072ca;} .form textarea {padding: 3px; color:#666; font-size:1.1em;border: solid 1px #ccc;} .form textarea:focus {border: solid 1px #ccc; outline:solid 1px #0072ca;} .form select {padding: 0; color:#333; font-size:1.1em; border:solid 1px #B2B3B5;} .form select:focus {border:solid 1px #0072ca;} .form input[type=submit] {padding: 3px 6px; color:#454545 !important; font-size:1.1em; font-weight:bold;} .form fieldset {background:#eee; border:solid 1px #ccc; padding:5px 10px; margin:0 0 10px;} .form .label {font-weight:bold; font-family:Arial;} a.button {padding:3px 15px; border:solid 1px #ccc; background:#249BED; color:#fff; font-weight:bold; font-size:1.1em; display:inline-block;} a.button:hover {background-color:#fff; color:#249BED; text-decoration:none;} a.button:focus {border: solid 1px #ccc; outline: solid 1px #0072ca;} .form_alert, .form_valid, .form_info {vertical-align:top; cursor:help;} .form_alert_tip, .form_valid_tip, .form_info_tip {color:#fff; padding:2px 4px; font-weight:bold; opacity:0.8; filter:alpha(opacity=80); max-width:200px;} .form_alert_tip {background:#cc0000;} .form_valid_tip {background:#cc0000;} .form_info_tip {background:#249BED;} .form .radioList {display:block; padding:0 0 10px; font-size:0.9em;} .form .panel {margin:0 0 20px 20px; background:#DEEFFE; padding:10px;} /*** BLOCS ***/ /* Banner */ #banner .logo {background:transparent url(../images/banner_fr.png) no-repeat; width:675px; height:140px;} .ENCA #banner .logo {background:transparent url(../images/banner_en.png) no-repeat right;} #banner .img24h7j {background:transparent url(../images/24-7_fr.png) no-repeat right; position:absolute; top:34px; right:123px; } .ENCA #banner .img24h7j {background:transparent url(../images/24-7_en.png) no-repeat;} #banner #language {position:absolute; top:0; right:23px; background: url(../images/language.png) no-repeat; padding:1px 0 7px; width:77px; text-align:center; } #banner a#language {color:#fff; font-weight:bold; text-decoration:none; font-size:1.25em; cursor:pointer;} #banner a#language:hover {text-decoration:underline;} #banner #colorPicker {position: absolute; top:91px; right:18px; padding:0 0 0 28px; display:none; background:transparent url(../images/changeColor_fr.png) no-repeat;} .ENCA #banner #colorPicker {background:transparent url(../images/changeColor_en.png) no-repeat;} #banner #search {position:absolute; bottom:18px; right:16px;} /* Bread Crumb */ #breadcrumb {color:#fff;} #breadcrumb a {color:#fff;} #breadcrumb a:hover {color:#fff;} #breadcrumb span {font-weight:bold;} /* Search */ table#search td {vertical-align:middle;} table#search input {border: solid 1px #04274b; margin:0 0 0 6px; padding:1px; width:107px;} table#search input.inputBlur {background:#fff url(../images/search_input_fr.gif) 3px center no-repeat;} .ENCA table#search input.inputBlur {background:#fff url(../images/search_input_en.gif) 3px center no-repeat;} table#search .search-go {margin:0 5px 0;} table#search a.button {padding:4px 15px; border:solid 1px #BBB; background-color:#fff; color:#db3b3c; font-weight:bold; font-size:1.1em; display:inline;} /* Center : SlideshowPro */ #center_slideshowpro {width:560px; position:relative; height:270px; margin:30px 0 15px; background:transparent url(../images/shadow_slideshow.png) no-repeat right bottom;} *html #center_slideshowpro {background:transparent url(../images/ie6/shadow_slideshow.gif) no-repeat right 35px;} /* Center : Content */ #center_content {width:100%;background:transparent url(../images/shadow_content.png) no-repeat right bottom; padding:0 0 15px; margin:0 0 5px; position:relative;} *html #center_content {background:transparent url(../images/ie6/shadow_content.gif) no-repeat right bottom;} #center_content .top {position:relative; width:100%; height:80px; overflow:hidden; background:transparent url(../images/content_top.png) no-repeat;} #center_content .top h2 {font-weight:bold; font-size:26px; padding:30px 18px 0;} #center_content .top h2.blueTitle {color:#249bed;} #center_content .top h2.redTitle {color:#d71827;} #center_content .top h2.sIFR-replaced,#center_content #top h2.sIFR-ignore{visibility:visible !important;padding-top:0 !important;} #center_content .top h2.sIFR-replaced div.sIFR-fixfocus{overflow:auto;letter-spacing:0;float:none;margin:0;padding:0;} #center_content .top h2 .sIFR-flash{visibility:visible !important;margin:0 0 100px;padding:0;} #center_content .top h2 .sIFR-alternate{display:block;margin:30px 0 0;} #center_content .middle {background:#fff; width:510px; padding:1px 20px 1px;min-height:360px; overflow:hidden;} #center_content .middle .formatting {margin:0 0 60px;} #center_content .middle .CMSEditableRegionEdit {width:510px !important;} #center_content .middle .CMSEditableRegionEdit iframe {width:510px;} #center_content .bottom {width:100%; height:10px; font-size:0; background:transparent url(../images/content_bottom.png) no-repeat; font-size:0; margin:0 0 0px;} #center_content .snail {width:110px; height:82px; background: transparent url(../images/snail.png) no-repeat; position:absolute; bottom:-5px; right:26px;} /* Center : Content Header */ .contentHead {font-family:Verdana,sans-serif;} .contentHead h3 { font-size:2em; font-weight:bold; margin:2px 0 20px;} .contentHead .toolBox {text-align:right; float:right;} .contentHead .toolBox a {margin:0 0 0 15px; font-size:0.95em; font-weight:bold;font-family:Arial,sans-serif;} .contentHead .toolBox a.print {background: transparent url(../Images/print.gif) no-repeat left center; padding: 0 0 0 20px;} .contentHead .toolBox a.share {background: transparent url(../Images/share.gif) no-repeat left center; padding: 0 0 0 16px;} /* Center : Content List */ ul.contentList {font-family:Verdana,sans-serif;} ul.contentList li { margin:10px 0 25px; clear:both;} ul.contentList h3 { padding:0 0 5px;font-size:1.4em; font-weight:bold;} ul.contentList p.leader { margin:0 0 3px;} ul.contentList p.leader a {font-size:1em; font-weight:bold;} ul.contentList p.teaser {line-height:150%; margin:0 0 5px;} ul.contentList .chevrons {font-size:0.9em;} ul.contentList .thumbnail img { margin:0 10px 20px 0; border:solid 1px #0567cb; float:left;} a.contentList {font-size:1.3em; font-weight:bold; clear:both; display:block;} /* Center : Page de recherche */ .center_searchPage .headSearch {margin:0 0 25px; display:block;} .center_searchPage .headSearch table td {vertical-align:middle; height:40px;} .center_searchPage .headSearch label {font-size:1.1em; padding:0 10px 0 0;} .center_searchPage .headSearch .searchInput {font-size:1.1em; padding:4px; font-weight:bold;} .center_searchPage .headSearch a.button {padding:4px 15px; border:solid 1px #BBB; background-color:#fff; color:#0567cb; font-weight:bold; font-size:1.1em; display:inline;} .center_searchPage .headSearch a:hover.button {background-color:#0567cb; color:#fff; text-decoration:none;} /* Center : Pager (tous les pagers du site) */ .center_pager {text-align:center; width:100%; clear:left; font-size:1.1em; padding:0 0 40px;} .center_pager .navigation {padding:5px 0;} .center_pager .description {margin:2px 0 0; color:#999;} .center_pager .selectedPrevNext {display:none;} .center_pager a.unselectedPrevNext {padding:3px 7px;} .center_pager a:hover.unselectedPrevNext {padding:3px 6px; border:solid 1px #BBB; background-color:#0567cb; color:#fff; text-decoration:none;} .center_pager .selectedPage {padding:3px 7px; background-color:#fff;font-weight:bold;} .center_pager a.unselectedPage {padding:3px 6px; border:solid 1px #BBB; background-color:#fff;} .center_pager a:hover.unselectedPage {padding:3px 6px; border:solid 1px #BBB; background-color:#0567cb; color:#fff; text-decoration:none;} /* Left : Localisation */ #localisation {position:relative;margin:12px 0 65px; background:transparent url(../images/shadow_left.png) no-repeat right bottom; padding:0 0 10px;} *html #localisation {background:transparent url(../images/ie6/shadow_left.gif) no-repeat right bottom;} #localisation .top {width:100%;height:27px;background:transparent url(../images/localisation_top_fr.png) no-repeat;} .ENCA #localisation .top {background:transparent url(../images/localisation_top_en.png) no-repeat;} #localisation .top h2 {display:none;} #localisation .middle {width:210px; background:#ffd800; padding:12px 10px 0; min-height:200px;} #localisation .middle p {margin: 10px 0 0; font-size:1em; font-weight:bold;} #localisation .bottom {width:100%;height:9px;background:transparent url(../images/localisation_bottom.png) no-repeat; font-size:0;} #localisation .cat {width:109px; height:76px; background: transparent url(../images/cat.png) no-repeat; position:absolute; bottom:-12px; right:4px;} *html #localisation .cat {display:none;} /* Left : Liste des nouvelles */ #newslist {position:relative;margin:12px 0 65px; background:transparent url(../images/shadow_left.png) no-repeat right bottom; padding:0 0 10px;} *html #newslist {background:transparent url(../images/ie6/shadow_left.gif) no-repeat right bottom;} #newslist .top {width:100%;height:27px;background:transparent url(../images/newsList_top_fr.png) no-repeat;} .ENCA #newslist .top {background:transparent url(../images/newsList_top_en.png) no-repeat;} #newslist .top h2 {display:none;} #newslist .middle {width:210px; background:#ffd800; padding:12px 10px 0; min-height:200px;} #newslist .middle ul {padding: 0 0 40px;} #newslist .middle li {margin: 0 0 10px;} #newslist .middle h3 {font-size:1.2em; font-weight:bold;} #newslist .bottom {width:100%;height:9px;background:transparent url(../images/localisation_bottom.png) no-repeat; font-size:0;} #newslist .cat {width:109px; height:76px; background: transparent url(../images/cat.png) no-repeat; position:absolute; bottom:-12px; right:4px;} *html #newslist .cat {display:none;} /* Left : Auto promo */ #sitePromotion {position:relative;margin:0 0 45px; background:transparent url(../images/shadow_left.png) no-repeat right bottom; padding:0 0 10px;} *html #sitePromotion {background:transparent url(../images/ie6/shadow_left.gif) no-repeat right bottom;} #sitePromotion .top {width:100%;height:9px;background:transparent url(../images/sitePromotion_top.png) no-repeat; font-size:0;} #sitePromotion .top h2 {display:none;} #sitePromotion .middle {width:210px; background:#0070ef; padding:18px 10px 0; min-height:200px} #sitePromotion .middle {color:#fff; font-weight:bold;} #sitePromotion .middle h3, #sitePromotion .middle h4 {font-size:1.5em; padding:0 0 10px;} #sitePromotion .middle p {font-size:1.1em; padding:0 0 10px;} #sitePromotion .middle a {color:#fff; text-decoration:underline;} #sitePromotion .middle a:hover {color:#fff; text-decoration:none;} /*#sitePromotion .bottom {width:100%;height:82px;background:transparent url(../images/sitePromotion_bottom2.png) no-repeat; font-size:0; position:absolute; bottom:-42px;}*/ #sitePromotion .bottom {width:100%;height:9px;background:transparent url(../images/sitePromotion_bottom.png) no-repeat; font-size:0;} #sitePromotion .fish {width:81px; height:75px; background: transparent url(../images/fish.png) no-repeat; position:absolute; bottom:-42px; right:6px;} *html #sitePromotion .fish {display:none;} /* Right : links */ #right_menu {margin:0 10px; cursor:default;} #right_menu li {margin:0; padding:1px 0 2px;} #right_menu li a {cursor:pointer;} #right_menu li a strong {display:none;} #right_menu li a .hover {width:153px; height:117px; display:block; background:no-repeat right top;} #right_menu li .shadow {background:url(../images/shadow_button.png) no-repeat; width:149px; height:94px; position:absolute; z-index:-1; margin:34px 0 0 8px;} /* Help Us */ .fr #right_menu li.helpUs {background:url(../images/button_fr_helpUs.png) no-repeat;} .en #right_menu li.helpUs {background:url(../images/button_en_helpUs.png) no-repeat;} #right_menu li.helpUs a:hover .hover {background-image:url(../images/button_fr_helpUsHover.png);} /* Contact US */ .fr #right_menu li.contactUs {background:url(../images/button_fr_contact.png) no-repeat;} .en #right_menu li.contactUs {background:url(../images/button_en_contact.png) no-repeat;} #right_menu li.contactUs a:hover .hover {background-image:url(../images/button_fr_contactHover.png);} /* Parent Place */ .fr #right_menu li.parentPlace {background:url(../images/button_fr_parentPlace.png) no-repeat;} .en #right_menu li.parentPlace {background:url(../images/button_en_parentPlace.png) no-repeat;} #right_menu li.parentPlace a:hover .hover {background-image:url(../images/button_fr_parentPlaceHover.png);} /* Philou In The Press */ .fr #right_menu li.philouInPress {background:url(../images/button_fr_philouInPress.png) no-repeat;} .en #right_menu li.philouInPress {background:url(../images/button_en_philouInPress.png) no-repeat;} #right_menu li.philouInPress a:hover .hover {background-image:url(../images/button_fr_philouInPressHover.png);} /* Media Kit */ .fr #right_menu li.mediaKit {background:url(../images/button_fr_mediaKit.png) no-repeat;} .en #right_menu li.mediaKit {background:url(../images/button_en_mediaKit.png) no-repeat;} #right_menu li.mediaKit a:hover .hover {background-image:url(../images/button_fr_mediaKitHover.png);} /* IE6Fix */ *html #right_menu li .hover {background:none !important;} /* Footer */ #footer .background {background:transparent url(../images/background_footer.png) no-repeat; width:585px; height:85px; position:absolute; top:0; left:0; z-index:-1;} #footer p {width:400px; margin:0 auto;} #footer a {color:#fff; text-decoration:underline;} #footer a:hover {color:#fff; text-decoration:none;} /*** COLOR PICKER ***/ #changeColor{font-size:11px;color:#000;} #changeColor .colorPicker_box{width:148px;height:130px;border:1px solid #636163;background-color:#fafafa;overflow:hidden;} #changeColor .colorPicker_overlayBox{width:100px;height:100px;margin-top:3px;margin-left:3px;border:1px solid #000;} #changeColor .colorPicker_slider{border:1px solid #000;margin-top:3px;margin-left:106px;width:15px;height:100px;} #changeColor .colorPicker_colorBox{visibility:hidden;border:1px solid #000;width:59px;height:68px;margin-top:20px;margin-left:315px;} #changeColor .colorPicker_currentColor{visibility:hidden;margin-top:55px;margin-left:316px;width:59px;height:34px;} #changeColor .colorPicker_okButton{font-family:Tahoma;font-weight:bold;font-size:8px;margin-top:110px;margin-left:113px;background:#064A95;color:#fff;height:15px;border:1px solid #064A95;} #changeColor #colorPicker_resetButton{font-family:Tahoma;font-weight:bold;font-size:8px;margin-top:110px;margin-left:4px;background:#FE8A03;color:#fff;height:15px;border:1px solid #FE8A03;} /*