/* Theme Name: Theme URI: Description: Author: Mathieu Chartier Author URI: http://kindoweb.com Template: Base Version: 1.0 . Sources: –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––/ CSS Reset : http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ Typography : http://www.blueprintcss.org/ –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––/ . [Table Of Contents] 0- Reset 1- Globals Tags 1.1- Headings 1.2- Text elements 1.3- Lists 1.4- Tables 1.5- Forms 1.6- Links 1.6.1- Header links 1.6.2- Content links 1.6.3- Aside Primary links 1.6.4- Footer links 2- Global Structure init 3- Header 4- Content 4.1- Programmation 4.2- Participation 4.3- Nouvelles 4.4- Multimédia 4.5- Tourisme 4.6- Partenaires 4.7- Archives 5- Aside Primary 6- Footer 7- Class 8- Microformats 9- Dev */ /* =0 Reset ------------------------------------------------------------------ */ 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-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus { outline: 0; } body { color: black; background: white; } ol, ul { list-style: none; } 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: "" ""; } /* =1 Globals Tags ------------------------------------------------------------------ */ html{ background: #000508 url(../images/architecture/arc-html.jpg) repeat-y center top; } body{ font-size: 75%; color: #222; background: url(../images/architecture/arc-body.jpg) no-repeat center top; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; } /* =1.1 Headings ------------------------------------------------------------------ */ h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #111; font-family:Arial, Helvetica, sans-serif;} h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; } h2 { font-size: 2em; margin-bottom: 0.75em; } h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; } h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; } h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; } h6 { font-size: 1em; font-weight: bold; } /* =1.2 Text elements ------------------------------------------------------------------ */ p { margin: 0 0 1.5em; } a:focus, a:hover { color: #000; } a { color: #009; text-decoration: underline; } blockquote { margin: 1.5em; color: #666; font-style: italic; } strong { font-weight: bold; } em, dfn { font-style: italic; } dfn { font-weight: bold; } sup, sub { line-height: 0; } abbr, acronym { border-bottom: 1px dotted #666; } address { margin:0 0 7px; font-style: italic; } del { color:#666; } pre { margin: 1.5em 0; white-space: pre; } pre, code, tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; } /* =1.3 Lists ------------------------------------------------------------------ */ li ul, li ol { margin:0 1.5em; } ul, ol { margin: 0 1.5em 1.5em 1.5em; } ul { list-style-type: none; } ol { list-style-type: decimal; } dl { margin: 0 0 1.5em 0; } dl dt { font-weight: bold; } dd { margin-left: 1.5em; } /* =1.4 Tables ------------------------------------------------------------------ */ table { margin-bottom: 1.4em; width:100%; } th { font-weight: bold; } thead th { background: #c3d9ff; } th, td, caption { padding: 4px 10px 4px 5px; } tr.even td { background: #e2e2e2; } tfoot { font-style: italic; } caption { background: #eee; } /* =1.5 Forms ------------------------------------------------------------------ */ input {border:1px solid #cccccc;} textarea {border:1px solid #cccccc;} /* =1.6 Links ------------------------------------------------------------------ */ a:link, a:visited { color: #333; } a:hover { color: #111; } a:active { color: #111; } a[href$='.pdf'], a[rel='pdf'], a[rel*='pdf'], a[rel~='pdf']{ background: transparent url(icon_pdf.gif) no-repeat center right; } a[href ^="mailto:"]{background: transparent url(icon_mailto.gif) no-repeat center right; } a[class ="popup"]{ padding-right: 18px; background: transparent url(icon_popup.gif) no-repeat center right; } a[href$='.doc']{padding-right: 18px;background: transparent url(icon_doc.gif) no-repeat center right;} a[href$='.xls']{padding-right: 18px;background: transparent url(icon_xls.gif) no-repeat center right;} a[rel ~='external']{ padding-right: 18px; background: transparent url(icon_external.gif) no-repeat center right; } /* =2 Global Structure init ------------------------------------------------------------------ */ #site{ width:980px; margin:0 auto; } #header{ width:980px; height:172px; margin:0 auto; position:relative;} #content{ width:655px; float:left; } #content_primary{ width:720px; float:left; padding:18px 10px 18px 18px; } #aside_primary{ width:232px; float:right; padding:18px 0px;} #footer{ clear:both; width:944px; background:#000101; padding:25px 18px 2px; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; color:#ffffff; } #home #content { width:980px; background: url(../images/architecture/arc-body.jpg) no-repeat center -172px; } #home #content_primary{ width:730px; float:left; padding:18px 0px 18px 18px; } /* =3 Header ------------------------------------------------------------------ */ #header address span { float:left; display:none; } #header address .url { margin-left:19px; } #header #logo { height:114px; } #header #nav-site-header {position:absolute;right:8px;top:13px; } #header #nav-site-header ul { font-size:10px; font-weight:bold; } #header #nav-site-header ul li { float:left; padding-left:9px; text-transform:uppercase; } #header #nav-site-header a { color:#fff; text-decoration:none; } #header #nav-site-global-en, #header #nav-site-global { font-family:Arial, Helvetica, sans-serif; height:26px; background:transparent url(../images/architecture/arc_nav-header.gif) no-repeat 18px 0px; } #header #nav-site-global-en ul { font-size:12px; font-weight:bold; margin:0 0 0 18px; padding:0 0 0 155px; } #header #nav-site-global ul { font-size:12px; font-weight:bold; margin:0 0 0 18px; padding:0 0 0 125px; } #header #nav-site-global-en ul li, #header #nav-site-global ul li { float:left; padding:5px 30px 6px 30px; text-transform:uppercase; cursor:pointer; color:#ffffff;} #header #nav-site-global-en ul li ul li, #header #nav-site-global ul li ul li { float:left; padding:5px 0 6px 22px; text-transform:uppercase; cursor:pointer; color:#ffffff;} #header #nav-site-global-en a, #header #nav-site-global a { color:#ffffff; text-decoration:none; } #header #nav-site-global-en li.current, #header #nav-site-global li.current, #header #nav-site-global-en a.current, #header #nav-site-global a.current { color:#f1e581; } #header #nav-site-global-en li:hover, #header #nav-site-global-en li.current:hover, #header #nav-site-global li:hover, #header #nav-site-global li.current:hover, #header #nav-site-global-en a:hover, #header #nav-site-global-en a.current:hover, #header #nav-site-global a:hover, #header #nav-site-global a.current:hover { color:#ffe323; cursor:default; } #header #nav-site-global-en ul ul li:hover, #header #nav-site-global-en ul ul li.current:hover, #header #nav-site-global ul ul li:hover, #header #nav-site-global ul ul li.current:hover, #header #nav-site-global-en ul ul a:hover, #header #nav-site-global-en ul ul a.current:hover, #header #nav-site-global ul ul a:hover, #header #nav-site-global ul ul a.current:hover { color:#ffe323; cursor:pointer; } #header #nav-site-global-en ul#topnav, #header #nav-site-global ul#topnav { position:relative; } #header #nav-site-global-en ul#topnav li ul { float:left; position:absolute; left:0px; top:26px; margin:0; width:944px; height:26px; background:transparent url(../images/architecture/arc_nav-header.gif) no-repeat; } #header #nav-site-global ul#topnav li ul { float:left; position:absolute; left:0px; top:26px; margin:0; width:944px; height:26px; background:transparent url(../images/architecture/arc_nav-header.gif) no-repeat; } #header #nav-site-global-en ul#topnav li ul#submenu-prog-en { padding-left:195px; } #header #nav-site-global-en ul#topnav li ul#submenu-prog-en-hf { padding-left:245px; } #header #nav-site-global-en ul#topnav li ul#submenu-part-en { padding-left:225px; } #header #nav-site-global-en ul#topnav li ul#submenu-news-en { padding-left:405px; } #header #nav-site-global-en ul#topnav li ul#submenu-multi-en { padding-left:345px; } #header #nav-site-global-en ul#topnav li ul#submenu-tour-en { padding-left:210px; } #header #nav-site-global ul#topnav li ul#submenu-prog { padding-left:145px; } #header #nav-site-global ul#topnav li ul#submenu-prog-hf { padding-left:220px; } #header #nav-site-global ul#topnav li ul#submenu-part { padding-left:260px; } #header #nav-site-global ul#topnav li ul#submenu-news { padding-left:395px; } #header #nav-site-global ul#topnav li ul#submenu-multi { padding-left:335px; } #header #nav-site-global ul#topnav li ul#submenu-tour { padding-left:193px; } #header #nav-site-global-en ul#topnav li ul li, #header #nav-site-global ul#topnav li ul li { text-transform:none; } #header #nav-site-global-en ul#topnav li ul, #header #nav-site-global ul#topnav li ul { display:none; } /* =4 Content ------------------------------------------------------------------ */ #home #slider { width:740px; height:310px; background:url(../images/architecture/arc-slider.jpg) no-repeat; } #home #nouvelles-hors-festival { width:355px; height:518px; background-color:#ededed; padding-bottom:10px; } #home #nouvelles { width:355px; height:348px; background-color:#ededed; padding-bottom:10px; } #home #programmation { width:355px; height:150px; background-color:#ededed; padding-bottom:10px; margin-bottom:10px;} #home #chorale-etoile { width:355px; height:354px; background-color:#ededed; padding-bottom:10px; margin-bottom:10px;} #home #multimedias { width:355px; height:144px; background-color:#ededed; padding-bottom:10px; } #home .colonne { float:left; width:355px; height:528px; padding-right:10px; } #home #chorale-etoile h3 { text-transform:none; margin-bottom:10px; } #home #chorale-etoile p { margin:7px 10px 0; text-transform:uppercase; font-size:10px;} #home #chorale-etoile a {color:#444048;} #home #chorale-etoile .hentry { height:84px; } #home #chorale-etoile .hentry p { font-size:15px; text-transform:uppercase; margin:0px; } #home #chorale-etoile .hentry p a { color:#000000; } #home #chorale-etoile .hentry p.extrait { margin-top:15px; } #home #chorale-etoile .hentry p.extrait a { color:#ff8c17; font-size:12px; text-transform:uppercase; font-weight:bold; } #home #chorale-etoile a:hover {text-decoration:underline;} #home #chorale-etoile a:hover p.nom-chorale {text-decoration:underline;} #home #programmation .image-news { float:left; width:95px; height:70px; padding-left:25px;} #home #nouvelles-hors-festival .image-news, #home #nouvelles .image-news { float:left; width:120px; height:70px;} #home #programmation .extrait-news, #home #nouvelles-hors-festival .extrait-news, #home #nouvelles .extrait-news { float:left; width:200px; padding-left:10px;height:70px; } #home #nouvelles-hors-festival .hentry { height:128px; } #home #programmation .hentry { padding:10px 10px 0; background:none; } #home #nouvelles .hentry { height:122px; } #home #nouvelles-hors-festival .hentry p, #home #nouvelles .hentry p { margin:0; line-height:14px; font-size:12px; text-transform:none;} #home #nouvelles-hors-festival .hentry a, #home #nouvelles .hentry a { text-decoration:underline;} #home #nouvelles-hors-festival .hentry a:hover, #home #nouvelles .hentry a:hover { color:#ff8c17;} #home #programmation p.lien { text-transform:uppercase; font-size:10px;} #home #nouvelles-hors-festival p, #home #nouvelles p { margin:7px 10px 0; text-transform:uppercase; font-size:10px;} #home #programmation p.lien a, #home #nouvelles-hors-festival a, #home #nouvelles a {color:#444048;} #home #programmation p.lien a:hover, #home #nouvelles-hors-festival a:hover, #home #nouvelles a:hover {text-decoration:underline;} #home #multimedias .image-multi { float:left; width:120px; height:70px;} #home #multimedias .legende-multi { float:left; width:200px; padding-left:10px;height:70px; } #home #multimedias .hentry { height:70px; } #home #multimedias .hentry p { margin:0; line-height:14px; font-size:12px; text-transform:none;} #home #multimedias p { margin:7px 10px 0; text-transform:uppercase; font-size:10px;} #home #multimedias a {color:#444048;} #home #multimedias a:hover {text-decoration:underline;} #home #content{ position:relative;} #home #teaser-en{ height:258px;position:absolute;right:18px;top:13px;width:194px; padding:16px 10px; height:300px; /* background:url(../images/architecture/arc-teaser_en.jpg) no-repeat; */} #home #teaser{ height:258px;position:absolute;right:18px;top:13px;width:194px; padding:16px 10px; height:300px; /* background:url(../images/architecture/arc-teaser.jpg) no-repeat; */} #home #teaser-en .loto-quebec, #home #teaser .loto-quebec{ color:#faed7e; font-family:Arial, Helvetica, sans-serif; font-size:13px; float:left; margin:60px 0 4px 0; } #home #teaser-en .loto-date, #home #teaser .loto-date{ font-family:Arial, Helvetica, sans-serif; font-size:23px; font-weight:bold; color:#FFFFFF; clear:both; margin:0;} #home #teaser-en #teaser-message p, #home #teaser #teaser-message p{color:#FFFFFF;font-size:16px;line-height:24px;margin:12px 0 0;} #home #chorale-mois, #archives #chorale-mois { background-color:#ededed; padding:10px; } #home #chorale-mois h2, #archives #chorale-mois h2 { text-transform:uppercase; font-size:15px; font-weight:bold; } #home #chorale-mois .hentry, #archives #chorale-mois .hentry { background:none; padding:0px;} #home #chorale-mois .hentry p, #archives #chorale-mois .hentry p { font-size:15px; margin:0px; } #home #chorale-mois .hentry p a, #archives #chorale-mois .hentry p a { color:#000000; text-decoration:none; } #home #chorale-mois .hentry div.description p, #archives #chorale-mois .hentry div.description p { font-size:12px; } #home #chorale-mois .hentry a:hover, #archives #chorale-mois .hentry a:hover {text-decoration:underline;} #home #chorale-mois .hentry a:hover p.nom-chorale, #archives #chorale-mois .hentry a:hover p.nom-chorale {text-decoration:underline;} #content_primary h1{ display:none; } #content_primary h3{ text-transform:uppercase; font-size:15px; font-weight:bold; } #content_primary a{ text-decoration:none; color:#ff8c17; } #content_primary #boite{ float:left; width:100%; background-color:#ededed; } #content_primary #boite-contenu{ padding:15px 10px; } #content_primary #boite-contenu p{ margin:0px; } #content_primary .contact-contenu-left{ float: left; width: 230px; padding: 20px 0px; } #content_primary .contact-contenu-middle{ float: left; width: 230px; padding: 20px 0px; } #content_primary .contact-contenu-right{ float: left; width: 230px; padding: 20px 0px; } #content_primary .contact-contenu-left p,#content_primary .contact-contenu-middle p,#content_primary .contact-contenu-right p { margin:0px; } #content_primary #contact-left, #content_primary #contact-right { float:left; width:290px; } #content_primary #contact-left ul, #content_primary #contact-right ul { list-style-type:none; font-size:12px; margin:0; padding:0;} .separateur {clear:both; height:10px; background-color:transparent;} .boite { background-color:#ededed; padding:15px 10px; } .hentry {clear:both;background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; padding:15px 10px;} p.nom-chorale { font-weight:bold; color:#000000; } /* =4.1 Programmation ------------------------------------------------------------------ */ #programmation #grand-evenements {background-color:#ededed; } #programmation #grand-evenements h3 {font-weight:bold; font-size:15px; text-transform:uppercase; padding:15px 10px; margin:0px;} #programmation #grand-evenements p {padding:0px 10px 10px; margin:0} #programmation #grand-evenements p.no-padding {padding-bottom:0px; text-transform:uppercase;} #programmation #spectacles {background-color:#ededed;} #programmation #spectacles .entry {height:178px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #programmation #spectacles .entry .description {float:left; height:158px; padding:15px 10px 5px; width:380px; } #programmation #spectacles .entry .photo {float:left; height:158px; width:320px; } #programmation #spectacles .entry h3 {margin-bottom:0px; font-size:21px; font-weight:normal; } #programmation #spectacles .entry p {margin-bottom:0px; } #programmation #spectacles .entry p.bold {margin-bottom:10px; } #programmation #spectacles .entry p.date {font-weight:bold; padding-bottom:0px; text-transform:uppercase; font-size:14px; margin-bottom:2px; } #programmation #spectacles .entry p.no-margin {margin:0px} #programmation #spectacles .entry p.fiche-es {margin-top:10px;} #programmation #spectacles .entry p.fiche-es a {color:#000000; padding:3px 10px; } #programmation #spectacles .entry .choeur {padding:10px 0px;} #programmation #themes {background-color:#ededed;} #programmation #themes .entry {height:180px; background:url(../images/architecture/arc-theme-bg.gif) repeat-x;} #programmation #themes .entry .description {float:left; height:160px; padding:15px 10px 5px; width:380px; } #programmation #themes .entry .photo {float:left; height:160px; width:320px; } #programmation #themes .entry h3 {margin-bottom:10px; color:#ffffff; font-size:21px; font-weight:normal;} #programmation #themes .entry p {margin-bottom:10px; color:#ffffff;} #programmation #themes .entry p a {color:#ffe323; text-decoration:underline;} #programmation #themes-detail {background-color:#ededed;} #programmation #themes-detail h3 {font-size:21px; margin-top:10px;} #programmation #themes-detail .image {text-align:center;} #programmation .fiche table {background-color:#ededed; margin:0px;} #programmation .fiche table th {background-color:#e0e0e0; text-transform:uppercase; color:#ff8c17; height:30px; padding:7px 10px} #programmation .fiche table td {padding:10px 10px;} #programmation .fiche table p {margin-bottom:0px; } #programmation .fiche table a {color:#000000; text-decoration:underline;} #programmation .fiche table .choeur {width:375px; border-right:1px solid #c1c1c1; font-weight:bold;} #programmation .fiche table .lieu {width:200px; border-right:1px solid #c1c1c1;} #programmation h3.horaire {color:#ffffff; margin:15px 0 8px;} #programmation #coordonnees ul, #programmation #tarification ul, #programmation #liste-des-salles ul, #programmation #hebergement ul {margin:0 0 15px 0;} #programmation #coordonnees p, #programmation #tarification p, #programmation #liste-des-salles p, #programmation #hebergement p {margin-bottom:15px;} #programmation #editions-precedentes {background-color:#ededed;} #programmation #editions-precedentes #liste-editions p { margin-bottom:5px; } #programmation #editions-precedentes ul#liste-editions { margin:0; } #programmation #editions-precedentes ul#liste-editions li { float:left; padding-right:25px; text-align:center; } #programmation #chorales-participantes {background-color:#ededed; } #programmation #chorales-participantes h3 {padding:15px 10px; margin:0px;} #programmation #chorales-participantes ul#alphabet { background-color:#e0e0e0; height:26px; margin:0px; padding:8px 0 0 7px;} #programmation #chorales-participantes ul#alphabet li { font-size:15px; font-weight:bold; } #programmation #chorales-participantes ul#alphabet li div { float:left; width:25px; text-align:center; border-right:2px solid #cccccc; } #programmation #chorales-participantes ul#alphabet li div.no-border { border:none; } #programmation #chorales-participantes ul#liste-chorale { margin:0px;} #programmation #chorales-participantes ul#liste-chorale p { margin-bottom:5px;} #programmation #chorales-participantes ul#liste-chorale li.hentry { padding:15px 15px;} #programmation #comment-sinscrire {background-color:#ededed; } #programmation #comment-sinscrire #inscription-choriste {float:left; width:320px; padding:15px 25px 15px 15px; } #programmation #comment-sinscrire #inscription-chorale {float:left; width:300px; padding:15px 15px; } #programmation #infos-pratiques {background-color:#ededed; } #programmation #infos-pratiques .boite {background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; } #programmation #infos-pratiques ul {margin:0 0 15px 0;} #programmation #infos-pratiques #hotel-sheraton {float:left; width:330px; padding-right:25px;} #programmation #infos-pratiques #hotel-sheraton a {padding:3px 7px; color:#000000;} #programmation #infos-pratiques #comfort-inn {float:left; width:310px;} #programmation #infos-pratiques #liste-gauche {float:left; width:310px;} #programmation #infos-pratiques #liste-droite {float:left; width:310px;} #programmation #infos-pratiques #gmap {border:1px solid #9d9d9d;} #programmation #infos-pratiques #gmap .logo-mondial { float:left; position:absolute;} #programmation #infos-pratiques #gmap .adresse{ float:right; position:absolute; left:85px;} /* =4.2 Participation ------------------------------------------------------------------ */ #participation #choeurs {background-color:#ededed;} #participation .boite {padding:15px 10px 5px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #participation .transport {background-color:#ededed;} #participation .hebergement {background-color:#ededed;} #participation .liens {background-color:#ededed;} #participation #choristes {background-color:#ededed;} #participation #hotes {background-color:#ededed;} #participation #volontaires {background-color:#ededed; } #participation #nombre-choristes {clear:both; padding-bottom:15px;} #participation #confirmation { background-color:#ededed; } #participation #zone-securisee { background-color:#ededed; } #participation #zone-securisee h3 { margin-bottom:2px; } #participation #zone-securisee h3.login { margin-bottom:15px; } #participation #zone-securisee label { float:left; width:100px; } #participation #zone-securisee p.liste { margin-bottom:5px; font-weight:bold; } #choriste-form, #choeur-form {background-color:#ededed; height:385px; padding:15px 15px;} #hote-form {background-color:#ededed; height:385px; padding:15px 15px;} #volontaire-form {background-color:#ededed; height:250px; padding:15px 15px;} #choriste-form h2, #participation #hote-form h2, #participation #volontaire-form h2, #choeur-form h2 {font-size:15px; font-weight:bold; text-transform:uppercase;} #choriste-form .left-side, #participation #volontaire-form .left-side, #choeur-form .left-side {float:left; width:275px; height:200px;} #hote-form .left-side {float:left; width:275px; height:170px;} #choriste-form .right-side, #participation #volontaire-form .right-side, #choeur-form .right-side {float:left; width:265px; height:200px;} #hote-form .right-side {float:left; width:265px; height:170px;} #choriste-form p, #participation #hote-form p, #participation #volontaire-form p, #choeur-form p {margin:0; } #choriste-form input, #participation #hote-form input, #participation #volontaire-form input, #choeur-form input {margin-bottom:15px;} #choriste-form input.champ-part, #participation #hote-form input.champ-part, #participation #volontaire-form input.champ-part, #choeur-form input.champ-part {width:260px;} #choriste-form label.error, #participation #volontaire-form label.error, #choeur-form label.error {float:right; position:relative; right:328px; top:85px; font-size:10px; color:red;} #hote-form label.error {float:right; position:relative; right:328px; top:55px; font-size:10px; color:red;} #hote-form #nombre-choristes label.error {float:right; position:relative; right:180px; top:-14px; font-size:10px; color:red;} #choriste-form .left-side label.error, #participation #hote-form .left-side label.error, #participation #volontaire-form .left-side label.error, #choeur-form .left-side label.error {position:relative; float:right; right:13px; top:-50px; font-size:10px; color:red;} #choriste-form .right-side label.error, #participation #hote-form .right-side label.error, #participation #volontaire-form .right-side label.error, #choeur-form .right-side label.error {position:relative; float:right; right:4px; top:-50px; font-size:10px; color:red;} /* =4.3 Nouvelles ------------------------------------------------------------------ */ #nouvelles #confirmation { background-color:#ededed; } #nouvelles #confirmation h3 { margin:0; } #nouvelles #dernieres-actualites {background-color:#ededed; } #nouvelles #dernieres-actualites h3 {font-weight:bold; font-size:15px; margin-bottom:10px; text-transform:uppercase;} #nouvelles #dernieres-actualites p {margin-bottom:0px;} #nouvelles #dernieres-actualites .titre { padding:15px 10px;} #nouvelles #dernieres-actualites .texte {background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; padding:15px 10px;} #nouvelles #dernieres-actualites .texte p {line-height:16px;} #nouvelles #dernieres-actualites .texte img {float:right; margin:0px 0px 10px 12px;} #nouvelles #dernieres-actualites .texte a {text-decoration:underline; color:#444048;} #nouvelles #dernieres-actualites .texte a:hover {color:#ff8c17;} #nouvelles #dernieres-actualites .partage .share {float:left; padding:10px 10px 7px;} #nouvelles #dernieres-actualites .partage .rss {float:right; padding:10px;} #nouvelles #dernieres-actualites .send-print {float:right; margin-left:60px;} #nouvelles #dernieres-actualites .send-print img {margin-left:10px;} #nouvelles #dernieres-actualites .partage {clear:both;} #nouvelles #commentaires {background-color:#ededed; } #nouvelles #commentaires h3 {font-weight:bold; font-size:15px; margin-bottom:10px; text-transform:uppercase;} #nouvelles #commentaires p {margin-bottom:0px;} #nouvelles #commentaires #comment-form {padding:15px 10px; height:188px;} #nouvelles #commentaires #comment-form #comment-fields{float:left; width:340px; height:150px;} #nouvelles #commentaires #comment-form #comment-fields input {margin-bottom:12px;} #nouvelles #commentaires #comment-form #comment-fields label.error {position:relative; float:right; left:-16px; top:-47px; font-size:10px; color:red;} #nouvelles #commentaires #comment-form #comment-message textarea {margin-bottom:12px; height:110px;} #nouvelles #commentaires #comment-form #comment-message label.error {position:relative; left:230px; top:-140px; font-size:10px; color:red;} #nouvelles #commentaires #comment-form #comment-message {float:left; width:356px; height:150px;} #nouvelles #commentaires #comment-form label.error {position:absolute; float:left; left:30px;} #nouvelles #commentaires .comment-list {background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; padding:15px 10px;} #nouvelles #commentaires p.comment-text {padding-top:10px;} #nouvelles #commentaires h3.total-comments {padding:15px 10px 0px; margin-bottom:0px;} #nouvelles #envoyer-ami {background-color:#ededed; height:375px; padding:15px 15px;} #nouvelles #publier-nouvelle {background-color:#ededed; height:512px; padding:15px 15px;} #nouvelles #envoyer-ami h2, #nouvelles #publier-nouvelle h2 {font-size:15px; font-weight:bold; text-transform:uppercase;} #nouvelles #envoyer-ami #form-envoyer .left-side {float:left; width:275px; height:150px;} #nouvelles #publier-nouvelle #form-publish .left-side {float:left; width:275px; height:150px;} #nouvelles #envoyer-ami #form-envoyer .right-side {float:left; width:265px; height:150px;} #nouvelles #publier-nouvelle #form-publish .right-side {float:left; width:265px; height:150px;} #nouvelles #publier-nouvelle #form-publish label.error {position:relative; float:right; right:4px; top:-239px; font-size:10px; color:red;} #nouvelles #envoyer-ami #form-envoyer .left-side label.error {position:relative; float:right; right:13px; top:-50px; font-size:10px; color:red;} #nouvelles #publier-nouvelle #form-publish .left-side label.error {position:relative; float:right; right:13px; top:-50px; font-size:10px; color:red;} #nouvelles #envoyer-ami #form-envoyer .right-side label.error {position:relative; float:right; right:4px; top:-50px; font-size:10px; color:red;} #nouvelles #publier-nouvelle #form-publish .clear input {width:538px;} #nouvelles #publier-nouvelle #form-publish .left-side input, #nouvelles #publier-nouvelle #form-publish .right-side input, #nouvelles #envoyer-ami #form-envoyer .right-side input, #nouvelles #envoyer-ami #form-envoyer .left-side input {width:261px;} #nouvelles #publier-nouvelle #form-publish .right-side label.error {position:relative; float:right; right:4px; top:-50px; font-size:10px; color:red;} #nouvelles #publier-nouvelle #form-publish .clear label.error {position:relative; float:right; right:4px; top:-50px; font-size:10px; color:red;} #nouvelles #publier-nouvelle #form-publish #upload label.error {position:absolute; float:right; right:116px; top:484px; font-size:10px; color:red;} #nouvelles #envoyer-ami p, #nouvelles #publier-nouvelle p {margin:0; } #nouvelles #envoyer-ami textarea, #nouvelles #envoyer-ami input, #nouvelles #publier-nouvelle textarea, #nouvelles #publier-nouvelle input {margin-bottom:15px;} #nouvelles #envoyer-ami textarea{ width:538px; height:140px; } #nouvelles #publier-nouvelle textarea { width:538px; height:206px; } #nouvelles #articles-en-ligne, #nouvelles #revue-de-presse {background-color:#ededed; } #nouvelles #articles-en-ligne h3, #nouvelles #revue-de-presse h3 {font-weight:bold; font-size:15px; margin-bottom:5px; text-transform:uppercase;} #nouvelles #articles-en-ligne p, #nouvelles #revue-de-presse p { margin-bottom:5px;} #nouvelles #revue-de-presse p.lien-pdf { margin-bottom:0px;} #nouvelles #articles-en-ligne a { text-decoration:underline; color:#000000;} #nouvelles #articles-en-ligne a:hover { text-decoration:none; color:#ff8c17;} #nouvelles #articles-en-ligne table {margin:0;} #nouvelles #articles-en-ligne th {font-size:14px; background-color:#e0e0e0; text-transform:uppercase; color:#ff8c17;} #nouvelles #articles-en-ligne tr.even td {background-color:#e0e0e0;} #nouvelles #articles-en-ligne tr .date {padding:10px 15px; width:23%; border-right:2px solid #cccccc;} #nouvelles #articles-en-ligne tr .titre {padding:10px 15px; width:55%; border-right:2px solid #cccccc;} #nouvelles #articles-en-ligne tr .lien {padding:10px 15px; width:22%;} /* =4.4 Multimédias ------------------------------------------------------------------ */ #multimedias #photos {background-color:#ededed; } #multimedias #photos h3 {font-weight:bold; font-size:15px; margin-bottom:10px; text-transform:uppercase;} #multimedias #photos .photo-accordeon {float:left; padding-right:1px;} #multimedias #videos .video-accordeon {float:left; text-align:center;} #multimedias #videos .video-accordeon p {width:172px; padding-right:3px;} #multimedias #videos .pagination {clear:both; text-align:center; padding-top:10px;} #multimedias #videos .pagination a {color:#000000;} #multimedias #videos .pagination a:hover {color:#ff8c17;} #multimedias #accordeon a.white { text-decoration:none; color:#ffffff; } #multimedias #accordeon h2.zone-header { height:22px; color:#ffffff; font-size:13px; font-weight:bold; background:url(../images/architecture/arc-zone-header.gif) repeat-x; margin:0; padding:5px 0 0 13px; text-transform:uppercase; } #multimedias #accordeon .boite p.cat-name { float:left; width:350px; height:20px; } #multimedias #accordeon .boite p select { float:right; margin-top:-3px;} #multimedias #videos {background-color:#ededed; } #multimedias #videos h3 {font-weight:bold; font-size:15px; margin-bottom:10px; text-transform:uppercase;} #multimedias #photos .pagination, #multimedias #videos .pagination {clear:both; text-align:center; padding-top:10px;} #multimedias #photos .pagination a, #multimedias #videos .pagination a {color:#000000;} #multimedias #photos .pagination a:hover, #multimedias #videos .pagination a:hover {color:#ff8c17;} #multimedias #video-streaming {background-color:#ededed; } #multimedias #audio {background-color:#ededed; } #multimedias #audio h3 {margin-bottom:0; } #multimedias #audio .boite { background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #multimedias #audio p.date {text-transform:uppercase; margin-bottom:8px; } #multimedias #audio .photo-podcast {float:left; width:150px; padding-bottom:15px; } #multimedias #audio .texte-podcast {float:left; } #multimedias #audio p.download-podcast {text-transform:uppercase; font-weight:bold; padding-top:2px; margin-bottom:0px; } /* =4.5 Tourisme ------------------------------------------------------------------ */ #tourisme #decouvrir .boite {padding:0px;} #tourisme #decouvrir h3 select {float:right; text-transform:none; margin-top:-3px;} #tourisme #decouvrir .boite .boite {padding:15px 10px 5px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom #ededed;} #tourisme #discover{ position:relative; height:30px;} #tourisme #discover h3{ position:absolute; top:10px; left:10px;} #tourisme #discover select{ position:absolute; top:10px; right:10px;} /* =4.6 Partenaires ------------------------------------------------------------------ */ #partenaires #commanditaires {background-color:#ededed;} #partenaires #commanditaires h3.merci {height:50px; padding:15px 10px; background:#ededed url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; margin:0;} #partenaires #commanditaires h3 {padding:10px 10px; margin:0;} #partenaires #commanditaires .hentry {background:none; text-align:center; padding:15px 85px;} #partenaires #commanditaires .boite img {padding:15px;} #partenaires #commanditaires .boite {background:#ededed url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #partenaires #contacts .boite p { margin:0; } #partenaires #contacts .boite .contact-contenu-left { float: left; width: 230px; padding: 20px 0px; } #partenaires #contacts .boite .contact-contenu-middle { float: left; width: 230px; padding: 20px 0px; } #partenaires #contacts .boite .contact-contenu-right { float: left; width: 230px; padding: 20px 0px; } /* =4.7 Archives ------------------------------------------------------------------ */ #archives #archive-etoile p { margin:0px} #archives #accordeon h2.zone-header { height:22px; color:#ffffff; font-size:13px; font-weight:bold; background:url(../images/architecture/arc-zone-header.gif) repeat-x; margin:0; padding:5px 0 0 13px; text-transform:uppercase; } #archives #accordeon p { margin:7px 10px 0; text-transform:uppercase; font-size:10px;} #archives #accordeon a.white { text-decoration:none; color:#ffffff; } #archives #accordeon .image { text-align:center; } #archives #accordeon .hentry { background-color:#ededed; } #archives #accordeon .hentry p { font-size:15px; text-transform:uppercase; margin:0px; } #archives #accordeon .hentry p a { color:#000000; } #archives #accordeon .hentry p a:hover { text-decoration:underline; } #archives #accordeon .hentry p.extrait { margin-top:15px; } #archives #accordeon .hentry p.extrait a { color:#ff8c17; font-size:12px; text-transform:uppercase; font-weight:bold; } #archives #accordeon .hentry p.description { margin-top:15px; text-transform:none; font-size:12px; } #archives #accordeon .boite {padding:0px;} /* =5 Aside Primary ------------------------------------------------------------------ */ h2.zone-header { color:#ffffff; font-size:12px; font-weight:bold; background:#020202 url(../images/architecture/arc-zone-header.gif) repeat-x; margin:0; padding:5px 13px; text-transform:uppercase; } #aside_primary ul, #aside_primary p { margin:0; padding:12px 12px 0px; } #aside_primary a { text-decoration:none; color:#ff8c17; } a.pdf-download { text-transform:uppercase; } #zone-calendrier, #zone-categorie, #zone-nouvelle, #zone-recherche, #zone-information, #zone-contact, #zone-billetterie, #zone-pdf, #zone-social, #zone-spectacle { width:215px; background-color:#ededed; padding-bottom:12px; margin-bottom:10px;} #zone-social { height:180px;margin-bottom:0px; } #zone-social #newsletter { float:left; padding:15px 10px; height:100px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; position:relative;} #zone-social #newsletter .logo-mondial{ position:absolute; top:64px; left:118px; } #zone-social p { padding:0 0 3px 0; text-transform:uppercase;} #zone-social label{ display:none;} #zone-social input[type=text] {width:158px;margin-bottom:10px;} #zone-social .button-newsletter {background-color:#ff9c1f; color:#ffffff; cursor:pointer;} #zone-social .button-newsletter:hover {color:#ffffff; font-weight:bold; } #zone-social #social { float:left; width:195px; padding:6px 10px 0; height:30px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #zone-social #social img { margin-right:5px;} #zone-nouvelle input.button { margin:10px; } #zone-information { padding-bottom:0; } #zone-information p { padding:0; } #zone-information .hentry { background:none; } #zone-spectacle { height:314px;} #zone-spectacle #contenu { height:164px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; padding:20px 11px; text-align:center;} #zone-spectacle #contenu-spectacle ul { padding:0px; } #zone-spectacle #contenu-spectacle ul li { height:70px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; padding:11px 10px 10px; } #zone-spectacle #contenu-spectacle ul li p { padding:0px; } #zone-spectacle #contenu-spectacle ul li p a { color:#000000; text-decoration:underline; } #zone-spectacle #contenu-spectacle ul li p a:hover { color:#ff8c17; text-decoration:underline; } #zone-spectacle #contenu-spectacle p.nom-spectacle { font-size:15px; font-weight:bold; text-transform:uppercase;} #zone-spectacle #contenu-spectacle p.date-spectacle { font-size:14px; font-weight:bold; } #zone-spectacle p.download { padding-bottom:12px; background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom;} #zone-spectacle p.lien {text-transform:uppercase; font-size:10px; margin:7px 10px 0; padding:0} #zone-spectacle p.lien a { color:#000000; } #zone-spectacle p.lien a:hover {text-decoration:underline;} #zone-billetterie .boite { background:url(../images/architecture/arc-zone-bottom.gif) repeat-x bottom; } #zone-billetterie .boite ul { margin:0; padding:0; } #zone-billetterie p {text-transform:uppercase; font-size:10px; margin:7px 10px 0; padding:0; height:8px;} #zone-billetterie p a { color:#000000; } #zone-billetterie p a:hover {text-decoration:underline;} #zone-recherche select { width:160px; } #zone-recherche #search-show, #zone-recherche #search-lieu, #zone-recherche #search-artist { background-color:#ff9c1f; color:#ffffff; cursor:pointer; } #zone-recherche a:hover #search-show, #zone-recherche a:hover #search-lieu, #zone-recherche a:hover #search-artist {color:#ffffff; font-weight:bold; font-size:13px; } #zone-calendrier table{ border-collapse:collapse;} #zone-calendrier table .date-week th{ font-size:10px; text-align:left; background:url(../images/illustrations/illu-calendrier.jpg) repeat-x; padding-top:12px; height:48px; } #zone-calendrier table .date-week th h3{ padding:0; margin:0 5px 0; text-transform:capitalize; font-weight:bold; font-size:13px;} #zone-calendrier table .date-week p{ padding:0; margin:0 5px 0; font-weight:normal;} #zone-calendrier table td{ padding:0; width:44px; height:26px; line-height:26px; border-bottom:solid 1px #dfdfdf;} #zone-calendrier table .today, #zone-calendrier table .today a, #zone-calendrier table .day-show a{ background:#ff9b1f; color:#FFFFFF; font-weight:bold; } #zone-calendrier table .calendarDayHeading{ color:#ff9c1f; font-weight:bold; background:url(../images/illustrations/illu-calendrier.jpg) repeat-x 0 bottom;} #zone-calendrier table .calendarBlank{ color:#999999; } #zone-calendrier table a{ background:#d4d4d4; display:block; color:#2d2d2d;} #zone-calendrier table a:hover{ background:#bababa;} #zone-calendrier table th,#zone-calendrier table td,#zone-calendrier table caption{ text-align:center;} /* =6 Footer ------------------------------------------------------------------ */ #footer #nav-site-footer-en ul, #footer #nav-site-footer ul { margin:0; } #footer #nav-site-footer-en ul li, #footer #nav-site-footer ul li { float:left; text-align:left; width:112px; text-transform:uppercase; line-height:17px; cursor:pointer; } #footer #nav-site-footer-en ul li.home, #footer #nav-site-footer ul li.home { width:112px; } #footer #nav-site-footer-en ul li.prog, #footer #nav-site-footer-en ul li.prog ul.footer-submenu li { width:158px; } #footer #nav-site-footer-en ul li.part, #footer #nav-site-footer-en ul li.part ul.footer-submenu li { width:163px; } #footer #nav-site-footer-en ul li.news, #footer #nav-site-footer-en ul li.news ul.footer-submenu li { width:137px; } #footer #nav-site-footer-en ul li.multi, #footer #nav-site-footer-en ul li.multi ul.footer-submenu li { width:124px; } #footer #nav-site-footer-en ul li.tour, #footer #nav-site-footer-en ul li.tour ul.footer-submenu li { width:136px; } #footer #nav-site-footer ul li.prog, #footer #nav-site-footer ul li.prog ul.footer-submenu li { width:178px; } #footer #nav-site-footer ul li.part, #footer #nav-site-footer ul li.part ul.footer-submenu li { width:138px; } #footer #nav-site-footer ul li.news, #footer #nav-site-footer ul li.news ul.footer-submenu li { width:132px; } #footer #nav-site-footer ul li.multi, #footer #nav-site-footer ul li.multi ul.footer-submenu li { width:128px; } #footer #nav-site-footer ul li.tour, #footer #nav-site-footer ul li.tour ul.footer-submenu li { width:140px; } #footer #nav-site-footer-en ul li ul.footer-submenu li, #footer #nav-site-footer ul li ul.footer-submenu li { text-transform:none; font-weight:normal; } #footer #nav-site-footer-en ul li.autres ul li, #footer #nav-site-footer ul li.autres ul li { padding-top:17px; } #footer a { color:#ffffff; text-decoration:none; } #footer li:hover, #footer a:hover { color:#ff8c17; } #footer p { color:#464646; clear:both; padding-top:37px; text-transform:uppercase; } #footer #footer-copyright { clear:both; background:url(../images/architecture/arc-footer-separator.gif) no-repeat 0 25px; } /* =7 Classes ------------------------------------------------------------------ */ .small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; } .large { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; } .huge { font-size: 1.6em; } .hide { display: none; } .show { display:block; } .quiet { color: #666; } .loud { color: #000; } .bold { font-weight:bold; } .highlight { background:#ff0; } .added { background:#060; color: #fff; } .removed { background:#900; color: #fff; } .first { margin-left:0; padding-left:0; } .last { margin-right:0; padding-right:0; } .top { margin-top:0; padding-top:0; } .bottom { margin-bottom:0; padding-bottom:0; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } .grey { color:#878787; } .active { color:#fee643; } .orange { color:#ff8c17; } .yellow { color:#ffe323; } .space { padding-bottom:15px; } .upper { text-transform:uppercase; } .lower { text-transform:lowercase; } .left { float:left; } .right { float:right; } .clear { clear:both;} .button { display: inline-block; zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */ *display: inline; vertical-align: baseline; margin: 0 2px; outline: none; cursor: pointer; text-align: center; text-decoration: none; font: 12px/100% Arial, Helvetica, sans-serif; font-weight:bold; padding: 0em 10px 0em; text-shadow: 0 1px 1px rgba(0,0,0,.3); -webkit-border-radius: .5em; -moz-border-radius: .5em; border-radius: .5em; -webkit-box-shadow: 0 1px 10px rgba(0,0,0,1.5); -moz-box-shadow: 0 1px 10px rgba(0,0,0,1.5); box-shadow: 0 1px 10px rgba(0,0,0,1.5); } .button:hover { text-decoration: none; } .button:active { position: relative; top: 1px; } /* orange */ a.orange, input.orange { color: #000; border: solid 1px #000; background: #f78d1d; background: -webkit-gradient(linear, left top, left bottom, from(#ffbb3a), to(#e68b1b)); background: -moz-linear-gradient(top, #ffbb3a, #e68b1b); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbb3a', endColorstr='#e68b1b'); -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } a.orange:hover, input.orange:hover { background: #f47c20; background: -webkit-gradient(linear, left top, left bottom, from(#ffff72), to(#f3d721)); background: -moz-linear-gradient(top, #ffff72, #f3d721); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff72', endColorstr='#f3d721'); } input.orange:active { color: #fcd3a5; background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a)); background: -moz-linear-gradient(top, #f47a20, #faa51a); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a'); } /* =8 Microformats ------------------------------------------------------------------ */ /* =9 Dev ------------------------------------------------------------------ */