X-Git-Url: https://git.cyclocoop.org/%7B%24admin_url%7Dmembres/cotisations/rappel.php?a=blobdiff_plain;f=css%2Fhabillage.css;h=016d3a893418d1536a90f17e0ae7066e5e1673f9;hb=d4f9bf137baf39a41b810162ab1fc8ffa98485cb;hp=605652c824e6b64114dd6f0da70fd75ec281c11d;hpb=4557b455fb9a2093667f40fe5b5f8ddbaab01387;p=lhc%2Fweb%2Fclavettes.git diff --git a/css/habillage.css b/css/habillage.css index 605652c..016d3a8 100644 --- a/css/habillage.css +++ b/css/habillage.css @@ -1,174 +1,338 @@ -body{ - margin-top:0; - height: 1500px; - font-family: 'Open Sans', Arial, sans-serif; -} - -header{ - margin:0 auto; - width:1200px; -} +@charset "UTF-8"; +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, 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, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font: inherit; + font-size: 100%; + vertical-align: baseline; + font-family: sans-serif; + color: #1a0583; + text-align: left; } + +html, body, span, applet, object, iframe, +blockquote, pre, section, +abbr, acronym, address, big, cite, code, +del, dfn, em, 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, +article, aside, canvas, details, embed, +figure, figcaption, hgroup, +menu, nav, output, ruby, summary, mark, audio, video { + background-color: #ffffff; } + +html { + line-height: 1; } + +ol, ul { + list-style: none; } + +table { + border-collapse: collapse; + border-spacing: 0; } + +caption, th, td { + text-align: left; + font-weight: normal; + vertical-align: middle; } + +q, blockquote { + quotes: none; } + +q:before, q:after, blockquote:before, blockquote:after { + content: ""; + content: none; } + +a img { + border: none; } + +article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { + display: block; } + +* { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; } + +body { + margin: 0; + padding: 0; } + +header { + margin: 0 auto; + width: 1200px; } + +header .spip_logos { + margin-left: 10px; + position: absolute; } #wrap { - background-color: #2b1b1b; - padding-top:100px; - width: 1200px; - margin: 0 auto; -} - -a{ - text-decoration:none; -} - -h1{ - margin: 15px -15px 5px 15px; - padding:0; - font-size:2.2em; - color:#1d0b78; - display:inline-block; - width:100%; - word-wrap: break-word; -} - -h2{ - margin: 15px 15px; - font-size:1.5em; - color:#1d0b78; - display:inline-block; - width:100%; - -} - -h3{ - margin:15px; - display:inline-block; - color:#1d0b78; -} - -p{ - margin:0 15px; - color:#1d0b78; - text-decoration:none; -} + padding-top: 130px; + width: 1200px; + margin: 0 auto; } + +a { + text-decoration: none; } + +a:focus, a:hover, a:active { + background: none; + color: #1a0583; } + +h1 { + margin: 0; + padding: 0; + padding-top: 15px; + padding-left: 15px; + font-size: 1.9em; + display: inline-block; } + +h2 { + margin: 15px 15px; + font-size: 1.3em; + display: inline-block; } + +h3 { + margin: 15px; + display: inline-block; } + +p { + margin: 0 15px; + text-decoration: none; + text-align: justify; } /*1ERE COLONNE*/ +#ateliers { + margin: 0 10px; } + +#ateliers:after { + content: ""; + /* Important, sinon l'élément n'est pas généré. */ + display: table; + clear: both; } + +#ateliers ul { + padding: 0; + margin: 0; + list-style-type: none; } + +#ateliers ul li { + height: 300px; + margin-bottom: 15px; + background-color: #2bc7cd; } + +#ateliers p { + margin: 15px 15px 0 15px; + font-size: 1.3em; + font-weight: bold; + text-align: left; } + +#ateliers p:nth-child(2) { + margin: 0px 15px 15px 15px; } +/*2EME COLONNE*/ +#news { + margin: 0 10px 10px 10px; + overflow: hidden; } -#ateliers{ - /*background-color: #76d55c;*/ - width:300px; - height:600px; - float:left; -} - -.atelier1{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier2{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier3{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier4{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier5{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier6{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} - -.atelier7{ - width:300px; - height:300px; - margin-bottom:15px; - background-color: #2bc7cd; -} +#news img { + height: 350px; } +.article { + background-color: #ffaa7f; } -/*2EME COLONNE*/ +/*3EME COLONNE*/ +.map { + background-color: #6059d2; + height: 300px; + margin: 0 0 15px 10px; } +.agenda { + background-color: #3ee88d; + height: 500px; + margin: 0 0 0px 10px; + padding-right: 10px; } -#news{ - /*background-color:#a51616;*/ - width:500px; - height:1000px; - margin-left:20px; - float:left; - clear:right; -} - -.article1{ - background-color:#ffaa7f; - width:500px; - height:700px; - margin-bottom:15px; -} - -.article2{ - background-color:#ffaa7f; - width:500px; - height:440px; - margin-bottom:15px; -} - -.article3{ - background-color:#ffaa7f; - width:500px; - height:440px; - margin-bottom:15px; -} - -.article4{ - background-color:#ffaa7f; - width:500px; - height:440px; - margin-bottom:15px; -} +.agenda p { + line-height: 120%; } +.agenda ul { + list-style-type: none; + padding: 0; + margin: 0; + padding-top: 15px; } +.date { + float: left; + font-size: 1.7em; } -/*3EME COLONNE*/ +/*RESPONSIVE*/ +.col-2, +.col-4, +.col-6, +.col-8, +.col-10, +.col-12 { + float: left; + position: relative; } + +.row:before, .row:after { + content: ""; + display: table; } + +.row:after { + clear: both; } + +.row { + margin: 0 -10px; + zoom: 1; } + +.col-1 { + width: 8.33333%; } + +.col-2 { + width: 16.66667%; } + +.col-3 { + width: 25%; } + +.col-4 { + width: 33.33333%; } + +.col-5 { + width: 41.66667%; } + +.col-6 { + width: 50%; } + +.col-7 { + width: 58.33333%; } + +.col-8 { + width: 66.66666%; } + +.col-9 { + width: 75%; } + +.col-10 { + width: 83.33333%; } + +.col-11 { + width: 91.66667%; } + +.col-12 { + width: 100%; } + +@media only screen and (min-width: 640px) { + .col-m-1 { + width: 8.33333%; } + + .col-m-2 { + width: 16.66667%; } + + .col-m-3 { + width: 25%; } + + .col-m-4 { + width: 33.33333%; } + + .col-m-5 { + width: 41.66667%; } + + .col-m-6 { + width: 50%; } + + .col-m-7 { + width: 58.33333%; } + + .col-m-8 { + width: 66.66666%; } + + .col-m-9 { + width: 75%; } + + .col-m-10 { + width: 83.33333%; } + + .col-m-11 { + width: 91.66667%; } + + .col-m-12 { + width: 100%; } } +@media only screen and (min-width: 1024px) { + .col-l-1 { + width: 8.33333%; } + + .col-l-2 { + width: 16.66667%; } + + .col-l-3 { + width: 25%; } + + .col-l-4 { + width: 33.33333%; } + + .col-l-5 { + width: 41.66667%; } + + .col-l-6 { + width: 50%; } + + .col-l-7 { + width: 58.33333%; } + + .col-l-8 { + width: 66.66666%; } + + .col-l-9 { + width: 75%; } + + .col-l-10 { + width: 83.33333%; } + + .col-l-11 { + width: 91.66667%; } + + .col-l-12 { + width: 100%; } } +/*FOOTER*/ +footer { + clear: both; + height: 200px; + width: 100%; + background-color: #ffaa7f; } +footer ul { + padding: 0; + margin: 0; + list-style-type: none; + padding-top: 70px; + margin-left: 100px; } +footer li { + margin-left: 2px; + float: left; + /*pour IE*/ } -.map{ - background-color:#6059d2; - width:400px; - margin-left:840px; - height:400px; - margin-bottom:20px; -} +footer ul li a { + display: block; + float: left; + text-decoration: none; } -.agenda{ - background-color: #ca52ae; - width:400px; - height:400px; - margin-left:840px; -} +footer ul li a:hover { + border-bottom: solid #1d0b78; } +/*# sourceMappingURL=habillage.css.map */