/* ** @author : * A. Librairies (CSS reset...) * B. Styles generaux (declarations defaut des Hx, strong) * C. Styles helpers (margins, paddings, txtX) * D. Structure principal (#page, #main, #menu, #nav...) * E. Contenus (listes ul.listPuce, .mea, dataArray...) * F. Blocs conteneurs + structure contenu (line, unit, .block, .blockSimple....) * G. Custom (blocks specifiques, contenus vraiment specifiques a une page, non reutilisable ailleurs) * H. Fixs class for navigators (corners) * I. Classes specifiques (lecteurs d'ecran, javascript...) */ /**** * A. Librairies (CSS reset...) ****/ /*Code du menu horizontal souligné*/ #underlinemenu{ margin: 0; padding: 0; } #underlinemenu ul{ margin: 0; margin-bottom: 1em; padding-left: 0; float: left; font-weight: bold; width: 100%; border: 1px solid #DFDFDF; border-width: 1px 0; } /*règle pour IE. Supprime la marge extra basse*/ * html #underlinemenu ul{ margin-bottom: 0; } #underlinemenu ul li{ display: inline; } /*Les liens tels que vous voulez qu'ils apparaissent*/ #underlinemenu ul li a{ float: left; color: gray; font-weight: bold; padding: 2px 6px 4px 6px; text-decoration: none; /*image de séparation des rubriques avec son adresse*/ background: white url(images/menudivide.gif) top right repeat-y; } /*Ici, c'est pour le configurer le survol des liens*/ #underlinemenu ul li a:hover{ color: red; background-color: #F3F3F3; border-bottom: 4px solid red; padding-bottom: 0; } /* ///////////////////////////////////////////////////////////////////////////////// */ html,body,span, applet,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, dd,dl,dt,li,ol,ul, fieldset,form,label,legend, caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;line-height:1.3em;font-family:inherit;text-align:inherit;vertical-align:baseline;} a img,:link img,:visited img{border:0;} table{border-collapse:collapse;border-spacing:0;} ol,ul{list-style:none;} q:before,q:after, blockquote:before,blockquote:after{content:"";} strong,h1,h2,h3,h4,h5,h6 {font-weight:bold;} em{font-style:italic;} input, textarea, select {font-size:99%} /**** * B. Styles generaux (declarations defaut des Hx, strong, a (liens) ) ****/ body {font-size:11px; *font-size:69.18%; font-family:Arial,Helvetica,sans-serif; background:#fff;} /* par defaut la hauteur du font-size est de 16px sur IE et FF, pour avoir un font-size relatif, il suffit de faire une division et indiquer le pourcentage correspondant */ a {color: #173A7C; text-decoration:none;} a:hover {text-decoration:underline;} h2, .h2 {font-size:172%; color:#DA0000; margin:5px;} h3, .h3 {color:#4C4C4C; font-size:160%; font-weight:normal;} h3 em, .h3 em {font-size:70%; font-style:normal;font-weight:bold;} h4 em, .h4 em {font-size:70%; font-style:normal;font-weight:bold;} h4, .h4 {color:#E75353; font-size:110%;} h4 a {color:#E75353;} h5, .h5 {font-size:100%; color:#173A7C;} p {margin:5px 0;} /*gestion cms, a cause d'une erreur de placement des dans le premier bloc a onglet*/ h3.newTitle {font-size:190%; color:#4C4C4C;} h3.title strong, h4.title strong, h5.title strong {font-weight:100;color:#DC0707;} .hidden {display:none;} /* contenus et separateurs */ .highLight {color:#A45255;} .bold {font-weight:bold;} .mentionsLegales {font-style:italic; } .mentionsLegales .mentionsContent {overflow:hidden; width:100%} .noBrd {border:0 !important} .sep {border-top:1px solid #ccc} .sepV {border-left:1px solid #ccc} .nuageMots {line-height:1.4em;text-align:justify;} /**** * C. Styles helpers (margins, paddings, txtX) ****/ /* alignement (vertical-align, text-align */ .txtL{text-align:left !important;} .txtC{text-align:center !important;} .txtR{text-align:right !important;} .txtT{vertical-align:top !important;} .txtM{vertical-align:middle !important;} .txtB{vertical-align:bottom !important;} /* positionnement flottant */ .floatL, .float_l {float:left;} .floatR, .float_r {float:right;} .context {overflow:hidden; _overflow:visible; zoom:1} /* fullWidth (force une image ou un flash a prendre toute la largeur de son conteneur, cela evite de devoir calculer au pixel pres la largeur d'une image. Utilisation :
) */ .fullImg img {width:100%; display:block;} .mediaSplit img, .mediaSplit object, .mediaSplit embed{width:100%; display:block; vertical-align:top;} .mediaSplit a {display:block;} /* marges des blocs */ .Vspace, .Tspace {margin-top:7px !important} .Vspace, .Bspace {margin-bottom:7px !important} .home .block .Vspace, .home .block .Tspace {margin-top:6px !important} .home .block .Vspace, .home .block .Bspace {margin-bottom:6px !important} /* margins pour les contenus */ .marginSm {margin:5px !important} .margin{margin:10px !important} .marginLg {margin:20px !important} .VmarginSm, .TmarginSm {margin-top:5px !important} .VmarginSm, .BmarginSm {margin-bottom:5px !important} .HmarginSm, .LmarginSm {margin-left:5px !important} .HmarginSm, .RmarginSm {margin-right:5px !important} .Vmargin, .Tmargin {margin-top:10px !important} .Vmargin, .Bmargin {margin-bottom:10px !important} .Hmargin, .Lmargin {margin-left:10px !important} .Hmargin, .Rmargin {margin-right:10px !important} .VmarginLg, .TmarginLg {margin-top:20px !important} .VmarginLg, .BmarginLg {margin-bottom:20px !important} .HmarginLg, .LmarginLg {margin-left:20px !important} .HmarginLg, .RmarginLg {margin-right:20px !important} /* paddings pour les contenus */ .paddingSm {padding:5px !important} .padding{padding:10px !important} .paddingLg {padding:20px !important} .VpaddingSm, .TpaddingSm {padding-top:5px !important} .VpaddingSm, .BpaddingSm {padding-bottom:5px !important} .HpaddingSm, .LpaddingSm {padding-left:5px !important} .HpaddingSm, .RpaddingSm {padding-right:5px !important} .Vpadding, .Tpadding {padding-top:10px !important} .Vpadding, .Bpadding {padding-bottom:10px !important} .Hpadding, .Lpadding {padding-left:10px !important} .Hpadding, .Rpadding {padding-right:10px !important} .VpaddingLg, .TpaddingLg {padding-top:20px !important} .VpaddingLg, .BpaddingLg {padding-bottom:20px !important} .HpaddingLg, .LpaddingLg {padding-left:20px !important} .HpaddingLg, .RpaddingLg {padding-right:20px !important} /***** D. Structure principal (#page, #main, #menu, #nav...) ****/ #page {min-width:984px; width:89.45em; *width:88.91em; margin:10px auto; text-align:left;zoom:1} #body {overflow:hidden; _overflow:visible; zoom:1;margin:15px 0 10px 0; position:relative; z-index:1;} #rightCol {float:right; margin-left:8px;_margin-left:5px;min-height:5px;_height:5px;position:relative;} #main {overflow:hidden; _overflow:visible; zoom:1; } /* #rightCol */ /* colonnes corners */ .colTl , .colTr {position:absolute; top:0; height:6px; width:6px; overflow:hidden; background:no-repeat left top} .colTr {background-position:right top} #main .colTl, #main .colTr {top:-1px; background-image:url(//s7.s-sfr.fr/css/v7/skin/blocks/blocksimple_corners.gif);} #main .colTl {left:-1px;} #main .colTr {right:-1px;} #leftCol .colTl, #leftCol .colTr, #rightCol .colTl, #rightCol .colTr {top:0; background-image:url(//s8.s-sfr.fr/css/v7/skin/default/leftcol_corners.gif);} #leftCol .colTl, #rightCol .colTl {left:0;} #leftCol .colTr, #rightCol .colTr {right:0;} #mainInside {padding:10px 15px; zoom:1; position:relative; border:1px solid #C3C3C1;} /* ===== NAVH ===== */ /* FOOTER v6.10 */ #footer {text-align:center;color:#d1d1d1;font-size:0.98em;line-height:1.5em;height:1%;} #footer ul {padding:0;margin:0;} #footer li {display:inline;list-style:none;} #footer a {text-decoration:none;color:#d1d1d1;white-space:nowrap;} #footer a:hover {text-decoration:underline;} #footer .mainFooter {border-top:1px solid #d1d1d1; border-bottom:1px solid #d1d1d1;color:#16387c;padding:8px 10px;} #footer .mainFooter a {color:#16387c;background:url(//s8.s-sfr.fr/css/v7/skin/header/header_icons.png) no-repeat 0 -197px;padding:0 2px 0 5px;} #footer .mainFooter li.first a, #footer .subFooter li.first a {background:none;} #footer .subFooter {padding:20px 10px;} #footer .under_ft {padding:0;} #footer .subFooter li a, #footer .under_ft li a {background:url(//s8.s-sfr.fr/css/v7/skin/header/header_icons.png) no-repeat left -243px;padding:0 0 0 7px;color:#d1d1d1;} #footer .subFooter li.first a, #footer .under_ft li.first a {background:none;} /* HEADER v6.12 */ acronym {border:0;} abbr {border:0;} #ctn_hd {width:984px;} #ctn_hd ul, #ctn_menu ul {list-style-type:none;} #ctn_hd ul, #ctn_hd li, #ctn_hd p, #ctn_hd form {margin:0;padding:0;} #ctn_menu ul, #ctn_menu li, #ctn_menu p {margin:0;padding:0;} #ctn_hd a, #ctn_menu a {text-decoration:none;} #ctn_hd *, #ctn_menu * {font-size:12px;line-height:14px;} #ctn_hd ul.big * {font-size:13px!important;} #ctn_hd ul {position:relative;z-index:1000;} #ctn_hd ul.pipe_r li {background:url(//s6.s-sfr.fr/css/v7/pictos/pipe_silver.png) right center no-repeat;} #ctn_hd ul.inlineList {height:1%;} #ctn_hd ul.inlineList a {color:#0000cc;font-weight:normal;} #ctn_hd ul.inlineList a strong {color:#000;} #ctn_hd ul.inlineList li {padding:6px 10px;font-weight:bold!important;} #ctn_hd ul.pipe_r li {background:url(//s6.s-sfr.fr/css/v7/pictos/pipe_silver.png) right center no-repeat;} #ctn_hd ul.inlineList li.first {padding-left:0!important;} #ctn_hd ul.inlineList li.last {background:none;margin:0!important;padding-bottom:0!important;padding-right:0!important;} #ctn_hd ul.inlineList li.plus {position:relative;z-index:1000;padding-right:0;padding-left:0;} #ctn_hd ul.inlineList li.plus a {padding-right:17px;padding-left:7px;float:left;height:1%;position:relative;z-index:2000;background:url(//s8.s-sfr.fr/css/v7/pictos/arrow_blue_close.png) 36px 6px no-repeat #fff;} #ctn_hd ul.inlineList li.plus a.collapse {background:url(//s5.s-sfr.fr/css/v7/pictos/arrow_blue_open.png) 36px 6px no-repeat #fff;border:1px solid #98040b;border-bottom:0;padding-left:6px;margin-top:-1px;} #ctn_hd ul.inlineList li a:hover {text-decoration: none!important;} #ctn_hd #hdnav_sublist {margin-top:-3px;width:140px;padding:2px;border-top:1px solid #98040b;border-left:1px solid #98040b;border-right:2px solid #98040b;border-bottom:2px solid #98040b;background:#fff;display:none;} #ctn_hd #hdnav_sublist.enabled {position:absolute;top:22px;left:0;display:block;z-index:10;} #ctn_hd #hdnav_sublist li {display:block;float:none;width:100%;background:none;padding:0;} #ctn_hd #hdnav_sublist li a, #ctn_hd #hdnav_sublist li strong {font-size:13px!important;line-height:24px!important;color:#0000cc;} #ctn_hd #hdnav_sublist li a {background:none;display:block;float:none;height:1%;padding:0 5px;border:none;white-space:nowrap;} #ctn_hd #hdnav_sublist li a.last {border-top:1px solid #98040b;} #ctn_hd #hdnav_sublist li a:hover {background:#e30200;color:#fff;} #sub_ctn_hd {clear:both;background:url(//s6.s-sfr.fr/css/v7/blocs/bg_shadow.png) left bottom repeat-x;position:relative;width:100%;height:58px;} #sub_ctn_hd .cctl, #sub_ctn_hd .cctr, #sub_ctn_hd .ccbl, #sub_ctn_hd .ccbr {position:absolute;width:5px;font-size:0;line-height:0;} #sub_ctn_hd .cctl, #sub_ctn_hd .cctr {height:3px;top:0;} #sub_ctn_hd .ccbl, #sub_ctn_hd .ccbr {height:7px;bottom:1px;} #sub_ctn_hd .cctl, #sub_ctn_hd .ccbl {left:0;} #sub_ctn_hd .cctr, #sub_ctn_hd .ccbr {right:0;} #sub_ctn_hd .cctl {background:url(//s7.s-sfr.fr/css/v7/blocs/corner_header.png) left top no-repeat;} #sub_ctn_hd .cctr {background:url(//s7.s-sfr.fr/css/v7/blocs/corner_header.png) right top no-repeat;} #sub_ctn_hd .ccbl {background:url(//s7.s-sfr.fr/css/v7/blocs/corner_header.png) bottom left no-repeat;} #sub_ctn_hd .ccbr {background:url(//s7.s-sfr.fr/css/v7/blocs/corner_header.png) bottom right no-repeat;} #sub_ctn_hd h1 {position:absolute;left:0;top:-1px;height:58px;width:58px;background:url(//s7.s-sfr.fr/css/v7/pictos/ico_logo.png) no-repeat;margin:0;padding:0;z-index:3000;} #sub_ctn_hd h1 a {height:100%;width:100%;display:block;text-indent:-1000em;} #sub_ctn_hd .shadow {background:url(//s8.s-sfr.fr/css/v7/blocs/bg_header.png) repeat-x #ed0116;height:53px;} #sub_ctn_hd h2 {font-size:24px;line-height:50px;color:#fff;font-weight:normal;padding:0 0 0 80px;} #ctn_menu {clear:both;background:url(//s5.s-sfr.fr/css/v7/blocs/bg_menu.png) repeat-x;position:relative;height:58px;width:984px;overflow:hidden;} #ctn_menu .paddingTab {padding:0 4px;} #ctn_menu a {text-decoration:none!important;} #ctn_menu ul.inlineList {padding:3px 0 0 0!important;height:1%;} #ctn_menu ul.inlineList li {float:left;display:inline;margin-left:4px;text-align: center!important;} #ctn_menu ul.inlineList li a {display:block;background:url(//s6.s-sfr.fr/css/v7/blocs/bg_tab_left.png) no-repeat left;width:auto!important;width:102px;min-width:102px;height:26px;line-height:26px;text-align:center;color:#fff; padding-left:10px;text-decoration:none!important;} #ctn_menu ul.inlineList li a span {cursor:pointer;display:block;background:url(//s7.s-sfr.fr/css/v7/blocs/bg_tab_right.png) no-repeat right;width:auto!important;width:102px;min-width:102px;height:26px;line-height:26px!important;text-align:center;color:#fff;white-space:nowrap; padding-right:10px;} #ctn_menu ul.inlineList li a.selected, #ctn_menu ul.inlineList li a:hover, #ctn_menu ul.inlineList li a:focus {color:#881015;background:url(//s8.s-sfr.fr/css/v7/blocs/bg_tab_left_highlight.png) no-repeat left;height:27px;margin-bottom:-1px!important;text-decoration:none;} #ctn_menu ul.inlineList li a.selected span, #ctn_menu ul.inlineList li a:hover span {color:#881015;background:url(//s5.s-sfr.fr/css/v7/blocs/bg_tab_right_highlight.png) no-repeat right;height:27px;margin-bottom:-1px!important;} #ctn_menu ul.inlineList ul {position:absolute;left:0;top:29px;width:984px;} #ctn_menu ul.inlineList li li {float:left;display:block;position:relative;z-index:10;} #ctn_menu ul.inlineList li li a.first,#ctn_menu ul.inlineList li li a.first:hover {background:none!important;} #ctn_menu ul.inlineList li li a, #ctn_menu ul.inlineList li li a.selected, #ctn_menu ul.inlineList li li a:hover {position:relative;z-index:10;float:left;display:inline;background:url(//s6.s-sfr.fr/css/v7/pictos/pipe_grey.png) left center no-repeat;width:auto;color:#881015;padding:0 13px 0 14px;font-weight:normal;text-align:center!important;} #ctn_menu ul.inlineList li li a:hover {text-decoration:underline!important;} #ctn_menu ul.inlineList li li a.selected {font-weight: bold!important;} #ctn_menu .cctl {position:absolute;z-index:1;width:4px;height:48px;left:0;bottom:0;background:url(//s7.s-sfr.fr/css/v7/blocs/bg_menu_left.png) left bottom no-repeat;} #ctn_menu .cctr {position:absolute;z-index:1;width:4px;height:48px;right:0;bottom:0;background:url(//s8.s-sfr.fr/css/v7/blocs/bg_menu_right.png) right bottom no-repeat;} ul.inlineList.last {float:right;display:inline;} ul.inlineList {position:relative;height:1%;} ul.inlineList li {float:left;display:inline;} ul.inlineList li ul {position:absolute;left:0;z-index:40;} ul.inlineList a {display:block;text-decoration:none;position:relative;} ul.universListLite {width:130px!important;} ul.universList {float:right;width:220px;overflow:hidden;padding:6px 0 0 0!important;position:relative;z-index:500!important;} ul.universList li {display:block;width:100%;} ul.universList li a {cursor:pointer;font-weight:bold;display:block;zoom:1;position:relative;padding:3px 28px 3px 4px!important;color:#fff;text-align:left;margin:0 1px 1px 0!important;} ul.universList li a span {cursor:pointer;background:url(//s5.s-sfr.fr/css/v7/pictos/pin_header.png) left 50% no-repeat;padding:0 0 0 18px;display:block;position:relative;} ul.universList li a:link, ul.universList li a:visited, ul.universList li a:hover, ul.universList li a:active, ul.universList li a:focus, ul.universList li a.selected {color:#fff!important;text-decoration: none!important;} ul.universList li a.selected {background:url(//s6.s-sfr.fr/css/v7/blocs/bg_univers_hover.png) repeat-x #f71629!important;text-decoration:none!important;} div.sfrSearch {float:left;padding:4px 0 0 110px;display:inline;width:264px;} div.sfrSearch input, div.sfrSearch button {border:none;padding:0;margin:0;background:none;} div.sfrSearch ul.inlineList {width:100%;} div.sfrSearch ul.inlineList li {padding:0!important;margin-right:0!important;} div.sfrSearch ul.inlineList li a {width:58px;height:17px;text-align:center;background:url(//s7.s-sfr.fr/css/v7/blocs/bg_tab_search.png) no-repeat;line-height:17px!important;color:#2b2a2a!important;text-decoration: none!important;} div.sfrSearch ul.inlineList li a:hover, div.sfrSearch ul.inlineList li a.selected {font-weight:bold!important;background:url(//s8.s-sfr.fr/css/v7/blocs/bg_tab_search_highlight.png) no-repeat;} div.sfrSearch ul.inlineList li a acronym, div.sfrSearch ul.inlineList li a abbr {display:block;height:100%;width:100%;font-size:12px!important;line-height:17px!important;} div.sfrSearch .fld_txt {float:left;width:225px;padding:4px 0 4px 5px;} div.sfrSearch .fld_btn {float:left;width:30px;height:22px;line-height:60px;text-indent:-5000px;cursor:pointer;} div.fieldSearch {clear:left;width:264px;height:26px;overflow:hidden;background:url(//s5.s-sfr.fr/css/v7/blocs/bg_recherche.png) no-repeat;} div.fieldSearch .padding {padding:2px!important;} div.sfrLogin {float:right;color:#fff;width:174px;text-align:left;background:url(//s6.s-sfr.fr/css/v7/pictos/pipe_separator.png) left top no-repeat; display:inline;margin-left:10px} div.sfrLogin p {padding:6px 8px 7px 8px!important;} div.sfrLogin strong {padding-left:15px;background:url(//s7.s-sfr.fr/css/v7/pictos/ico_user.png) left center no-repeat;} div.sfrLogin em {font-style:normal;} div.sfrLogin button {border:none;background:none;padding:0;margin:0;width:auto;overflow:visible;text-align:center;white-space:nowrap;font-size:11px!important;line-height:20px!important;} div.sfrLogin button span {background:url(//s8.s-sfr.fr/css/v7/blocs/bg_btn_right.png) right top no-repeat;font-size:11px!important;line-height:20px!important;float:left;} div.sfrLogin button em {background:url(//s5.s-sfr.fr/css/v7/blocs/bg_btn_left.png) left top no-repeat;font-size:11px!important;line-height:20px!important;float:left;padding:0 10px;} #ctn_hd div.sfrLogin span {font-size:11px!important;} /* ===== /HEADER ===== */ /* ===== /NAVH ===== */ /**** * E. Contenus (listes ul.listPuce, .mea, dataArray...) ****/ /* mea */ .mea, .mea .text, .meaRight, .meaRight .text, .meaWrap {overflow:hidden; _overflow:visible; zoom:1} .mea .media {float:left; margin-right:10px; _margin-right:7px;} .mea .clearReturn {clear:left} .meaRight .clearReturn {clear:right} .meaRight .media {float:right; margin-left:10px; _margin-left:7px;} .meaWrap .text {overflow:visible; zoom:0;} /* == listes == */ /* list2cols + list3cols*/ ul.list2cols, ul.list3cols {overflow:hidden; _overflow:visible; zoom:1; list-style:none} ul.list2cols li.item, ul.list3cols li.item {float:left; width:49.80%; list-style:none; position:relative;} ul.list2cols li.firstItem, ul.list3cols li.firstItem {clear:left;} ul.list3cols li.item {width:33.3%} ul.list3cols li.lastItem, ul.list2cols li.lastItem {float:none;width:auto !important; overflow:hidden; _overflow:visible; _float:left; position:static} div.listCtn {zoom:1; padding:5px; overflow:hidden;} /* bordure de liste */ ul.borderSep li.item, div.borderSep{border-left:1px solid #CDCDCD} ul.borderSep li.firstItem{border-left:none} ul.borderRSep li.item, div.borderRSep{border-right:1px solid #CDCDCD} ul.borderRSep li.lastItem{border-right:none} ul.borderBSep li.item, div.borderBSep{border-bottom:1px solid #CDCDCD} ul.borderBSep li.LastItem{border-bottom:none} ul.borderTSep li.item, div.borderTSep{border-top:1px solid #CDCDCD} ul.borderTSep li.firstLine{border-top:none} .hideCenterBorder{background:white;position: absolute;right:-6px;width:11px;height:11px;top:-6px;z-index:99;} /* margin special */ ul.borderRSep li.item .listCtn {padding-right:11px;} ul.borderRSep li.item .listCtn {padding-left:11px;} /* listArrawSquare et liste basique sur le site */ ul.squareArrow li, a.squareArrow {padding:3px 5px 3px 21px; background:url(//s7.s-sfr.fr/css/v7/skin/pictos/squarearrow.gif) no-repeat 0 0.4em;zoom:1} ul.squareArrow li, ul.siteList li {margin:5px 0} a.squareArrow {display:block;_zoom:1;} /* inline links */ ul.inlineLinks li {display:inline; border-right:1px solid #A4A4A4; padding-right:10px; margin-right:8px;} ul.inlineLinks li.last {border:0;} a.inlineLinks {display:block;_zoom:1;} /* redArrow */ ul.redArrow li, a.redArrow {background:url(//s8.s-sfr.fr/css/v7/skin/pictos/redarrow.gif) no-repeat 0 0.4em;padding-left:10px;} a.redArrow {display:block;_zoom:1;} /* margin pareil partout pour les listes */ ul.squareArrow li, ul.siteList li, .redArrow li {margin:5px 0} /* listen */ ul.listen li, a.listen {padding-left:21px; background:url(//s5.s-sfr.fr/css/v7/skin/pictos/listen.png) no-repeat 0 center;min-height:14px; _height:14px;} ul.listen li{margin:3px 0} .listen {display:block;_zoom:1;} /* download */ ul.download li, a.download {padding-left:21px; background:url(//s6.s-sfr.fr/css/v7/skin/pictos/download.png) no-repeat 0 center; min-height:14px; _height:14px;} ul.download li{margin:3px 0} .download {display:block;_zoom:1;} /* content hide/show */ .contentHide .show {display:none;} /* on met la classe show, pour cacher les elements quand le block est en mode "hide" */ .contentShow .hide {display:none;} /* on met la classe hide, pour cacher les elements qui doivent l'etre quand le block est en mode "show" */ /* == tableaux (dataArray) == */ /* dataArray */ /* Vertical + horizontal separator */ .Vseparator {background:url(//s7.s-sfr.fr/css/v7/skin/default/v_separator.gif) repeat-y center top;} /* boutons, (html : texte bouton OU pour les formulaires : */ .btn {text-align:left; overflow:hidden; _overflow:visible;font-size:100%;} .btn, .btn strong, button.btn span {background:url(//s8.s-sfr.fr/css/v7/skin/default/button.png) no-repeat left top; vertical-align:middle;_overflow:visible;} .btn_red, .btn_red strong, button.btn_red span {background-image:url(//s5.s-sfr.fr/css/v7/skin/default/button_red.png);} .btn, button.btn span {display:-moz-inline-box; display:inline-block; padding-left:5px;} .btn strong{display:block; height:18px; color:#FFF; background-position:right top; line-height:18px; _width:1%; white-space:nowrap; padding-right:5px; cursor:pointer; font-weight:normal} .btn span {vertical-align:middle;} button.btn {border:0; margin:0; padding:0; padding-right:1px; display:inline; overflow:hidden; //overflow:visible; background:none; cursor:pointer} button.btn span {overflow:visible; display:block; _width:1%; /*haslayout correcting bug*/} button.btn span span {background:none; padding:0; width:auto; line-height:normal;} body:last-child:not(:root:root) button.btn {display:inline-block;} /* tabs : onglets, declaration de la partie structurelle */ ul.tabs {overflow:hidden; zoom:1} ul.tabs li {float:left; cursor:pointer;} ul.tabs a {display:block; zoom:1; _width:1%; white-space:nowrap; outline:none;} ul.tabs li.last {float:none;_float:left; width:auto;} ul.tabs li.last a{width:auto; } ul.tabs img{vertical-align:middle;} ul.onglets2 li {width:49%} ul.onglets3 li {width:33.1%} ul.onglets4 li {width:24.8%} ul.onglets5 li {width:19%} ul.onglets6 li {width:16%} ul.onglets7 li {width:14%} ul.onglets8 li {width:12.3%} ul.onglets9 li {width:11%} ul.onglets10 li {width:10%} .hasJS .tabCtn {display:none;} .hasJS .tabCurrent {display:block;} .hasJS .tabTitle {display:none;} /**** * F. Blocs conteneurs + structure contenu (line, unit, .block, .blockSimple....) ****/ /* line, unit */ .line, .lastunit {overflow: hidden; _overflow: visible; zoom:1; margin:0; padding:0; display:block; } .unit{float:left;margin-right:10px; zoom:1;} .size1on1{float:none !important;margin-right:0; width:auto} .size1on2{width:49%!important;} .size1on3{width:32.3%!important;} .size2on3{width:66%!important;} .size1on4{width:23.8%!important;} .size3on4{width:74.8%!important;} .size1on5{width:18.8%!important;} .size2on5{width:39%!important;} .size3on5{width:58%!important;} .size4on5{width:78%!important;} .lastunit {float:none;_float:left; width:auto !important; margin-right:0 !important;} /* gestion padding/margin de block */ .blockNWPadding .block{padding-top:10px;padding-left:10px;}/*NW = Nord West*/ /* ** block structure -- */ .block{overflow:hidden;_overflow:visible; zoom:1; position:relative;} .blockInside{position:relative; zoom:1; background:#fff} .body {overflow:hidden; _overflow:visible; zoom:1;} /* head */ .head {overflow:hidden; _overflow:visible; zoom:1; margin:0; padding:1px 9px; color:#fff; background:#A45255; font-weight:bold; font-size:118%;} .head a{color:#fff !important} .headMiddle {overflow:hidden; _overflow:visible; zoom:1; margin:0; padding:3px 5px; color:#fff; background:#A45255; font-weight:bold; font-size:118%;} /* corners and sides (corners are user sometines for side */ .tl, .tr, .bl, .br, .overtl{background-repeat:no-repeat; position:absolute; height:6px; width:6px; font-size:1%; overflow:hidden; z-index:10} .overtl {left:0; top:0;} .tl{background-position: left top;top:0; left:0;} .tr{background-position: right top;top:0; right:0} .bl{background-position: left bottom; bottom:0; left:0;} .br{background-position: right bottom; bottom:0; right:0;} .bl, .br{display:none;} .cornersBottom {display:block; position:relative; z-index:10; zoom:1;} .cornersBottom .cbl, .cornersBottom .cbr {position:relative; z-index:10;font-size:1%; margin-top:-6px; background:no-repeat left bottom;} .cornersBottom .cbl {float:left; } .cornersBottom .cbr {float:right; background-position:right bottom;} /* foot */ .foot{overflow:hidden; _overflow:visible; zoom:1; padding:3px;} .footFilled {background-color:#E5E5E5} .footDark {background:#947E81} .footDark a {color:#fff} /* blockSimple */ body .block .blockSimple .blockInside, .blockSimple .blockInside {border:1px solid #C3C3C3; padding:0;} .blockSimple .tl, .blockSimple .tr, .blockSimple .bl, .blockSimple .br, .blockSimple .cbl, .blockSimple .cbr{background-image:url(//s7.s-sfr.fr/css/v7/skin/blocks/blocksimple_corners.gif); height:6px; width:6px;} .blockSimple .tl{top:-1px; left:-1px;} .blockSimple .tr{top:-1px; right:-1px;} .blockSimple .bl{bottom:-1px; left:-1px;} .blockSimple .br{bottom:-1px; right:-1px;} /* blockSquareShadow : les ombres de ce block, sont actuellement definis sur un fond gris */ .blockSquareShadow .blockInside {border: 1px solid #ccc; background-color:#fff; zoom:1;} .hasJS .blockSquareShadow .blockInside {border:0; padding:3px 5px 6px;} .blockSquareShadow .tl, .blockSquareShadow .br , .blockSquareShadow .overtl{background:url(//s7.s-sfr.fr/css/v7/skin/blocks/blocksquareshadow_h.png) no-repeat left top; width:100%; _width:100.5%; height:3px;} .blockSquareShadow .br {background-position:right bottom; height:6px;} .blockSquareShadow .tr, .blockSquareShadow .bl{background:url(//s8.s-sfr.fr/css/v7/skin/blocks/blocksquareshadow_v.png) no-repeat right top; width:5px; height:100%;} .blockSquareShadow .bl {background-position:left bottom; width:9px;} .blockSquareShadow .tl{top:0; left:0; z-index:20} .blockSquareShadow .tr{top:0; right:0; z-index:21} .blockSquareShadow .br{bottom:0; right:0;z-index:22} .blockSquareShadow .bl{bottom:0; left:0;z-index:23} .blockSquareShadow .overtl {left:0; top:0; z-index:24; width:5px; } /* blockSimpleShadow : blockSimple avec une ombre. Il n'y a rien du blockSimple d'origine */ .blockSimpleShadow .blockInside {border:1px solid #ccc;} .blockSimpleShadow .blockInside, .block .blockSimpleShadow .blockInside {background-color:#fff;} .hasJS .blockSimpleShadow .blockInside {border:0; padding:2px 2px 7px 4px;} .blockSimpleShadow .tl, .blockSimpleShadow .br , .blockSimpleShadow .overtl{background:url(//s5.s-sfr.fr/css/v7/skin/blocks/blocksimpleshadow_h.png) no-repeat left top; width:100%; height:6px;} .blockSimpleShadow .br {background-position:right bottom; height:11px;} .blockSimpleShadow .tr, .blockSimpleShadow .bl{background:url(//s6.s-sfr.fr/css/v7/skin/blocks/blocksimpleshadow_v.png) no-repeat right top; width:6px; height:100%;} .blockSimpleShadow .bl {background-position:left bottom; width:8px;} .blockSimpleShadow .tl{top:0; left:0; z-index:20} .blockSimpleShadow .tr{top:0; right:0; z-index:21} .blockSimpleShadow .br{bottom:0; right:0;z-index:22} .blockSimpleShadow .bl{bottom:0; left:0;z-index:23} .blockSimpleShadow .overtl {left:0; top:0; z-index:24; width:8px; } /* blockTabsType2 : tous les selecteurs sont prefixes afin de permettre la modification des elements */ .blockTabsType2 .tabs {margin-bottom:-1px;position:relative; z-index:5} .blockTabsType2 .tabs li {background:#FFFFFF url(//s7.s-sfr.fr/css/v7/skin/blocks/blocktabstype2_tab_off.gif) no-repeat left top;padding-left:17px;margin-left:13px; position:relative; z-index:1; border:1px solid #A7A7A7; /*border-bottom-color:#C3C3C3;*/ position:relative;} .blockTabsType2 .tabs li.first {//display:inline;} .blockTabsType2 .tabs li a {padding:4px 12px 2px; font-weight:bold; color:#595959; text-decoration:none !important;font-size:130%} .blockTabsType2 .tabs li.current {z-index:4;background:#F0F0F0 url(//s8.s-sfr.fr/css/v7/skin/blocks/blocktabstype2_tab_on.gif) no-repeat left top !important;border-bottom:0;} .blockTabsType2 .tabs li.current a {color:#000 !important;padding-bottom:3px;} .blockTabsType2 .tabs li b {position:absolute; top:-1px; background:url(//s5.s-sfr.fr/css/v7/skin/blocks/blocktabstype2_corners.gif) no-repeat left top;width:4px; height:4px; overflow:hidden;} .blockTabsType2 .tabs li b.tabTl {left:-1px;} .blockTabsType2 .tabs li b.tabTr {right:-1px;background-position:right top;} .IS_IE6 .blockTabsType2 .tabs li b.tabTr {_right:expression(cssRight(this));} /* CSS a utiliser */ .noshdw .tl, .noshdw .tr, .noshdw .br, .noshdw .bl, .noshdw .overtl{display:none!important} /* style specifique de liste+block */ .blockTabsVertical ul.tabs li{float:none;} .blockTabsVertical ul.tabs {float:left;margin-right:-1px; _margin-right:-4px;} .blockTabsVertical .tabsBorder{border:solid 1px #CDCDCD;} .blockTabsVertical .even{background:#EDEDED;} .blockTabsVertical .odd{background:#FEFEFE;} .blockTabsVertical .tabs{position:relative;z-index:21; width:10.4545em; *width:10.3915em;} .blockTabsVertical .tabs li{border-right:solid 1px #CDCDCD;padding:1px 2px 1px 0;} .blockTabsVertical .tabs li.current{border:solid #CDCDCD;border-width:1px 0 1px 0;padding:0 3px 0 0;} .blockTabsVertical .tabs li.first{border-top:none;padding-top:0;} .blockTabsVertical .tabs li a{padding:2px 0 2px 18px;background:url(//s6.s-sfr.fr/css/v7/skin/pictos/flecheBlur.png) center left no-repeat;font-size:100%;} .blockTabsVertical .tabs li.current a{background-image:url(//s7.s-sfr.fr/css/v7/skin/pictos/flecheFocus.png);} .blockTabsVertical .body{border-left:solid 1px #CDCDCD;position:relative;z-index:20;} .blockTabsVertical .tabCtn{padding:1px;} .blockTabsVertical .even{background:#EDEDED;} .blockTabsVertical .odd{background:#FEFEFE;} body .blocksTabHideContents .tabCurrent {display:none !important} /* Declinaison onglets a droite avec picto (bloc "A la une") */ .blockTabsLeft, .blockTabsLeft .odd {background:#fff;} .blockTabsLeft h3.title {border-bottom:1px solid #cccdcd; background:#fff;} .blockTabsLeft {background:#fff;} .blockTabsLeft .body {border-right:1px solid #CDCDCD; border-left:none;} .blockTabsLeft ul.tabs {float:right; margin-left:-1px; margin-right:0; width:13.31em;} * html .blockTabsLeft ul.tabs{margin-left:-4px;} .blockTabsLeft ul.tabs a{white-space:normal !important; width:auto;} .blockTabsLeft .tabs li {border-top:none; border-right:none; border-left:1px solid #cccdcd; border-bottom:1px solid #cccdcd; padding:3px 0 3px 3px !important; background:url(//s8.s-sfr.fr/css/v7/skin/blocks/bkg_tabs.png) repeat-x bottom left;} .blockTabsLeft .tabs li a{background:none; padding:0; vertical-align:middle; min-height:21px !important; line-height:-3em; display:inline;} .blockTabsLeft .tabs li img{margin-right:5px; float:left;} /*.blockTabsLeft .tabs li.first {padding-top:3px;}*/ .blockTabsLeft .tabs li.current {border-left-color:#fff; background:none; padding:3px 0 3px 3px; border-top:none; border-right:none; border-left:1px solid #cccdcd; border-bottom:1px solid #cccdcd;} .blockTabsLeft .tabs li.current a{color:#d10019; background:none;} .blockTabsLeft .meaRight .media {float:left; margin-left:0; margin-right:20px;} .blockTabsLeft .meaRight .media img {border:1px solid #536fb3;} /* footer plus de mobile block actus */ .plus_mobiles {background:url(//s5.s-sfr.fr/css/v7/skin/blocks/blockactus_footerred.gif) repeat-x left bottom;} .plus_mobiles div {background:url(//s6.s-sfr.fr/css/v7/skin/pictos/lesplusmobiles_picto.gif) no-repeat 10px bottom; min-height:30px; _height:30px; padding-left:78px;} .plus_mobiles a {color:#E03D66 !important; line-height:30px; vertical-align:middle;} /* footer vodaphone live block actus*/ .footVodaphone {background:url(//s7.s-sfr.fr/css/v7/skin/blocks/blockactus_footer_vodaphone.png) repeat-x right bottom;} .footVodaphone div {background:url(//s8.s-sfr.fr/css/v7/skin/pictos/picto_aide_vodalive.gif) no-repeat 10px center; min-height:30px; _height:30px; padding-left:40px;} .footVodaphone a {color:#fff !important; line-height:30px;} /* couleurs de fond de blocks */ .blockFilled .blockInside {background-color:#F0F0F0} /**** * G. Custom (blocks specifiques, contenus vraiment specifiques a une partie de la page, non reutilisable ailleurs) ****/ /* ==== page home (template specific), elements specifiques ===== */ #page.home {} #page.home .colTl, #page.home .colTr {display:none;} #page.home #leftCol {display:none} #page.home #rightCol {width:27.27em; *width:27.14em; margin-left:13px; _margin-left:10px; background:none;} #page.home #mainInside {border:0; padding:0} #page.home .blockSimple .bl, #page.home .blockSimple .br{display:block;} #page.home .sizeHome {width:59.3%;} /* largeur colonne de gauche sur home*/ #page.home .unit {margin-right:12px;} #page.home .block .unit {margin-right:6px;} #page.home .head {background-color:#A14264;} #page.home #rightCol .head {background-color:#CE6CD1;} #ajaxBlock {} #ajaxBlock #ajbContainer {overflow:hidden; _overflow:visible; zoom:1;padding:10px; } #ajaxBlock ul.ajaxTab {overflow:hidden; _overflow:visible; zoom:1;margin-bottom:3px; z-index:2; position:relative;} #ajaxBlock ul.currentMenu {margin-bottom:0;//height:41px;position:relative;} #ajaxBlock ul.ajaxTab li {float:left;background:#F0F0F0 no-repeat 2px 2px;padding:2px 5px 2px 30px;border:1px solid #C3C3C3;width:18%;_width:18%;margin-right:4px;height:31px;zoom:1;} #ajaxBlock ul.ajaxTab li .title {display:block;zoom:1;cursor:default;} #ajaxBlock ul.ajaxTab li img {vertical-align:middle;float:left;margin-right:5px;} #ajaxBlock ul.ajaxTab li.first, #ajaxBlock ul.currentMenu li.first {} #ajaxBlock ul.ajaxTab li.last {float:none; zoom:1; _float:left; overflow:hidden; width:auto !important; margin-right:0;} #ajaxBlock ul.ajaxTab li a{display:block; zoom:1; } #ajaxBlock ul.currentMenu li {margin-bottom:4px;} #ajaxBlock ul.currentMenu li.current {margin-bottom:0px;background:white no-repeat 2px 2px;border-bottom:1px solid white;//border-bottom:none;height:35px;//height:37px;} #ajaxBlock ul.fake {display:none;} #ajaxBlock ul.square {list-style-type:square;} #ajaxBlock ul.square li {margin-left:15px;} #ajaxBlock ul a {white-space:normal;} #ajaxBlock .btn_red strong {font-weight:bold;font-size:100%;font-family:Arial;} #ajaxBlock a.pass {display:block;margin-left:5px;} #ajaxBlock .noBMargin {margin-bottom:0px !important;} #ajaxBlock .fline {overflow:hidden; _overflow:visible; zoom:1;} #ajaxBlock label {width:60%;float:left;display:block;} #ajaxBlock input {width:31%;padding:0;} #ajaxBlock .check input {float:left;width:auto;margin-right:5px;} #ajaxBlock .check label {float:none;width:auto;text-align:left;} #ajaxBlock .full input {width:97.6%;float:none} #ajaxBlock .full label {font-weight:bold;width:100%;text-align:left;} #ajaxBlock .unit {width:55%;} #ajaxBlock .lastunit {width:30%;} #ajaxContent {border:1px solid #C3C3C3;padding:10px 5px 10px 10px;margin:-1px 0 3px; position:relative; zoom:1; z-index:1;} #ajaxContent .tab {zoom:1; background:white;overflow:hidden; height:0; position:relative;} #ajaxContent .arrayMessages {zoom:1; position:relative;} #ajaxContent .arrayMessages table {width:100%;} #ajaxContent .arrayMessages caption{font-size:1em;font-weight:bold;text-align:left;} #ajaxContent .arrayMessages thead th {color:#3F3F3F;font-weight:normal;} #ajaxContent .arrayMessages td, .arrayMessages th {padding:1px 5px; border-bottom:1px solid #EEF1F4;} #ajaxContent .arrayMessages a{color:#808080;} #ajaxContent .arrayMessages .notRead a{color:#0E3278; font-weight:bold;} #ajaxContent .arrayMessages .colDe {width:60px;} #ajaxContent .arrayMessages .colObjet {} #ajaxContent .arrayMessages .colDate {width:10%;} #ajaxContent .arrayMessages .cut {word-break:break-all} #ajaxContent .arrayMessages .cut div {width:98%; overflow:hidden;white-space:nowrap;*white-space:normal; word-break:break-word;height:1.2em;} .specialLiveInfo{margin:30px 0 20px 0;color:#173A7C} .specialLiveInfo input.text{width:40px;padding:0;} .specialLiveInfo .submit{text-decoration:underline;} .toolTip {text-align:left;color:black;background:#FFF;//background:#FFFFE1;border:1px solid black;position:absolute;z-index:2;padding:0 3px;width:176px;//width:186px;} /**** * H. Fixs class for navigators (corners, heights, most of the problems comes from IE) ****/ html.IS_IE6 body .tr, html.IS_IE6 body .br, .IS_IE6 #page.home #rightCol .block .tr, .IS_IE6 #page.home .block .br{_right:expression(cssRight(this))} /* autres corners a corriger */ html.IS_IE6 body .block .blockInside .bl,html.IS_IE6 body .block .blockInside .br{_bottom:expression(cssBottom(this, true))} /* heights */ html.IS_IE6 body .blockSimpleShadow .bl, html.IS_IE6 body .blockSimpleShadow .tr, html.IS_IE6 body .blockSquareShadow .bl, html.IS_IE6 body .blockSquareShadow .tr {height:expression(cssHeight(this, true))} .hideCorners .br, .hideCorners .bl {display:none !important} /**** * I. Classes specifiques (lecteurs d'ecran, javascript...) ****/ .screenreader {position:absolute; left:0; top:-5000px; width:1px; height:1px; overflow:hidden;} .error{color: #DA0000;background:#F2B6C0 url(//s8.s-sfr.fr/css/img/error.gif) no-repeat 5px 50%; padding: 5px 5px 5px 40px;min-height: 30px; _height: 30px;} .error_sm{color: #DA0000;background:#D2AFBF url(//s5.s-sfr.fr/css/img/error_sm.gif) no-repeat 5px 5px; padding: 7px 5px 7px 30px;min-height: 15px; _height: 15px;} /* v2008-10-30[0] */