/****************** RESET *******************/ html,body,div,span,applet,object,iframe,h1,h2,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,b,u,i,center,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;vertical-align:baseline;background:transparent;} body {line-height:1;} ol, ul {list-style:none;} blockquote, q {quotes:none;} :focus {outline:0;} ins {text-decoration:none;} del {text-decoration:line-through;} table {border-collapse:collapse;border-spacing:0;} /****************** CLEARFIX *****************/ .clearfix:after {content:".";display:block;clear:both;visibility:hidden;line-height:0;height: 0;} html[xmlns] .clearfix {display:block;} * html .clearfix {height:1%;} /****************** HTML *********************/ * {margin:0;padding:0;} body {color:#656565;font-family:"Trebuchet MS", Tahoma, Arial, Verdana, Helvetica, sans-serif;font-size:11px;} img {border:0;} a {color:#000;text-decoration:underline;} a:hover {color:#f6a21c;} a.action {color:#ef9000;text-decoration:underline;} a.action:hover {color:#000000;text-decoration:underline;} h1 {color:#f6a21c;font-size:12px;font-weight:normal;/*line-height:14px;*/text-transform:uppercase;} h2 {font-size:11px;color:#ac76ce;margin-bottom:6px;font-weight:normal;text-transform:uppercase;} h3 {font-size:10px;color:#ccc;margin-bottom:4px;text-transform:uppercase;} p, li, a {font-size:11px;line-height:14px;} .errors {color:#cc3300;padding:4px;margin:10px 0;border:1px dashed #cc3300;} .message {color:blue;padding:4px;margin:10px 0;border:1px dashed blue;} .left {float:left;} .right {float:right;} .clear {clear:both;visibility:hidden;height:0;display:block;} #preview {position:absolute;border:1px solid #000;background:#AC76CE;padding:2px;display:none;color:#fff;} #tooltip {z-index:9999999;position:absolute;border:1px solid #f6a21c;background:url('../img/bg_tooltip.gif') repeat-x bottom #fff /*#90c47c*/;padding:5px;color:#000;font-weight:bold;display:none;-moz-border-radius:5px; } /****************** LAYOUT *******************/ #openmag {position:relative;min-height:100%;} #header_wrap {width:100%;height:150px;background:url('../img/bg_header.gif');} #header {width:890px;margin:0 auto;} #main_wrap {width:100%;} #main {width:890px;margin:0 auto;padding-bottom:20px;} #footer_wrap {width:100%;height:280px;background:url('../img/bg_footer.gif');} #footer {width:890px;margin:0 auto;} /****************** MENU ******************/ #menu {width:890px;height:72px;background:url('../img/bg_menu.gif');} #menu ul {float:left;margin-left:14px;} #menu li {display:inline;} #menu a, #menu span {float:left;display:block;background:url('../img/bg_nav.jpg');text-indent:-9999px;} #menu a#actu {width:130px;height:72px;background-position:0 0;} #menu span#musiques {width:109px;height:35px;background-position:-140px 0;} #menu a#rock_pop {width:121px;height:35px;background-position:-249px 0;} #menu a#world_jazz {width:136px;height:35px;background-position:-370px 0;} #menu a#electro {width:100px;height:35px;background-position:-506px 0;} #menu a#urban_groove {width:162px;height:35px;background-position:-606px 0;} #menu span#mais_aussi {width:109px;height:35px;background-position:-140px -35px;} #menu a#cinema {width:121px;height:35px;background-position:-249px -35px;} #menu a#litterature {width:136px;height:35px;background-position:-370px -35px;} #menu a#sortir {width:100px;height:35px;background-position:-506px -35px;} #menu a#jeux_concours {width:162px;height:35px;background-position:-606px -35px;} #menu a#actu:hover {background-position:0 144px;} #menu a#rock_pop:hover {background-position:-249px 144px;} #menu a#world_jazz:hover {background-position:-370px 144px;} #menu a#electro:hover {background-position:-506px 144px;} #menu a#urban_groove:hover {background-position:-606px 144px;} #menu a#cinema:hover {background-position:-249px 109px;} #menu a#litterature:hover {background-position:-370px 109px;} #menu a#sortir:hover {background-position:-506px 109px;} #menu a#jeux_concours:hover {background-position:-606px 109px;} #menu a#actu.current {background-position:0 72px;} #menu a#rock_pop.current {background-position:-249px 72px;} #menu a#world_jazz.current {background-position:-370px 72px;} #menu a#electro.current {background-position:-506px 72px;} #menu a#urban_groove.current {background-position:-606px 72px;} #menu a#cinema.current {background-position:-249px 37px;} #menu a#litterature.current {background-position:-370px 37px;} #menu a#sortir.current {background-position:-506px 37px;} #menu a#jeux_concours.current {background-position:-606px 37px;} /****************** HEADER ******************/ #header ul#links {float:right;background:#fff;padding:2px 10px;} #header ul#links li {display:inline;} #header ul#links li a {text-decoration:underline;} #header #logo {float:left;margin-top:60px;} #header ul#bannieres {float:right;margin-top:60px;} /****************** FOOTER ******************/ #footer div {float:left;margin-top:20px;margin-right:40px;width:75px;} #footer div.openmag {width:130px;} #footer h2 {color:#f6a21c;height:30px;line-height:30px;background:url('../img/pt2.gif') repeat-x bottom;} #footer li {padding:1px 0;} #footer a {color:#929091;text-decoration:underline;} #footer a#link_dl {float:right;margin-top:25px;} /****************** COMMUN ******************/ h1.title {font-size:12px;color:#fff;background:#000;height:30px;line-height:30px;} h1.title img {float:left;margin:7px 10px;} h1.title a img {float:right;margin:12px 6px 0 0;} h2.title {font-size:12px;color:#fff;background:#000;height:30px;line-height:30px;} h2.title img {margin:8px 5px;} div.item:hover {background:#f2f2f2;} div.item {/*cursor:pointer;*/} div.item p {line-height:16px;} div.item h1 span {color:#000;font-size:10px;line-height:14px;} .pagination {float:right;margin-right:140px;} .pagination a, .pagination strong, .pagination span {float:left;display:block;line-height:32px;margin-right:5px;font-size:12px;color:#fff;text-decoration:none;} .pagination strong {color:#f6a21c;font-weight:normal;} .pagination span {color:#aaa;} a.suite {display:block;background:url('../img/pu1.gif') no-repeat 0 5px;padding-left:8px;color:#656565;font-weight:bold;text-decoration:underline;} a.suite:hover {color:#000;} hr {display:block;clear:both;height:1px;background:url('../img/pt1.gif') repeat-x bottom;border:0;} /****************** RUBRIQUE ******************/ div.col3 {width:290px;float:left;margin-right:10px;} div.col3.last {margin-right:0;} div.col3#interviews div.item {margin-top:10px;text-align:justify;} div.col3#interviews div.item h1 {font-size:18px;text-align:left;} div.col3#interviews div.item img {margin-bottom:10px;} div.col3#interviews div.item div {margin:0 2px;} div.col3#chroniques, div.col3#actualites {margin-bottom:20px;} div.col3#chroniques div.item, div.col3#actualites div.item {height:60px;padding:10px 0;} div.col3#chroniques div.item img, div.col3#actualites div.item img {float:left;} div.col3#chroniques div.item div, div.col3#actualites div.item div {float:right;width:220px;} /****************** 680 - 190 ******************/ div.col680 {width:680px;} div.col190 {width:190px;} div.col190 div.item {height:60px;padding:10px 0;} div.col190 div.item img {float:left;} div.col190 div.item div {float:right;width:120px;} div.col190 div.itw {padding:10px 0;} div.col190 div.itw img {margin-bottom:4px;} div.col190 a.link_all {display:block;margin:10px 0 20px 0;} /****************** HOME ******************/ #home {} #home_top {width:890px;height:200px;margin-bottom:20px;} #home_left {float:left;width:590px;margin-right:10px;} #home_right {float:right;width:290px;} #home_slides {width:680px;height:200px;float:left;} #home_slides li span {display:none;} #home_slides_nav {width:210px;height:200px;background:#000;float:right;} #home_slides_nav li a {display:block;width:185px;height:35px;background:url('../img/home_slide_link.jpg');color:#989898;text-decoration:none;padding:5px 0 0 25px;} #home_slides_nav li a strong {display:block;} #home_slides_nav li a.activeSlide {color:#fff;} #home #actualites {margin-bottom:20px;} #home #actualites div.item {height:60px;padding:10px 0;} #home #actualites div.item img {float:left;} #home #actualites div.item div {float:right;width:520px;} #home #interviews div.item {width:290px;float:right;padding:10px 0;margin-left:10px;} #home #interviews div.item h1 {font-size:20px;} #home #interviews div.item img {margin-bottom:10px;} #home #interviews div.item div {margin:0 2px;} #home #interviews div.item.last {margin-left:0;} #home #interviews div.item.last h1 {color:#6138c9;} #home #chroniques {margin-bottom:20px;} #home #chroniques div.item {height:60px;padding:10px 0;} #home #chroniques div.item img {float:left;} #home #chroniques div.item div {float:right;width:220px;} #home #chroniques a#link_chroniques {float:right;margin:10px 0 37px 0;} #home_right a#eastpack {display:block;width:290px;height:120px;background:url('../img/SW09_modzik.gif');margin-top:60px;} #home_right a#eastpack:hover {background:url('../img/SW09_modzik_survol.gif');} /****************** INTERVIEW ******************/ div#chapo {font-family:Georgia;color:#9b9b9b;font-size:14px;font-weight:bold;line-height:19px;text-align:justify;margin:10px 0 0 0;} div#chapo span#auteur {color:#000;font-size:11px;font-weight:normal;font-style:italic;line-height:19px;/*white-space:nowrap;*/} div#chapo:first-letter {font-size:42px;float:left;height:360px;margin-right:2px;margin-top:4px;text-shadow:5px;} div#texte {line-height:16px;text-align:justify;} div#texte1, div#texte2 {float:left;width:330px;line-height:16px;text-align:justify;} div#texte2 {float:right;} div#photos {margin-top:20px;} div#share {clear:both;text-align:right;margin-bottom:10px;width:100%;} ul.thumb {margin:10px 0;padding:10px 0 0 10px;background:url('../img/bg_header.gif');} ul.thumb li {margin:0;padding:5px;float:left;position:relative;width:110px;height:110px;} ul.thumb li img {width:100px;height:100px;-ms-interpolation-mode:bicubic;border:1px solid #ddd;padding:5px;background:#f0f0f0;position:absolute;left:0;top:0;} ul.thumb li img.hover {background:url('../img/thumb_bg.png') no-repeat center center;border:none;} ul.thumb li span {display:none;background:#fff;color:#000;position:absolute;width:174px;margin-left:-35px;margin-top:125px;text-align:center;border-top:1px solid #666;} ul.thumb li span.hover {display:block;z-index:9999;} div#liens {margin-top:20px;} div#liens ul {margin:20px;} div#liens li {margin:5px 0;padding:2px 0;border-bottom:1px dashed #ccc;} div#liens a {text-decoration:none;display:block;background:url('../img/pu1.gif') no-repeat 0 5px;padding-left:8px;color:#000;font-sweight:bold;} div#liens a:hover {color:#f6a21c;} /****************** ACTUALITES ******************/ #all_actualites {position:relative;} #all_actualites div.item {/*height:120px;*/padding:10px 0;} #all_actualites div.item img {float:left;} #all_actualites div.item div {float:right;width:590px;} /****************** CHRONIQUES ******************/ #all_chroniques {position:relative;} #all_chroniques div.item {/*height:120px;*/padding:10px 0;} #all_chroniques div.item img {float:left;margin-bottom:10px;} #all_chroniques div.item div {float:right;width:590px;padding:10px 0;} /****************** INTERVIEWS ******************/ #all_interviews div.item {width:290px;float:left;padding:10px 0;margin-right:10px;} #all_interviews div.item.first {clear:both;} #all_interviews div.item.last {margin-right:0;} #all_interviews div.item h1 {font-size:20px;} #all_interviews div.item img {margin-bottom:10px;} #all_interviews div.item div {margin:0 2px;} #all_interviews div.item div p {text-align:justify;} div.search {position:absolute;margin-left:755px;margin-top:6px;cursor:pointer;} div.search .hover {} div.search h4 {font-size:10px;color:#f6a21c;border:1px dotted #666;padding:1px 3px;width:120px;line-height:15px;font-weight:normal;background:url('../img/fleche_rub.png') 115px 5px no-repeat;} div.search ul {display:none;border:1px solid #222;} div.search li {background:#000;} div.search a {color:#fff;text-decoration:none;padding:1px 3px;font-size:10px;} div.search a:hover {color:#f6a21c;} /****************** CONTACTS, ABOUT ******************/ div.static {margin:10px 0;} div.static h1 {font-size:20px;margin-bottom:12px;} div.static h2 {font-size:12px;line-height:16px;color:#000;font-weight:bold;} div.static p {line-height:16px;text-align:justify;} div#contact {width:530px;} #contact_form p {margin:10px 0;} #contact_form label {display:block;line-height:18px;font-size:11px;} #contact_form input {width:220px;border:1px solid #ddd;padding:3px;margin-bottom:6px;} #contact_form select {font-size:11px;width:228px;border:1px solid #ddd;margin-bottom:6px;padding:3px;} #contact_form option {font-size:11px;} #contact_form textarea {width:240px;height:122px;border:1px solid #ddd;padding:3px;} #contact_form div.submit {clear:both} #contact_form div.submit span.error {float:left;font-family:"Trebuchet MS";font-size:11px;font-weight:bold;margin-left:5px;color:#cc3300;} #contact_form div.submit span.send {float:left;font-family:"Trebuchet MS";font-size:11px;font-weight:bold;margin-left:5px;color:blue;} #contact_form input.button {float:right;width:54px;height:17px;background:url('../img/button/send.jpg') no-repeat;text-indent:-9999px;margin-right:4px;} #jeu_concours {} #jeu_concours div#intro {} #jeu_concours div#intro div {float:left;width:200px;line-height:14px;} #jeu_concours div#intro div h1 {font-weight:normal;font-size:16px;line-height:20px;} #jeu_concours div#intro img {float:right;} #quizz {margin-top:20px;} #quizz div {margin-bottom:15px;float:left;} #quizz h2 {color:#000;font-size:11px;font-weight:bold;} #quizz p {margin:5px 0;} #quizz strong {color:#f6a21c;font-size:20px;font-weight:normal;} #quizz label {float:left;width:140px;} #quizz input {width:240px;background:#eee;border:1px solid #ccc;} #quizz input.button {margin:10px 0 0 140px;background:#f6a21c;color:#fff;width:auto;} p.required {font-size:9px;color:#000;margin:20px;} #openmag_live, #openmag_concours {width:424px;height:384px;-ms-interpolation-mode:bicubic;position:absolute;margin-left:200px;behavior:url('media/js/iepngfix.htc');} div.skyscraper {background:#ccc;float:right;margin:10px 0;padding:5px 10px 10px 10px;text-align:center;} div.carre {width:250px;background:#ccc;margin:5px 0;padding:5px 10px 10px 10px;text-align:center;} div.skyscraper h2, div.carre h2 {color:#fff;}