SliTaz Repositories

     1.1 --- a/slitaz.css	Wed Jan 05 21:35:34 2011 +0100
     1.2 +++ b/slitaz.css	Thu Jan 06 15:49:44 2011 +0100
     1.3 @@ -4,7 +4,7 @@
     1.4  */
     1.5  
     1.6  html {
     1.7 -	height:  102%;
     1.8 +	min-height:  102%;
     1.9  }
    1.10  
    1.11  body {
    1.12 @@ -42,18 +42,15 @@
    1.13  
    1.14  /* Header and title */
    1.15  
    1.16 -#header{
    1.17 +#header {
    1.18  	/*background: #f0ba08 url(pics/website/header.png) repeat-x top;*/
    1.19  	background: #351a0a url(pics/website/header-img.png) no-repeat top right;
    1.20  	color: black;
    1.21  	width: 100%;
    1.22  	height: 42px;
    1.23  	border-top: 1px solid black;
    1.24 -	border-bottom: 1px solid black;
    1.25 -	margin-bottom: 30px;
    1.26 -	-moz-box-shadow: 0 1px 5px #333;
    1.27 -	-webkit-box-shadow: 0 1px 5px #333;
    1.28 -	box-shadow: 0 1px 5px #333;
    1.29 +	border-bottom: 1px solid #999;
    1.30 +	margin-bottom: 33px;
    1.31  }
    1.32  
    1.33  #titre {
    1.34 @@ -73,7 +70,7 @@
    1.35  	height: 74px;
    1.36  }
    1.37  
    1.38 -/* Navigation */
    1.39 +/* Side bar Navigation */
    1.40  
    1.41  #nav {
    1.42  	position: absolute;
    1.43 @@ -121,15 +118,10 @@
    1.44  	display: block;
    1.45  }
    1.46  
    1.47 -#nav hr {
    1.48 -	margin: 2px 0px 1px 0px;
    1.49 -	border: 0px;
    1.50 -	border-top: 1px solid #BDBDBD;
    1.51 -}
    1.52 -
    1.53  #nav ul {
    1.54  	-moz-border-radius: 8px;
    1.55  	-webkit-border-radius: 8px;
    1.56 +	border-radius: 8px;
    1.57  	list-style-type: none;
    1.58  	margin: 10px 0;
    1.59  	padding: 10px 24px 10px 24px;
    1.60 @@ -174,11 +166,6 @@
    1.61  	background: inherit;
    1.62  }
    1.63  
    1.64 -#nav hr {
    1.65 -	height: 0px;
    1.66 -	border: 0px solid #eaeaea;
    1.67 -}
    1.68 -
    1.69  /* Page content */
    1.70  
    1.71  #content {
    1.72 @@ -195,8 +182,8 @@
    1.73  	color: black;
    1.74  	text-align: justify;
    1.75  	height: auto;
    1.76 -	margin: 6px 0px 0px 0px;
    1.77 -	padding: 0px 80px 35% 80px;
    1.78 +	margin: 0;
    1.79 +	padding: 0px 80px 40px 80px;
    1.80  }
    1.81  
    1.82  #content li, #content-full li {
    1.83 @@ -204,41 +191,6 @@
    1.84  	text-align: left;
    1.85  }
    1.86  
    1.87 -/* Legal informations */
    1.88 -
    1.89 -#copy {
    1.90 -	font-size: 11px ;
    1.91 -	text-align: left ;
    1.92 -	background: transparent;
    1.93 -	color: #a8a8a8;
    1.94 -	padding-top: 10px;
    1.95 -	margin: 0 0 0 80px;
    1.96 -}
    1.97 -
    1.98 -#copy a {
    1.99 -	background: inherit;
   1.100 -	color: #a8a8a8;
   1.101 -}
   1.102 -
   1.103 -#copy a:hover {
   1.104 -	background: inherit;
   1.105 -	color: #666666;
   1.106 -}
   1.107 -
   1.108 -/* Footer */
   1.109 -
   1.110 -#bottom {
   1.111 -	float: none;
   1.112 -	background: inherit;
   1.113 -	color: black;
   1.114 -	width: auto;
   1.115 -	clear: both;
   1.116 -	padding: 0;
   1.117 -	margin: 0 0 0 80px;
   1.118 -	text-align: left;
   1.119 -	vertical-align: middle;
   1.120 -}
   1.121 -
   1.122  #news li {
   1.123  	list-style-type: square;
   1.124  	border-bottom: 1px dotted #BEBEBE;
   1.125 @@ -258,6 +210,134 @@
   1.126  	margin: 30px 0px 30px 0px;
   1.127  }
   1.128  
   1.129 +/* Box and block. */
   1.130 +
   1.131 +.infobox {
   1.132 +	margin: 10px 60px;
   1.133 +	padding: 12px;
   1.134 +	background: #f8f8f8;
   1.135 +}
   1.136 +
   1.137 +.infobox img { vertical-align: middle; }
   1.138 +.infobox:hover { background-color: #f2b21d; }
   1.139 +
   1.140 +.block {
   1.141 +	/*padding-bottom: 35%;*/
   1.142 +	color: black;
   1.143 +	min-height: 200px;
   1.144 +	margin-bottom: 40px;
   1.145 +}
   1.146 +
   1.147 +.block ul {
   1.148 +	list-style-type: none;
   1.149 +	margin: 0;
   1.150 +	padding: 0 20px;
   1.151 +}
   1.152 +
   1.153 +.block_left {
   1.154 +	width: 46%;
   1.155 +	float: left;
   1.156 +	background-color: #eaeaea;
   1.157 +	margin: 4px 2px;
   1.158 +	padding: 0 10px 10px 10px;
   1.159 +}
   1.160 +
   1.161 +.block_right {
   1.162 +	width: 46%;
   1.163 +	float: right;
   1.164 +	background-color: #eaeaea;
   1.165 +	margin: 4px 2px;
   1.166 +	padding: 0 10px 10px 10px;
   1.167 +}
   1.168 +
   1.169 +#block_top {
   1.170 +	color: black;
   1.171 +	background-color: #eaeaea;
   1.172 +	min-height: 180px;
   1.173 +	margin-bottom: 40px;
   1.174 +	margin-right: 340px;
   1.175 +	padding: 0 10px;
   1.176 +}
   1.177 +
   1.178 +#block_nav {
   1.179 +	width: 300px;
   1.180 +	min-height: 180px;
   1.181 +	float: right;
   1.182 +	background-color: #eaeaea;
   1.183 +	margin: 0;
   1.184 +	padding: 0 10px;
   1.185 +}
   1.186 +
   1.187 +.infobox, .block_left, .block_right, #block_top, #block_nav, #footer {
   1.188 +	-moz-border-radius: 8px;
   1.189 +	-webkit-border-radius: 8px;
   1.190 +	border-radius: 8px;
   1.191 +	-moz-box-shadow: 0 1px 3px #666;
   1.192 +	-webkit-box-shadow: 0 1px 3px #666;
   1.193 +	box-shadow: 0 1px 3px #666;
   1.194 +	/* CSS3 transition */
   1.195 +	-webkit-transition-property: background-color;
   1.196 +	-webkit-transition-duration: 2s;
   1.197 +	-moz-transition-property: background-color;
   1.198 +	-moz-transition-duration: 2s;
   1.199 +	transition-property: background-color;
   1.200 +	transition-duration: 2s;
   1.201 +}
   1.202 +
   1.203 +#block_nav {
   1.204 +	font-weight: bold;
   1.205 +}
   1.206 +
   1.207 +#block_nav a {
   1.208 +	text-decoration: none;
   1.209 +}
   1.210 +
   1.211 +#block_nav li a:hover {
   1.212 +	color: #b64b22;
   1.213 +}
   1.214 +
   1.215 +#block_nav ul {
   1.216 +	margin: 0;
   1.217 +	list-style-type: none;
   1.218 +}
   1.219 +
   1.220 +#block_nav h3 {
   1.221 +	font-size: 110%;
   1.222 +}
   1.223 +
   1.224 +.block_left:hover, .block_right:hover, #block_top:hover,
   1.225 +#block_nav:hover, #footer:hover { 
   1.226 +	background-color: #f8f8f8;
   1.227 +}
   1.228 +
   1.229 +.right_box {
   1.230 +	width: 50%;
   1.231 +	float: right;
   1.232 +}
   1.233 +
   1.234 +/* Button */
   1.235 +
   1.236 +.button { margin-left: 20px; }
   1.237 +
   1.238 +.button a { 
   1.239 +	background-color: #b64b22;
   1.240 +	color: #ffffff;
   1.241 +	margin-right: 6px;
   1.242 +	padding: 6px 10px;
   1.243 +	font-size: 14px;
   1.244 +	-moz-border-radius: 4px;
   1.245 +	-webkit-border-radius: 4px;
   1.246 +	border-radius: 4px;
   1.247 +	-moz-box-shadow: 0 1px 3px #666;
   1.248 +	-webkit-box-shadow: 0 1px 3px #666;
   1.249 +	box-shadow: 0 1px 3px #666;
   1.250 +}
   1.251 +
   1.252 +.button a:hover { 
   1.253 +	background-color: #a3431f;
   1.254 +	color: #ffffff;
   1.255 +}
   1.256 +
   1.257  /* Clouds */
   1.258  
   1.259  #cloud {
   1.260 @@ -277,12 +357,26 @@
   1.261  #cloud a.tag9 { font-size: 2.2em; font-weight: 900; }
   1.262  #cloud a.tag10 { font-size: 2.5em; font-weight: 900; }
   1.263  
   1.264 -/* CSS class. */
   1.265 +/* Slideshow. */
   1.266  
   1.267 -.infobox {
   1.268 -	margin: 10px;
   1.269 -	padding: 12px;
   1.270 -	background: #f8f8f8;
   1.271 +#slideshow
   1.272 +{
   1.273 +	overflow: hidden;
   1.274 +	margin: 10px auto 10px;
   1.275 +	position: relative;
   1.276 +	width: 260px;
   1.277 +	height: 163px;
   1.278 +}
   1.279 +
   1.280 +#slideshow img
   1.281 +{
   1.282 +	border: 0;
   1.283 +	width: 260px;
   1.284 +	height: 163px;
   1.285 +}
   1.286 +
   1.287 +#twitter {
   1.288 +	margin-top: 20px;
   1.289  	-moz-border-radius: 8px;
   1.290  	-webkit-border-radius: 8px;
   1.291  	border-radius: 8px;
   1.292 @@ -291,107 +385,29 @@
   1.293  	box-shadow: 0 1px 3px #666;
   1.294  }
   1.295  
   1.296 -.imagebox {
   1.297 -	min-width: 300px;
   1.298 -	margin: 10px 15%;
   1.299 -	padding: 8px;
   1.300 -	background: transparent;
   1.301 -	text-align: center;
   1.302 -	/* CSS3 transition */
   1.303 -	-webkit-transition-property: background-color;
   1.304 -	-webkit-transition-duration: 3s;
   1.305 -	-moz-transition-property: background-color;
   1.306 -	-moz-transition-duration: 3s;
   1.307 -	transition-property: background-color;
   1.308 -	transition-duration: 3s;
   1.309 -}
   1.310 -
   1.311 -.imagebox:hover, .imagebox img {
   1.312 -	-moz-border-radius: 8px;
   1.313 -	-webkit-border-radius: 8px;
   1.314 -	border-radius: 8px;
   1.315 -	-moz-box-shadow: 0 1px 3px #666;
   1.316 -	-webkit-box-shadow: 0 1px 3px #666;
   1.317 -	box-shadow: 0 1px 3px #666;
   1.318 -}
   1.319 -
   1.320 -.block {
   1.321 -	/*padding-bottom: 35%;*/
   1.322 -	color: black;
   1.323 -	min-height: 200px;
   1.324 -}
   1.325 -
   1.326 -.block h3 img {
   1.327 -	padding: 0 2px 2px 0;
   1.328 -	margin: 0;
   1.329 -}
   1.330 -
   1.331 -.block ul {
   1.332 -	list-style-type: square;
   1.333 -}
   1.334 -
   1.335 -.block_left {
   1.336 -	width: 46%;
   1.337 -	float: left;
   1.338 -	background-color: #eaeaea;
   1.339 -	margin: 4px 2px;
   1.340 -	padding: 0 6px;
   1.341 -}
   1.342 -
   1.343 -.block_right {
   1.344 -	width: 46%;
   1.345 -	float: right;
   1.346 -	background-color: #eaeaea;
   1.347 -	margin: 4px 2px;
   1.348 -	padding: 0 6px;
   1.349 -}
   1.350 -
   1.351 -.block_left, .block_right {
   1.352 -	-moz-border-radius: 8px;
   1.353 -	-webkit-border-radius: 8px;
   1.354 -	border-radius: 8px;
   1.355 -	-moz-box-shadow: 0 1px 3px #666;
   1.356 -	-webkit-box-shadow: 0 1px 3px #666;
   1.357 -	box-shadow: 0 1px 3px #666;
   1.358 -	/* CSS3 transition */
   1.359 -	-webkit-transition-property: background-color;
   1.360 -	-webkit-transition-duration: 2s;
   1.361 -	-moz-transition-property: background-color;
   1.362 -	-moz-transition-duration: 2s;
   1.363 -	transition-property: background-color;
   1.364 -	transition-duration: 2s;
   1.365 -	/* For browsers that don't support RGBa
   1.366 -	background: rgb(0, 0, 0);*/
   1.367 -	/* RGBa with 0.6 opacity
   1.368 -	background: rgba(0, 0, 0, 0.2);*/
   1.369 -}
   1.370 -
   1.371 -.block_left:hover, .block_right:hover, .imagebox:hover, #slidebox:hover {
   1.372 -	background-color: #f2b21d;
   1.373 -}
   1.374 -
   1.375  /* HTML styles */
   1.376  
   1.377  h1 {
   1.378  	color: #444444;
   1.379 -	background: inherit;
   1.380 +	background: transparent;
   1.381  	text-align: left;
   1.382  	margin: 0px 0px 4px 0px;
   1.383  	font-size: 150%;
   1.384  	font-weight: bold;
   1.385 +	padding: 5px 0 0 10px;
   1.386  }
   1.387  
   1.388  h2 {
   1.389  	color: #b64b22;
   1.390  	padding: 0;
   1.391 -	margin: 4px 0 0 0;
   1.392 +	margin: 20px 0 0 0;
   1.393  	font-size: 130%;
   1.394  	font-weight: bold;
   1.395  }
   1.396  
   1.397  h3 {
   1.398  	font-weight: bold;
   1.399 -	color: #390012;
   1.400 +	color: #666666;
   1.401  	background: transparent;
   1.402  }
   1.403  	
   1.404 @@ -399,11 +415,12 @@
   1.405  	vertical-align: middle;
   1.406  	width: 20px;
   1.407  	height: 20px;
   1.408 +	padding-right: 4px; 
   1.409  }
   1.410  
   1.411  a {
   1.412  	text-decoration: underline;
   1.413 -	color: #0F314E;
   1.414 +	color: #103A5E;
   1.415  	background: inherit;
   1.416  }
   1.417  
   1.418 @@ -486,3 +503,37 @@
   1.419  	/* content: "2007-2011"; */
   1.420  	content: "2011";
   1.421  }
   1.422 +
   1.423 +/* Footer */
   1.424 +
   1.425 +#footer {
   1.426 +	margin: 0px 80px 80px 80px;
   1.427 +	padding: 10px;
   1.428 +	background: #eaeaea;
   1.429 +	color: #666666;
   1.430 +	height: 180px;
   1.431 +	border-radius: 8px;
   1.432 +	-moz-border-radius: 8px;
   1.433 +	-webkit-border-radius: 8px;
   1.434 +	-moz-box-shadow: 0 1px 3px #666;
   1.435 +	-webkit-box-shadow: 0 1px 3px #666;
   1.436 +	box-shadow: 0 1px 3px #666;
   1.437 +}
   1.438 +#footer a {
   1.439 +	background: inherit;
   1.440 +	color: #666666;
   1.441 +}
   1.442 +#footer a:hover {
   1.443 +	background: inherit;
   1.444 +	color: #333333;
   1.445 +}
   1.446 +#footer ul {
   1.447 +	list-style-type: none;
   1.448 +}
   1.449 +#footer li {
   1.450 +	padding: 2px;
   1.451 +}
   1.452 +#footer h4 {
   1.453 +	margin: 0 20px;
   1.454 +	font-size: 125%;
   1.455 +}