/******************** Globals */ * { margin: 0; padding: 0; } A IMG { border: none; } BODY { background: white; font-family: Arial, sans;} UL { padding-left: 1em; } /********************* Layout */ #container { position: relative; width: 800px; margin: 0 auto; border-left: 1px solid silver; border-right: 1px solid silver; } #header { width: 800px; height: 148px; background: url(/media/img/header/header-bg.png); position: relative; } #body { position: relative; top: -20px; width: 800px; margin: 0 auto; } #sidebar { position: absolute; top: 20px; right: 0; width: 240px; z-index: 5; } #lower-sidebar { margin-top: 70px; } #banner { width: 560px; position: relative; z-index: 1;} #content { width: 560px; } #content-footer { width: 560px; background: url(/media/img/body/content-footer-bg.png); width: 560px; height: 152px; } /******************** Header */ /* link buttons */ #header .home-link { position: absolute; top: 0; left: 0; display: block; width: 220px; height: 148px; -moz-outline: none; } #header #header-outplacement { position: absolute; top: 4px; left: 210px; width: 90px; height: 20px; } #header #header-formations { position: absolute; top: 26px; left: 219px; width: 90px; height: 20px; } #header #header-coaching { position: absolute; top: 62px; left: 228px; width: 90px; height: 20px; } #header #header-bilan { position: absolute; top: 83px; left: 228px; width: 132px; height: 20px; } #header .blog-link { width: 128px; display: block; line-height: 20px; font-size: 10px; color: grey; text-align: right; } #header .contact-link { position: absolute; top: 30px; left: 599px; display: block; width: 160px; height: 28px; background: url(/media/img/header/contact-button.png) no-repeat; moz-outline: none; } /* #header .contact-link:hover { background: url(/media/img/header/contact-button-active.png); } */ #header .contact-link { background: url(/media/img/header/contact-button-active.png); } /* search form */ #search-form { position:absolute; left: 600px; top:60px; width:160px; text-align:left; padding: 0; margin: 0; height: 30px;} #search-form INPUT { display: block; width: 122px; height: 22px; font-size: 14px; line-height: 14px; text-transform: uppercase; vertical-align: middle; color: #fea829; font-weight: bold; margin: 0; padding: 5px 2px 0 5px; border: none; background: url(/media/img/header/search-input.png) no-repeat 100% 0; } #search-form BUTTON { display: block; width:20px; height:20px; float: right; background: white url(/media/img/header/search-button.png) no-repeat; border:0; margin: 2px 0 0px 0px; cursor:pointer; position: relative; left: -5px; vertical-align: middle;} #search-form BUTTON:hover { background: white url(/media/img/header/search-button-active.png); } #search-form #search-suggestions { display: none; z-index: 11; position: absolute; left: 0; top: 22px; background: white; padding: 10px; border: solid 1px silver; margin-top: 5px; font-size: 80%; } #search-form.show-suggestions #search-suggestions { display: block; } #search-form #search-suggestions { } #search-form #search-suggestions P { margin: 0; padding: 0; } #search-form #search-suggestions UL { margin: 0; padding: 0; } #search-form #search-suggestions UL LI { display: block; clear: both; padding: 0; } #search-form #search-suggestions UL LI A { margin: 0; padding: 0;} /******************** Sidebar */ /* menu */ #menu { background: white; margin-top: 10px; padding-left: 5px;} #menu UL { list-style: none; padding-left: 0;} #menu UL LI { display: block; height: 38px; width: 200px; overflow: hidden; } #menu UL LI A { display: block; height: 38px; width: 200px; background: url(/media/img/menu/menu-bullet-bg.png); text-decoration: none; color: #222; font-size: 16px; line-height: 38px; padding-left: 32px; font-weight: bold; color: #444; } #menu UL LI.selected A, #menu UL LI.selected A:hover { background: url(/media/img/menu/menu-active-bullet-bg.png); } #menu UL LI A:hover { background: url(/media/img/menu/menu-hover-bullet-bg.png); color: #000; } /* submenu */ #submenu { background-image: url(/media/img/sidebar/submenu-top.png); padding-top: 30px; margin-bottom: 20px; } #submenu UL { list-style: none; padding-left: 45px; padding-bottom: 30px; background-image: url(/media/img/sidebar/submenu-bottom.png); background-position: 0 100%; background-repeat: no-repeat;} #submenu UL LI A { color: #27BEF9; color: #ccc; text-transform: uppercase; background-image: url(/media/img/bullet-24.png); background-repeat: no-repeat; padding-left: 35px; display: block; height: 24px; margin-bottom: 6px; font-size: 14px; font-weight: bolder; line-height: 24px; vertical-align: middle; text-decoration: none; -moz-outline: none; } #submenu UL LI.selected A, #submenu UL LI A:hover { color: #aac; } #submenu UL LI.selected A { color: #27BEF9; } /* info box */ #sidebar .infobox { background-image: url(/media/img/sidebar/infobox-top.png); padding-top: 15px; margin-top: 90px; position: relative; color: white; color: #444; } #sidebar .infobox A { color: white; font-weight: normal; } #sidebar .infobox A:hover { color: #eee; } #sidebar .infobox INPUT { border: 1px solid #eee; } #sidebar .infobox P { font-size: 90%; margin-left: 50px; margin-right: 15px; text-align: left; padding-bottom: 0.5em; } #sidebar .infobox H2 { margin-left: 40px; color: #bbbab6; position: absolute; top: -17px; line-height: 20px; font-size: 20px; text-transform: uppercase; } #sidebar .infobox-bottom { margin-left: 0; background-image: url(/media/img/sidebar/infobox-bottom.png); height: 12px; background-repeat: no-repeat; margin-bottom: 40px; } /* free services buttons */ #free-services A { color: white; color: red; display: block; width: 240px; -moz-outline: none; } #free-services A SPAN { display: none; } /* hide text */ #free-services A.online-test { height: 40px; background-image: url(/media/img/sidebar/online-test.png); } #free-services A.online-test:hover { background-image: url(/media/img/sidebar/online-test-active.png); } #free-services A.online-form { height: 81px; background-image: url(/media/img/sidebar/online-form.png) } #free-services A.online-form:hover { background-image: url(/media/img/sidebar/online-form-active.png) } #sidebar #prestations-menu-box { background: url(/media/img/sidebar/prestations-menu-body.png) repeat-y; } #sidebar #prestations-menu P, #sidebar #prestations-menu H2, #sidebar #prestations-menu H3 { margin-left: 40px; font-size: 9pt; } #sidebar #prestations-menu H2 { margin-top: 1em; } #sidebar #prestations-menu H2, #sidebar #prestations-menu H2 A { text-transform: uppercase; color: #fe930f; text-decoration: none; } #sidebar #prestations-menu H2 A:hover { color: #ffbf70;} #sidebar #prestations-menu P A { text-transform: uppercase; color: #898886; text-decoration: none; } #sidebar #prestations-menu P A:hover { color: #c0bebb; } /* photo gallery */ #sidebar #photo-gallery .photo { display: block; width: 240px; text-align: center; margin-top: 30px; -moz-outline: none; } #sidebar #photo-gallery .photo { position: relative; } #sidebar #photo-gallery .photo BUTTON { display: block; width: 40px; height: 40px; position: absolute; top: 0; right:60px; border: none; background: url(/media/img/icons/plus.gif) no-repeat;} #sidebar #photo-gallery .photo:hover BUTTON { background: url(/media/img/icons/plus-active.gif); } #sidebar #photo-gallery .photo.active BUTTON { background: url(/media/img/icons/minus.gif); } #sidebar #photo-gallery .photo.active:hover BUTTON { background: url(/media/img/icons/minus-active.gif); } /* maps */ .sidemap { } .sidemap A.title { display: block; text-transform: uppercase; color: grey !important; font-size: 10px; font-weight: bold; text-decoration: none; padding-left: 20px;} .sidemap A.title:hover { color: silver; text-decoration: underline; } /******************** Content ***/ /* banner */ BODY.page-abc-comptences #banner { background-image: url(/media/img/head/accueil.png); height: 249px; } BODY.page-notre-catalogue #banner { background-image: url(/media/img/head/catalogue.png); height: 249px; } BODY.page-notre-equipe #banner, BODY.page-nos-consultants #banner { background-image: url(/media/img/head/consultant.png); height: 429px; } BODY.page-historique #banner { background-image: url(/media/img/head/historique.png); height: 249px; } BODY.page-nos-bureaux #banner { background-image: url(/media/img/header/nos-sites.png); height: 247px; } BODY.page-references #banner { background-image: url(/media/img/head/references.png); height: 249px; } BODY.category-prestations-junior #banner { background-image: url(/media/img/head/junior.png); height: 249px; } /* text styles */ #content { color: #4f5e75; font-size: 10pt; } #content .content-relative{ position:relative; } #content A { color: #27BEF9; text-decoration: none; } #content A:hover { text-decoration: underline; } #content .actions-column A { color: #444; } #content P { text-align: justify; margin-left: 50px; margin-right: 30px; margin-bottom: 1em; } /* #content P strong { color: #0b80b6; color: #0072b8; font-size: 110%; font-style: normal; } */ #content P strong { color: #0b80b6; color: #444; color: #4F5E75; font-style: normal; } #content P A { /*color: #27BEF9; font-size: 110%; */ font-weight: bold; font-style: normal; } #content UL { margin-left: 50px; } #content TABLE { margin-left: 50px; margin-bottom: 1em; margin-right: 30px; } /* fallback for dtr */ #content H1 { margin-left: 30px; color: #27BEF9; font-weight: normal; text-align: center; margin-bottom: 1em; text-transform: uppercase; font-size: 115%; } /* other titles */ #content H2 { padding-left: 30px; margin-bottom: 0.5em; background: url(/media/img/content/content-h2-bg.png) no-repeat; font-size: 18px; padding-top: 10px; } #content H2, #content H2 A { color: #ffaf5d; } #content H3 { margin-left: 50px; color: #0968A8; text-transform: uppercase; font-weight: normal; font-size: 100%; margin-bottom:5px; margin-top:10px;} #content H4 { margin-left:50px; color: #5480BA; text-decoration: underline; font-weight: normal;} #content H5 { margin-left: 50px; color: grey; } /* exceptions */ BODY.page-institutions #content H3 { background: none; padding-left: 30px; margin-bottom: 0.5em; font-size: 18px; padding-top: 10px; margin-left: 0; color: #ffaf5d; } BODY.page-accueil #main-content UL, BODY.page-accueil #main-content H4, BODY.page-accueil #main-content H5, BODY.page-accueil #content P { margin-left: 80px; } BODY.page-accueil #content P A { font-size: 14pt; color: #0072b8; } BODY.page-accueil #content P STRONG U A { font-size: 10pt; color: #0072b8; } BODY.page-accueil #content P A STRONG U { font-size: 10pt; color: #0072b8; } BODY.page-accueil #content A.home-en_savoir_plus_sur { display: block; width: 316px; height: 47px; background: url(/media/img/content/en_savoir_plus_sur.png)} BODY.page-accueil #content A.home-en_savoir_plus_sur:hover { background: url(/media/img/content/en_savoir_plus_sur-active.png)} BODY.page-accueil #content A.home-nos_autres_formations { display: block; width: 248px; height: 56px; background: url(/media/img/content/nos_autres_formations.png); margin-left: 18px; position: absolute; top: -6px; right: 0px;} BODY.page-accueil #content A.home-nos_autres_formations:hover { background: url(/media/img/content/nos_autres_formations-active.png);} BODY.page-accueil #content A.home-junior { display: block; width: 270px; height: 64px; background: url(/media/img/content/prestations-junior.png); position:absolute; top:90px; right:-22px; } BODY.page-accueil #content A.home-junior:hover { background: url(/media/img/content/prestations-junior-active.png);} BODY.page-accueil #content A.home-dif { display: block; width: 270px; height:64px; background:url(/media/img/content/dif-intermittents.png); position:absolute; top:40px; right:-22px; } BODY.page-accueil #content A.home-dif:hover { background: url(/media/img/content/dif-intermittents-active.png);} BODY.page-accueil #content A.home-facebook { display: block; width: 310px; height: 31px; background: url(/media/img/content/facebook.png); margin-left: 70px; } BODY.page-accueil #content A.home-facebook:hover { background: url(/media/img/content/facebook-active.png); } BODY.page-accueil #content .news { /* background: url(/media/img/content/news-icon.png) no-repeat 20px 14px; */ } BODY.page-accueil #content .news P.chapo { font-size: 12pt; color: #0072b8; } BODY.page-accueil #content .news A.more { font-size: 10pt; color: #0072b8; } BODY.page-accueil #content .news #news_body { font-size: 10pt; } BODY.page-accueil #content .news #news_body UL { margin-top: 10px; margin-bottom: 10px; margin-left: 70px; padding-left: 30px; } BODY.page-accueil #content .news #news_body A { font-size: 10pt; } BODY.page-accueil #content .news #news_body A.close_button { font-weight: normal; } BODY.page-accueil #main-content UL { margin-top: 0.5em; margin-bottom: 1em; } UL#featured-prestations { list-style: none; padding-left: 80px; text-transform: lowercase; margin-left: 0; margin-top: 10px; margin-bottom: 20px; } UL#featured-prestations LI { background: url(/media/img/content/bullet-prestation.png) no-repeat; height: 18px; padding-left: 24px; font-size: 14pt; margin-bottom: 8px; } UL#featured-prestations LI.style-2 { background: url(/media/img/content/bullet-prestation-2.png) no-repeat; } UL#featured-prestations LI A { color: #2f7ece; } UL#featured-prestations LI.style-2 A { color: #636363; } /* dtr */ #content .replaced-dtr-content-title { margin-bottom: 1em; margin-top: 20px;} /* search results */ #content .search-result { font-size: 90%; } #content .search-result P { margin-bottom: 0; } #content .search-result H3 { margin-top: 1.5em; } #content .search-result-style-1 H3 A, #content .search-result-style-1 P { color: #4f5e75; } /* #content .search-result-style-2 H3 A, #content .search-result-style-2 P { color: #6cb0df; } */ #content P.url-info { font-size: 80%; color: silver; } #content .url-info A { color: #27BEF9; } /* prestations TODO: refacto */ #content .prestation-category P { /*height: 40px;*/ margin-bottom: 10px; } #content .prestation-category H2 { margin-bottom: 10px; } #content H2#formations { margin-bottom: 20px; } /*#content .prestation-category A.prestation-title { line-height: 3em;}*/ #content .prestation-category A.prestation-title { font-size: 10pt; text-transform: uppercase; color: #898886; color: #444;} #content .prestation-category A.prestation-title:hover { color: #c0bebb; } /* #content .prestation-category .prestation-style-2 A.prestation-title { color: #609ed4; } */ #content .prestation-category A.pdf-link { position: absolute; left: 450px; } #content .formation-category A.prestation-title { text-transform: none; text-transform: uppercase; } #content H3.formation-category-title { margin-bottom: 1em; } #content H3.formation-category-title A { color: #898886; color: #444444; font-weight: bold; } #content H3.formation-category-title A:hover { color: #c0bebb; } /* #content .formation-style-2 H3.formation-category-title A { color: #609ed4; } #content .formation-category.formation-style-2 A.prestation-title { color: #609ed4; } */ #content .formation-category P A { font-weight: normal; } /* prestation category page */ #content TABLE.prestation { width: 520px; } #content TABLE.prestation H3 { margin-left: 0; } #content TABLE.prestation .description-column { width: 300px; font-size: 90%; } #content TABLE.prestation .actions-column { text-align: center; vertical-align: middle; font-size: 80%; } /* #content .prestation-style-2 H3, #content .prestation-style-2 .description-column { color: #6ab0da;} */ #content TABLE.prestation .ask-a-question { display: block; margin-top: 1em; } #content .prestation H3 { color: #27bef9; font-weight: bold; } #prestation-tooltip { position: absolute; display: none; width: 200px; height: 195px; padding-left: 70px; padding-top: 30px; padding-right: 30px; font-size: 10pt; font-style: italic; color: #fbaf56; background: url(/media/img/content/catalog-bulle.gif) no-repeat; } #prestation-tooltip P.more { position: absolute; left: 70px; bottom: 60px; width: 150px; font-style: normal; font-weight: bolder; } /* links/references */ #content .link { font-size: 90%; } #content .link P { margin-bottom: 0; } #content .link H3 { margin-top: 1.5em; color: #27BEF9; font-weight: bold; } /* #content .link-style-2 H3, #content .link-style-2 P { color: #6ab0da; } */ #content .link .url { font-size: 90%; } #content .link .url A { color: #4F5E75; } /* #content .link-style-2 .url A { color: #27BEF9; } */ #content TABLE.link-columns TD { vertical-align: top; } #content TABLE.link-columns { margin-left: 0; margin-right: 0; } /* gallery pane */ #content #gallery-pane { position: absolute; bottom: 135px; opacity: 0.95; display: block; width: 560px; height: 412px; padding-top: 25px; background: url(/media/img/content/gallery-pane-bg.gif) 50% 0 no-repeat; text-align: center;} #content #gallery-pane .close-button { display: block; width: 40px; height: 40px; position: absolute; top: 20px; right:28px; border: none; background: url(/media/img/icons/minus.gif) no-repeat; cursor: pointer; } #content #gallery-pane .close-button:hover { background: url(/media/img/icons/minus-active.gif) } /* contact form */ TABLE.contact-form { width: 500px; } TABLE.contact-form TH { width: 200px; text-align: left; } TABLE.contact-form INPUT { width: 280px; } TABLE.contact-form INPUT.submit { display: block; height:20px; padding-right: 35px; text-align: right; background: white url(/media/img/header/search-button.png) no-repeat 100%; border:0; margin: 2px 0 0px 0px; cursor:pointer; } TABLE.contact-form INPUT.submit:hover { background-image: url(/media/img/header/search-button-active.png); } /******************** Content footer */ #content-footer { position: relative } #content-footer A.email { position: absolute; left:99px; top:102px; width: 184px; height: 26px; background: url(/media/img/body/content-footer-email.png) left no-repeat; } #content-footer A.email:hover { background:url(/media/img/body/content-footer-email-active.png) 10px -1px no-repeat; } /******************** Footer */ #footer { } #footer .container { width: 800px; margin: 0 auto; } #footer A { color: #3e5b76; } #footer A:hover { color: #27BEF9; } #footer P { margin-left: 30px; width: 560px; } #footer .copyright { padding-left: 30px; margin-left: 0; } #footer { padding-top: 2em; border-top: 1px solid silver; font-size: 80%; background: #f7f7f7; padding-bottom: 1em; } #extra-footer #mini-sitemap { margin-top: 1em; } #extra-footer #mini-sitemap .submenu { font-size: 90%; text-decoration: none; } #extra-footer #mini-sitemap UL { margin-left: 30px; list-style: dash; margin-bottom: 1em; } /******************** « Billes » decoration effect */ #billes-top, #billes-middle, #billes-bottom { position: absolute; right: 0; width: 300px; opacity: 0.5; } #billes-top { height: 419px; top: 340px; background: url(/media/img/billes/billes-top.png) 100% 0; } #billes-middle { position: absolute; background: purple; } #billes-bottom { position: absolute; height: 419px; bottom: 0; background: url(/media/img/billes/billes-bottom.png) 100% 100%; } /******************** CMS */ .editable-content { position: relative; } .editable-content .edit-button { display: none; } .editable-content.active { outline: 1px inset #888; } .editable-content.active .edit-button { display: block; width: 30px; height: 15px; position: absolute; right: 3px; top: 0; opacity: 0.4; margin:2px 0; padding:2px 3px; vertical-align:middle; font-family:"Lucida Grande", Verdana, Arial, sans-serif; font-weight:normal; font-size:11px; background:white url(/admin/media/img/admin/nav-bg.gif) bottom repeat-x; padding:3px; color:black !important; border:1px solid #bbb; border-color:#ddd #aaa #aaa #ddd; } .editable-content.active .edit-button:hover { opacity: 1;} .editable-content.active .edit-button:active { background-image:url(../img/admin/nav-bg-reverse.gif); background-position:top; } .editable-content.empty { height: 2em; width: 20em; background: black; color: white; float: left; } #content-edit-popup { position: absolute; top: 10px; left: 10px; background: white; color: black; opacity: 0.9; } #content-edit-popup #id_text { width: 400px; height: 400px; } .openable_container .openable { display: none; } .openable_container.open .openable { display: block; } .openable_container.open .closable { display: none; } /* home logos animation */ .logo-animation-container { width: 175px; height: 130px; background: white; margin-bottom: 10px; } .logo-animation-container IMG { position: absolute; } /* link to the other site */ #sidebar .abc-spectacle { margin-top: 20px; } #sidebar .abc-spectacle A { display: block; text-decoration: none; padding-left: 30px; width: 200px; text-align: center; } #sidebar .abc-spectacle A SPAN { display: block; color: #FE8F02; font-style: italic; font-size: 14px; } #content .abc-spectacle { text-align: center; } #content .abc-spectacle A { text-decoration: none; } #content .abc-spectacle A:hover SPAN { text-decoration: underline; } body.page-accueil #content P.seo-fix-home A { font-size: 10pt; } body.page-accueil #content P.seo-fix-home u { text-decoration: none; } .cscbc-box { margin-top: 4em; margin-left: 40px; margin-right: 15px; font-size: 10px; text-align: justify; color: #008; } .cscbc-box IMG { margin-left: 10px; } .cscbc-box P { background: #FFFBF5; padding: 5px 10px; } .page-notre-catalogue #content { min-height: 600px; } p.prestation-style-1 a.prestation-title{ color:#664688 !important; } p.prestation-style-2 a.prestation-title{ color:#5480BA !important; } #content .prestation-category p{ /*height:20px;*/ margin-bottom:0px; } #content hr{ margin-left:50px; color:#EEE; background-color:#EEE; margin-bottom:30px; margin-top:20px; border:0; } #content h5.formation-category-title { margin-top:20px; margin-bottom:3px; } #content div.prestation-category h3 a{ color:#046CBF; font-weight:bold; font-size:10pt; } #content h5.formation-category-title a{ color:#BBB !important; font-size:10pt; letter-spacing:4px; text-transform:uppercase; } #content .prestation-category A.facebook-link { left: 410px; position: absolute; } #content .prestation-category A.pdf-link { left: 390px; } .replaced-dtr-content-subtitle-new { margin-top:10px; } h3#formations { font-weight:bold; font-size:11pt; } #content .prestation-category P A.prestation-title { font-weight: normal; font-size:8pt; line-height:12pt; } #content { margin-bottom:50px; font-size:9pt; }