/* CSS "www.afar.fr" - 12/2013 - */ /* -o- "CSS Afar" -o- */ /* IMPORTANT */ /* Ce design n'est pas un template. Vous ne pouvez pas le reproduire sans l'accord préalable de l'auteur. Cependant, libre à vous d'étudier ce CSS et d'employer par ailleurs les techniques utilisées. ----- This design is not a template. You cannot reproduce it without prior agreement of the author. However, free with you studied this CSS and to in addition employ the techniques used. */ /* == COMMUN A TOUS LES ECRANS ========================================== ====================================================================== _________ __/ General \_________________________________________________________ */ html, body { font-style:normal; font-variant:normal; font-weight:normal; font-family:"HelveticaNeue-CondensedBold","HelveticaNeueBoldCondensed","HelveticaNeue-Bold-Condensed","Helvetica Neue Bold Condensed","HelveticaNeue-CondensedBoldObl","HelveticaNeueCondensedBoldObl","Helvetica-Neue-Condensed-Bold-Obl","Helvetica Neue Condensed Bold Obl","HelveticaNeue-Condensed","HelveticaNeue-Condensed","Helvetica NeueCondensed","Helvetica Neue","Archivo Narrow",Helvetica,Arial,"Lucida Grande",sans-serif; font-stretch:condensed; font-weight:600; } body { background-color:#FFF; color:#333; } .shadow { box-shadow:2px 2px 3px #888; -moz-box-shadow:2px 2px 3px #888; -webkit-box-shadow:2px 2px 3px #888; } .cornerround { border-radius:10px; } .afar_blocktxtstd { border-radius:10px; border:2px solid #666; background-color:#FFF; margin-bottom:15px; } .afar_titletxtstd { border-radius:8px 8px 0 0; background-color:#DD0029; color:#FFF; padding:5px 10px; font-weight:bold; text-transform:uppercase; margin:0; } .txtbold { font-weight:bold; } .txtred { color:#DD0029; } .txtupper { text-transform:uppercase; } /* h1, h2, h3, h4, h5, h6 { color:#343434; } h3 { font-family:"Arial Narrow Bold","Arial Narrow Gras","Arial Narrow",sans-serif; font-weight:bold; } .center { text-align:center; } .strong { font-weight:bold; } #n_blockContent { margin: 15px 0; } .n_blockzone { } .n_mep2c { margin:0; } .n_mep2c td { padding:0; vertical-align:top; } .n_mep2c td.n_col1 { } .n_mep2c td.n_col1 div.bordergrey { background-color:#E8E8E8; border:2px solid #BDBDBD; } .n_mep2c td.n_col1 h3 { background-color:#F42829; color:#FFF; height:70px; line-height:70px; padding-left:25px; } .n_mep2c td.n_col1 h3.deuxlignes span { display:block; line-height:23px; padding-top:12px; } .n_mep2c td.n_col1 div.contentwhite { background-color:#FFF; margin:0 25px 1.5em; } .n_mep2c td.n_col2 { width:90px; padding-left:32px; } /* _______ __/ Liens \___________________________________________________________ */ /* a:link \ a:visited \ a:hover \ a:active * a.cadrerr { display:block; height:18px; background:transparent url("img/afar_cerclerouge.png") left top no-repeat; padding-left:8px; } a.cadrerr span { display:block; height:18px; background:#E8E8E8 url("img/afar_cerclerouge.png") right top no-repeat; padding-right:8px; } a.hrefpdf { background:transparent url("img/pdficon_32x32_v1.png") left center no-repeat; padding-left:32px; display:inline-block; height:32px; line-height:32px; } a.nounderline { text-decoration:none; } a.red { color:#F42829; } .onglets p { display:inline-block; margin:0 -3px -1px 0!important; text-align:center; background-color:#F9F9F9; border:1px solid #BDBDBD; border-bottom:0; } .onglets p.ongletroll, .onglets p:hover { background-color:#F42829; } .onglets p.ongletroll a { color:#FFF; } .onglet90x40 p { width:90px; } .onglet150x40 p { width:150px; } .onglets p a { display:block; color:#F42828; text-decoration:none; font-weight:bold; font-size:110%; padding: 5px 15px; } .onglet90x40 p a { background:#E8E8E8 url("img/onglets_90x40.jpg") left top no-repeat; } .onglet150x40 p a { background:#E8E8E8 url("img/onglets_150x40.jpg") left top no-repeat; } .onglets p a:hover { color:#FFF; } .onglet90x40 p a:hover, .onglet150x40 p a:hover { background-position:left -40px; } .onglet90x40 p.ongletroll a, .onglet150x40 p.ongletroll a { background-position:left -40px; color:#FFF; text-decoration:underline; } .onglet90x40 p.ongletroll a:hover, .onglet150x40 p.ongletroll a:hover { text-decoration:none; } /* __________________________________ __/ Contenant de la page (container) \________________________________ */ #container { /*width:940px; margin:0 auto; */position:relative; } /* ________ __/ Entete \__________________________________________________________ */ #blockHeader { /*width:940px; margin:0 auto;height:160px; */ position:relative; background:#FFF url("img/header_background.jpg") top left repeat-x; } #blockHeader #siteHeader { width:940px; margin:0 auto; } #blockHeader #siteHeader h1 a { display:block; width:204px; height:160px; background:transparent url("img/header_logo.jpg") top center no-repeat; } #blockHeader #siteHeader h1 a span { display:none; } #blockHeader #siteHeader h2 { display:none; } #blockHeader #siteFind { margin:-60px auto 0; text-align:right; width:940px; font-size:140%; } #blockHeader #siteFind label { background-color:#4D4D4D; color:#FFF; text-transform:uppercase; border-radius:8px 0 0 8px; padding:3px 30px 3px 10px; } #blockHeader #siteFind span { background-color:#FFF; display:inline-block; margin:0 0 0 -5px; } #blockHeader #siteFind input[type=text] { border:0 none; margin:0; padding:0 5px; } #blockHeader #siteFind input[type=submit] { background-color:#FFF; border:0 none; height:25px; } /* #siteHeader { width:200px; } #siteHeader h1 { margin-bottom:0; } #siteHeader h1 a { display:block; width:122px; height:85px; background:transparent url("img/afar_head-logo.png") top center no-repeat; } #siteHeader h1 a span { display:none; } #siteHeader h2 { display:none; } #siteFind #formrech input[type=text] { float:left; font-size:80%; width:200px; height:18px; padding:0px 8px; color:#333; background:url("img/afar_recherche.png") top left no-repeat; margin:0; border:0; font-weight:bold; } #siteFind #formrech input[type=submit] { cursor:pointer; float:left; border:0; width:27px; height:18px; color:#888; background:url("img/afar_recherche.png") top right no-repeat; margin:0; padding:0; } #siteFind .forminput_pre { color:#888!important; } #bandeauentete { position:absolute; top:0; left:135px; width:540px; height:85px; background:#FFF url() top left no-repeat; } #bandeauentete a { display:block; width:540px; height:85px; position:absolute; top:0; left:0; z-index:5; } #bandeauentete object { } /* ________________ __/ Menu principal \__________________________________________________ */ #siteMenus { margin:20px 0 30px 0; background-color:#DD0029; color:#FFF; font-size:1.2em; text-transform:uppercase; box-shadow:0 2px 3px #AAA; -moz-box-shadow:0 2px 3px #AAAAAA; -webkit-box-shadow:0 2px 3px #AAAAAA; } #siteMenus #menuContent { width:940px; margin:0 auto; } #siteMenus #menuContent a { border-right:1px solid #FFF; color:#FFF; display:inline-block; padding:5px 9px; text-decoration:none; margin-left:-3px; } #siteMenus #menuContent a:hover { background-color:#BA102D; } #siteMenus #menuContent a.isthelast { border-right:0; } #siteMenus #menuContent a.menu_on { background-color:#FFF; color:#DD0029; } #siteMenus #menuContent a.menu_on:hover { background-color:#BA102D; color:#FFF; } /* #siteMenus ul { color:#fff; margin:1px 0 0 0; width:940px; position:relative; list-style-type:none; height:34px; } #siteMenus ul li { float:left; } #siteMenus ul li a.menuline { display:block; height:34px; background:#5D5D5D url("img/afar_btns-menus_v3.png") 0 0 no-repeat; } #siteMenus ul li a.menuline span { display:none; } #siteMenus ul li a#menu_fsan { background-position:0 0; width:220px; } #siteMenus ul li a#menu_fsan:hover { background-position:0 -35px; } #siteMenus ul li a#menu_coll { background-position:-220px 0; width:148px; } #siteMenus ul li a#menu_coll:hover { background-position:-220px -35px; } #siteMenus ul li a#menu_fcon { background-position:-368px 0; width:213px; } #siteMenus ul li a#menu_fcon:hover { background-position:-368px -35px; } #siteMenus ul li a#menu_curs { background-position:-581px 0; width:330px; } #siteMenus ul li a#menu_curs:hover { background-position:-581px -35px; } #siteMenus div { display:none; } #siteMenus li.hovering div { display:block; } #siteMenus div { position:absolute; top:35px; left:0; z-index:20; width:940px; border:1px solid #ADADAD; border-top-color:#F5F5F5; background:#FEFEFE; color:#727272; } #siteMenus div td { vertical-align:top; padding:0; background:transparent url("img/afar_ssmenu-sep.gif") top left no-repeat; } #siteMenus div td:first-child { background-image:none; } #siteMenus div h6 { font-size:120%; text-transform:uppercase; color:#000; padding-left:1em; } #siteMenus div a { color:#727272; background-image:none; text-decoration:none; display:block; } #siteMenus div a:hover { background-image:none; color:#FFF; background-color:#AAA; } #siteMenus div td p { margin:0; margin-left:1em; } #siteMenus div td p.lieu { margin-bottom:1em; font-weight:bold; font-size:120%; } #siteMenus p.btnplaqweb { margin-top:25px; } #siteMenus p.btnplaqweb a { background: url("img/DPC2013_menu.jpg") no-repeat scroll left top transparent; display:block; height:214px; width:155px; } #siteMenus p.btnplaqweb span { display:none; } #siteMenus li#menu_formsante td.intra, #siteMenus li#menu_formcont td.intra { width:210px; } #siteMenus li#menu_formsante td.intra p, #siteMenus li#menu_formcont td.intra p { width:190px; } #siteMenus td.annee0 h6 { color:__annee0_couleur__; } #siteMenus td.annee0 a:hover { background-color:__annee0_couleur__; } #siteMenus td.annee1 h6 { color:__annee1_couleur__; } #siteMenus td.annee1 a:hover { background-color:__annee1_couleur__; } #siteMenus td.intra h6 { color:__intra_couleur__; } #siteMenus td.intra a:hover { background-color:__intra_couleur__; } #siteMenus td.cursus h6 { color:__cursus_couleur__; } #siteMenus td.cursus a:hover { background-color:__cursus_couleur__; } #siteMenus td.colloques h6 { color:#F30505; } #siteMenus td.colloques a:hover { background-color:#F30505; } #siteMenus td.entrepr h6 { color:__f_entr_couleur__; } #siteMenus td.entrepr a:hover { background-color:__f_entr_couleur__; } /* _______________ __/ Chemin (path) \___________________________________________________ */ /* #sitePath { color:#FFF; line-height:24px; font-weight:bold; text-align:left; } #sitePath a { color:#FFF; text-decoration:none; } #sitePath a:hover { text-decoration:underline; } /* ________________ __/ Corps du corps \__________________________________________________ */ #blockContent { width:940px; margin:0 auto; } #blockContent .btn { background:#4B4B4B url("img/afar_bouton-bg.png") 0 0 no-repeat; display:inline-block; height:19px; line-height:19px; text-decoration:none; color:#FFF; } #blockContent .btn span { background:#4B4B4B url("img/afar_bouton-bg.png") right 0 no-repeat; display:inline-block; height:19px; line-height:19px; margin-left:35px; padding-right:35px; } #blockContent .btn:hover { background-position:0 -19px; } #blockContent .btn:hover span { background-position:right -19px; } /* ______________ __/ Pied de page \____________________________________________________ */ #blockFooter { background-color:#EDEDED; padding:15px 0; box-shadow:0 2px 3px #AAAAAA; -moz-box-shadow:0 2px 3px #AAAAAA; -webkit-box-shadow:0 2px 3px #AAAAAA; } #blockFooter #linksFooter { width:940px; margin:0 auto; text-align:center; } #blockFooter a.footerlink { color:#000000; display:inline-block; font-size:1.6em; margin:0 4%; text-align:center; text-decoration:none; text-transform:uppercase; } #blockFooter a#footer_linkedin { padding-right:35px; background:transparent url("img/linkedin.jpg") right center no-repeat} p#copyrightFooter { width:940px; margin:30px auto 0; text-align:center; } /* #blockFooter table { width:100%; } #blockFooter td { font-size:7pt; text-align:center; padding:0 2px; } #blockFooter a { color:#343434; text-decoration:none; } #blockFooter a:hover { text-decoration:underline; } #blockFooter td#inf { font-size:1em; margin:0; font-weight:bold; text-align:right; } /* #blockFooter td#inf a { display:block; height:18px; background:transparent url(img/afar_cerclerouge.png) left top no-repeat; padding-left:8px; } #blockFooter td#inf a span { display:block; height:18px; background:#E8E8E8 url(img/afar_cerclerouge.png) right top no-repeat; padding-right:8px; } */ /* ________ __/ Extras \__________________________________________________________ */ #extraDiv1, #extraDiv2, #extraDiv3 { display:none; } /* __________________________________________ __/ Messages d'informations | Erreurs | etc. \________________________ */ p.message { background:#EAEBF7 url("img/icon_information.png") center no-repeat; color:#666699; border-top:2px solid #9999FF; border-bottom:2px solid #9999FF; background-position:15px 50%; padding:5px 20px 5px 45px; } p.message { color:#666699; border-color:#9999FF; background-color:#EAEBF7; background-image:url("img/icon_information.png"); } p.alert { color:#992222; border-color:#992222; background-color:#F8E7E7; background-image:url("img/icon_exclamation.png"); } p.ok { color:#669933; border-color:#669933; background-color:#E6F3DA; background-image:url("img/icon_accept.png"); } p.warning { color:#FF9900; border-color:#FF9900; background-color:#FFFFCC; background-image:url("img/icon_error.png"); } /* __________________________________________ __/ Messages d'informations | Erreurs | etc. \________________________ */ /* .anythingSlider-default.activeSlider .anythingWindow { border:none; } /* == ECRAN "ACCUEIL" =================================================== ====================================================================== */ /* ---------- La zone de bienvenue peut etre un texte de Mme Monfort ou une liste de stages a mettre en avant. ---------- */ #index .afar_blocktxtstd { float:left; height:210px; margin-right:15px; } #index .no_marginright { margin-right:0; } #index .txtcenter, #index .h3center h3 { text-align:center; } #index #home_video { width:380px; background:transparent url("img/home_mme_monfort.jpg") left bottom no-repeat; position:relative; } #index #home_video h3 span { font-size:80%; } #index #home_video a { color:#FFFFFF; font-size:1.8em; height:30px; left:0; padding:180px 40px 0 0; position:absolute; text-align:right; text-decoration:none; text-shadow:1px 1px 2px #000000; top:0; width:340px; } #index #home_formations { width:325px; } #index #home_formations h3 span { font-size:90%; font-style:italic; } #index #home_formations img { float:left; margin:15px; } #index #home_formations p { margin-top:2em; font-size:1.3em; font-weight:bold; } #index #home_dwnlddocs { width:170px; height:115px; } #index #home_dwnlddocs a { background:url("img/home_documents.jpg") no-repeat scroll center 75% transparent; color:#DD0029; display:block; font-size:1.6em; height:80%; text-decoration:none; text-transform:uppercase; } #index #home_publications { width:170px; height:75px; background-color:#DD0029; } #index #home_publications a { color:#FFF; display:block; font-size:1.7em; line-height:1em; margin-top:0.8em; text-decoration:none; text-transform:uppercase; } #index #home_publications a span { font-size:0.8em; } #index #home_projecteur, #index #home_videos, #index #home_esppriv { height:270px; } #index #home_projecteur { width:380px; line-height:1em; } #index #home_projecteur img { float:left; margin:15px; } #index #home_projecteur p { margin-top:2em; font-size:2.2em; font-weight:bold; text-transform:uppercase; } #index #home_videos { width:325px; } #index #home_esppriv { width:170px; } /* #index .bienvenue { float:left; width:698px; height:213px; overflow:hidden; } #index #bienvenue { background:transparent url("img/afar_home-actu_v2.png") left center no-repeat; } #index #bienvenue h3 { text-align:left; margin:16px 0 1em 195px; } #index #bienvenue h4 { text-align:left; margin:0 0 0 195px; } #index #bienvenue blockquote { text-align:left; margin:0 0 0 195px; overflow:hidden; width:494px; height:150px; font-style:normal; } #index #bienvenue blockquote p { line-height:1.1; margin-bottom:0.5em; } #index #bienvenue2 { background:#F4F5F5 url("img/afar_home-actu_v3.jpg") left center no-repeat; width:210px; } #index #stagesonhome { margin-left:35px; width:450px; background:transparent url("img/afar_home-stages.png") center center no-repeat; } #index #stagesonhome h3 { line-height:32px; text-align:center; margin:4px 1px 0; background:transparent url("img/afar_home_stages_title.jpg") center center no-repeat; color:#FFF; } #index #stagesonhome #listestages { overflow:auto; height:173px; margin:0 1px; } #index #stagesonhome .lignestage { height:1.9em; line-height:1.9em; overflow:hidden; padding:0 5px; position:relative; } #index #stagesonhome .lignestage span.date { float:right; margin-left:20px; color:inherit; } #index #stagesonhome .lignestage a { text-decoration:none; color:inherit; } #index #stagesonhome .lignestage a:hover { color:#009; } #index #stagesonhome .ligne0 { background-color:#E2E2E2; } #index #stagesonhome .ligne1 { background-color:#BEBEBE; } #index #bienvenue3 { width:205px; } #index #bienvenue3 a { display:block; background:#F4F5F5 url("img/home_cmonfort_video.jpg") left top no-repeat; width:205px; height:206px; } #index #bienvenue3 a:hover { background-position:right -206px; } #index #bienvenue3 a span { display:none; visibility:hidden; }