/*************************** Copyright : LGV-RR version : 1.03/ 2009.12.10 ***************************/ /* reset version : 1.00 / 2009.12.02 */ /************************************/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-family: inherit; vertical-align: baseline; font-size: 100%; } :focus { outline: 0; } body { background: white; } ol, ul { list-style: none; margin: 0; padding: 0; } table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /***********/ /* GLOBAL */ /*********/ html, body { } body { border:0; font-family: Arial, Helvetica, sans-serif; color: #000; font-size: 75%; position: relative; background: url(../img/topheader_bg.png) repeat-x center top; } a:hover, a:focus { text-decoration: underline; } .clearboth { clear: both; } .clearleft { clear: left; } .clearright { clear: right; } .float_left { float: left; margin-right: 10px; } .float_right { float: right; margin-left: 10px; } .hidden { display: none; } .jumpers { left:-999px; position:absolute; top:-999px; } #global { width: 960px; position: relative; margin-right: auto; margin-left: auto; } /*************/ /* HEADER */ /***********/ #header { height: 152px; width: 960px; position: relative; margin-left: auto; margin-right: auto; } #header .rff { position: absolute; top: 75px; left: 50px; } #header_flash .counter { font-weight: bold; font-size: 140%; font-family: "arial narrow", Arial, Helvetica, sans-serif; z-index: 99999; color: #fff; padding-right:8px;margin-top:-22px;float:right} #header_flash .remainder{ padding-left:34px;font-weight: bold; font-size: 125%; font-family: "arial narrow", Arial, Helvetica, sans-serif; z-index: 99; color: #fff;margin-top:5px; } #header a { color: #888888; text-decoration: none; } #header a:hover { text-decoration: underline; } #headlogo { width: 960px; } #headlogo h1 { position: absolute; top: 87px; right:0px } #headlogo h1 span { display:none; text-indent: -9999px; } #headlogo h1 a { display: block; } #top_header { position: absolute; top: 0px; width: 100%; height: 35px; left: 0px; z-index: 999; color: #888888; } #top_header #branches { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 110%; position: relative; top: 12px; } #top_header #branches a { margin-left: 3px; margin-right: 3px; } #top_header #branches a:hover { } #top_header #topsearch { position: absolute; right: 0px; top: 10px; width: auto; } #top_header #topsearch form { float: left; margin-left: 20px; } #top_header #topsearch label { display: none; text-indent: -9999px; } #top_header #topsearch input.search { color: #888888; font-size: 90%; padding-left: 3px; width: 140px; border: 1px solid #d8d8d8; height: 15px; } #top_header #topsearch input.btn { width: 23px; height: 20px; color: #fff; font-size: 86%; font-weight: bold; cursor: pointer; vertical-align: top; border: none; padding-bottom: 2px; } #top_header #toplinks { font-size: 90%; float: left; margin-top: 5px; } #top_header #toplinks a { margin-right: 3px; margin-left: 3px; } #top_header #toplinks a.lang { background: url(../img/picto_flag_en.png) no-repeat right center; padding-right: 22px; } /************/ /* TOPMENU */ /**********/ #topmenu { background-color: #666; width: 960px; height: 25px; text-align: right; border-bottom: 1px solid #fff; position: relative; z-index: 19; } #topmenu #nav { display: block; position: relative; float: right; text-align:left; } #topmenu #nav li { color: #fff; position: relative; display: block; float: left; } #topmenu #nav li a { text-decoration: none; text-transform: uppercase; font-size: 110%; font-weight: bold; display: block; width: auto; padding-left: 8px; padding-right: 8px; color: #fff; border-bottom: 1px solid; height: 20px; padding-top: 5px; float: left; position: relative;width:260px; } #topmenu #nav li a:hover { border-bottom: 1px solid #fff; display: block; } #topmenu #nav .nav2 { display: none; position: absolute; border-left: 1px solid #fff; text-align: left; top: 25px; left: 0px; width: 251px; margin: 0; padding: 0; opacity: 0.87; filter : alpha(opacity=87); } /*#topmenu #nav .last .nav2 { left: -15px; }*/ #topmenu #nav .nav2 li { display: block; color: #fff; width: 250px; height: auto; margin: 0px; float: left; border-top: 1px dotted #fff; border-right: 1px solid #fff; } #topmenu #nav .nav2 li.last { border-right: none; } #topmenu #nav .nav2 li a { text-decoration: none; text-transform: none; font-size: 90%; font-weight: normal; display: block; width: 234px; padding-left: 8px; padding-right: 8px; color: #fff; background-image: url(none); padding-top: 7px; padding-bottom: 7px; margin: 0px; border: none!important; height: auto; } #topmenu #nav .nav2 li a:hover { background-image: url(none)!important; } #topmenu #nav li:hover .nav2, #topmenu #nav .nav2.sfhover ul { display: block; } /**********/ /* FLASH */ /********/ #header_flash { padding-bottom: 32px; display: block; height: 260px; background-color: #666; } /***********/ /* FOOTER */ /*********/ #footer { color: #8c9194; font-size: 95%; background: #f5f5f5 url(../img/footer_bg.png) no-repeat center top; height: 20px; text-align: center; padding-top: 10px; margin-top: 30px; } #footer a { color: #6b5e55; text-decoration: none; margin-right: 2px; margin-left: 2px; } #footer a:hover { text-decoration: underline; } #footer a.malvoyants { position: absolute; left: 10px; } #footer a.malvoyants .size2 { font-size: 120%; } #footer a.malvoyants .size3 { font-size: 120%; } /***********/ /* HOME */ /*********/ #main.home { font-size: 90%; } #main.home .leftside { width: 340px; margin-top: 30px; margin-left: 35px; float: left; } #main.home .leftside a:hover { text-decoration:none } #main.home .leftside h1 { font-size: 170%; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; border-bottom: 1px dotted #ccc; padding-bottom: 2px; margin-bottom: 13px; font-weight: normal; } #main.home .leftside p { margin-bottom: 10px; } #main.home .leftside .chapeau { font-weight: bold; font-size: 110%; } #main.home .rightside { float: right; margin-top: 30px; } #main.home .rightside #bloc_medias { width: 552px; height:280px;} #main.home .rightside #bloc_medias .onglets { height: 26px; width: 552px; } #main.home .rightside #bloc_medias .onglets li { display: inline; } #main.home .rightside #bloc_medias .onglets li a { display: block; height: 20px; background: url(../img/main_medias_onglet.png) no-repeat left bottom; float: left; color: #fff; text-decoration: none; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 120%; font-weight: bold; padding-right: 12px; padding-left: 15px; position: relative; padding-top: 6px; width: 78px; } #main.home .rightside #bloc_medias .onglets li.highlight a { width: 105px; } #main.home .rightside #bloc_medias .onglets li a span { background: url(../img/main_medias_onglet.png) no-repeat right bottom; display: block; width: 6px; height: 26px; position: absolute; z-index: 99; right: 0px; bottom: 0px; } #main.home .rightside #bloc_medias .onglets li a:hover, #main.home .rightside #bloc_medias .onglets li.active a, #main.home .rightside #bloc_medias .onglets li.highlight a:hover { background: url(../img/main_medias_onglet.png) no-repeat left top; color: #333; } #main.home .rightside #bloc_medias .onglets li a:hover span, #main.home .rightside #bloc_medias .onglets li.active a span { background: url(../img/main_medias_onglet.png) no-repeat right top; } #main.home .rightside #bloc_medias .medias_content { background: url(../img/main_medias_bg.png) no-repeat center bottom; padding: 5px; padding-left: 8px; padding-right: 9px; padding-bottom: 8px;position:absolute; height:250px;} #main.home .rightside #bloc_medias .medias_content .bloc_actus { position: relative; width: 535px; height: 250px; } #main.home .rightside #bloc_medias .medias_content .bloc_actus .actu { position: absolute; bottom: 0px; width: 515px; height: 55px; color: #fff; padding: 10px; padding-top: 6px; opacity: 0.9; filter : alpha(opacity=90); ;overflow: hidden; } #main.home .rightside #bloc_medias .medias_content .bloc_actus .actu h2 { font-size: 110%; margin-bottom: 3px; } #main.home .rightside #bloc_medias .medias_content .bloc_actus .actu p { color: #ddddd0; width: 360px; line-height: 110%; } #main.home .rightside #bloc_medias .medias_content .btn { display: block; position: absolute; right: 10px; bottom: 10px; border: 1px solid #353934; padding-top: 3px; padding-bottom: 3px; padding-right: 5px; padding-left: 5px; color: #fff; font-family: Verdana, Geneva, sans-serif; font-weight: bold; text-decoration: none; font-size: 90%; background-color: #333; } #main.home .rightside #bloc_medias .medias_content .bloc_actus img { } /**************/ /* RUBRIQUES */ /************/ /*colonnes*/ .rub #main { border-left: 1px solid #c2c2c2; width:959px; background: url(../img/rub_main_bg.png) repeat-y left top; color: #474956; } .rub #main.leftonly { background:transparent url(../img/rub_main_bg_uniq.png) repeat-y scroll left top; border-left:1px solid #C2C2C2; color:#474956; width:959px; } .rub #main .leftside { width: 623px; position: relative; float: left; min-height:700px;height:auto!important;height:700px } .rub #main .rightside { width:335px; text-align: center; position: relative; float: left; padding-bottom: 20px; } .rub #footer{ margin-top: 0px; } /* entete */ .rub #main #head { height: 83px; background-color: #f5f5f5; position: relative; z-index: 10; width: 958px; } .rub #main #head #breadcrumb { color: #474956; font-size: 90%; position: absolute; top: 10px; left: 15px; width: 550px; z-index: 20; } .rub #main #head #breadcrumb a { color: #474956; } .rub #main #head #breadcrumb a:hover { text-decoration: none; } .rub #main #head h1 { font-size: 200%; font-weight: normal; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; position: absolute; z-index: 25; top: 40px; left: 15px; } .rub #main #head h1 span { text-indent: -9999px; display: none; } /* Leftmenu */ .rub #main #leftmenu { width: 170px; background-color: #F5F5F5; float: left; font-size: 95%; border-top: 1px dotted #303030; } .rub #main #leftmenu li { } .rub #main #leftmenu a { text-transform: uppercase; color: #303030; text-decoration: none; display: block; border-bottom: 1px dotted #303030; padding-left: 12px; padding-right: 10px; padding-top: 3px; padding-bottom: 3px; } .rub #main #leftmenu a:hover, .rub #main #leftmenu a.active { color: #fff; } /* Article */ .rub #main #article { width: 413px; background-color: #fff; float: left; padding-right: 20px; padding-left: 20px; padding-top: 35px; padding-bottom: 25px; } .rub #main #article h2 { font-size: 100%; margin-bottom: 20px; clear: both; } .rub #main #article h3 { margin-bottom: 10px; margin-top: 20px; clear: both; } .rub #main #article p { margin-bottom: 12px; margin-top: 3px; } .rub #main #article p.chapeau { font-weight: bold; font-size: 110%; } .rub #main #article a {} .rub #main #article a:hover { text-decoration: none; } .rub #main #article a.plus { display: block; background: url(../img/rub_linkplus_bg.png) no-repeat right center; text-decoration: none; font-weight: bold; height: 18px; width: auto; float: right; padding-left: 10px; padding-right: 10px; border-left: 1px solid #e5e1e1; padding-top: 2px; } .rub #main #article ul { margin-bottom: 20px; } .rub #main #article ul li { margin-bottom: 5px; padding-left: 10px; margin-left: 15px; } .rub #main #article img.left { float: left; margin-right: 10px; } .rub #main #article img.right { float: right; margin-left: 10px; } .rub #main #article form { padding-top: 15px; padding-bottom: 15px; width: 410px; } .rub #main #article form label { margin-right: 5px; width: 120px; float: left; display: block; clear: left; } .rub #main #article form input[type="text"] { font-size: 90%; margin-bottom: 10px; min-width: 150px; } .rub #main #article form input[type="radio"], .rub #main #article form input[type="checkbox"] { margin-bottom: 10px; padding-bottom: 1px; vertical-align: middle; } .rub #main #article form select { font-size: 90%; font-family: Arial, Helvetica, sans-serif; margin-bottom: 10px; } .rub #main #article form textarea { font-family: Arial, Helvetica, sans-serif; font-size: 95%; width: 270px; margin-bottom: 10px; } .rub #main #article form input[type="button"] { background: url(../img/est_form_btn.png) repeat-x left top; border: none; color: #fff; text-transform: uppercase; cursor: pointer; height: 25px; padding-bottom: 2px; font-size: 90%; float: right; margin-right: 10px; } /*rightside blocs média*/ .rub #main .rightside .bloc_medias { margin-top: 20px; background: url(../img/rub_rightmedia_top_bg.png) no-repeat left top; width: 306px; position: relative; margin-right: auto; margin-left: auto; padding-top: 10px; } .rub #main .rightside .bloc_medias .media { background: url(../img/rub_rightmedia_bg.png) repeat-y center top; padding-bottom: 5px; } .rub #main .rightside .bloc_medias .infos { position: relative; text-align: right; color: #fff; padding: 5px; width: 275px; margin-right: auto; margin-left: auto; font-size: 90%; } .rub #main .rightside .bloc_medias .infos .fs { display: block; background: url(../img/rub_rightmedia_picto_fs.png) no-repeat center center; width: 20px; height: 20px; position: absolute; left: 20px; top: 10px; } .rub #main .rightside .bloc_medias .infos .fs span { text-indent: -9999px; display: none; } /*---------ajout 22 12 09-----------*/ /*photos*/ .rub #main .rightside .bloc_medias ul.photos { margin-left: auto; margin-right: auto; width: 280px; padding-top: 15px; padding-bottom: 5px; } .rub #main .rightside .bloc_medias ul.photos li {display:inline; float: left; width: 125px; font-size: 85%; text-align: left; margin-left: 10px; margin-right: 5px;} .rub #main .rightside .bloc_medias ul.photos li a { text-decoration: none; color: #717171; } .rub #main .rightside .bloc_medias ul.photos li img{ border: 1px solid #717171; } /*docs*/ .rub #main .rightside .bloc_medias ul.docs { margin-left: auto; margin-right: auto; width: 280px; padding-top: 15px; padding-bottom: 5px;text-align:left; } .rub #main .rightside .bloc_medias ul.docs li { } .rub #main .rightside .bloc_medias ul.docs li a { text-decoration: none; color: #717171; font-weight:bold;font-size: 90%;} .rub #main .rightside .bloc_medias ul.docs li img{ border: 0; vertical-align:middle} .rub #main .rightside .bloc_medias ul.lienint { margin-left: auto; margin-right: auto; width: 280px; padding-top: 15px; padding-bottom: 5px;text-align:left; } .rub #main .rightside .bloc_medias ul.lienint li { } .rub #main .rightside .bloc_medias ul.lienint li a { text-decoration: none; color: #00a300; font-weight:bold;font-size: 90%;} .rub #main .rightside .bloc_medias ul.lienint li img{ border: 0; } .rub #main .rightside .bloc_medias ul.lienext { margin-left: auto; margin-right: auto; width: 280px; padding-top: 15px; padding-bottom: 5px;text-align:left; } .rub #main .rightside .bloc_medias ul.lienext li { } .rub #main .rightside .bloc_medias ul.lienext li a { text-decoration: none; color: #a30000; font-weight:bold;font-size: 90%;} .rub #main .rightside .bloc_medias ul.lienext li img{ border: 0; } .rub #main .rightside .bloc_medias .btn { display: block; background: url(../img/rub_rightmedia_bot_bg.png) no-repeat left top; height: 24px; padding-top: 4px; text-align: left; } .rub #main .rightside .bloc_medias .btn a { text-decoration: none; font-weight: bold; color: #474956; margin-left: 150px; padding-left: 12px; } .rub #main .leftsidefull { width: 100%; /*margin-top: 30px;*/ float: left; } .rub #main .leftsidefull a:hover { text-decoration:none } .rub #main .leftsidefull h1 { font-size: 170%; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; border-bottom: 1px dotted #ccc; padding-bottom: 2px; margin-bottom: 13px; font-weight: normal; } .rub #main .leftsidefull p { margin-bottom: 10px; } .rub #main .leftsidefull .chapeau { font-weight: bold; font-size: 110%; } .rub #main .leftsidefull #article { width: 736px; padding:35px 20px 25px;} /****************/ /* MEDIATHEQUE */ /**************/ /************/ /*colonnes*/ .rub #main.mediatheque #head { border-left:1px solid #c2c2c2; border-right: 1px solid #c2c2c2; height: 102px; background-color: #f5f5f5; position: relative; z-index: 10; width: 958px; border-bottom: 1px solid #c2c2c2; } .rub #main.mediatheque { border-left: none; border-right: none; width:958px; background: none; color: #474956; } .rub #main.mediatheque .leftside { width: 957px; position: relative; float: left; } .rub #main.mediatheque .rightside { width:1px; float: left; padding-bottom: 20px; } /*menu onglets*/ .rub #main.mediatheque #head ul { position: absolute; left: 0px; bottom: -1px; z-index: 60; } .rub #main.mediatheque #head ul li{ display: inline; } .rub #main.mediatheque #head ul a { border-right: 1px solid #c2c2c2; border-top: 1px solid #c2c2c2; height: 20px; padding-right: 10px; padding-left: 10px; color: #303030; text-decoration: none; margin: 0px; display: block; float: left; padding-top: 2px; } .rub #main.mediatheque #head li a:hover, .rub #main.mediatheque #head li a.active { background-color:#F5F5F5; display: block; } /* formulaire filtre */ .rub #main #filtre { width: 150px; background-color: #F5F5F5; float: left; font-size: 95%; margin-top: 20px; border: 1px solid #e2dede; padding-right: 10px; padding-left: 10px; padding-top: 10px; padding-bottom: 10px; position: relative; color: #474956; margin-bottom: 20px; } .rub #main #filtre h2 { font-size: 110%; margin-bottom: 10px; } .rub #main #filtre fieldset { border-top: 1px dotted #474956; margin-top: 15px; padding-top: 15px; position: relative; } .rub #main #filtre label { vertical-align: middle; } .rub #main #filtre input.text { width: 148px; font-size: 95%; color: #474956; margin-bottom: 5px; } .rub #main #filtre select { width: 152px; font-size: 95%; color: #474956; margin-top: 5px; margin-bottom: 5px; } .rub #main #filtre select.select_annee { width: 61px; } .rub #main #filtre select.select_mois { width: 80px; margin-right: 5px; } .rub #main #filtre select.nav_page { width: 45px; vertical-align: middle; margin-left: 10px; } .rub #main #filtre input#filtrer { background: url(../img/est_mediatheque_form_btn.png) repeat-x left top; color: #fff; border: none; height: 27px; text-transform: uppercase; font-weight: bold; font-size: 93%; letter-spacing: -1%; position: relative; margin-right: auto; margin-left: auto; display: block; width: 90px; margin-top: 5px; margin-bottom: 5px; cursor: pointer; } /*main*/ .rub #main.mediatheque #article { width: 760px; padding-right: 0px!important; position: relative; } .rub #main.mediatheque #article h2 { border-bottom: 1px dotted #ccc; padding-bottom: 5px; font-size: 140%; margin-left: 20px; margin-right: 15px; } .rub #main.mediatheque #article p { margin-left:20px; margin-right:15px; } .rub #main.mediatheque #article ul { margin-left:20px; margin-right:15px; } .rub #main.mediatheque #article ul.accueil_media { margin-top: 45px; position: relative; margin-right: auto; margin-left: auto; width: 620px; } .rub #main.mediatheque #article ul.accueil_media li { background: none!important; background-image: url(none); float: left; text-align: center; display: block; font-size: 135%; font-weight: bold; padding: 0; margin-left: 25px; margin-right: 25px; } .rub #main.mediatheque #article ul.accueil_media li img { border: none!important; margin-bottom: 10px; } .rub #main.mediatheque #article ul.accueil_media li a { text-decoration: none; } /*main photos*/ .rub #main.mediatheque #article.photos ul { margin-left:auto; margin-right:auto; display: block; } .rub #main.mediatheque #article.photos ul li { display:block; float:left; font-size:85%; margin-left:20px; margin-right:6px; text-align:left; width:125px; background: none!important; font-size: 85%; height: 135px; overflow: hidden; padding-left: 0px; font-weight: bold; } .rub #main.mediatheque #article.photos ul li a { text-decoration: none; color: #717171!important; } .rub #main.mediatheque #article.photos .pagination { background-color: #F5F5F5; border-top: 1px solid #e2dede; border-bottom: 1px solid #e2dede; text-align: center; position: relative; margin-right: 20px; margin-left: 20px; } .rub #main.mediatheque #article.photos .pagination a { color:#474956!important; text-decoration: none; padding-right: 3px; padding-left: 3px; border-right: 1px solid #f5f5f5; border-left: 1px solid #f5f5f5; padding-top: 1px; padding-bottom: 1px; } .rub #main.mediatheque #article.photos .pagination a:hover, .rub #main.mediatheque #article.photos .pagination a.active { color:#0387d2; background-color: #fff; } /* main docs */ .rub #main.mediatheque #article.docs #accordion { margin-left: 20px; margin-top: 25px; } .rub #main.mediatheque #article.docs #accordion img { margin-right: 5px; border:none; vertical-align: middle; } .rub #main.mediatheque #article.docs #accordion h3.toggler { margin-bottom: 2px; margin-top: 8px; border: 1px dotted #ccc; padding: 2px; background: url(../img/est_list_picto.png) no-repeat 5px center!important; padding-left: 20px; } .rub #main.mediatheque #article.docs #accordion h3:hover.toggler { cursor:pointer; background-color:#F5F5F5; } .rub #main.mediatheque #article.docs #accordion p { margin-bottom: 5px; } .rub #main.mediatheque #article.docs #accordion .toggler {} .rub #main.mediatheque #article.docs #accordion .element {} /**************/ /* autres */ /************/ .hightLight{font-weight:bold} #main #article .searchbar {background-color:#55A8DC;color:#fff;padding-top:5px;padding-bottom:2px;} #est.rub #main #article .searchbar p a {color:#fff} #main #article .searchbar p {margin-left:5px} #main #article .searchbar p span{font-weight:bold} /*ajout accueil*/ #main.home #photo-accueil,#main.home .videos {width:535px} #main.home #photo-accueil li { -moz-background-clip:border !important; -moz-background-inline-policy:continuous !important; -moz-background-origin:padding !important; background:transparent none repeat scroll 0 0 !important; display:block; float:left; font-size:85%; font-weight:bold; height:110px; margin-left:0px; margin-right:6px; overflow:hidden; padding-left:0; text-align:left; width:120px; } #main.home .docs ,#main.home .photos { padding-left:20px;width:515px } #main.home .docs h2 ,#main.home .videos h2,#main.home .photos h2 { font-size:15px;margin-bottom:5px;font-weight:lighter;font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;color:#0387D2; } /*newsticker*/ #NewsTicker #NewsVertical li{height:100px;} ul#TickerVertical{margin-left:5px;} #est #main.home #NewsTicker #NewsVertical h2 a{color:#fff;} #article p{text-align:justify} /*************************/ /* end */