[CSS] -couleur des blocs de la premiere colonne geree dans le squelette
[lhc/web/clavettes.git] / css / habillage.scss
index 74cf4f3..31f1dc8 100644 (file)
@@ -1,3 +1,78 @@
+@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;
+       background: none;
+}
+
+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;
 body{
        margin:0;
        padding:0;
-       font-family: sans-serif;
 }
 
 header{
        margin:0 auto;
-       width:100%;
+       width:1200px;
+       
 }
 
-header img{
-       margin-left:120px;
+header .spip_logos{
+       margin-left: 10px;
+       position:absolute;
 }
 
+
 #wrap{
-       padding-top:20px;
-       width:1100px;
+       padding-top:130px;
+       width:1200px;
        margin:0 auto;
 }
 a{
        text-decoration:none;
 }
 
+a:focus, a:hover, a:active{
+       background:none;
+       color:#1a0583;
+}
+
 h1{
-       margin: 15px -15px 5px 15px;
+       margin: 0;
        padding:0;
-       font-size:2.0em;
-       color:#1d0b78;
+       padding-top:15px;
+       padding-left:15px;
+       font-size:1.9em;
        display:inline-block;
+       font-weight: bold;
 }
 
 h2{
        margin: 15px 15px;
        font-size:1.3em;
-       color:#1d0b78;
        display:inline-block;
-               
 }
 
 h3{
        margin:15px;
        display:inline-block;
-       color:#1d0b78;
 }
 
 p{
        margin:0 15px;
-       color:#1d0b78;
+       padding-bottom:15px;
        text-decoration:none;
+       text-align: justify;
 }
 
 /*1ERE COLONNE*/
 
 
 #ateliers{
-       margin:0 10px;
-       overflow: hidden;
-               
+       margin:0 10px;          
 }
 
 #ateliers:after {
@@ -75,14 +155,22 @@ p{
        padding:0;
        margin:0;
        list-style-type:none;
-       
 }
 
 #ateliers ul li{
-       height: 300px;
-       margin-bottom:15px;
-       background-color: #2bc7cd;
        
+       margin-bottom:15px;
+}
+
+#ateliers p{
+       margin: 15px 15px 0 0;
+       font-size:1.3em;
+       font-weight: bold;
+       text-align: left;       
+}
+
+#ateliers p:nth-child(2){
+       margin:0px 15px 15px 15px;
 }
 
 
@@ -90,27 +178,18 @@ p{
 
 
 #news{
-       background-color:#a51616;
-       margin:0 10px 10px 10px;
        overflow: hidden;
-
 }
 
 #news img{
        height:350px;
 }
 
-.article1,
-.article2,
-.article3,
-.article4{
+.article{
        background-color:#ffaa7f;
-               
+       margin:0 10px 15px 10px;
 }
 
-.suite{
-       text-align:right;
-}
 
 
 
@@ -125,9 +204,27 @@ p{
 }
 
 .agenda{
-       background-color: #ca52ae;
-       height: 300px;
-       margin:0 0 0px 10px;    
+       background-color: #3ee88d;
+       height:500px;
+       margin:0 0 0px 10px;
+       padding-right: 10px;    
+}
+
+.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;
+        
 }
 
 /*RESPONSIVE*/
@@ -323,3 +420,34 @@ p{
 }
 }
 
+/*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*/
+}
+footer ul li a {
+       display:block;
+       float:left;   
+       text-decoration:none;
+}
+footer ul li a:hover {
+       border-bottom: solid #1d0b78;
+} 
+