@charset "UTF-8"; /* General Body */ /* NUANCIER DE COULEURS */ /* Basé entièrement sur le nuancier fourni par l'équipe DESIGN */ /* URL : .pdf */ /*********************************************************************/ /* COULEURS DE SECTIONS **********************************************************/ /* UNE : À la une */ /* ACT : Actualités */ /* AFF : affaires/portfolio */ /* ART : Arts */ /* AUT : Auto */ /* CIN : Cinéma */ /* DEB : Débats */ /* DOS : Dossiers */ /* GOU : Gourmand */ /* MAI : Maison */ /* PAU : Pause (billboard) */ /* SPO : Sport */ /* VOY : Voyage */ /* TEC : Techno */ /** spécial **/ /* NOEL : Noël */ /* WCM (petit crayon) */ /* réseau Sociaux */ /* Listes de couleurs */ /**** POUR GENERER RAPIDEMENT UNE LISTE var output=""; var variante="1"; var a_list=new Array("UNE","ACT","AFF","ART","AUT","CIN","DEB","DOS","GOU","MAI","PAU","SPO","VOY","TEC","NOEL") for(i=0;i .main { background: #fff; } a { text-decoration: none; } a img { border: none; } h3 { font: 700 18px Verlag, Arial, sans-serif; text-transform: uppercase; -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; margin: 10px 0; padding: 0; color: #333; } h3 span { text-transform: lowercase; } h3 a { color: #333; } h4 { font: normal 13px Arial, sans-serif; margin: 0; padding: 0; color: #333; -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; } h4 a { color: #333; } sup { line-height: 10px; } .icon { font-family: lp_web_icons, sans-serif; } .sommaire h4 { font: 700 15px Verlag, Arial, sans-serif; text-transform: uppercase; color: #FFF; margin: 0 0 18px 0; padding: 0; } .sommaire h5 { font: normal 11px/18px Arial, sans-serif; color: #c8c8D2; text-transform: uppercase; margin: 0; padding: 0; } .sommaire p { font: normal 14px Arial, sans-serif; padding: 0 0 10px 0; margin: 0 0 10px 0; } .sommaire a { color: #FFF; display: inline; font: normal 13px Arial, sans-serif; margin: 10px 0; } .sommaire a:hover { color: #c8c8D2; } .sommaire ul, .sommaire li { padding: 0; margin: 0; list-style: none; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } .sommaire ul.tableish { display: table; width: 100%; } .sommaire ul.tableish li { display: table-cell; text-align: center; vertical-align: top; } .allCaps { text-transform: uppercase; } /**** CONVERTIR EN MIXIN ??? ********* */ .btn_play, .btn_playSmall, .btn_playBig { position: absolute; display: block; height: 100px; width: 100px; background: transparent; z-index: 20; } .btn_play div, .btn_playSmall div, .btn_playBig div { margin: 30px 0 0 30px; padding: 0 0 0 2px; color: #fff; height: 30px; width: 28px; border-radius: 30px; background: rgba(0, 0, 0, 0.6); box-shadow: 0 0 0 34px rgba(0, 0, 0, 0.6); text-align: center; } .btn_play div:before, .btn_playSmall div:before, .btn_playBig div:before { content: "4"; position: absolute; left: 9px; font: normal 87px/32px lp_web_icons, sans-serif; } /* &:hover * div * background: rgba(0,0,0,0.8) * box-shadow: 0 0 0 30px rgba(0,0,0,0.8) */ .btn_playSmall { height: 45px; width: 45px; } .btn_playSmall div { margin: 13px 0 0 13px; padding: 0 0 0 1px; border-radius: 10px; height: 14px; width: 13px; box-shadow: 0 0 0 17px rgba(0, 0, 0, 0.6); font: normal 7px/15px Arial, sans-serif; } .btn_playSmall div:before { left: 3px; font: normal 41px/17px lp_web_icons, sans-serif; } .btn_playBig { height: 129px; width: 129px; } .btn_playBig div { margin: 37px 0 0 37px; padding: 0 0 0 3px; border-radius: 30px; height: 39px; width: 36px; box-shadow: 0 0 0 37px rgba(0, 0, 0, 0.6); transition: all 150ms linear; } .btn_playBig div:before { position: absolute; left: 13px; font: normal 107px/42px lp_web_icons, sans-serif; } .btn_playBig:hover div { background: rgba(0, 0, 0, 0.8); box-shadow: 0 0 0 37px rgba(0, 0, 0, 0.8); } /* Tout les css de pubs */ /************************** */ /********* acceuil ******** */ .vide { display: none; margin: 0; height: 0; } #fond > .zonePubTop { background: none; padding: 50px 0 0 0; } #fond > .zonePubTop.vide { padding: 0; } .zonePubTop { height: auto; color: #fff; background: #F1F1F1; padding: 70px 0 20px; display: none; } .zonePubTop.vide { height: 50px; display: block; visibility: hidden; padding: 0; } .zonePubTop .publicite { width: 994px; text-align: center; margin: 0 auto; line-height: 0px; color: #fff; } .zonePubTop .publicite > * { margin: 0 auto; } .zonePubTop .wallpaperSideA, .zonePubTop .wallpaperSideB { width: 303px; height: 1000px; top: 50px; left: 0; position: fixed; z-index: 0; cursor: pointer; } .main > header ~ .publicite { margin: 20px 0; background: none; text-align: center; } section.manchette .publicite { margin-top: 40px; min-width: 654px; text-align: center; } aside .publicite { line-height: 0; } .colGauche > .publicite { margin: 40px 0; color: #fff; text-align: center; } /* Pub miniBanière */ .pubInterne { height: 90px; margin: 0; position: relative; overflow: hidden; } .pubInterne a { display: block; height: 90px; } .pubInterne .montageLPP { position: relative; float: left; width: 130px; height: 100px; margin: 6px 20px 0 10px; } .pubInterne .montageLPP > * { position: absolute; } .pubInterne .montageLPP .ipad { z-index: 3; } .pubInterne .montageLPP .section { color: #fff; font: 700 11px Verlag, Arial, sans-serif; padding: 3px 0 2px 5px; top: 5px; left: 21px; width: 88px; z-index: 2; text-transform: uppercase; background: #666; } .pubInterne .montageLPP .clientupdate { width: 88px; height: 48px; z-index: 1; top: 23px; left: 21px; } .pubInterne h4 { font: 800 22px Verlag, Arial, sans-serif; margin: 0; padding: 16px 0 0 0; text-transform: uppercase; } .pubInterne p { font: 500 16px/18px Verlag, Arial, sans-serif; color: #000; margin: 0; padding: 0; width: 580px; } .pubInterne .rollinfo { display: table; opacity: 0; position: absolute; z-index: 10; height: 100%; width: 100%; transition: all 150ms linear; } .pubInterne .rollinfo h5 { font: 700 26px Verlag, Arial, sans-serif; padding-top: 9px; text-transform: uppercase; color: #fff; display: table-cell; vertical-align: middle; text-align: center; } .pubInterne .petitLogo { position: absolute; right: 10px; bottom: 10px; } .pubInterne:hover .rollinfo { opacity: 1; } .zonePubBillboard .publicite { height: 300px; } .billboard { width: 974px; height: 300px; display: block; background: #ebebeb; position: relative; overflow: hidden; } .billboard.ACT { background: #d9d9d9; } .billboard.ACT .fakeBorder { background: #666; } .billboard.ACT .billOverlay { background: rgba(102, 102, 102, 0.8); } .billboard.ACT .billTitre { color: #666; } .billboard.ACT .billTop { background: #b3b3b3; } .billboard.AFF { background: #d8ecf4; } .billboard.AFF .fakeBorder { background: #0574ac; } .billboard.AFF .billOverlay { background: rgba(5, 116, 172, 0.8); } .billboard.AFF .billTitre { color: #0574ac; } .billboard.AFF .billTop { background: #a4d0e4; } .billboard.ART { background: #d5f1f5; } .billboard.ART .fakeBorder { background: #00a5bb; } .billboard.ART .billOverlay { background: rgba(0, 165, 187, 0.8); } .billboard.ART .billTitre { color: #00a5bb; } .billboard.ART .billTop { background: #9cdee6; } .billboard.AUT { background: #c9d7de; } .billboard.AUT .fakeBorder { background: #5b7c8e; } .billboard.AUT .billOverlay { background: rgba(91, 124, 142, 0.8); } .billboard.AUT .billTitre { color: #5b7c8e; } .billboard.AUT .billTop { background: #acc2cd; } .billboard.CIN { background: #e1c7e4; } .billboard.CIN .fakeBorder { background: #9958A1; } .billboard.CIN .billOverlay { background: rgba(153, 88, 161, 0.8); } .billboard.CIN .billTitre { color: #9958A1; } .billboard.CIN .billTop { background: #d1a9d6; } .billboard.DOS { background: #E2E8EE; } .billboard.DOS .fakeBorder { background: #3E6084; } .billboard.DOS .billOverlay { background: rgba(62, 96, 132, 0.8); } .billboard.DOS .billTitre { color: #3E6084; } .billboard.DOS .billTop { background: #B7C6D4; } .billboard.GOU { background: #E7C9D5; } .billboard.GOU .fakeBorder { background: #840132; } .billboard.GOU .billOverlay { background: rgba(132, 1, 50, 0.8); } .billboard.GOU .billTitre { color: #840132; } .billboard.GOU .billTop { background: #D6A9B9; } .billboard.MAI { background: #E7F1E8; } .billboard.MAI .fakeBorder { background: #699771; } .billboard.MAI .billOverlay { background: rgba(105, 151, 113, 0.8); } .billboard.MAI .billTitre { color: #699771; } .billboard.MAI .billTop { background: #A4C8AB; } .billboard.PAU { background: #EAF3D2; } .billboard.PAU .fakeBorder { background: #91BB2B; } .billboard.PAU .billOverlay { background: rgba(145, 187, 43, 0.8); } .billboard.PAU .billTitre { color: #91BB2B; } .billboard.PAU .billTop { background: #D1E695; } .billboard.SPO { background: #FFF0D2; } .billboard.SPO .fakeBorder { background: #FFAF00; } .billboard.SPO .billOverlay { background: rgba(255, 175, 0, 0.8); } .billboard.SPO .billTitre { color: #FFAF00; } .billboard.SPO .billTop { background: #FFE187; } .billboard.VOY { background: #FFDDBE; } .billboard.VOY .fakeBorder { background: #FF6C00; } .billboard.VOY .billOverlay { background: rgba(255, 108, 0, 0.8); } .billboard.VOY .billTitre { color: #FF6C00; } .billboard.VOY .billTop { background: #FFB471; } .billboard.TEC { background: #CCD4F0; } .billboard.TEC .fakeBorder { background: #6473B4; } .billboard.TEC .billOverlay { background: rgba(100, 115, 180, 0.8); } .billboard.TEC .billTitre { color: #6473B4; } .billboard.TEC .billTop { background: #A3AFE7; } .billboard.NOEL { background: #D5F0DC; } .billboard.NOEL .fakeBorder { background: #01A349; } .billboard.NOEL .billOverlay { background: rgba(1, 163, 73, 0.8); } .billboard.NOEL .billTitre { color: #01A349; } .billboard.NOEL .billTop { background: #80D19E; } .billboard .billTop { font: 500 18px Verlag, Arial, sans-serif; color: #fff; display: inline; background: #999; padding: 10px 20px; position: absolute; top: 0; left: 0; text-transform: uppercase; } .billboard .billTop:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .billboard .billTitre { font: 800 36px/36px Verlag, Arial, sans-serif; color: #666; width: 350px; position: absolute; left: 20px; top: 85px; text-transform: uppercase; } .billboard .billTitre .chronique { font: 400 20px Verlag, Arial, sans-serif; display: none; margin: 10px 0 0 0; text-transform: none; } .billboard .billImgOverlay { background: url("../img/billboard_overlay_tablette.png") no-repeat top left; width: 489px; height: 251px; top: 50px; left: 389px; z-index: 10; position: absolute; } .billboard .billImgMain { position: absolute; width: 437px; left: 415px; top: 76px; z-index: 9; } .billboard .billLogo { width: 58px; height: 45px; position: absolute; right: 20px; bottom: 20px; } .billboard .fakeBorder { height: 6px; width: 100%; bottom: 0; left: 0; background: #666; position: absolute; } .billboard:hover .billOverlay { opacity: 1; } .billboard.automatique .billTop { display: none; } .billboard.automatique .billImgOverlay { background: url("../img/billboard_overlay_tablette2.png") no-repeat top left; width: 407px; height: 285px; top: 17px; left: 389px; z-index: 10; position: absolute; } .billboard.automatique .billImgMain { position: absolute; width: 328px; left: 449px; top: 36px; } .billboard.automatique .billTitre { font: 800 46px/46px Verlag, Arial, sans-serif; top: 81px; } .billOverlay { display: table; position: absolute; color: #fff; vertical-align: middle; text-align: center; font: 700 36px Verlag, Arial, sans-serif; background: rgba(102, 102, 102, 0.8); width: 974px; height: 300px; position: absolute; top: 0; left: 0; z-index: 11; opacity: 0; transition: all 150ms linear; } .billOverlay span { vertical-align: middle; text-align: center; display: table-cell; width: 100%; height: 100%; text-transform: uppercase; } .videoBillboard { position: relative; height: 25px; width: 974px; height: 300px; background: none !important; } .videoBillboard.ACT .billOverlay { background: rgba(102, 102, 102, 0.8); } .videoBillboard.AFF .billOverlay { background: rgba(5, 116, 172, 0.8); } .videoBillboard.ART .billOverlay { background: rgba(0, 165, 187, 0.8); } .videoBillboard.AUT .billOverlay { background: rgba(91, 124, 142, 0.8); } .videoBillboard.CIN .billOverlay { background: rgba(153, 88, 161, 0.8); } .videoBillboard.DOS .billOverlay { background: rgba(62, 96, 132, 0.8); } .videoBillboard.GOU .billOverlay { background: rgba(132, 1, 50, 0.8); } .videoBillboard.MAI .billOverlay { background: rgba(105, 151, 113, 0.8); } .videoBillboard.PAU .billOverlay { background: rgba(145, 187, 43, 0.8); } .videoBillboard.SPO .billOverlay { background: rgba(255, 175, 0, 0.8); } .videoBillboard.VOY .billOverlay { background: rgba(255, 108, 0, 0.8); } .videoBillboard.TEC .billOverlay { background: rgba(100, 115, 180, 0.8); } .videoBillboard.NOEL .billOverlay { background: rgba(1, 163, 73, 0.8); } .videoBillboard video { position: absolute; z-index: 1; } .videoBillboard:hover .billOverlay { opacity: 1; cursor: pointer; } .xtra, .promotion { border: solid 1px #d2d2d2; padding: 0; margin: 40px 0; position: relative; /* +demiCouleur($PRO-S,$LPCA-4,138px) */ } .xtra .tabeffect, .promotion .tabeffect, .xtra .shader, .promotion .shader, .xtra .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .xtra .degrade, .promotion .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .promotion .degrade { height: 138px; width: 100%; z-index: 0; position: absolute; background: #d2d2d2; } .xtra .shader, .promotion .shader, .xtra .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .xtra .degrade, .promotion .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .promotion .degrade { background: #beb4ae; z-index: 1; opacity: 0; } .xtra header, .promotion header { position: relative; z-index: 2; } .xtra h2, .promotion h2 { width: 614px; margin: 10px auto; font: 700 25px MuseoSlab, serif; } .xtra h2 a, .promotion h2 a { color: #584d49; text-transform: uppercase; } .xtra > a, .promotion > a { position: relative; z-index: 1; display: block; width: 574px; padding: 20px; min-height: 138px; background: #fff; margin: 0 auto; } .xtra > a .btn_play, .promotion > a .btn_play, .xtra > a .btn_playSmall, .promotion > a .btn_playSmall, .xtra > a .btn_playBig, .promotion > a .btn_playBig { left: 82px; top: 48px; } .xtra > a .tag, .promotion > a .tag { font: 500 14px/17px MuseoSlab, serif; color: #968b86; padding: 0; } .xtra > a h3, .promotion > a h3 { font: 700 18px MuseoSlab, serif; color: #584d49; text-transform: none; margin: 6px 0 9px; transition: all 150ms linear; } .xtra > a p, .promotion > a p { font: 500 14px/17px MuseoSans, Arial, sans-serif; color: #584d49; margin: 0; } .xtra > a img, .promotion > a img { float: left; margin: 0 20px 0 0; width: 218px; height: 145px; } .xtra > a .shader, .promotion > a .shader, .xtra > a .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .xtra > a .degrade, .promotion > a .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .promotion > a .degrade { width: 218px; height: 145px; transition: all 150ms linear; } .xtra > a:hover h3, .promotion > a:hover h3 { color: #968b86; } .xtra > a:hover .shader, .promotion > a:hover .shader, .xtra > a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .xtra > a:hover .degrade, .promotion > a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .promotion > a:hover .degrade { opacity: 0.3; } .xtra ul, .promotion ul { margin: 0 0 20px 24px; padding: 0 0 0 14px; } .xtra ul li, .promotion ul li { font: 500 14px MuseoSlab, serif; list-style-type: none; padding: 3px 0; color: #584d49; transition: all 150ms linear; } .xtra ul li:before, .promotion ul li:before { content: "▶"; font-family: Arial, sans-serif; display: inline-block; vertical-align: middle; line-height: 18px; margin-right: 8px; font-size: 8px; color: #584d49; transition: all 150ms linear; } .xtra ul li:hover:before, .promotion ul li:hover:before { color: #968b86; } .xtra ul li a, .promotion ul li a { color: #584d49; transition: all 150ms linear; } .xtra ul li a:hover, .promotion ul li a:hover { color: #968b86; } .xtra:hover:before, .promotion:hover:before { width: 614px; position: absolute; } .promotion { margin: 40px 0; background: -moz-linear-gradient(top, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d2d2d2), color-stop(143px, #d2d2d2), color-stop(143px, #fff), color-stop(100%, #fff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* IE10+ */ background: linear-gradient(to bottom, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* W3C */ background: linear-gradient(to bottom, #d2d2d2 0%, #d2d2d2 143px, #fff 143px, #fff 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$from', endColorstr='$LPCA-4',GradientType=0 ); /* IE6-8 */ } .promotion h2 { font-size: 20px; width: 258px; text-align: center; } .promotion a { width: 220px; } .promotion a > img { margin: 0 0 20px 0; width: 220px; height: 166px; } .promotion a > .shader, .promotion .manchette .nouvellesTrio a > .degrade, .manchette .nouvellesTrio .promotion a > .degrade { width: 220px; height: 166px; } .promotion + .vitrinePromo { margin: -40px 0 40px 0; } .promotion + .id_obj + .vitrinePromo { margin: -40px 0 40px 0; } .vitrinePromo { border: solid 1px #ebebeb; } .vitrinePromo h2 { background: #d2d2d2; color: #584d49; padding: 8px 0; width: 300px; text-align: center; margin: 0; font: 700 18px MuseoSlab, serif; text-transform: uppercase; } .plusLink { position: relative; } .plusLink img { display: block; position: relative; } .plusPart { background: rgba(0, 0, 0, 0.6); position: absolute; z-index: 100; } .plusPart:nth-child(2) { background: rgba(0, 0, 0, 0.5); } .boxOverlay { position: absolute; z-index: 1000; width: 500px; height: 300px; margin: auto; } .overlayFull { position: fixed; height: 100%; width: 100%; z-index: 1000; overflow: hidden; } .ytube { z-index: 10000; position: absolute; } .ytube .overlayClose { float: right; height: 40px; color: #ebebeb; text-decoration: none; font: normal 43px lp_web_icons, sans-serif; text-align: right; margin: 0 -8px 0 0; } .ytube .overlayClose:hover { color: #999; } .ytube iframe { border: none; } /* petit crayon CSS */ .petitCrayon, .petitCrayonListe, .petitCrayonListeOrigine, .id_obj { display: none; } .petitCrayon.active, .petitCrayonListe.active { display: block; background: #666; position: absolute; right: 10px; margin: 10px 0 0 10px; width: 37px; height: 37px; min-height: 37px; overflow: hidden; border-radius: 35px; z-index: 50; opacity: 1; transition: all 150ms linear; } .petitCrayon.active:hover, .petitCrayonListe.active:hover { opacity: 1; width: 200px; height: auto; border-radius: 0px; z-index: 52; } .petitCrayon.active:hover:before, .petitCrayonListe.active:hover:before { width: 40px; background: #333; margin: 0; border-radius: 0px; display: block; position: absolute; font: normal 50px/39px lp_web_icons, sans-serif; padding: 0; } .petitCrayon.active:hover .contenuEdit, .petitCrayonListe.active:hover .contenuEdit { width: 150px; padding: 10px 0 10px 38px; height: 235px; opacity: 1; } .petitCrayon.active:before, .petitCrayonListe.active:before { content: "/"; color: #fff; position: absolute; font: normal 50px/39px lp_web_icons, sans-serif; padding: 0; } .petitCrayon.active .contenuEdit, .petitCrayonListe.active .contenuEdit { color: #fff !important; position: relative !important; display: block; width: 150px; font: normal 12px Arial, sans-serif; height: 0px; max-height: 45px; overflow: hidden; padding: 10px; float: right; opacity: 0; transition: all 150ms linear; } .petitCrayon.active .contenuEdit a, .petitCrayonListe.active .contenuEdit a { display: block; margin: 5px 0; color: #fff; } .petitCrayon.active .contenuEdit a:hover, .petitCrayonListe.active .contenuEdit a:hover { color: #ebebeb; } .petitCrayonListe.active { right: 10px; z-index: 51; } .petitCrayonListe.active .contenuEdit { padding: 4px 0 10px 0; height: auto; max-height: none; } .petitCrayonListe.active:hover { max-height: none; } .petitCrayonListe.active:hover .contenuEdit { padding: 4px 0 10px 0; height: auto; } .petitCrayonListe.active:before { content: "6"; font: 100 45px/40px lp_web_icons, sans-serif; } .une .petitCrayon.active { margin-top: 38px; } aside.manchette .petitCrayonListe.active { margin-top: 0px; } .hardNews .petitCrayonListe.active { right: 57px; } .slowNews .petitCrayon.active { margin-top: 112px; right: 4px; } .slowNews .petitCrayonListe.active { right: 4px; } .petitCrayon.active.hidden, .petitCrayonListe.active.hidden { display: none; } .hotTopic .petitCrayon.active { margin: 0; } .hotTopic .petitCrayon.active:nth-child(4) { left: 0; } .hotTopic .petitCrayon.active:nth-child(3) { left: 200px; } .hotTopic .petitCrayon.active:nth-child(2) { left: 400px; } .hotTopic .petitCrayon.active:nth-child(1) { left: 600px; } .manchetteSuite .petitCrayonListe.active { top: -43px; } .xtra .petitCrayon.active, .promotion .petitCrayon.active { margin-top: 60px; } .xtra ul li .petitCrayon.active, .promotion ul li .petitCrayon.active { margin-top: -30px !important; } .sectionDouble > .petitCrayonListe { left: 0; } .colGauche section.half:nth-child(odd) .petitCrayonListe.active { right: 341px; } .adminSwitch { display: block; background: #666; position: fixed; right: 10px; bottom: 10px; height: 41px; padding: 10px 10px 1px 45px; box-shadow: 1px 2px 0 rgba(0, 0, 0, 0.7); z-index: 5000001; color: #fff; } .adminSwitch:hover { color: #ebebeb; } .adminSwitch:before { content: "/"; color: #fff; position: absolute; font: normal 50px/39px lp_web_icons, sans-serif; padding: 0; margin: -6px 0 0 -44px; opacity: 1; } .adminSwitch.off:before { opacity: 0.3; } /********** mixins Accueil *********** */ /******* Manchette fold *********** */ /*************** */ /* ANIMATION */ /***************************************** */ /********* init Style répétitifs (accueil only) ******** */ .tag { font: bold 14px Verlag, Arial, sans-serif; text-transform: uppercase; text-decoration: none; color: #333; transition: opacity 150ms; -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; } .tag:hover { opacity: 0.85; } /* statusSpecial Master */ .specialStatus, .specialStatusFull { background: #E1001A; color: #fff; padding: 4px 10px 0 10px; margin-bottom: 0; display: inline-block; text-transform: uppercase; font: normal 13px/13px Verlag, Arial, sans-serif; height: 16px; } .specialStatus.alt, .specialStatusFull.alt { background: #fff600; color: #000; font-weight: 700; } .specialStatusFull { display: block; margin-bottom: 15px; } /* nouvelles Trio GENERIQUE : manchette repeat plus bas */ .nouvellesTrio { width: 654px; position: relative; height: 234px; } .nouvellesTrio:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .nouvellesTrio article { width: 218px; height: 234px; border-bottom: solid 1px #EBEBEB; float: left; position: relative; } .nouvellesTrio article:first-child .contenu { border-right: solid 1px #EBEBEB; width: 218px; } .nouvellesTrio article:nth-child(2) .specialStatusFull, .nouvellesTrio article:nth-child(2) .specialStatus { margin-left: 1px; } .nouvellesTrio article:last-child .contenu { border-left: solid 1px #EBEBEB; width: 217px; } .nouvellesTrio article:last-child .specialStatusFull, .nouvellesTrio article:last-child .specialStatus { margin-left: 1px; } .nouvellesTrio article:hover .social { display: block; opacity: 1; -webkit-transition-delay: 1s; transition-delay: 1s; } .nouvellesTrio a.imageArticle { width: 218px; height: 145px; } .nouvellesTrio img { position: absolute; height: 145px; z-index: 1; } .nouvellesTrio .shader, .manchette .nouvellesTrio .degrade { transition: all 150ms linear; width: 218px; height: 145px; position: absolute; z-index: 9; display: block; content: " "; border-right: solid 1px white; } .nouvellesTrio .infoArticle { position: absolute; bottom: 89px; z-index: 10; overflow: hidden; } .nouvellesTrio .social { opacity: 0; transition: all 150ms linear; margin-bottom: 4px; } .nouvellesTrio .social:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .nouvellesTrio .social .twitter-share-button, .nouvellesTrio .social .fb_iframe_widget { float: left; clear: left; margin: 2px 0 4px 10px; } .nouvellesTrio .specialStatusFull { position: relative; z-index: 10; } .nouvellesTrio .heure { display: none; font: bold 15px Arial, sans-serif; color: #666; } .nouvellesTrio .heure:after { content: " "; } .nouvellesTrio .contenu { text-transform: none; position: relative; top: 145px; width: 218px; height: 89px; margin: 0; padding: 0; overflow: hidden; } .nouvellesTrio .contenu .tag { padding: 5px 10px 0px 10px; } .nouvellesTrio .contenu a { position: absolute; top: 0; display: block; padding: 7px 10px 12px 10px; transition: all 150ms linear; } .nouvellesTrio .contenu a h3 { position: relative; width: 198px; height: 60px; transition: all 150ms linear; } .nouvellesTrio .btn_play, .nouvellesTrio .btn_playSmall, .nouvellesTrio .btn_playBig { left: 62px; top: 22px; } /***************************************************** */ /* Fin init */ /************************************************** */ /* HEADER */ /*********** header general ********** */ /*********************************** */ .main > header { width: 100%; position: relative; margin: 0px auto; } .main > header h1 { width: 140px; height: 140px; padding: 0; position: relative; margin: 0; overflow: hidden; display: block; } .main > header h1 a { display: block; position: absolute; width: 140px; height: 140px; padding: 0; margin: 0; } .main > header h1 a img { width: 140px; height: 140px; } .main > header h1 a:hover { background: #000; } .main > header h1 a:hover img { opacity: 0.9; } .toolbox { width: 814px; border-bottom: solid 1px #ebebeb; position: absolute; top: 0; right: 0; height: 37px; padding: 8px 0 0 0; } .dateDuJour, .meteo { display: inline; font: 700 12px Verlag, arial; line-height: 16px; padding: 0 15px 0 0; -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; text-transform: uppercase; } .meteo { color: #767676; } .icoMeteo { font: normal 22px/22px lp_web_icons, sans-serif; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; text-transform: none; } .mercure { font: 500 18px Verlag, arial; padding: 0 5px 0 5px; -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; } .mercure sup { font: 200 10px/22px Verlag, arial; } .rightctrl { right: 0; top: 5px; position: absolute; width: 300px; height: 40px; text-align: right; } .rightctrl a { display: block; position: relative; height: 40px; padding: 0 12px 0 5px; float: right; overflow: hidden; color: #333; transition: all 150ms linear; width: 20px; } .rightctrl a:hover, .rightctrl a.active { width: 115px; } .rightctrl a > div { width: 130px; } .rightctrl a span { vertical-align: top; display: inline-block; } .rightctrl a .icon { width: 30px; left: 0; font: normal 38px/38px lp_web_icons, sans-serif; } .rightctrl a .text { width: 95px; text-align: center; font: 700 13px/36px Verlag, Arial, sans-serif; text-transform: uppercase; } .rightctrl a.btn_mapresse.logged { width: 32px; } .rightctrl a.btn_mapresse.logged:hover, .rightctrl a.btn_mapresse.logged.active { width: 105px; } .rightctrl a.btn_mapresse.logged img { border-radius: 17px; border: solid 1px #999; width: 34px; height: 34px; } .tooltip { position: absolute; background: rgba(51, 51, 51, 0.95); z-index: 52; width: 809px; height: 69px; padding: 13px 0 0 5px; top: 58px; display: none; } .tooltip.recherche { height: 78px; top: 58px; padding: 2px; } .tooltip.recherche .recherche_google { position: absolute; width: 809px; height: 68px; background-color: #fff; padding-top: 10px; } .tooltip.recherche .recherche_google input { outline: none !important; } .tooltip.recherche .recherche_google input[type="text"] { background-position-y: 0 !important; background-color: transparent !important; font-size: 1.1rem; color: #333; } .tooltip.recherche .recherche_google > div { width: 763px; } .tooltip.recherche > a { color: #fff; opacity: 1; font-weight: normal; position: absolute; transition: all 150ms linear; } .tooltip.recherche .fermer { display: inline-block; font-size: 26px; text-align: center; width: 27px; line-height: 27px; height: 27px; background-color: #ccc; top: 28px; right: 17px; border-radius: 2px; } .tooltip .arrow-up { top: -7px; position: absolute; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid rgba(51, 51, 51, 0.95); } .tooltip.recherche .arrow-up { right: 98px; } .tooltip.mapresse { height: 0px; padding: 0; width: 814px; z-index: 30; } .tooltip.mapresse .contenu { padding-top: 20px; } .tooltip.mapresse .arrow-up { right: 55px; } .hotTopic { height: 75px; position: absolute; top: 65px; right: 0; width: 814px; overflow: hidden; } .hotTopic > a { display: block; width: 200px; height: 75px; position: relative; float: left; margin: 0 0 0 0; } .hotTopic > a.UNE:hover .shader, .hotTopic > a.UNE:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.UNE:hover .degrade { background: rgba(225, 0, 26, 0.3); } .hotTopic > a.ACT:hover .shader, .hotTopic > a.ACT:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.ACT:hover .degrade { background: rgba(102, 102, 102, 0.3); } .hotTopic > a.AFF:hover .shader, .hotTopic > a.AFF:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.AFF:hover .degrade { background: rgba(5, 116, 172, 0.3); } .hotTopic > a.ART:hover .shader, .hotTopic > a.ART:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.ART:hover .degrade { background: rgba(0, 165, 187, 0.3); } .hotTopic > a.AUT:hover .shader, .hotTopic > a.AUT:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.AUT:hover .degrade { background: rgba(91, 124, 142, 0.3); } .hotTopic > a.CIN:hover .shader, .hotTopic > a.CIN:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.CIN:hover .degrade { background: rgba(153, 88, 161, 0.3); } .hotTopic > a.DEB:hover .shader, .hotTopic > a.DEB:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.DEB:hover .degrade { background: rgba(51, 51, 51, 0.3); } .hotTopic > a.DOS:hover .shader, .hotTopic > a.DOS:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.DOS:hover .degrade { background: rgba(62, 96, 132, 0.3); } .hotTopic > a.GOU:hover .shader, .hotTopic > a.GOU:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.GOU:hover .degrade { background: rgba(132, 1, 50, 0.3); } .hotTopic > a.MAI:hover .shader, .hotTopic > a.MAI:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.MAI:hover .degrade { background: rgba(105, 151, 113, 0.3); } .hotTopic > a.PAU:hover .shader, .hotTopic > a.PAU:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.PAU:hover .degrade { background: rgba(145, 187, 43, 0.3); } .hotTopic > a.SPO:hover .shader, .hotTopic > a.SPO:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.SPO:hover .degrade { background: rgba(255, 175, 0, 0.3); } .hotTopic > a.VOY:hover .shader, .hotTopic > a.VOY:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.VOY:hover .degrade { background: rgba(255, 108, 0, 0.3); } .hotTopic > a.TEC:hover .shader, .hotTopic > a.TEC:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.TEC:hover .degrade { background: rgba(100, 115, 180, 0.3); } .hotTopic > a.NOEL:hover .shader, .hotTopic > a.NOEL:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.NOEL:hover .degrade { background: rgba(1, 163, 73, 0.3); } .hotTopic > a.icon:hover .shader, .hotTopic > a.icon:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a.icon:hover .degrade { background: rgba(81, 81, 85, 0.3); } .hotTopic > a.UNE:hover h3, .hotTopic > a.UNE:hover p { color: #b70420; } .hotTopic > a.UNE:hover h3 a, .hotTopic > a.UNE:hover p a { color: #b70420; } .hotTopic > a.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .hotTopic > a.ACT:hover h3, .hotTopic > a.ACT:hover p { color: #8c8c8c; } .hotTopic > a.ACT:hover h3 a, .hotTopic > a.ACT:hover p a { color: #8c8c8c; } .hotTopic > a.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .hotTopic > a.AFF:hover h3, .hotTopic > a.AFF:hover p { color: #0574ac; } .hotTopic > a.AFF:hover h3 a, .hotTopic > a.AFF:hover p a { color: #0574ac; } .hotTopic > a.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .hotTopic > a.ART:hover h3, .hotTopic > a.ART:hover p { color: #00a5bb; } .hotTopic > a.ART:hover h3 a, .hotTopic > a.ART:hover p a { color: #00a5bb; } .hotTopic > a.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .hotTopic > a.AUT:hover h3, .hotTopic > a.AUT:hover p { color: #577180; } .hotTopic > a.AUT:hover h3 a, .hotTopic > a.AUT:hover p a { color: #577180; } .hotTopic > a.AUT:after { /* couleur pour animation ligne */ background: #577180; } .hotTopic > a.CIN:hover h3, .hotTopic > a.CIN:hover p { color: #824D89; } .hotTopic > a.CIN:hover h3 a, .hotTopic > a.CIN:hover p a { color: #824D89; } .hotTopic > a.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .hotTopic > a.DEB:hover h3, .hotTopic > a.DEB:hover p { color: #016a7c; } .hotTopic > a.DEB:hover h3 a, .hotTopic > a.DEB:hover p a { color: #016a7c; } .hotTopic > a.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .hotTopic > a.DOS:hover h3, .hotTopic > a.DOS:hover p { color: #25415C; } .hotTopic > a.DOS:hover h3 a, .hotTopic > a.DOS:hover p a { color: #25415C; } .hotTopic > a.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .hotTopic > a.GOU:hover h3, .hotTopic > a.GOU:hover p { color: #A32F5C; } .hotTopic > a.GOU:hover h3 a, .hotTopic > a.GOU:hover p a { color: #A32F5C; } .hotTopic > a.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .hotTopic > a.MAI:hover h3, .hotTopic > a.MAI:hover p { color: #4A7D54; } .hotTopic > a.MAI:hover h3 a, .hotTopic > a.MAI:hover p a { color: #4A7D54; } .hotTopic > a.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .hotTopic > a.PAU:hover h3, .hotTopic > a.PAU:hover p { color: #6E9A1C; } .hotTopic > a.PAU:hover h3 a, .hotTopic > a.PAU:hover p a { color: #6E9A1C; } .hotTopic > a.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .hotTopic > a.SPO:hover h3, .hotTopic > a.SPO:hover p { color: #F09114; } .hotTopic > a.SPO:hover h3 a, .hotTopic > a.SPO:hover p a { color: #F09114; } .hotTopic > a.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .hotTopic > a.VOY:hover h3, .hotTopic > a.VOY:hover p { color: #F25402; } .hotTopic > a.VOY:hover h3 a, .hotTopic > a.VOY:hover p a { color: #F25402; } .hotTopic > a.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .hotTopic > a.TEC:hover h3, .hotTopic > a.TEC:hover p { color: #4E5C9C; } .hotTopic > a.TEC:hover h3 a, .hotTopic > a.TEC:hover p a { color: #4E5C9C; } .hotTopic > a.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .hotTopic > a.NOEL:hover h3, .hotTopic > a.NOEL:hover p { color: #01823A; } .hotTopic > a.NOEL:hover h3 a, .hotTopic > a.NOEL:hover p a { color: #01823A; } .hotTopic > a.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .hotTopic > a:last-child { margin: 0; } .hotTopic > a:hover h3 { color: #666; } .hotTopic > a img { position: absolute; height: 75px; width: 113px; left: -19px; } .hotTopic > a .cropview { position: absolute; top: 0; left: 0; width: 75px; height: 75px; overflow: hidden; } .hotTopic > a .cropview.left img { left: 0; } .hotTopic > a .cropview.right img { left: -38px; } .hotTopic > a .shader, .hotTopic > a .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .hotTopic > a .degrade { position: absolute; top: 0; left: 0; z-index: 10; width: 75px; height: 75px; transition: all 150ms linear; } .hotTopic > a h3 { position: relative; top: 14px; left: 85px; width: 110px; text-transform: none; font: normal 12px/14px Arial; margin: 0; color: #333; transition: all 150ms linear; } .hotTopic > a .specialStatus { top: 0; left: 85px; position: relative; } /********** Nav ********* */ .barreNav { width: 100%; height: 50px; background: #232325; position: fixed; z-index: 10001; top: 0; } .barreNav nav { width: 994px; margin: 0 auto; padding: 0; position: relative; display: table; } .barreNav nav a { color: #fff; text-decoration: none; text-transform: uppercase; font: 400 12px Verlag, arial; display: table-cell; vertical-align: middle; height: 50px; padding: 0 5px; margin: 0; text-align: center; transition: all 150ms linear; } .barreNav nav a.UNE:hover, .barreNav nav a.UNE.active { background: #E1001A; } .barreNav nav a.ACT:hover, .barreNav nav a.ACT.active { background: #666; } .barreNav nav a.AFF:hover, .barreNav nav a.AFF.active { background: #0574ac; } .barreNav nav a.ART:hover, .barreNav nav a.ART.active { background: #00a5bb; } .barreNav nav a.AUT:hover, .barreNav nav a.AUT.active { background: #5b7c8e; } .barreNav nav a.CIN:hover, .barreNav nav a.CIN.active { background: #9958A1; } .barreNav nav a.DEB:hover, .barreNav nav a.DEB.active { background: #333; } .barreNav nav a.DOS:hover, .barreNav nav a.DOS.active { background: #3E6084; } .barreNav nav a.GOU:hover, .barreNav nav a.GOU.active { background: #840132; } .barreNav nav a.MAI:hover, .barreNav nav a.MAI.active { background: #699771; } .barreNav nav a.PAU:hover, .barreNav nav a.PAU.active { background: #91BB2B; } .barreNav nav a.SPO:hover, .barreNav nav a.SPO.active { background: #FFAF00; } .barreNav nav a.VOY:hover, .barreNav nav a.VOY.active { background: #FF6C00; } .barreNav nav a.TEC:hover, .barreNav nav a.TEC.active { background: #6473B4; } .barreNav nav a.NOEL:hover, .barreNav nav a.NOEL.active { background: #01A349; } .barreNav nav a.icon:hover, .barreNav nav a.icon.active { background: #515155; } .barreNav nav .info, .barreNav nav .home, .barreNav nav .mapresse { padding: 0 10px; color: #fff; width: 15px; /*background-image: url('../img/btn_nav_sprites.png') */ background-repeat: no-repeat; text-transform: none; } .barreNav nav .icon { font: normal 34px lp_web_icons, sans-serif; } .barreNav nav .mapresse.logged img { border: solid 1px #999; border-radius: 17px; position: absolute; top: 7px; right: 6px; width: 34px; height: 34px; } /*********** sous nav ********* */ .barreNav .sousnav { width: 994px; margin: 0 auto; padding: 0; } .barreNav .sousnav > div { display: none; } .barreNav .arrow { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #303033; position: absolute; top: 44px; margin-left: -6px; display: block; } .barreNav .sommaire, .barreNav .sommaireCopy { background: none; height: 388px; display: table; display: none; background: #303033; width: 974px; position: absolute; } .barreNav .sommaire:before, .barreNav .sommaireCopy:before { background: #1A1A1C; position: absolute; width: 100%; left: -99.8%; top: 0; height: 388px; content: " "; } .barreNav .sommaire:after, .barreNav .sommaireCopy:after { background: #303033; width: 100%; right: -99.8%; position: absolute; top: 0; height: 388px; content: " "; } .barreNav .sommaire a, .barreNav .sommaireCopy a { font: 500 14px Arial, sans-serif; } .barreNav .sommaire ul, .barreNav .sommaireCopy ul { margin: 20px 0; } .barreNav .sommaire li, .barreNav .sommaireCopy li { margin: 5px 0; } .barreNav .sommaire h4, .barreNav .sommaireCopy h4 { border-bottom: solid 1px #1A1A1C; padding-bottom: 18px; font-weight: 500; } .barreNav .sommaire .ailleurs, .barreNav .sommaireCopy .ailleurs { width: 222px; background: #1A1A1C; height: 368px; padding: 20px 0 0 10px; display: table-cell; } .barreNav .sommaire .ailleurs .deco, .barreNav .sommaireCopy .ailleurs .deco { width: 104px; border-top: solid 1px #303033; margin: 10px 0; } .barreNav .sommaire .ailleurs .important li a, .barreNav .sommaireCopy .ailleurs .important li a { font-size: 12px; text-transform: uppercase; } .barreNav .sommaire .socialIcons, .barreNav .sommaireCopy .socialIcons { margin: 0 0 40px -2px; padding: 0; } .barreNav .sommaire .sitemap, .barreNav .sommaireCopy .sitemap { width: 114px; padding: 20px 27px 0 33px; background: #303033; display: table-cell; } .barreNav .sommaire .famille, .barreNav .sommaireCopy .famille { width: 204px; padding: 20px 0 0 37px; background: #303033; display: table-cell; } .barreNav .sommaire .famille li, .barreNav .sommaireCopy .famille li { margin: 8px 0; } .barreNav .sommaire .famille li a, .barreNav .sommaireCopy .famille li a { color: #c8c8D2; } .barreNav .sommaire .famille li a span, .barreNav .sommaireCopy .famille li a span { color: #fff; padding: 0 0 0 10px; font-weight: 500; } .barreNav .sommaire .famille li a:hover span, .barreNav .sommaireCopy .famille li a:hover span { color: #c8c8D2; } .barreNav .sommaire .fakeshadow, .barreNav .sommaireCopy .fakeshadow { background: rgba(51, 51, 51, 0.36); height: 10px; display: block; left: -1000px; position: absolute; width: 3945px; z-index: 30; } /*************** MA PRESSE ************ */ .mapresseBox { width: 100%; position: relative; font: normal 16px rubrik, Verlag, Arial, sans-serif; /***** LOGGEDOUT **** */ } .mapresseBox .contenu { width: 328px; right: 0px; background: url(../img/bkg_mapresse.png) repeat; position: absolute; /***** LOGGED **** */ } .mapresseBox .contenu .logo { background: none; padding-top: 0px; text-align: center; padding: 0 0 15px 0; display: block; border-bottom: solid 1px #4d4d4d; } .mapresseBox .contenu .logout div { background: url(../img/bkg_mapresse.png) repeat; width: 270px; text-align: center; display: table-cell; vertical-align: middle; height: 46px; } .mapresseBox .contenu .fermer { font-size: 30px; width: 10px; height: 10px; position: absolute; margin: -34px 0 0 267px; color: #fff; border-bottom: none; background: none; } .mapresseBox .contenu .fermer:hover { color: #999; } .mapresseBox .contenu a { transition: all 150ms linear; } .mapresseBox .logged a { min-height: 19px; font: solid 1px rubrik, Verlag, Arial, sans-serif; text-decoration: none; color: #fff; display: block; padding: 15px 29px; border-bottom: solid 1px #4d4d4d; background: #232325; } .mapresseBox .logged a:hover { color: #999; } .mapresseBox .logged a:last-child { border: none; } .mapresseBox .logged a span { color: #999; font-size: 13px; display: block; } .mapresseBox .login .fermer { margin: -18px 0 0 301px; } .mapresseBox .loginWrap { color: #fff; display: block; padding: 15px 29px; border-bottom: solid 1px #333; background: #232325; } .mapresseBox .loginWrap #erreur { color: #E1001A; font-style: italic; margin: 0 0 10px 0; } .mapresseBox .loginWrap h2 { font: normal 18px rubrik, Verlag, Arial, sans-serif; text-transform: none; margin-top: 0; } .mapresseBox .loginWrap input { background: #ebebeb; width: 242px; height: 20px; padding: 6px 15px; border: none; margin: 0 0 3px 0; } .mapresseBox .loginWrap input.check { float: left; width: auto; margin: -2px 10px 0 0; } .mapresseBox .loginWrap fieldset { border: none; width: 100%; padding: 0; margin: 10px 0; } .mapresseBox .loginWrap label { font-size: 13px; } .mapresseBox .loginWrap button { background: url(../img/bkg_mapresse.png) repeat; color: #ebebeb; padding: 15px 20px; font: normal 16px rubrik, Verlag, Arial, sans-serif; border: none; text-align: left; cursor: pointer; } .mapresseBox .loginWrap button#fbButton { width: 100%; background: #3D5898; position: relative; } .mapresseBox .loginWrap button#fbButton:after { bottom: 0; content: "."; display: block; font: 87px/66px lp_web_icons, sans-serif; height: 52px; opacity: 0.4; overflow: hidden; position: absolute; right: 0; text-align: left; width: 48px; } .mapresseBox .loginWrap button:hover { color: #fff; } .mapresseBox ul { padding: 0 0 0 18px; margin-top: 3px; } .mapresseBox ul li { list-style: none; padding: 4px 0; font-size: 13px; color: #fff; } .mapresseBox ul li:before { position: absolute; left: 28px; content: "▶"; } .mapresseBox ul li a { color: #fff; } .mapresseBox ul li a:hover { color: #999; } .mapresseBox .smallWrap { padding: 0 29px; } .mapresseBox .smallWrap p { text-align: left; color: #ebebeb; margin-bottom: 0; } /*************************************************** */ .fold { width: 100%; position: relative; margin: 20px 0 40px 0; overflow: hidden; } .alerte { color: #fff; margin: 20px 0; } .alerte h2 { background: #b70420; font: 500 18px Verlag, Arial, sans-serif; text-transform: uppercase; margin: 0; padding: 6px 20px 2px 20px; } .alerte .contenu { background: #f00; padding: 20px 20px 20px 20px; margin: 0 0 20px 0; } .alerte .contenu h3 { font: bold 18px Arial, sans-serif; margin: 0; color: #fff; text-transform: none; } .alerte .contenu p { margin: 8px 0 0 0; font: normal 18px Arial, sans-serif; } .alerte .contenu .heure { margin: 0; font-size: 18px; color: #ffc8c8; padding: 0 10px 0 0; } .alerte .contenu .heure:before { margin: 0; content: ""; display: none; } .messageEditeur { position: relative; display: block; width: 974px; height: 136px; background-color: #333; color: #FFF; font: 16px Verlag, Arial, sans-serif; margin: 20px 0; overflow: hidden; } .messageEditeur:before { position: absolute; width: 100%; height: 100%; background: rgba(153, 153, 153, 0.15); content: " "; z-index: 2; opacity: 0; transition: all 150ms linear; } .messageEditeur:hover:before { opacity: 1; } .messageEditeur .message-tbl { display: table; table-layout: fixed; width: 100%; height: 100%; } .messageEditeur .message-tbl > * { position: relative; display: table-cell; vertical-align: middle; } .messageEditeur .media { width: 204px; text-align: center; overflow: hidden; vertical-align: top; } .messageEditeur .media img { display: block; height: 136px; } .messageEditeur h4 { padding: 20px 20px 0 20px; font: 400 20px/25px Verlag, Arial, sans-serif; width: 412px; color: #fff; } .messageEditeur .author { width: 245px; color: #b3b3b3; font: 14px Verlag, Arial, sans-serif; padding: 45px 20px 20px 20px; } .messageEditeur .author .name { text-transform: uppercase; } .messageEditeur .line { width: 1px; height: 70px; background: rgba(255, 255, 255, 0.16); display: block; position: absolute; margin-top: 45px; } .messageEditeur .skyline { display: block; position: absolute; top: 0; left: 204px; width: 729px; background: rgba(0, 0, 0, 0.54); font: 400 16px/25px Verlag, Arial, sans-serif; text-transform: uppercase; padding: 0 20px; z-index: 1; } .gsc-results-wrapper-overlay { top: 10% !important; } /*************************************************** */ /* MANCHETTES * fichier pour les diférentes versions de manchettes (une et trio de nouvelles) */ /*** Manchette basic et dérivés ** */ /* section BASE (regulière) */ section.manchette { width: 654px; top: 0; left: 0; display: inline-block; position: relative; } section.manchette article.une { height: 222px; width: 654px; position: relative; margin: 0 0 10px 0; padding-top: 15px; background: #F1F1F1; overflow: hidden; /* exceptions */ } section.manchette article.une .imgLien { position: absolute; z-index: 10; top: 0; margin: 0; width: 654px; height: 237px; display: block; } section.manchette article.une .imgLien img { position: absolute; z-index: 1; } section.manchette article.une .imgLien .shader, section.manchette article.une .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une .imgLien .degrade { transition: all 150ms linear; position: absolute; z-index: 2; width: 357px; height: 237px; } section.manchette article.une .infoArticle { display: block; pointer-events: none; margin-bottom: 10px; } section.manchette article.une .tag { display: block; min-width: 20px; max-width: 284px; pointer-events: auto; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } section.manchette article.une .tag:before { content: "."; visibility: hidden; display: block; height: 0; margin: 12px 0 0 0; } section.manchette article.une .imgLien ~ * { left: 375px; width: 273px; z-index: 20; display: block; position: relative; } section.manchette article.une .imgLien + .infoArticle, section.manchette article.une .imgLien + .tag { margin-top: -12px; } section.manchette article.une .specialStatus { /* Barre qui affecte la hauteur du contenu si présente */ display: inline; padding: 3px 10px 2px 10px; } section.manchette article.une .specialStatusFull { display: block; margin-top: -15px; margin-bottom: 10px; } section.manchette article.une .txtLien { z-index: 30; display: block; margin: 10px 0 0 0; } section.manchette article.une h3 { margin: 5px 0; font: 700 22px/24px Verlag, Arial, sans-serif; } section.manchette article.une p { color: #333; } section.manchette article.une .contenu { margin: 0 0 5px 0; } section.manchette article.une .creditPhoto { position: absolute; text-transform: uppercase; font-size: 11px; margin: 5px 0 0 0; } section.manchette article.une:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } section.manchette article.une.UNE:hover .imgLien .shader, section.manchette article.une.UNE:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.UNE:hover .imgLien .degrade { background: rgba(225, 0, 26, 0.3); } section.manchette article.une.ACT:hover .imgLien .shader, section.manchette article.une.ACT:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.ACT:hover .imgLien .degrade { background: rgba(102, 102, 102, 0.3); } section.manchette article.une.AFF:hover .imgLien .shader, section.manchette article.une.AFF:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.AFF:hover .imgLien .degrade { background: rgba(5, 116, 172, 0.3); } section.manchette article.une.ART:hover .imgLien .shader, section.manchette article.une.ART:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.ART:hover .imgLien .degrade { background: rgba(0, 165, 187, 0.3); } section.manchette article.une.AUT:hover .imgLien .shader, section.manchette article.une.AUT:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.AUT:hover .imgLien .degrade { background: rgba(91, 124, 142, 0.3); } section.manchette article.une.CIN:hover .imgLien .shader, section.manchette article.une.CIN:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.CIN:hover .imgLien .degrade { background: rgba(153, 88, 161, 0.3); } section.manchette article.une.DEB:hover .imgLien .shader, section.manchette article.une.DEB:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.DEB:hover .imgLien .degrade { background: rgba(51, 51, 51, 0.3); } section.manchette article.une.DOS:hover .imgLien .shader, section.manchette article.une.DOS:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.DOS:hover .imgLien .degrade { background: rgba(62, 96, 132, 0.3); } section.manchette article.une.GOU:hover .imgLien .shader, section.manchette article.une.GOU:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.GOU:hover .imgLien .degrade { background: rgba(132, 1, 50, 0.3); } section.manchette article.une.MAI:hover .imgLien .shader, section.manchette article.une.MAI:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.MAI:hover .imgLien .degrade { background: rgba(105, 151, 113, 0.3); } section.manchette article.une.PAU:hover .imgLien .shader, section.manchette article.une.PAU:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.PAU:hover .imgLien .degrade { background: rgba(145, 187, 43, 0.3); } section.manchette article.une.SPO:hover .imgLien .shader, section.manchette article.une.SPO:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.SPO:hover .imgLien .degrade { background: rgba(255, 175, 0, 0.3); } section.manchette article.une.VOY:hover .imgLien .shader, section.manchette article.une.VOY:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.VOY:hover .imgLien .degrade { background: rgba(255, 108, 0, 0.3); } section.manchette article.une.TEC:hover .imgLien .shader, section.manchette article.une.TEC:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.TEC:hover .imgLien .degrade { background: rgba(100, 115, 180, 0.3); } section.manchette article.une.NOEL:hover .imgLien .shader, section.manchette article.une.NOEL:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.NOEL:hover .imgLien .degrade { background: rgba(1, 163, 73, 0.3); } section.manchette article.une.icon:hover .imgLien .shader, section.manchette article.une.icon:hover .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.icon:hover .imgLien .degrade { background: rgba(81, 81, 85, 0.3); } /* mixin size reset */ section.manchette { /* Panoramique */ } section.manchette article.une { /* manchette magasine */ } section.manchette article.une h3 { transition: all 150ms linear; } section.manchette article.une .specialStatusFull { left: 357px; width: 277px; } section.manchette article.une .btn_playBig { top: 56px; left: 103px; } section.manchette article.une.regular.UNE:hover h3 { color: #b70420; } section.manchette article.une.regular.ACT:hover h3 { color: #8c8c8c; } section.manchette article.une.regular.AFF:hover h3 { color: #0574ac; } section.manchette article.une.regular.ART:hover h3 { color: #00a5bb; } section.manchette article.une.regular.AUT:hover h3 { color: #577180; } section.manchette article.une.regular.CIN:hover h3 { color: #824D89; } section.manchette article.une.regular.DEB:hover h3 { color: #016a7c; } section.manchette article.une.regular.DOS:hover h3 { color: #25415C; } section.manchette article.une.regular.GOU:hover h3 { color: #A32F5C; } section.manchette article.une.regular.MAI:hover h3 { color: #4A7D54; } section.manchette article.une.regular.PAU:hover h3 { color: #6E9A1C; } section.manchette article.une.regular.SPO:hover h3 { color: #F09114; } section.manchette article.une.regular.VOY:hover h3 { color: #F25402; } section.manchette article.une.regular.TEC:hover h3 { color: #4E5C9C; } section.manchette article.une.regular.NOEL:hover h3 { color: #01823A; } section.manchette article.une.magasine { height: 295px; width: 654px; } section.manchette article.une.magasine .imgLien { height: 310px; width: 654px; /* temp pour auto fix img */ } section.manchette article.une.magasine .imgLien img, section.manchette article.une.magasine .imgLien .shader, section.manchette article.une.magasine .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.magasine .imgLien .degrade { height: 310px; width: 654px; } section.manchette article.une.magasine .imgLien ~ * { width: 244px; left: 20px; } section.manchette article.une.magasine .specialStatusFull { left: 0; width: 634px; } section.manchette article.une.magasine .tag { margin-bottom: 9px; } section.manchette article.une.magasine .btn_playBig { top: 100px; right: 150px; } section.manchette article.une.magasine.droite { height: 295px; width: 654px; } section.manchette article.une.magasine.droite .imgLien { height: 310px; width: 654px; /* temp pour auto fix img */ } section.manchette article.une.magasine.droite .imgLien img, section.manchette article.une.magasine.droite .imgLien .shader, section.manchette article.une.magasine.droite .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.magasine.droite .imgLien .degrade { height: 310px; width: 654px; } section.manchette article.une.magasine.droite .imgLien ~ * { width: 244px; left: 400px; } section.manchette article.une.magasine.droite .specialStatusFull { left: 0; width: 634px; } section.manchette article.une.magasine.droite .btn_playBig { top: 100px; left: 150px; } section.manchette article.une.magasine.haut { height: 295px; width: 654px; } section.manchette article.une.magasine.haut .imgLien { height: 310px; width: 654px; /* temp pour auto fix img */ } section.manchette article.une.magasine.haut .imgLien img, section.manchette article.une.magasine.haut .imgLien .shader, section.manchette article.une.magasine.haut .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.magasine.haut .imgLien .degrade { height: 310px; width: 654px; } section.manchette article.une.magasine.haut .imgLien ~ * { width: 644px; left: 20px; width: 624px; } section.manchette article.une.magasine.haut .specialStatusFull { left: 0; width: 634px; } section.manchette article.une.magasine.haut .tag { max-width: 600px; } section.manchette article.une.magasine.bas { height: 295px; width: 654px; } section.manchette article.une.magasine.bas .imgLien { height: 310px; width: 654px; /* temp pour auto fix img */ } section.manchette article.une.magasine.bas .imgLien img, section.manchette article.une.magasine.bas .imgLien .shader, section.manchette article.une.magasine.bas .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.magasine.bas .imgLien .degrade { height: 310px; width: 654px; } section.manchette article.une.magasine.bas .imgLien ~ * { width: 644px; left: 20px; width: 624px; } section.manchette article.une.magasine.bas .specialStatusFull { left: 0; position: absolute; width: 634px; } section.manchette article.une.magasine.bas .specialStatus { top: 134px; } section.manchette article.une.magasine.bas .contenu { max-height: 50px; overflow: hidden; } section.manchette article.une.magasine.bas .txtLien { position: absolute; top: 183px; } section.manchette article.une.magasine.bas .imgLien + .tag { margin: 0; } section.manchette article.une.magasine.bas .creditPhoto { bottom: 15px; } section.manchette article.une.magasine.bas .tag { max-width: 600px; min-width: 20px; position: absolute; bottom: 119px; display: inline; margin: 0; } section.manchette article.une.magasine.bas .tag:before { display: none; } section.manchette article.une.panoramique { height: 335px; width: 974px; } section.manchette article.une.panoramique .imgLien { height: 350px; width: 974px; /* temp pour auto fix img */ } section.manchette article.une.panoramique .imgLien img, section.manchette article.une.panoramique .imgLien .shader, section.manchette article.une.panoramique .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.panoramique .imgLien .degrade { height: 350px; width: 974px; } section.manchette article.une.panoramique .imgLien ~ * { width: 315px; left: 20px; } section.manchette article.une.panoramique .specialStatusFull { width: 330px; left: 0; } section.manchette article.une.panoramique h3 { font-size: 24px; } section.manchette article.une.panoramique.droite { height: 335px; width: 974px; } section.manchette article.une.panoramique.droite .imgLien { height: 350px; width: 974px; /* temp pour auto fix img */ } section.manchette article.une.panoramique.droite .imgLien img, section.manchette article.une.panoramique.droite .imgLien .shader, section.manchette article.une.panoramique.droite .imgLien .nouvellesTrio .degrade, section.manchette .nouvellesTrio article.une.panoramique.droite .imgLien .degrade { height: 350px; width: 974px; } section.manchette article.une.panoramique.droite .imgLien ~ * { width: 310px; left: 654px; } section.manchette article.une.panoramique.droite .specialStatusFull { width: 300px; } section.panoramique + aside.manchette { margin-top: 360px; } section.panoramique article.une .tag { max-width: 364px; } /* couleure blanche pour images foncées */ section.manchette article.une.contraste h3, section.manchette article.une.contraste .heure, section.manchette article.une.contraste .tag, section.manchette article.une.contraste .txtLien, section.manchette article.une.contraste p { color: #fff; } /************ big box ********** */ section.manchette.bigbox header h2 { background: #4d4d4d; margin: 0; padding: 6px 10px; } section.manchette.bigbox header a { color: #fff; font: 500 17px/19px Verlag, Arial, sans-serif; text-transform: uppercase; } section.manchette.bigbox article.une { width: 435px; height: auto; position: relative; margin: 0 0 0 0; padding: 0 0 0 0; background: #d9d9d9; overflow: hidden; min-height: 267px; float: left; } section.manchette.bigbox article.une .btn_playBig { left: 150px; top: 72px; } section.manchette.bigbox article.une .imgLien { width: 435px; height: 290px; position: relative; min-height: 310px; } section.manchette.bigbox article.une .imgLien img { position: relative; width: 435px; height: 290px; } section.manchette.bigbox article.une .imgLien .shader, section.manchette.bigbox article.une .imgLien .nouvellesTrio .degrade, section.manchette.bigbox .nouvellesTrio article.une .imgLien .degrade { position: relative; bottom: 295px; width: 435px; height: 290px; } section.manchette.bigbox article.une .imgLien ~ * { left: 20px; width: 395px; } section.manchette.bigbox article.une .txtLien { font: 500 16px Arial, sans-serif; } section.manchette.bigbox article.une h3 { font: 800 28px Verlag, Arial, sans-serif; } section.manchette.bigbox article.une .tag { max-width: 466px; font: 700 16px Verlag, Arial, sans-serif; } section.manchette.bigbox article.une .heure { color: #E1001A; } section.manchette.bigbox article.une .creditPhoto { position: relative; display: inline; padding: 15px 0; } section.manchette.bigbox article.une .specialStatusFull { margin: 0; padding: 10px 0 5px 10px; position: relative; left: 0; width: 425px; } section.manchette.bigbox .followup { width: 219px; float: right; top: 0; } section.manchette.bigbox .bigboxContainer { /* extra room pour article une */ background: #d9d9d9; } section.manchette.bigbox .bigboxContainer:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } section.manchette.bigbox .bigboxContainer article:not(.une) { background: #f2f2f2; width: 219px; position: relative; right: 0; float: left; border-bottom: solid 1px #fff; } section.manchette.bigbox .bigboxContainer article:not(.une):last-child { border-bottom: solid 1px #f2f2f2; } section.manchette.bigbox .bigboxContainer article:not(.une) .infoArticle { position: relative; width: 205px; top: 10px; left: 10px; pointer-events: none; } section.manchette.bigbox .bigboxContainer article:not(.une) .specialStatus { margin: 0 5px 0 0; /*float: left */ } section.manchette.bigbox .bigboxContainer article:not(.une) .section { padding: 8px 0 0 0; } section.manchette.bigbox .bigboxContainer article:not(.une) .specialStatus + .tag { line-height: 21px; } section.manchette.bigbox .bigboxContainer article:not(.une) .tag { font: 700 12px Verlag, Arial, sans-serif; display: inline; pointer-events: auto; } section.manchette.bigbox .bigboxContainer article:not(.une) .contenu a { height: 74px; padding: 22px 10px 0 10px; margin: -17px 0 0 0; /*background: rgba(244,0,0,0.3) */ display: block; } section.manchette.bigbox .bigboxContainer article:not(.une) h3 { font: 700 14px/17px Arial, sans-serif; text-transform: none; height: 51px; overflow: hidden; } /************************************************** */ .manchette .nouvellesTrio { height: 294px; overflow: hidden; padding-bottom: 1px; } .manchette .nouvellesTrio article { height: 294px; } .manchette .nouvellesTrio article.UNE:hover .degrade { background: rgba(225, 0, 26, 0.3); } .manchette .nouvellesTrio article.ACT:hover .degrade { background: rgba(102, 102, 102, 0.3); } .manchette .nouvellesTrio article.AFF:hover .degrade { background: rgba(5, 116, 172, 0.3); } .manchette .nouvellesTrio article.ART:hover .degrade { background: rgba(0, 165, 187, 0.3); } .manchette .nouvellesTrio article.AUT:hover .degrade { background: rgba(91, 124, 142, 0.3); } .manchette .nouvellesTrio article.CIN:hover .degrade { background: rgba(153, 88, 161, 0.3); } .manchette .nouvellesTrio article.DEB:hover .degrade { background: rgba(51, 51, 51, 0.3); } .manchette .nouvellesTrio article.DOS:hover .degrade { background: rgba(62, 96, 132, 0.3); } .manchette .nouvellesTrio article.GOU:hover .degrade { background: rgba(132, 1, 50, 0.3); } .manchette .nouvellesTrio article.MAI:hover .degrade { background: rgba(105, 151, 113, 0.3); } .manchette .nouvellesTrio article.PAU:hover .degrade { background: rgba(145, 187, 43, 0.3); } .manchette .nouvellesTrio article.SPO:hover .degrade { background: rgba(255, 175, 0, 0.3); } .manchette .nouvellesTrio article.VOY:hover .degrade { background: rgba(255, 108, 0, 0.3); } .manchette .nouvellesTrio article.TEC:hover .degrade { background: rgba(100, 115, 180, 0.3); } .manchette .nouvellesTrio article.NOEL:hover .degrade { background: rgba(1, 163, 73, 0.3); } .manchette .nouvellesTrio article.icon:hover .degrade { background: rgba(81, 81, 85, 0.3); } .manchette .nouvellesTrio article.UNE:hover h3, .manchette .nouvellesTrio article.UNE:hover p { color: #b70420; } .manchette .nouvellesTrio article.UNE:hover h3 a, .manchette .nouvellesTrio article.UNE:hover p a { color: #b70420; } .manchette .nouvellesTrio article.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .manchette .nouvellesTrio article.ACT:hover h3, .manchette .nouvellesTrio article.ACT:hover p { color: #8c8c8c; } .manchette .nouvellesTrio article.ACT:hover h3 a, .manchette .nouvellesTrio article.ACT:hover p a { color: #8c8c8c; } .manchette .nouvellesTrio article.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .manchette .nouvellesTrio article.AFF:hover h3, .manchette .nouvellesTrio article.AFF:hover p { color: #0574ac; } .manchette .nouvellesTrio article.AFF:hover h3 a, .manchette .nouvellesTrio article.AFF:hover p a { color: #0574ac; } .manchette .nouvellesTrio article.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .manchette .nouvellesTrio article.ART:hover h3, .manchette .nouvellesTrio article.ART:hover p { color: #00a5bb; } .manchette .nouvellesTrio article.ART:hover h3 a, .manchette .nouvellesTrio article.ART:hover p a { color: #00a5bb; } .manchette .nouvellesTrio article.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .manchette .nouvellesTrio article.AUT:hover h3, .manchette .nouvellesTrio article.AUT:hover p { color: #577180; } .manchette .nouvellesTrio article.AUT:hover h3 a, .manchette .nouvellesTrio article.AUT:hover p a { color: #577180; } .manchette .nouvellesTrio article.AUT:after { /* couleur pour animation ligne */ background: #577180; } .manchette .nouvellesTrio article.CIN:hover h3, .manchette .nouvellesTrio article.CIN:hover p { color: #824D89; } .manchette .nouvellesTrio article.CIN:hover h3 a, .manchette .nouvellesTrio article.CIN:hover p a { color: #824D89; } .manchette .nouvellesTrio article.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .manchette .nouvellesTrio article.DEB:hover h3, .manchette .nouvellesTrio article.DEB:hover p { color: #016a7c; } .manchette .nouvellesTrio article.DEB:hover h3 a, .manchette .nouvellesTrio article.DEB:hover p a { color: #016a7c; } .manchette .nouvellesTrio article.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .manchette .nouvellesTrio article.DOS:hover h3, .manchette .nouvellesTrio article.DOS:hover p { color: #25415C; } .manchette .nouvellesTrio article.DOS:hover h3 a, .manchette .nouvellesTrio article.DOS:hover p a { color: #25415C; } .manchette .nouvellesTrio article.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .manchette .nouvellesTrio article.GOU:hover h3, .manchette .nouvellesTrio article.GOU:hover p { color: #A32F5C; } .manchette .nouvellesTrio article.GOU:hover h3 a, .manchette .nouvellesTrio article.GOU:hover p a { color: #A32F5C; } .manchette .nouvellesTrio article.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .manchette .nouvellesTrio article.MAI:hover h3, .manchette .nouvellesTrio article.MAI:hover p { color: #4A7D54; } .manchette .nouvellesTrio article.MAI:hover h3 a, .manchette .nouvellesTrio article.MAI:hover p a { color: #4A7D54; } .manchette .nouvellesTrio article.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .manchette .nouvellesTrio article.PAU:hover h3, .manchette .nouvellesTrio article.PAU:hover p { color: #6E9A1C; } .manchette .nouvellesTrio article.PAU:hover h3 a, .manchette .nouvellesTrio article.PAU:hover p a { color: #6E9A1C; } .manchette .nouvellesTrio article.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .manchette .nouvellesTrio article.SPO:hover h3, .manchette .nouvellesTrio article.SPO:hover p { color: #F09114; } .manchette .nouvellesTrio article.SPO:hover h3 a, .manchette .nouvellesTrio article.SPO:hover p a { color: #F09114; } .manchette .nouvellesTrio article.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .manchette .nouvellesTrio article.VOY:hover h3, .manchette .nouvellesTrio article.VOY:hover p { color: #F25402; } .manchette .nouvellesTrio article.VOY:hover h3 a, .manchette .nouvellesTrio article.VOY:hover p a { color: #F25402; } .manchette .nouvellesTrio article.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .manchette .nouvellesTrio article.TEC:hover h3, .manchette .nouvellesTrio article.TEC:hover p { color: #4E5C9C; } .manchette .nouvellesTrio article.TEC:hover h3 a, .manchette .nouvellesTrio article.TEC:hover p a { color: #4E5C9C; } .manchette .nouvellesTrio article.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .manchette .nouvellesTrio article.NOEL:hover h3, .manchette .nouvellesTrio article.NOEL:hover p { color: #01823A; } .manchette .nouvellesTrio article.NOEL:hover h3 a, .manchette .nouvellesTrio article.NOEL:hover p a { color: #01823A; } .manchette .nouvellesTrio article.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .manchette .nouvellesTrio .shader, .manchette .nouvellesTrio .degrade { /* override values*/ /* fallback/image non-cover color */ /* Firefox 3.6+ */ background-image: -moz-linear-gradient(rgba(25, 25, 25, 0), rgba(25, 25, 25, 0.8)); /* Safari 4+, Chrome 1+ */ background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(25, 25, 25, 0)), to(rgba(25, 25, 25, 0.8))); /* Safari 5.1+, Chrome 10+ */ background-image: -webkit-linear-gradient(rgba(25, 25, 25, 0), rgba(25, 25, 25, 0.8)); /* Opera 11.10+ */ background-image: -o-linear-gradient(rgba(25, 25, 25, 0), rgba(25, 25, 25, 0.8)); z-index: 8; height: 45px; top: 100px; } .manchette .nouvellesTrio .degrade { background: none; z-index: 9; height: 145px; top: 0; border-right: solid 1px white; } .manchette .nouvellesTrio .infoArticle { pointer-events: none; overflow: visible; top: 147px; } .manchette .nouvellesTrio .specialStatus { position: absolute; top: -22px; } .manchette .nouvellesTrio .specialStatus:nth-child(3) { left: 87px; } .manchette .nouvellesTrio .tag { font: bold 12px/13.5px Verlag, Arial, sans-serif; color: #666; padding: 5px 10px; display: block; margin: 0 0 5px 0; clear: both; width: auto; z-index: 10; pointer-events: auto; height: auto; } .manchette .nouvellesTrio .contenu { height: 149px; position: absolute; overflow: hidden; top: 145px; } .manchette .nouvellesTrio .contenu a { z-index: 1; padding-top: 5px; width: 198px; height: 140px; color: #666; } .manchette .nouvellesTrio .contenu a h3, .manchette .nouvellesTrio .contenu a p.amorce { height: auto; overflow: hidden; display: block; display: -webkit-box; width: 198px; } .manchette .nouvellesTrio .contenu a h3 { font: bold 15px/17px Arial, sans-serif; text-transform: none; margin: 0; padding-top: 28px; max-height: 54px; } .manchette .nouvellesTrio .contenu a p.amorce { font: normal 14px/17px Arial, sans-serif; position: relative; top: 0; max-height: 51px; padding-top: 6px; border: 0; margin: 0; } .aujourdhui { position: relative; width: 654px; min-height: 200px; margin: 40px 0 0 0; } .aujourdhui:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .aujourdhui .tag { font: normal 14px Verlag, Arial, sans-serif; color: #666; } .manchetteSuite { position: relative; width: 654px; min-height: 200px; margin: 40px 0 0 0; } .manchetteSuite:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .manchetteSuite .tag { font: normal 14px Verlag, Arial, sans-serif; color: #666; } .slowNews { width: 178px; padding: 15px; background: #F1F1F1; float: left; position: relative; } .slowNews article { margin: 0 0 15px 0; height: 213px; } .slowNews article.UNE:hover h3, .slowNews article.UNE:hover p { color: #b70420; } .slowNews article.UNE:hover h3 a, .slowNews article.UNE:hover p a { color: #b70420; } .slowNews article.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .slowNews article.ACT:hover h3, .slowNews article.ACT:hover p { color: #8c8c8c; } .slowNews article.ACT:hover h3 a, .slowNews article.ACT:hover p a { color: #8c8c8c; } .slowNews article.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .slowNews article.AFF:hover h3, .slowNews article.AFF:hover p { color: #0574ac; } .slowNews article.AFF:hover h3 a, .slowNews article.AFF:hover p a { color: #0574ac; } .slowNews article.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .slowNews article.ART:hover h3, .slowNews article.ART:hover p { color: #00a5bb; } .slowNews article.ART:hover h3 a, .slowNews article.ART:hover p a { color: #00a5bb; } .slowNews article.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .slowNews article.AUT:hover h3, .slowNews article.AUT:hover p { color: #577180; } .slowNews article.AUT:hover h3 a, .slowNews article.AUT:hover p a { color: #577180; } .slowNews article.AUT:after { /* couleur pour animation ligne */ background: #577180; } .slowNews article.CIN:hover h3, .slowNews article.CIN:hover p { color: #824D89; } .slowNews article.CIN:hover h3 a, .slowNews article.CIN:hover p a { color: #824D89; } .slowNews article.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .slowNews article.DEB:hover h3, .slowNews article.DEB:hover p { color: #016a7c; } .slowNews article.DEB:hover h3 a, .slowNews article.DEB:hover p a { color: #016a7c; } .slowNews article.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .slowNews article.DOS:hover h3, .slowNews article.DOS:hover p { color: #25415C; } .slowNews article.DOS:hover h3 a, .slowNews article.DOS:hover p a { color: #25415C; } .slowNews article.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .slowNews article.GOU:hover h3, .slowNews article.GOU:hover p { color: #A32F5C; } .slowNews article.GOU:hover h3 a, .slowNews article.GOU:hover p a { color: #A32F5C; } .slowNews article.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .slowNews article.MAI:hover h3, .slowNews article.MAI:hover p { color: #4A7D54; } .slowNews article.MAI:hover h3 a, .slowNews article.MAI:hover p a { color: #4A7D54; } .slowNews article.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .slowNews article.PAU:hover h3, .slowNews article.PAU:hover p { color: #6E9A1C; } .slowNews article.PAU:hover h3 a, .slowNews article.PAU:hover p a { color: #6E9A1C; } .slowNews article.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .slowNews article.SPO:hover h3, .slowNews article.SPO:hover p { color: #F09114; } .slowNews article.SPO:hover h3 a, .slowNews article.SPO:hover p a { color: #F09114; } .slowNews article.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .slowNews article.VOY:hover h3, .slowNews article.VOY:hover p { color: #F25402; } .slowNews article.VOY:hover h3 a, .slowNews article.VOY:hover p a { color: #F25402; } .slowNews article.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .slowNews article.TEC:hover h3, .slowNews article.TEC:hover p { color: #4E5C9C; } .slowNews article.TEC:hover h3 a, .slowNews article.TEC:hover p a { color: #4E5C9C; } .slowNews article.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .slowNews article.NOEL:hover h3, .slowNews article.NOEL:hover p { color: #01823A; } .slowNews article.NOEL:hover h3 a, .slowNews article.NOEL:hover p a { color: #01823A; } .slowNews article.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .slowNews article.UNE:hover .shader, .slowNews article.UNE:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.UNE:hover .degrade { background: rgba(225, 0, 26, 0.3); } .slowNews article.ACT:hover .shader, .slowNews article.ACT:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.ACT:hover .degrade { background: rgba(102, 102, 102, 0.3); } .slowNews article.AFF:hover .shader, .slowNews article.AFF:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.AFF:hover .degrade { background: rgba(5, 116, 172, 0.3); } .slowNews article.ART:hover .shader, .slowNews article.ART:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.ART:hover .degrade { background: rgba(0, 165, 187, 0.3); } .slowNews article.AUT:hover .shader, .slowNews article.AUT:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.AUT:hover .degrade { background: rgba(91, 124, 142, 0.3); } .slowNews article.CIN:hover .shader, .slowNews article.CIN:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.CIN:hover .degrade { background: rgba(153, 88, 161, 0.3); } .slowNews article.DEB:hover .shader, .slowNews article.DEB:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.DEB:hover .degrade { background: rgba(51, 51, 51, 0.3); } .slowNews article.DOS:hover .shader, .slowNews article.DOS:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.DOS:hover .degrade { background: rgba(62, 96, 132, 0.3); } .slowNews article.GOU:hover .shader, .slowNews article.GOU:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.GOU:hover .degrade { background: rgba(132, 1, 50, 0.3); } .slowNews article.MAI:hover .shader, .slowNews article.MAI:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.MAI:hover .degrade { background: rgba(105, 151, 113, 0.3); } .slowNews article.PAU:hover .shader, .slowNews article.PAU:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.PAU:hover .degrade { background: rgba(145, 187, 43, 0.3); } .slowNews article.SPO:hover .shader, .slowNews article.SPO:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.SPO:hover .degrade { background: rgba(255, 175, 0, 0.3); } .slowNews article.VOY:hover .shader, .slowNews article.VOY:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.VOY:hover .degrade { background: rgba(255, 108, 0, 0.3); } .slowNews article.TEC:hover .shader, .slowNews article.TEC:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.TEC:hover .degrade { background: rgba(100, 115, 180, 0.3); } .slowNews article.NOEL:hover .shader, .slowNews article.NOEL:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.NOEL:hover .degrade { background: rgba(1, 163, 73, 0.3); } .slowNews article.icon:hover .shader, .slowNews article.icon:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews article.icon:hover .degrade { background: rgba(81, 81, 85, 0.3); } .slowNews .btn_playSmall { top: 37px; left: 70px; } .slowNews .imgArticle { display: block; margin: 0; position: relative; } .slowNews .shader, .slowNews .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .slowNews .degrade { width: 180px; height: 120px; top: 0; position: absolute; transition: all 150ms linear; } .slowNews .tag { position: absolute; margin-top: 10px; width: 177px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } .slowNews .txtLien { display: block; } .slowNews h3 { font: normal 15px/18px Arial, sans-serif; display: block; height: 75px; text-transform: none; margin: 0; padding-top: 34px; overflow: hidden; transition: all 150ms linear; } .hardNews { float: right; width: 426px; } .hardNews article { margin: 0 0 10px 0; border-bottom: solid 1px #EBEBEB; height: 88px; position: relative; } .hardNews article.UNE:hover h3, .hardNews article.UNE:hover p { color: #b70420; } .hardNews article.UNE:hover h3 a, .hardNews article.UNE:hover p a { color: #b70420; } .hardNews article.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .hardNews article.ACT:hover h3, .hardNews article.ACT:hover p { color: #8c8c8c; } .hardNews article.ACT:hover h3 a, .hardNews article.ACT:hover p a { color: #8c8c8c; } .hardNews article.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .hardNews article.AFF:hover h3, .hardNews article.AFF:hover p { color: #0574ac; } .hardNews article.AFF:hover h3 a, .hardNews article.AFF:hover p a { color: #0574ac; } .hardNews article.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .hardNews article.ART:hover h3, .hardNews article.ART:hover p { color: #00a5bb; } .hardNews article.ART:hover h3 a, .hardNews article.ART:hover p a { color: #00a5bb; } .hardNews article.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .hardNews article.AUT:hover h3, .hardNews article.AUT:hover p { color: #577180; } .hardNews article.AUT:hover h3 a, .hardNews article.AUT:hover p a { color: #577180; } .hardNews article.AUT:after { /* couleur pour animation ligne */ background: #577180; } .hardNews article.CIN:hover h3, .hardNews article.CIN:hover p { color: #824D89; } .hardNews article.CIN:hover h3 a, .hardNews article.CIN:hover p a { color: #824D89; } .hardNews article.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .hardNews article.DEB:hover h3, .hardNews article.DEB:hover p { color: #016a7c; } .hardNews article.DEB:hover h3 a, .hardNews article.DEB:hover p a { color: #016a7c; } .hardNews article.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .hardNews article.DOS:hover h3, .hardNews article.DOS:hover p { color: #25415C; } .hardNews article.DOS:hover h3 a, .hardNews article.DOS:hover p a { color: #25415C; } .hardNews article.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .hardNews article.GOU:hover h3, .hardNews article.GOU:hover p { color: #A32F5C; } .hardNews article.GOU:hover h3 a, .hardNews article.GOU:hover p a { color: #A32F5C; } .hardNews article.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .hardNews article.MAI:hover h3, .hardNews article.MAI:hover p { color: #4A7D54; } .hardNews article.MAI:hover h3 a, .hardNews article.MAI:hover p a { color: #4A7D54; } .hardNews article.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .hardNews article.PAU:hover h3, .hardNews article.PAU:hover p { color: #6E9A1C; } .hardNews article.PAU:hover h3 a, .hardNews article.PAU:hover p a { color: #6E9A1C; } .hardNews article.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .hardNews article.SPO:hover h3, .hardNews article.SPO:hover p { color: #F09114; } .hardNews article.SPO:hover h3 a, .hardNews article.SPO:hover p a { color: #F09114; } .hardNews article.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .hardNews article.VOY:hover h3, .hardNews article.VOY:hover p { color: #F25402; } .hardNews article.VOY:hover h3 a, .hardNews article.VOY:hover p a { color: #F25402; } .hardNews article.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .hardNews article.TEC:hover h3, .hardNews article.TEC:hover p { color: #4E5C9C; } .hardNews article.TEC:hover h3 a, .hardNews article.TEC:hover p a { color: #4E5C9C; } .hardNews article.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .hardNews article.NOEL:hover h3, .hardNews article.NOEL:hover p { color: #01823A; } .hardNews article.NOEL:hover h3 a, .hardNews article.NOEL:hover p a { color: #01823A; } .hardNews article.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .hardNews article:last-child { margin: 0; } .hardNews article:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: absolute; background: #666; transition: all 250ms ease-in; } .hardNews article:hover:after { width: 100%; } .hardNews article:hover:after { width: 100%; } .hardNews .tag { z-index: 10; position: absolute; display: inline; } .hardNews .lienPrincipal { display: block; width: 100%; height: 100%; position: absolute; top: 0; z-index: 1; } .hardNews h3 { font: bold 18px/23px Arial, sans-serif; display: block; margin: 0; text-transform: none; height: 50px; overflow: hidden; padding-top: 24px; transition: all 150ms linear; } .hardNews .specialStatus + .tag { margin: 3px 0 0 8px; } .moreNews .UNE a:hover .shader, .moreNews .UNE a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .UNE a:hover .degrade { background: rgba(225, 0, 26, 0.3); } .moreNews .ACT a:hover .shader, .moreNews .ACT a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .ACT a:hover .degrade { background: rgba(102, 102, 102, 0.3); } .moreNews .AFF a:hover .shader, .moreNews .AFF a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .AFF a:hover .degrade { background: rgba(5, 116, 172, 0.3); } .moreNews .ART a:hover .shader, .moreNews .ART a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .ART a:hover .degrade { background: rgba(0, 165, 187, 0.3); } .moreNews .AUT a:hover .shader, .moreNews .AUT a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .AUT a:hover .degrade { background: rgba(91, 124, 142, 0.3); } .moreNews .CIN a:hover .shader, .moreNews .CIN a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .CIN a:hover .degrade { background: rgba(153, 88, 161, 0.3); } .moreNews .DEB a:hover .shader, .moreNews .DEB a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .DEB a:hover .degrade { background: rgba(51, 51, 51, 0.3); } .moreNews .DOS a:hover .shader, .moreNews .DOS a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .DOS a:hover .degrade { background: rgba(62, 96, 132, 0.3); } .moreNews .GOU a:hover .shader, .moreNews .GOU a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .GOU a:hover .degrade { background: rgba(132, 1, 50, 0.3); } .moreNews .MAI a:hover .shader, .moreNews .MAI a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .MAI a:hover .degrade { background: rgba(105, 151, 113, 0.3); } .moreNews .PAU a:hover .shader, .moreNews .PAU a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .PAU a:hover .degrade { background: rgba(145, 187, 43, 0.3); } .moreNews .SPO a:hover .shader, .moreNews .SPO a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .SPO a:hover .degrade { background: rgba(255, 175, 0, 0.3); } .moreNews .VOY a:hover .shader, .moreNews .VOY a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .VOY a:hover .degrade { background: rgba(255, 108, 0, 0.3); } .moreNews .TEC a:hover .shader, .moreNews .TEC a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .TEC a:hover .degrade { background: rgba(100, 115, 180, 0.3); } .moreNews .NOEL a:hover .shader, .moreNews .NOEL a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .NOEL a:hover .degrade { background: rgba(1, 163, 73, 0.3); } .moreNews .icon a:hover .shader, .moreNews .icon a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .icon a:hover .degrade { background: rgba(81, 81, 85, 0.3); } .moreNews article { margin: 0; border-bottom: solid 1px #EBEBEB; height: 140px; position: relative; } .moreNews article.UNE:hover h3, .moreNews article.UNE:hover p { color: #b70420; } .moreNews article.UNE:hover h3 a, .moreNews article.UNE:hover p a { color: #b70420; } .moreNews article.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .moreNews article.ACT:hover h3, .moreNews article.ACT:hover p { color: #8c8c8c; } .moreNews article.ACT:hover h3 a, .moreNews article.ACT:hover p a { color: #8c8c8c; } .moreNews article.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .moreNews article.AFF:hover h3, .moreNews article.AFF:hover p { color: #0574ac; } .moreNews article.AFF:hover h3 a, .moreNews article.AFF:hover p a { color: #0574ac; } .moreNews article.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .moreNews article.ART:hover h3, .moreNews article.ART:hover p { color: #00a5bb; } .moreNews article.ART:hover h3 a, .moreNews article.ART:hover p a { color: #00a5bb; } .moreNews article.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .moreNews article.AUT:hover h3, .moreNews article.AUT:hover p { color: #577180; } .moreNews article.AUT:hover h3 a, .moreNews article.AUT:hover p a { color: #577180; } .moreNews article.AUT:after { /* couleur pour animation ligne */ background: #577180; } .moreNews article.CIN:hover h3, .moreNews article.CIN:hover p { color: #824D89; } .moreNews article.CIN:hover h3 a, .moreNews article.CIN:hover p a { color: #824D89; } .moreNews article.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .moreNews article.DEB:hover h3, .moreNews article.DEB:hover p { color: #016a7c; } .moreNews article.DEB:hover h3 a, .moreNews article.DEB:hover p a { color: #016a7c; } .moreNews article.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .moreNews article.DOS:hover h3, .moreNews article.DOS:hover p { color: #25415C; } .moreNews article.DOS:hover h3 a, .moreNews article.DOS:hover p a { color: #25415C; } .moreNews article.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .moreNews article.GOU:hover h3, .moreNews article.GOU:hover p { color: #A32F5C; } .moreNews article.GOU:hover h3 a, .moreNews article.GOU:hover p a { color: #A32F5C; } .moreNews article.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .moreNews article.MAI:hover h3, .moreNews article.MAI:hover p { color: #4A7D54; } .moreNews article.MAI:hover h3 a, .moreNews article.MAI:hover p a { color: #4A7D54; } .moreNews article.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .moreNews article.PAU:hover h3, .moreNews article.PAU:hover p { color: #6E9A1C; } .moreNews article.PAU:hover h3 a, .moreNews article.PAU:hover p a { color: #6E9A1C; } .moreNews article.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .moreNews article.SPO:hover h3, .moreNews article.SPO:hover p { color: #F09114; } .moreNews article.SPO:hover h3 a, .moreNews article.SPO:hover p a { color: #F09114; } .moreNews article.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .moreNews article.VOY:hover h3, .moreNews article.VOY:hover p { color: #F25402; } .moreNews article.VOY:hover h3 a, .moreNews article.VOY:hover p a { color: #F25402; } .moreNews article.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .moreNews article.TEC:hover h3, .moreNews article.TEC:hover p { color: #4E5C9C; } .moreNews article.TEC:hover h3 a, .moreNews article.TEC:hover p a { color: #4E5C9C; } .moreNews article.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .moreNews article.NOEL:hover h3, .moreNews article.NOEL:hover p { color: #01823A; } .moreNews article.NOEL:hover h3 a, .moreNews article.NOEL:hover p a { color: #01823A; } .moreNews article.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .moreNews article:last-child { margin: 0; } .moreNews article:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: absolute; background: #666; transition: all 250ms ease-in; } .moreNews article:hover:after { width: 100%; } .moreNews article:hover:after { width: 100%; } .moreNews .btn_playSmall { top: 50%; left: 66px; margin-top: -34px; } .moreNews .btn_playSmall div { border-radius: 50%; height: 45px; width: 45px; } .moreNews .btn_playSmall div:before { left: 5px; font: normal 75px/48px lp_web_icons, sans-serif; } .moreNews img { float: left; margin: 10px; } .moreNews .shader, .moreNews .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .moreNews .degrade { height: 120px; width: 180px; position: absolute; z-index: 100; top: 10px; left: 10px; } .moreNews .characteristic { position: absolute; top: 10px; left: 200px; } .moreNews .specialStatus, .moreNews .specialStatusFull { margin-right: 10px; } .moreNews .tag { position: relative; display: inline-block; } .moreNews .lienPrincipal { display: block; width: 100%; height: 100%; position: absolute; top: 0; z-index: 1; } .moreNews h3 { font: bold 16px/21px Arial, sans-serif; display: block; display: -webkit-box; margin: 10px 0; text-transform: none; max-height: 45px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; padding-top: 30px; transition: all 150ms linear; } .moreNews p { margin: 8px 0 0 0; font: normal 14px Arial, sans-serif; color: #333; transition: all 150ms linear; } .moreNews .specialStatus + .tag { margin: 3px 0 0 0px; } /* aside */ aside.manchette { width: 300px; margin-top: 0px; right: 0; display: inline-block; position: absolute; vertical-align: top; } aside .boiteOnglets .tabs:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } aside .boiteOnglets .tabs a { text-decoration: none; text-transform: uppercase; display: block; float: left; padding: 10px 0; width: 99px; text-align: center; font: 400 14px Verlag, Arial, sans-serif; color: #999; background: #F1F1F1; transition: all 150ms linear; } aside .boiteOnglets .tabs a:hover, aside .boiteOnglets .tabs a.active { color: #333; background: #FFF; } aside .boiteOnglets .tabs a:nth-child(2) { width: 100px; border-left: solid 1px #FFF; border-right: solid 1px #FFF; } aside .boiteOnglets .tabsContent { position: relative; } aside .boiteOnglets ol, aside .boiteOnglets ul { list-style-type: none; margin: 0; padding: 0; display: none; overflow: hidden; width: 300px; } aside .boiteOnglets ol li, aside .boiteOnglets ul li { height: 80px; background: #fff; position: relative; border-bottom: solid 1px #EBEBEB; } aside .boiteOnglets ol li.inactive, aside .boiteOnglets ul li.inactive { display: none; } aside .boiteOnglets ol li a, aside .boiteOnglets ul li a { display: table; width: 100%; height: 100%; overflow: hidden; } aside .boiteOnglets ol li a h4, aside .boiteOnglets ul li a h4 { display: table-cell; font: normal 14px Arial, sans-serif; width: 216px; vertical-align: middle; transition: all 150ms linear; } aside .boiteOnglets ol.active, aside .boiteOnglets ul.active { display: block; } aside .boiteOnglets ol.activeTransition, aside .boiteOnglets ul.activeTransition { display: block; position: absolute; top: 0; z-index: 5; } aside .boiteOnglets ol { counter-reset: customlistcounter; counter-reset: grosZero; } aside .boiteOnglets ol li { counter-increment: customlistcounter; } aside .boiteOnglets ol li:nth-child(10) { counter-increment: grosZero; counter-reset: customlistcounter; } aside .boiteOnglets ol li a { -moz-font-feature-settings: "lnum" 1; -moz-font-feature-settings: "lnum=1"; -ms-font-feature-settings: "lnum" 1; -o-font-feature-settings: "lnum" 1; -webkit-font-feature-settings: "lnum" 1; font-feature-settings: "lnum" 1; } aside .boiteOnglets ol li a:before { content: counter(grosZero)counter(customlistcounter); display: table-cell; vertical-align: middle; padding-left: 10px; font: 100 35px Verlag, Arial, sans-serif !important; padding-top: 5px; color: #E1001A !important; } aside .darkLinkBox { background-color: #333; color: #FFF; overflow: hidden; } aside .darkLinkBox a { display: block; position: relative; padding-bottom: 12px; } aside .darkLinkBox a:before { position: absolute; background: #999; height: 100%; width: 100%; content: " "; z-index: 2; opacity: 0; transition: all 150ms linear; } aside .darkLinkBox a:hover:before { opacity: 0.15; } aside .darkLinkBox h4 { color: #fff; display: block; position: relative; width: 270px; background: rgba(0, 0, 0, 0.54); font: 400 16px/25px Verlag, Arial, sans-serif; text-transform: uppercase; padding: 0 10px 0 20px; } aside .darkLinkBox img { float: left; margin: 0 15px 15px 0; width: 130px; height: 87px; } aside .darkLinkBox p { font: 100 16px Verlag, Arial, sans-serif; padding: 8px 15px 8px 20px; color: #FFF; margin: 0; } /********* end ******** */ /***** uderfold *********** */ .underFold { position: relative; vertical-align: top; overflow: hidden; margin: 40px 0 0 0; padding: 0 0 40px 0; } .colGauche { width: 654px; position: relative; display: inline-block; left: 0; } .colGauche section { margin: 40px 0; position: relative; /***** Page Films ******** */ } .colGauche section:first-child { margin-top: 0; } .colGauche section:last-child { margin-bottom: 0; } .colGauche section#boiteACT { margin-top: 0; } .colGauche section header { position: relative; } .colGauche section header .shader, .colGauche section header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section header .degrade { width: 100%; height: 100%; position: absolute; opacity: 0; top: 0; right: 0; z-index: 1; } .colGauche section header h2 { margin: 0; padding: 0px; line-height: 30px; height: 50px; font: 500 26px Verlag, Arial, sans-serif; text-transform: uppercase; letter-spacing: 1px; } .colGauche section header h2 a { color: #fff; z-index: 10; position: absolute; display: block; padding: 10px; } .colGauche section header .options { position: absolute; top: 17px; right: 0; width: 309px; text-align: right; z-index: 2; padding-right: 10px; } .colGauche section header .options a { color: #333; text-transform: uppercase; font: normal 15px Arial, sans-serif; padding: 0 20px; } .colGauche section header .options a.active, .colGauche section header .options a:hover { color: #fff; } .colGauche section header .options a.guidetv { font: 500 16px Arial, sans-serif; color: #fff; /*background: url('../img/ico_guidetv.png') no-repeat right top */ padding: 0 28px 0 0; margin: 0 6px 0 0; transition: all 150ms linear; } .colGauche section header .options a.guidetv:after { content: "5"; font: normal 54px/20px lp_web_icons, sans-serif; position: absolute; } .colGauche section header .options a.guidetv:hover { color: #d5f1f5; } .colGauche section .indices { background: #012037; height: 14px; padding: 8px 10px; color: #fff; } .colGauche section .indices h5 { float: left; font: bold 12px Arial, sans-serif; color: #a4d0e4; padding: 0; margin: 0; text-transform: uppercase; } .colGauche section .indices ul { width: 558px; float: right; padding: 0; margin: 0; display: table; } .colGauche section .indices li { display: table-cell; text-align: center; padding: 0 20px 0 0; margin: 0; font: bold 12px Arial, sans-serif; text-transform: uppercase; } .colGauche section .indices li .fleche { background-image: url("../img/ico_indices.png"); background-repeat: no-repeat; background-position: 0 -18px; height: 9px; width: 13px; display: inline-block; margin: 0 0 0 8px; } .colGauche section .indices li.hausse .fleche { background-position: 0 0; } .colGauche section .indices li.baisse .fleche { background-position: 0 -9px; } .colGauche section .extra { background: #333; color: #fff; height: 30px; position: relative; } .colGauche section .extra.inactive { display: none; } .colGauche section .extra p { position: absolute; top: 6px; left: 10px; padding: 0; margin: 0; font: normal 12px Arial, sans-serif; text-transform: uppercase; } .colGauche section .extra a { position: absolute; top: 6px; color: #FFF; text-transform: uppercase; padding-left: 10px; } .colGauche section .extra a.btn_region { right: 10px; } .colGauche section .extra .arrow-up { top: -7px; right: 248px; position: absolute; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #333; } .colGauche section .extra .btn_region { padding: 2px 25px 0 0; } .colGauche section .extra .btn_region .cog { background: url("../img/ico_cog.png"); width: 18px; height: 18px; position: absolute; top: 0; right: 0; transition: all 300ms linear; } .colGauche section .extra .btn_region:hover .cog { -webkit-transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .colGauche section .extra .changeRegion { width: 100%; position: absolute; top: 30px; height: 70px; background: #000; z-index: 25; display: none; } .colGauche section .extra .changeRegion.active { display: block; } .colGauche section .extra .changeRegion .selectRegion { width: 450px; font: normal 15px Arial, sans-serif; color: #666; height: 39px; padding: 8px 10px; border: none; border-radius: 0; margin: 15px 0 0 30px; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-background-clip: padding; -moz-background-clip: padding; background-clip: padding-box; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; webkit-appearance: none; outline: 0; } .colGauche section .extra .changeRegion .arrow-down { top: 32px; left: 452px; position: absolute; pointer-events: none; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #666; } .colGauche section .extra .changeRegion a { display: block; vertical-align: middle; width: 129px; text-align: center; background: #666; height: 28px; margin: 9px 0 0 0; padding: 12px 0 0 0; right: 30px; text-transform: none; } .colGauche section .extra .changeRegion a:hover { background: #4d4d4d; } .colGauche section .nouvellesTrio { overflow: hidden; padding-bottom: 1px; } .colGauche section .nouvellesTrio article .specialStatus, .colGauche section .nouvellesTrio article .specialStatusFull { position: absolute; width: 198px; } .colGauche section .nouvellesTrio article:nth-child(2) .specialStatusFull { width: 197px; } .colGauche section .nouvellesTrio .social a:hover { text-decoration: none; } .colGauche section .nouvellesTrio .contenu .tag { position: absolute; float: left; z-index: 10; padding: 5px 0 0 0; margin: 0 0 0 10px; max-width: 200px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } .colGauche section .nouvellesTrio .contenu a:not(.tag) { position: relative; display: block; padding-top: 16px; } .colGauche section .nouvellesTrio .contenu h3 { height: 53px; font: normal 14px Arial, sans-serif; text-transform: none; position: relative; } .colGauche section .hiddenDataACT { /* Pas en display none, pour ne pas charger inutilement les images (display none = offsetTop = scrollPosY) */ display: block; position: absolute; z-index: 0; visibility: hidden; pointer-events: none; height: 1px; overflow: hidden; } .colGauche section .subcontent header h2 { color: #fff; font-size: 20px; height: 40px; } .colGauche section .subcontent header h2 a { padding: 8px 10px; } .colGauche section.UNE article:hover .shader, .colGauche section.UNE article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.UNE article:hover .degrade { background: rgba(225, 0, 26, 0.3); } .colGauche section.ACT article:hover .shader, .colGauche section.ACT article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.ACT article:hover .degrade { background: rgba(102, 102, 102, 0.3); } .colGauche section.AFF article:hover .shader, .colGauche section.AFF article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.AFF article:hover .degrade { background: rgba(5, 116, 172, 0.3); } .colGauche section.ART article:hover .shader, .colGauche section.ART article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.ART article:hover .degrade { background: rgba(0, 165, 187, 0.3); } .colGauche section.AUT article:hover .shader, .colGauche section.AUT article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.AUT article:hover .degrade { background: rgba(91, 124, 142, 0.3); } .colGauche section.CIN article:hover .shader, .colGauche section.CIN article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.CIN article:hover .degrade { background: rgba(153, 88, 161, 0.3); } .colGauche section.DEB article:hover .shader, .colGauche section.DEB article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.DEB article:hover .degrade { background: rgba(51, 51, 51, 0.3); } .colGauche section.DOS article:hover .shader, .colGauche section.DOS article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.DOS article:hover .degrade { background: rgba(62, 96, 132, 0.3); } .colGauche section.GOU article:hover .shader, .colGauche section.GOU article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.GOU article:hover .degrade { background: rgba(132, 1, 50, 0.3); } .colGauche section.MAI article:hover .shader, .colGauche section.MAI article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.MAI article:hover .degrade { background: rgba(105, 151, 113, 0.3); } .colGauche section.PAU article:hover .shader, .colGauche section.PAU article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.PAU article:hover .degrade { background: rgba(145, 187, 43, 0.3); } .colGauche section.SPO article:hover .shader, .colGauche section.SPO article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.SPO article:hover .degrade { background: rgba(255, 175, 0, 0.3); } .colGauche section.VOY article:hover .shader, .colGauche section.VOY article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.VOY article:hover .degrade { background: rgba(255, 108, 0, 0.3); } .colGauche section.TEC article:hover .shader, .colGauche section.TEC article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.TEC article:hover .degrade { background: rgba(100, 115, 180, 0.3); } .colGauche section.NOEL article:hover .shader, .colGauche section.NOEL article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.NOEL article:hover .degrade { background: rgba(1, 163, 73, 0.3); } .colGauche section.icon article:hover .shader, .colGauche section.icon article:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.icon article:hover .degrade { background: rgba(81, 81, 85, 0.3); } .colGauche section.UNE article:hover h3 { color: #b70420; } .colGauche section.UNE article:hover h3 a { color: #b70420; } .colGauche section.ACT article:hover h3 { color: #8c8c8c; } .colGauche section.ACT article:hover h3 a { color: #8c8c8c; } .colGauche section.AFF article:hover h3 { color: #0574ac; } .colGauche section.AFF article:hover h3 a { color: #0574ac; } .colGauche section.ART article:hover h3 { color: #00a5bb; } .colGauche section.ART article:hover h3 a { color: #00a5bb; } .colGauche section.AUT article:hover h3 { color: #577180; } .colGauche section.AUT article:hover h3 a { color: #577180; } .colGauche section.CIN article:hover h3 { color: #824D89; } .colGauche section.CIN article:hover h3 a { color: #824D89; } .colGauche section.DEB article:hover h3 { color: #016a7c; } .colGauche section.DEB article:hover h3 a { color: #016a7c; } .colGauche section.DOS article:hover h3 { color: #25415C; } .colGauche section.DOS article:hover h3 a { color: #25415C; } .colGauche section.GOU article:hover h3 { color: #A32F5C; } .colGauche section.GOU article:hover h3 a { color: #A32F5C; } .colGauche section.MAI article:hover h3 { color: #4A7D54; } .colGauche section.MAI article:hover h3 a { color: #4A7D54; } .colGauche section.PAU article:hover h3 { color: #6E9A1C; } .colGauche section.PAU article:hover h3 a { color: #6E9A1C; } .colGauche section.SPO article:hover h3 { color: #F09114; } .colGauche section.SPO article:hover h3 a { color: #F09114; } .colGauche section.VOY article:hover h3 { color: #F25402; } .colGauche section.VOY article:hover h3 a { color: #F25402; } .colGauche section.TEC article:hover h3 { color: #4E5C9C; } .colGauche section.TEC article:hover h3 a { color: #4E5C9C; } .colGauche section.NOEL article:hover h3 { color: #01823A; } .colGauche section.NOEL article:hover h3 a { color: #01823A; } .colGauche section.UNE header { background: #E1001A; } .colGauche section.UNE .pubInterne { border-bottom: solid 4px #E1001A; } .colGauche section.UNE .pubInterne h4 { color: #E1001A; } .colGauche section.UNE .pubInterne .section { background: #E1001A; } .colGauche section.UNE .pubInterne .rollinfo { background: rgba(225, 0, 26, 0.9); } .colGauche section.ACT header { background: #666; } .colGauche section.ACT .pubInterne { border-bottom: solid 4px #666; } .colGauche section.ACT .pubInterne h4 { color: #666; } .colGauche section.ACT .pubInterne .section { background: #666; } .colGauche section.ACT .pubInterne .rollinfo { background: rgba(102, 102, 102, 0.9); } .colGauche section.AFF header { background: #0574ac; } .colGauche section.AFF .pubInterne { border-bottom: solid 4px #0574ac; } .colGauche section.AFF .pubInterne h4 { color: #0574ac; } .colGauche section.AFF .pubInterne .section { background: #0574ac; } .colGauche section.AFF .pubInterne .rollinfo { background: rgba(5, 116, 172, 0.9); } .colGauche section.ART header { background: #00a5bb; } .colGauche section.ART .pubInterne { border-bottom: solid 4px #00a5bb; } .colGauche section.ART .pubInterne h4 { color: #00a5bb; } .colGauche section.ART .pubInterne .section { background: #00a5bb; } .colGauche section.ART .pubInterne .rollinfo { background: rgba(0, 165, 187, 0.9); } .colGauche section.AUT header { background: #5b7c8e; } .colGauche section.AUT .pubInterne { border-bottom: solid 4px #5b7c8e; } .colGauche section.AUT .pubInterne h4 { color: #5b7c8e; } .colGauche section.AUT .pubInterne .section { background: #5b7c8e; } .colGauche section.AUT .pubInterne .rollinfo { background: rgba(91, 124, 142, 0.9); } .colGauche section.CIN header { background: #9958A1; } .colGauche section.CIN .pubInterne { border-bottom: solid 4px #9958A1; } .colGauche section.CIN .pubInterne h4 { color: #9958A1; } .colGauche section.CIN .pubInterne .section { background: #9958A1; } .colGauche section.CIN .pubInterne .rollinfo { background: rgba(153, 88, 161, 0.9); } .colGauche section.DEB header { background: #333; } .colGauche section.DEB .pubInterne { border-bottom: solid 4px #333; } .colGauche section.DEB .pubInterne h4 { color: #333; } .colGauche section.DEB .pubInterne .section { background: #333; } .colGauche section.DEB .pubInterne .rollinfo { background: rgba(51, 51, 51, 0.9); } .colGauche section.DOS header { background: #3E6084; } .colGauche section.DOS .pubInterne { border-bottom: solid 4px #3E6084; } .colGauche section.DOS .pubInterne h4 { color: #3E6084; } .colGauche section.DOS .pubInterne .section { background: #3E6084; } .colGauche section.DOS .pubInterne .rollinfo { background: rgba(62, 96, 132, 0.9); } .colGauche section.GOU header { background: #840132; } .colGauche section.GOU .pubInterne { border-bottom: solid 4px #840132; } .colGauche section.GOU .pubInterne h4 { color: #840132; } .colGauche section.GOU .pubInterne .section { background: #840132; } .colGauche section.GOU .pubInterne .rollinfo { background: rgba(132, 1, 50, 0.9); } .colGauche section.MAI header { background: #699771; } .colGauche section.MAI .pubInterne { border-bottom: solid 4px #699771; } .colGauche section.MAI .pubInterne h4 { color: #699771; } .colGauche section.MAI .pubInterne .section { background: #699771; } .colGauche section.MAI .pubInterne .rollinfo { background: rgba(105, 151, 113, 0.9); } .colGauche section.PAU header { background: #91BB2B; } .colGauche section.PAU .pubInterne { border-bottom: solid 4px #91BB2B; } .colGauche section.PAU .pubInterne h4 { color: #91BB2B; } .colGauche section.PAU .pubInterne .section { background: #91BB2B; } .colGauche section.PAU .pubInterne .rollinfo { background: rgba(145, 187, 43, 0.9); } .colGauche section.SPO header { background: #FFAF00; } .colGauche section.SPO .pubInterne { border-bottom: solid 4px #FFAF00; } .colGauche section.SPO .pubInterne h4 { color: #FFAF00; } .colGauche section.SPO .pubInterne .section { background: #FFAF00; } .colGauche section.SPO .pubInterne .rollinfo { background: rgba(255, 175, 0, 0.9); } .colGauche section.VOY header { background: #FF6C00; } .colGauche section.VOY .pubInterne { border-bottom: solid 4px #FF6C00; } .colGauche section.VOY .pubInterne h4 { color: #FF6C00; } .colGauche section.VOY .pubInterne .section { background: #FF6C00; } .colGauche section.VOY .pubInterne .rollinfo { background: rgba(255, 108, 0, 0.9); } .colGauche section.TEC header { background: #6473B4; } .colGauche section.TEC .pubInterne { border-bottom: solid 4px #6473B4; } .colGauche section.TEC .pubInterne h4 { color: #6473B4; } .colGauche section.TEC .pubInterne .section { background: #6473B4; } .colGauche section.TEC .pubInterne .rollinfo { background: rgba(100, 115, 180, 0.9); } .colGauche section.NOEL header { background: #01A349; } .colGauche section.NOEL .pubInterne { border-bottom: solid 4px #01A349; } .colGauche section.NOEL .pubInterne h4 { color: #01A349; } .colGauche section.NOEL .pubInterne .section { background: #01A349; } .colGauche section.NOEL .pubInterne .rollinfo { background: rgba(1, 163, 73, 0.9); } .colGauche section.icon header { background: #515155; } .colGauche section.icon .pubInterne { border-bottom: solid 4px #515155; } .colGauche section.icon .pubInterne h4 { color: #515155; } .colGauche section.icon .pubInterne .section { background: #515155; } .colGauche section.icon .pubInterne .rollinfo { background: rgba(81, 81, 85, 0.9); } .colGauche section.UNE header .shader, .colGauche section.UNE header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.UNE header .degrade { background: rgba(183, 4, 32, 0.6); } .colGauche section.ACT header .shader, .colGauche section.ACT header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.ACT header .degrade { background: rgba(77, 77, 77, 0.6); } .colGauche section.AFF header .shader, .colGauche section.AFF header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.AFF header .degrade { background: rgba(5, 71, 114, 0.6); } .colGauche section.ART header .shader, .colGauche section.ART header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.ART header .degrade { background: rgba(1, 106, 124, 0.6); } .colGauche section.AUT header .shader, .colGauche section.AUT header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.AUT header .degrade { background: rgba(87, 113, 128, 0.6); } .colGauche section.CIN header .shader, .colGauche section.CIN header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.CIN header .degrade { background: rgba(130, 77, 137, 0.6); } .colGauche section.DEB header .shader, .colGauche section.DEB header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.DEB header .degrade { background: rgba(1, 106, 124, 0.6); } .colGauche section.DOS header .shader, .colGauche section.DOS header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.DOS header .degrade { background: rgba(37, 65, 92, 0.6); } .colGauche section.GOU header .shader, .colGauche section.GOU header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.GOU header .degrade { background: rgba(59, 1, 19, 0.6); } .colGauche section.MAI header .shader, .colGauche section.MAI header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.MAI header .degrade { background: rgba(74, 125, 84, 0.6); } .colGauche section.PAU header .shader, .colGauche section.PAU header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.PAU header .degrade { background: rgba(110, 154, 28, 0.6); } .colGauche section.SPO header .shader, .colGauche section.SPO header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.SPO header .degrade { background: rgba(240, 145, 20, 0.6); } .colGauche section.VOY header .shader, .colGauche section.VOY header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.VOY header .degrade { background: rgba(242, 84, 2, 0.6); } .colGauche section.TEC header .shader, .colGauche section.TEC header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.TEC header .degrade { background: rgba(78, 92, 156, 0.6); } .colGauche section.NOEL header .shader, .colGauche section.NOEL header .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section.NOEL header .degrade { background: rgba(1, 130, 58, 0.6); } .colGauche section.UNE .pubInterne { background: rgba(243, 198, 205, 0.5); } .colGauche section.ACT .pubInterne { background: rgba(242, 242, 242, 0.5); } .colGauche section.AFF .pubInterne { background: rgba(216, 236, 244, 0.5); } .colGauche section.ART .pubInterne { background: rgba(213, 241, 245, 0.5); } .colGauche section.AUT .pubInterne { background: rgba(233, 239, 242, 0.5); } .colGauche section.CIN .pubInterne { background: rgba(243, 231, 244, 0.5); } .colGauche section.DEB .pubInterne { background: rgba(242, 242, 242, 0.5); } .colGauche section.DOS .pubInterne { background: rgba(226, 232, 238, 0.5); } .colGauche section.GOU .pubInterne { background: rgba(245, 235, 239, 0.5); } .colGauche section.MAI .pubInterne { background: rgba(231, 241, 232, 0.5); } .colGauche section.SPO .pubInterne { background: rgba(255, 240, 210, 0.5); } .colGauche section.VOY .pubInterne { background: rgba(255, 221, 190, 0.5); } .colGauche section.TEC .pubInterne { background: rgba(204, 212, 240, 0.5); } .colGauche section.NOEL .pubInterne { background: rgba(213, 240, 220, 0.5); } .colGauche section.UNE .subcontent header { background: #dc566b; } .colGauche section.ACT .subcontent header { background: #b3b3b3; } .colGauche section.AFF .subcontent header { background: #1ba1cf; } .colGauche section.ART .subcontent header { background: #16ccdb; } .colGauche section.AUT .subcontent header { background: #acc2cd; } .colGauche section.CIN .subcontent header { background: #d1a9d6; } .colGauche section.DEB .subcontent header { background: #666; } .colGauche section.DOS .subcontent header { background: #8DA3B9; } .colGauche section.GOU .subcontent header { background: #B15B7C; } .colGauche section.MAI .subcontent header { background: #A4C8AB; } .colGauche section.SPO .subcontent header { background: #FFE187; } .colGauche section.VOY .subcontent header { background: #FFB471; } .colGauche section.TEC .subcontent header { background: #A3AFE7; } .colGauche section.NOEL .subcontent header { background: #80D19E; } .colGauche section.UNE article:not(.tag):after { background: #b70420; } .colGauche section.ACT article:not(.tag):after { background: #8c8c8c; } .colGauche section.AFF article:not(.tag):after { background: #0574ac; } .colGauche section.ART article:not(.tag):after { background: #00a5bb; } .colGauche section.AUT article:not(.tag):after { background: #577180; } .colGauche section.CIN article:not(.tag):after { background: #824D89; } .colGauche section.DEB article:not(.tag):after { background: #016a7c; } .colGauche section.DOS article:not(.tag):after { background: #25415C; } .colGauche section.GOU article:not(.tag):after { background: #A32F5C; } .colGauche section.MAI article:not(.tag):after { background: #4A7D54; } .colGauche section.PAU article:not(.tag):after { background: #6E9A1C; } .colGauche section.SPO article:not(.tag):after { background: #F09114; } .colGauche section.VOY article:not(.tag):after { background: #F25402; } .colGauche section.TEC article:not(.tag):after { background: #4E5C9C; } .colGauche section.NOEL article:not(.tag):after { background: #01823A; } .colGauche section article.ficheFilm { width: 131px; height: 276px; float: left; position: relative; } .colGauche section article.ficheFilm a { width: 130px; display: block; overflow: hidden; } .colGauche section article.ficheFilm a > img { height: 195px; display: block; border-right: solid 1px #fff; } .colGauche section article.ficheFilm:last-child { width: 130px; } .colGauche section article.ficheFilm:last-child > a img, .colGauche section article.ficheFilm:last-child > a h3, .colGauche section article.ficheFilm:last-child > a .ratings { border-right: none; } .colGauche section article.ficheFilm h3 { font: normal 12px/14px Arial, sans-serif; margin: 0; padding: 8px; width: 114px; height: 44px; text-transform: none; border-right: solid 1px #f1f1f1; border-bottom: solid 1px #f1f1f1; overflow: hidden; } .colGauche section article.ficheFilm .shader, .colGauche section article.ficheFilm .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche section article.ficheFilm .degrade { width: 130px; height: 195px; position: absolute; bottom: 81px; transition: all 150ms linear; } .colGauche section article.ficheFilm .ratings { background: #f1f1f1; text-align: center; height: 20px; line-height: 19px; margin: 0; border-right: solid 1px #fff; font: normal 11px/21px Arial, sans-serif; color: #333; } .colGauche section article.ficheFilm .ratings .rates { margin: 0 auto; } .colGauche section article.ficheFilm .ratings img { height: 9px; } .colGauche .tag { color: #666; font: 600 12px Verlag, Arial, sans-serif; line-height: 17px; padding-top: 5px; margin: 0; } .colGauche .sectionDouble { position: relative; } .colGauche section.half { height: 321px; } .colGauche section.half header { width: 327px; } .colGauche section.half:first-child { width: 326px; border-right: solid 1px #FFF; } .colGauche section.half:first-child .nouvellesTrioVertical, .colGauche section.half:first-child header { width: 326px; } .colGauche section.half:last-child { position: absolute; top: 0; margin: 0; left: 327px; width: 327px; } .colGauche section.half:last-child:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .colGauche section.half:last-child .nouvellesTrioVertical { width: 327px; } .colGauche .nouvellesTrioVertical.UNE article:not(.tag):after { background: #b70420; } .colGauche .nouvellesTrioVertical.ACT article:not(.tag):after { background: #8c8c8c; } .colGauche .nouvellesTrioVertical.AFF article:not(.tag):after { background: #0574ac; } .colGauche .nouvellesTrioVertical.ART article:not(.tag):after { background: #00a5bb; } .colGauche .nouvellesTrioVertical.AUT article:not(.tag):after { background: #577180; } .colGauche .nouvellesTrioVertical.CIN article:not(.tag):after { background: #824D89; } .colGauche .nouvellesTrioVertical.DEB article:not(.tag):after { background: #016a7c; } .colGauche .nouvellesTrioVertical.DOS article:not(.tag):after { background: #25415C; } .colGauche .nouvellesTrioVertical.GOU article:not(.tag):after { background: #A32F5C; } .colGauche .nouvellesTrioVertical.MAI article:not(.tag):after { background: #4A7D54; } .colGauche .nouvellesTrioVertical.PAU article:not(.tag):after { background: #6E9A1C; } .colGauche .nouvellesTrioVertical.SPO article:not(.tag):after { background: #F09114; } .colGauche .nouvellesTrioVertical.VOY article:not(.tag):after { background: #F25402; } .colGauche .nouvellesTrioVertical.TEC article:not(.tag):after { background: #4E5C9C; } .colGauche .nouvellesTrioVertical.NOEL article:not(.tag):after { background: #01823A; } .colGauche .nouvellesTrioVertical article { width: 322px; border-bottom: solid 1px #EBEBEB; clear: both; height: 80px; position: relative; } .colGauche .nouvellesTrioVertical article:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: relative; background: #666; transition: all 250ms ease-in; } .colGauche .nouvellesTrioVertical article:hover:after { width: 100%; } .colGauche .nouvellesTrioVertical article:first-child { height: 109px; } .colGauche .nouvellesTrioVertical article:first-child .infoArticle { left: 140px; } .colGauche .nouvellesTrioVertical article:first-child a.contenu { height: 78px; } .colGauche .nouvellesTrioVertical article:first-child .tag { max-width: 183px; } .colGauche .nouvellesTrioVertical article:first-child:after { display: none; } .colGauche .nouvellesTrioVertical article .btn_playSmall { left: 40px; top: 21px; } .colGauche .nouvellesTrioVertical article .shader, .colGauche .nouvellesTrioVertical article .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .colGauche .nouvellesTrioVertical article .degrade { width: 130px; height: 87px; top: 0; position: absolute; z-index: 5; transition: all 150ms linear; } .colGauche .nouvellesTrioVertical article .specialStatus { position: absolute; bottom: 22px; left: 0; z-index: 10; } .colGauche .nouvellesTrioVertical article .infoArticle { position: absolute; z-index: 20; height: 23px; overflow: hidden; top: 5px; left: 10px; } .colGauche .nouvellesTrioVertical article .tag { line-height: 22px; max-width: 308px; display: inline-block; padding: 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } .colGauche .nouvellesTrioVertical article a.contenu { padding: 27px 10px 4px 10px; display: block; width: 302px; height: 48px; } .colGauche .nouvellesTrioVertical article a.imageArticle { float: left; margin: 0 10px 22px 0; } .colGauche .nouvellesTrioVertical article a.imageArticle img { width: 130px; left: 87px; } .colGauche .nouvellesTrioVertical article h3 { font: normal 14px Arial, sans-serif; margin: 3px 0 0 0; text-transform: none; transition: all 150ms linear; } .colGauche .boiteSorties:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .colDroite { width: 300px; display: block; position: absolute; top: 0; right: 0; /*transition: all 250ms linear */ } aside > * { margin: 40px 0; } aside > *:first-child { margin: 0 0 40px 0; } aside > *:last-child { margin: 40px 0 0 0; } aside > .publicite + * { margin: 0px 0 40px 0; } aside > .publicite:not(.vide) + * { margin: 40px 0; } /** publicité vide remove article + padding-top */ .empty { display: none; } .empty + * { margin-top: 0; } .header300clear h2, .enVedette h2, .plusConsulte h2, .plusPopulaire h2 { font: 700 20px Verlag, Arial, sans-serif; text-transform: uppercase; min-height: 30px; padding: 0px 0 10px 0; margin: 0; border-bottom: solid 2px #4d4d4d; } .header300link h2, .blogue h2, .videoPlayer h2, .opinion h2 { font: 700 20px/21px Verlag, Arial, sans-serif; text-transform: uppercase; margin: 0; padding: 0; } .header300link h2 > a, .blogue h2 > a, .videoPlayer h2 > a, .opinion h2 > a { display: block; background: #333; color: #fff; height: 30px; padding: 10px 0 0 10px; } .footer300link a { color: #fff; text-align: right; font: 700 13px Verlag, Arial, sans-serif; text-transform: uppercase; display: block; padding: 10px 37px 8px 0; vertical-align: middle; background: #666; transition: all 150ms linear; } .footer300link a:after { content: ">"; font: 700 29px Verlag, Arial, sans-serif; position: absolute; margin: -11px 0 0 13px; } .footer300link a:hover { background: rgba(77, 77, 77, 0.9); } .article300generic, .enVedette article { width: 300px; height: 90px; padding: 0 0 0 0; border-bottom: solid 1px #f1f1f1; } .article300generic a, .enVedette article a { display: block; height: 72px; padding-top: 17px; } .article300generic .tag, .enVedette article .tag { font: 700 14px Verlag, Arial, sans-serif; color: #666; margin: 0; padding: 0; } .article300generic h3, .enVedette article h3 { margin: 4px 0 0 0; padding: 0; font: normal 14px Arial, sans-serif; color: #000; text-transform: none; } .article300generic.inactive, .enVedette article.inactive { display: none; } .enVedette .UNE a:hover .shader, .enVedette .UNE a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .UNE a:hover .degrade { background: rgba(225, 0, 26, 0.3); } .enVedette .ACT a:hover .shader, .enVedette .ACT a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .ACT a:hover .degrade { background: rgba(102, 102, 102, 0.3); } .enVedette .AFF a:hover .shader, .enVedette .AFF a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .AFF a:hover .degrade { background: rgba(5, 116, 172, 0.3); } .enVedette .ART a:hover .shader, .enVedette .ART a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .ART a:hover .degrade { background: rgba(0, 165, 187, 0.3); } .enVedette .AUT a:hover .shader, .enVedette .AUT a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .AUT a:hover .degrade { background: rgba(91, 124, 142, 0.3); } .enVedette .CIN a:hover .shader, .enVedette .CIN a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .CIN a:hover .degrade { background: rgba(153, 88, 161, 0.3); } .enVedette .DEB a:hover .shader, .enVedette .DEB a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .DEB a:hover .degrade { background: rgba(51, 51, 51, 0.3); } .enVedette .DOS a:hover .shader, .enVedette .DOS a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .DOS a:hover .degrade { background: rgba(62, 96, 132, 0.3); } .enVedette .GOU a:hover .shader, .enVedette .GOU a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .GOU a:hover .degrade { background: rgba(132, 1, 50, 0.3); } .enVedette .MAI a:hover .shader, .enVedette .MAI a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .MAI a:hover .degrade { background: rgba(105, 151, 113, 0.3); } .enVedette .PAU a:hover .shader, .enVedette .PAU a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .PAU a:hover .degrade { background: rgba(145, 187, 43, 0.3); } .enVedette .SPO a:hover .shader, .enVedette .SPO a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .SPO a:hover .degrade { background: rgba(255, 175, 0, 0.3); } .enVedette .VOY a:hover .shader, .enVedette .VOY a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .VOY a:hover .degrade { background: rgba(255, 108, 0, 0.3); } .enVedette .TEC a:hover .shader, .enVedette .TEC a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .TEC a:hover .degrade { background: rgba(100, 115, 180, 0.3); } .enVedette .NOEL a:hover .shader, .enVedette .NOEL a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .NOEL a:hover .degrade { background: rgba(1, 163, 73, 0.3); } .enVedette .icon a:hover .shader, .enVedette .icon a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette .icon a:hover .degrade { background: rgba(81, 81, 85, 0.3); } .enVedette article { height: 94px; } .enVedette article img { float: left; margin-right: 10px; } .enVedette article a { position: relative; } .enVedette article a .shader, .enVedette article a .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .enVedette article a .degrade { transition: all 150ms linear; position: absolute; height: 65px; width: 98px; top: 15px; z-index: 4; } .enVedette article .tag { position: absolute; display: none; margin: 10px 0 0 0; z-index: 5; max-width: 300px; height: 18px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } .enVedette article a:not(.tag) { padding-top: 15px; height: 64px; display: table-cell; vertical-align: middle; } .enVedette article:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: relative; background: #666; transition: all 250ms ease-in; } .enVedette article:hover:after { width: 100%; } .enVedette article:after { bottom: -15px; } .enVedette article.UNE:hover h3, .enVedette article.UNE:hover p { color: #b70420; } .enVedette article.UNE:hover h3 a, .enVedette article.UNE:hover p a { color: #b70420; } .enVedette article.UNE:after { /* couleur pour animation ligne */ background: #b70420; } .enVedette article.ACT:hover h3, .enVedette article.ACT:hover p { color: #8c8c8c; } .enVedette article.ACT:hover h3 a, .enVedette article.ACT:hover p a { color: #8c8c8c; } .enVedette article.ACT:after { /* couleur pour animation ligne */ background: #8c8c8c; } .enVedette article.AFF:hover h3, .enVedette article.AFF:hover p { color: #0574ac; } .enVedette article.AFF:hover h3 a, .enVedette article.AFF:hover p a { color: #0574ac; } .enVedette article.AFF:after { /* couleur pour animation ligne */ background: #0574ac; } .enVedette article.ART:hover h3, .enVedette article.ART:hover p { color: #00a5bb; } .enVedette article.ART:hover h3 a, .enVedette article.ART:hover p a { color: #00a5bb; } .enVedette article.ART:after { /* couleur pour animation ligne */ background: #00a5bb; } .enVedette article.AUT:hover h3, .enVedette article.AUT:hover p { color: #577180; } .enVedette article.AUT:hover h3 a, .enVedette article.AUT:hover p a { color: #577180; } .enVedette article.AUT:after { /* couleur pour animation ligne */ background: #577180; } .enVedette article.CIN:hover h3, .enVedette article.CIN:hover p { color: #824D89; } .enVedette article.CIN:hover h3 a, .enVedette article.CIN:hover p a { color: #824D89; } .enVedette article.CIN:after { /* couleur pour animation ligne */ background: #824D89; } .enVedette article.DEB:hover h3, .enVedette article.DEB:hover p { color: #016a7c; } .enVedette article.DEB:hover h3 a, .enVedette article.DEB:hover p a { color: #016a7c; } .enVedette article.DEB:after { /* couleur pour animation ligne */ background: #016a7c; } .enVedette article.DOS:hover h3, .enVedette article.DOS:hover p { color: #25415C; } .enVedette article.DOS:hover h3 a, .enVedette article.DOS:hover p a { color: #25415C; } .enVedette article.DOS:after { /* couleur pour animation ligne */ background: #25415C; } .enVedette article.GOU:hover h3, .enVedette article.GOU:hover p { color: #A32F5C; } .enVedette article.GOU:hover h3 a, .enVedette article.GOU:hover p a { color: #A32F5C; } .enVedette article.GOU:after { /* couleur pour animation ligne */ background: #A32F5C; } .enVedette article.MAI:hover h3, .enVedette article.MAI:hover p { color: #4A7D54; } .enVedette article.MAI:hover h3 a, .enVedette article.MAI:hover p a { color: #4A7D54; } .enVedette article.MAI:after { /* couleur pour animation ligne */ background: #4A7D54; } .enVedette article.PAU:hover h3, .enVedette article.PAU:hover p { color: #6E9A1C; } .enVedette article.PAU:hover h3 a, .enVedette article.PAU:hover p a { color: #6E9A1C; } .enVedette article.PAU:after { /* couleur pour animation ligne */ background: #6E9A1C; } .enVedette article.SPO:hover h3, .enVedette article.SPO:hover p { color: #F09114; } .enVedette article.SPO:hover h3 a, .enVedette article.SPO:hover p a { color: #F09114; } .enVedette article.SPO:after { /* couleur pour animation ligne */ background: #F09114; } .enVedette article.VOY:hover h3, .enVedette article.VOY:hover p { color: #F25402; } .enVedette article.VOY:hover h3 a, .enVedette article.VOY:hover p a { color: #F25402; } .enVedette article.VOY:after { /* couleur pour animation ligne */ background: #F25402; } .enVedette article.TEC:hover h3, .enVedette article.TEC:hover p { color: #4E5C9C; } .enVedette article.TEC:hover h3 a, .enVedette article.TEC:hover p a { color: #4E5C9C; } .enVedette article.TEC:after { /* couleur pour animation ligne */ background: #4E5C9C; } .enVedette article.NOEL:hover h3, .enVedette article.NOEL:hover p { color: #01823A; } .enVedette article.NOEL:hover h3 a, .enVedette article.NOEL:hover p a { color: #01823A; } .enVedette article.NOEL:after { /* couleur pour animation ligne */ background: #01823A; } .enVedette article h3 { margin-top: 10px; width: 191px; display: inline-block; transition: all 150ms linear; } .plusConsulte ol li.UNE:hover h4 { color: #b70420; } .plusConsulte ol li.ACT:hover h4 { color: #8c8c8c; } .plusConsulte ol li.AFF:hover h4 { color: #0574ac; } .plusConsulte ol li.ART:hover h4 { color: #00a5bb; } .plusConsulte ol li.AUT:hover h4 { color: #577180; } .plusConsulte ol li.CIN:hover h4 { color: #824D89; } .plusConsulte ol li.DEB:hover h4 { color: #016a7c; } .plusConsulte ol li.DOS:hover h4 { color: #25415C; } .plusConsulte ol li.GOU:hover h4 { color: #A32F5C; } .plusConsulte ol li.MAI:hover h4 { color: #4A7D54; } .plusConsulte ol li.PAU:hover h4 { color: #6E9A1C; } .plusConsulte ol li.SPO:hover h4 { color: #F09114; } .plusConsulte ol li.VOY:hover h4 { color: #F25402; } .plusConsulte ol li.TEC:hover h4 { color: #4E5C9C; } .plusConsulte ol li.NOEL:hover h4 { color: #01823A; } .plusConsulte ol li:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: absolute; background: #666; transition: all 250ms ease-in; } .plusConsulte ol li:hover:after { width: 100%; } .plusConsulte ol li.UNE:after { background: #b70420; } .plusConsulte ol li.ACT:after { background: #8c8c8c; } .plusConsulte ol li.AFF:after { background: #0574ac; } .plusConsulte ol li.ART:after { background: #00a5bb; } .plusConsulte ol li.AUT:after { background: #577180; } .plusConsulte ol li.CIN:after { background: #824D89; } .plusConsulte ol li.DEB:after { background: #016a7c; } .plusConsulte ol li.DOS:after { background: #25415C; } .plusConsulte ol li.GOU:after { background: #A32F5C; } .plusConsulte ol li.MAI:after { background: #4A7D54; } .plusConsulte ol li.PAU:after { background: #6E9A1C; } .plusConsulte ol li.SPO:after { background: #F09114; } .plusConsulte ol li.VOY:after { background: #F25402; } .plusConsulte ol li.TEC:after { background: #4E5C9C; } .plusConsulte ol li.NOEL:after { background: #01823A; } .plusPopulaire ul.UNE li:hover h4 { color: #E1001A; } .plusPopulaire ul.UNE li:hover .shader, .plusPopulaire ul.UNE li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.UNE li:hover .degrade { background: rgba(225, 0, 26, 0.3); } .plusPopulaire ul.ACT li:hover h4 { color: #666; } .plusPopulaire ul.ACT li:hover .shader, .plusPopulaire ul.ACT li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.ACT li:hover .degrade { background: rgba(102, 102, 102, 0.3); } .plusPopulaire ul.AFF li:hover h4 { color: #0574ac; } .plusPopulaire ul.AFF li:hover .shader, .plusPopulaire ul.AFF li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.AFF li:hover .degrade { background: rgba(5, 116, 172, 0.3); } .plusPopulaire ul.ART li:hover h4 { color: #00a5bb; } .plusPopulaire ul.ART li:hover .shader, .plusPopulaire ul.ART li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.ART li:hover .degrade { background: rgba(0, 165, 187, 0.3); } .plusPopulaire ul.AUT li:hover h4 { color: #5b7c8e; } .plusPopulaire ul.AUT li:hover .shader, .plusPopulaire ul.AUT li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.AUT li:hover .degrade { background: rgba(91, 124, 142, 0.3); } .plusPopulaire ul.CIN li:hover h4 { color: #9958A1; } .plusPopulaire ul.CIN li:hover .shader, .plusPopulaire ul.CIN li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.CIN li:hover .degrade { background: rgba(153, 88, 161, 0.3); } .plusPopulaire ul.DEB li:hover h4 { color: #333; } .plusPopulaire ul.DEB li:hover .shader, .plusPopulaire ul.DEB li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.DEB li:hover .degrade { background: rgba(51, 51, 51, 0.3); } .plusPopulaire ul.DOS li:hover h4 { color: #3E6084; } .plusPopulaire ul.DOS li:hover .shader, .plusPopulaire ul.DOS li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.DOS li:hover .degrade { background: rgba(62, 96, 132, 0.3); } .plusPopulaire ul.GOU li:hover h4 { color: #840132; } .plusPopulaire ul.GOU li:hover .shader, .plusPopulaire ul.GOU li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.GOU li:hover .degrade { background: rgba(132, 1, 50, 0.3); } .plusPopulaire ul.MAI li:hover h4 { color: #699771; } .plusPopulaire ul.MAI li:hover .shader, .plusPopulaire ul.MAI li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.MAI li:hover .degrade { background: rgba(105, 151, 113, 0.3); } .plusPopulaire ul.PAU li:hover h4 { color: #91BB2B; } .plusPopulaire ul.PAU li:hover .shader, .plusPopulaire ul.PAU li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.PAU li:hover .degrade { background: rgba(145, 187, 43, 0.3); } .plusPopulaire ul.SPO li:hover h4 { color: #FFAF00; } .plusPopulaire ul.SPO li:hover .shader, .plusPopulaire ul.SPO li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.SPO li:hover .degrade { background: rgba(255, 175, 0, 0.3); } .plusPopulaire ul.VOY li:hover h4 { color: #FF6C00; } .plusPopulaire ul.VOY li:hover .shader, .plusPopulaire ul.VOY li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.VOY li:hover .degrade { background: rgba(255, 108, 0, 0.3); } .plusPopulaire ul.TEC li:hover h4 { color: #6473B4; } .plusPopulaire ul.TEC li:hover .shader, .plusPopulaire ul.TEC li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.TEC li:hover .degrade { background: rgba(100, 115, 180, 0.3); } .plusPopulaire ul.NOEL li:hover h4 { color: #01A349; } .plusPopulaire ul.NOEL li:hover .shader, .plusPopulaire ul.NOEL li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.NOEL li:hover .degrade { background: rgba(1, 163, 73, 0.3); } .plusPopulaire ul.icon li:hover h4 { color: #515155; } .plusPopulaire ul.icon li:hover .shader, .plusPopulaire ul.icon li:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul.icon li:hover .degrade { background: rgba(81, 81, 85, 0.3); } .plusPopulaire ul li { height: 95px !important; } .plusPopulaire ul li a { position: relative; } .plusPopulaire ul li a img { height: 65px; width: 98px; margin: 15px 10px 0 0; } .plusPopulaire ul li a .shader, .plusPopulaire ul li a .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .plusPopulaire ul li a .degrade { transition: all 150ms linear; position: absolute; height: 65px; width: 98px; top: 15px; z-index: 3; } .blogue, .videoPlayer, .opinion { /******** */ } .blogue article, .videoPlayer article, .opinion article { clear: both; border-bottom: solid 1px #F1F1F1; } .blogue article > a, .videoPlayer article > a, .opinion article > a { display: block; position: relative; height: 86px; overflow: hidden; } .blogue article > a:hover h3, .videoPlayer article > a:hover h3, .opinion article > a:hover h3 { color: #999; } .blogue article > a:hover .shader, .videoPlayer article > a:hover .shader, .opinion article > a:hover .shader, .blogue article > a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .blogue article > a:hover .degrade, .videoPlayer article > a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .videoPlayer article > a:hover .degrade, .opinion article > a:hover .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .opinion article > a:hover .degrade { background: rgba(51, 51, 51, 0.3); } .blogue article img, .videoPlayer article img, .opinion article img { float: left; margin: 0 10px 0 0; /* stabilité du progressive download */ width: 130px; height: 86px; } .blogue article .shader, .videoPlayer article .shader, .opinion article .shader, .blogue article .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .blogue article .degrade, .videoPlayer article .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .videoPlayer article .degrade, .opinion article .manchette .nouvellesTrio .degrade, .manchette .nouvellesTrio .opinion article .degrade { width: 130px; height: 86px; position: absolute; background: rgba(51, 51, 51, 0); transition: all 150ms linear; } .blogue article h3, .videoPlayer article h3, .opinion article h3 { font: normal 14px Arial, sans-serif; text-transform: none; color: #333; margin: 0; padding: 27px 0 0 0; height: 50px; overflow: hidden; transition: all 150ms linear; } .blogue article .tag, .videoPlayer article .tag, .opinion article .tag { font: 700 13px Verlag, Arial, sans-serif; padding: 8px 0 4px 0; color: #999; width: 160px; left: 140px; height: 12px; position: absolute; z-index: 3; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal; } .blogue article .comments, .videoPlayer article .comments, .opinion article .comments { font: 100 8.5px Arial, sans-serif; line-height: 13px; width: 18px; height: 18px; float: right; margin: 11px 0 0 10px; background: url("../img/ico_blogue_commentaires.png") no-repeat top center; text-align: center; color: #fff; overflow: hidden; } .videoPlayer article { background: #000; transition: all 150ms linear; } .videoPlayer article > a { height: 80px; padding: 9px 10px; position: relative; background: #333; color: #fff; transition: all 150ms linear; } .videoPlayer article > a:hover, .videoPlayer article > a.actif { background: #333; opacity: 0.83; } .videoPlayer article > a img { position: absolute; z-index: 10; width: 142px; height: 79px; } .videoPlayer article > a .btn_playSmall { position: absolute; top: 26px; left: 61px; z-index: 20; } .videoPlayer article > a h3 { position: absolute; width: 126px; left: 164px; top: 9px; color: #fff; } .videoPlayer .social { padding: 5px 0; height: 23px; } .videoPlayer .social .videoTwitter, .videoPlayer .social .videoFacebook { width: 145px; position: absolute; } .videoPlayer .social .videoTwitter { left: 150px; } .videoPlayer article.player > a { position: relative; padding: 0; height: 169px; } .videoPlayer article.player img { height: 169px; width: 300px; } .videoPlayer article.player .btn_play, .videoPlayer article.player .btn_playSmall, .videoPlayer article.player .btn_playBig { position: absolute; left: 93px; top: 36px; } .opinion article { height: 40px; border-bottom: solid 1px #ebebeb; height: auto; } .opinion article:after { display: block; height: 1px; width: 0; bottom: -1px; z-index: 10; content: " "; position: relative; background: #666; transition: all 250ms ease-in; } .opinion article:hover:after { width: 100%; } .opinion article a { height: auto; min-height: 20px; padding: 10px; font: bold 13px/21px Arial, sans-serif; color: #333; } .opinion article a:hover { color: #666; } .clindoeil { width: 300px; color: #333; } .clindoeil a { color: #333; } .clindoeil header { background: #ebebeb; padding: 10px 20px; } .clindoeil header h2 { margin: 0; font: 700 20px Verlag, Arial, sans-serif; color: #000; text-transform: uppercase; } .clindoeil header h2 span { font: 500 17px Verlag, Arial, sans-serif; } .clindoeil .triangle { width: 0; height: 0; border-bottom: 21px solid transparent; border-right: 21px solid transparent; border-left: 21px solid #ebebeb; position: absolute; right: 20px; } .clindoeil blockquote { font: 400 italic 16px Arial, sans-serif; padding: 35px 20px 15px 20px; margin: 0; } .clindoeil cite { font: 400 14px Arial, sans-serif; padding: 10px 30px 15px 40px; } .clindoeil cite:before { content: "—"; padding: 0 8px 0 0; } /***************************************************** */ /* footer */ .sommaire { background: #1A1A1C; position: relative; z-index: 1; } .sommaire section { color: #FFF; } .sommaire section.lapresse .main { display: table; padding: 40px 0; } .sommaire section.lapresse .main > div { display: table-cell; vertical-align: top; } .sommaire section.lapresse .infos { width: 246px; } .sommaire section.lapresse .infos img { width: 108px; height: 108px; } .sommaire section.lapresse .infos li { margin: 10px 0 11px 0; } .sommaire section.lapresse .infos a { text-transform: uppercase; font-size: 12px; } .sommaire section.lapresse .infos a.logo { width: 108px; display: block; margin: 0 0 35px 0; } .sommaire section.lapresse .ailleurs { width: 232px; padding: 0 0 0 30px; font-size: 14px; } .sommaire section.lapresse .plus { width: 221px; padding: 0 0 0 30px; border-left: solid 2px #232325; } .sommaire section.lapresse .plus:last-child { width: 217px; } .sommaire section.lapresse ul { display: block; margin: 10px 0 25px 0; } .sommaire section.lapresse li { margin: 5px 0 0 0; } .sommaire section.lapresse h4.fixPos { margin-top: 33px; } .sommaire section.famille { background: #232325; padding: 20px 0; } .sommaire section.famille li a { font-size: 11px; display: inline-block; margin: 0; color: #c8c8D2; } .sommaire section.famille li a:hover { color: #FFF; } .sommaire section.famille li a:nth-child(2) { color: #FFF; padding-bottom: 11px; text-transform: uppercase; } .sommaire section.famille li a:nth-child(2):hover { color: #c8c8D2; } .sommaire section.legal { background: #303033; padding: 40px 0; } .sommaire section.legal a { font-size: 12px; } .sommaire section.legal p { font-size: 12px; margin: 17px 0 0 0; } .sommaire section.legal ul { display: block; } .sommaire section.legal li { display: inline-block; border-right: solid 1px #FFF; padding: 0 10px; font-size: 12px; } .sommaire section.legal li:first-child { padding: 0 10px 0 0; } .sommaire section.legal li:last-child { border: none; padding: 0 0 0 10px; } .socialIcons { height: 40px; margin: 0 0 40px -2px; padding: 15px 0 0 0; } .socialIcons:after { clear: both; content: " "; visibility: hidden; display: block; float: none; height: 0px; } .socialIcons a { display: block; float: left; width: 40px; height: 40px; border-radius: 20px; background: #fff; margin: 0 10px 0 0; } .socialIcons a:hover { background: #ebebeb; } .socialIcons a.btn_fbook:before { font: normal 40px/41px lp_web_icons, sans-serif; content: "."; margin: 0 0 0 3px; color: #3b5998; } .socialIcons a.btn_fbook:hover:before { color: #374284; } .socialIcons a.btn_twt:before { font: normal 34px/41px lp_web_icons, sans-serif; content: ","; margin: 0 0 0 7px; color: #4099FF; } .socialIcons a.btn_twt:hover:before { color: #1683ab; } .socialIcons a.btn_rss:before { font: normal 40px/42px lp_web_icons, sans-serif; content: "!"; margin: 0 0 0 5px; color: #ff7700; } .socialIcons a.btn_rss:hover:before { color: #db5c00; } .hiddenComScore { display: none; } /*# sourceMappingURL=accueil.css.map */