slitaz-forge annotate boot/slitaz.css @ rev 38

boot: Update to new style and layout
author Christophe Lincoln <pankso@slitaz.org>
date Mon Mar 28 15:10:53 2011 +0200 (2011-03-28)
parents
children 3d1dfcfb56d9
rev   line source
pankso@38 1 /*
pankso@38 2 CSS style for SliTaz Network - (C) 2011 SliTaz GNU/Linux
pankso@38 3 */
pankso@38 4
pankso@38 5 html {
pankso@38 6 min-height: 102%;
pankso@38 7 }
pankso@38 8
pankso@38 9 body {
pankso@38 10 background: #ffffff;
pankso@38 11 color: black;
pankso@38 12 font: 13px sans-serif, vernada, arial;
pankso@38 13 margin: 0;
pankso@38 14 min-width: 900px;
pankso@38 15 }
pankso@38 16
pankso@38 17 a { text-decoration: underline; color: #215090; }
pankso@38 18 a:hover { text-decoration: none; color: blue; }
pankso@38 19 img { border: 0pt none; vertical-align: middle; }
pankso@38 20 h2 { color: #444; }
pankso@38 21 h3 { color: #666; font-size: 140%; }
pankso@38 22 h4 { color: #888; font-size: 120%; }
pankso@38 23 pre {
pankso@38 24 background-color: #f8f8f8;
pankso@38 25 border: 1px solid #ddd;
pankso@38 26 padding: 10px;
pankso@38 27 }
pankso@38 28
pankso@38 29 /* Header */
pankso@38 30
pankso@38 31 #header {
pankso@38 32 height: 40px;
pankso@38 33 background: #351a0a;
pankso@38 34 }
pankso@38 35
pankso@38 36 #header h1 {
pankso@38 37 margin: 0;
pankso@38 38 padding: 8px 0 0 42px;
pankso@38 39 width: 250px;
pankso@38 40 }
pankso@38 41
pankso@38 42 #header h1 a {
pankso@38 43 color: white;
pankso@38 44 text-decoration: none;
pankso@38 45 font-size: 20px;
pankso@38 46 font-style: italic;
pankso@38 47 }
pankso@38 48
pankso@38 49 #header h1 a:hover, #network a:hover {
pankso@38 50 color: #d66018;
pankso@38 51 }
pankso@38 52
pankso@38 53 /* Logo */
pankso@38 54
pankso@38 55 #logo {
pankso@38 56 background: url(images/logo.png) no-repeat left;
pankso@38 57 position: absolute;
pankso@38 58 float: left;
pankso@38 59 left: 0px;
pankso@38 60 top: 0px;
pankso@38 61 width: 40px;
pankso@38 62 height: 40px;
pankso@38 63 }
pankso@38 64
pankso@38 65 /* SliTaz Network */
pankso@38 66
pankso@38 67 #network {
pankso@38 68 float: right;
pankso@38 69 padding: 10px 5px 0;
pankso@38 70 font-size: 12px;
pankso@38 71 }
pankso@38 72
pankso@38 73 #network a { padding: 0 6px; }
pankso@38 74
pankso@38 75 /* Block */
pankso@38 76
pankso@38 77 #block {
pankso@38 78 min-height: 200px;
pankso@38 79 background: #d66018;
pankso@38 80 padding: 26px 10% 0px;
pankso@38 81 text-align: center;
pankso@38 82 color: #333;
pankso@38 83 border-bottom: 1px solid #f5f5f5;
pankso@38 84 }
pankso@38 85
pankso@38 86 #block_info {
pankso@38 87 text-align: justify;
pankso@38 88 width: 48%;
pankso@38 89 padding: 10px 10px 0 0;
pankso@38 90 }
pankso@38 91
pankso@38 92 #block a, #network a {
pankso@38 93 color: #fff;
pankso@38 94 font-weight: bold;
pankso@38 95 text-decoration: none;
pankso@38 96 }
pankso@38 97
pankso@38 98 #block h4 {
pankso@38 99 color: #351a0a;
pankso@38 100 margin: 0 0 6px;
pankso@38 101 font-weight: bold;
pankso@38 102 font-size: 110%;
pankso@38 103 }
pankso@38 104
pankso@38 105 #block_info p { margin: 6px 0; padding: 0 12px 0 0; }
pankso@38 106 #block_info a { font-weight: normal; }
pankso@38 107 #block ul { list-style-type: square; }
pankso@38 108 #block a:hover { color: #351a0a; }
pankso@38 109
pankso@38 110 /* Navigation */
pankso@38 111
pankso@38 112 #block_nav {
pankso@38 113 background: #cc5b17;
pankso@38 114 padding: 10px 10px 40px;
pankso@38 115 text-align: justify;
pankso@38 116 width: 48%;
pankso@38 117 float: right;
pankso@38 118 }
pankso@38 119
pankso@38 120 #block_nav ul {
pankso@38 121 list-style-type: none;
pankso@38 122 margin: 6px 0;
pankso@38 123 padding: 0;
pankso@38 124 }
pankso@38 125
pankso@38 126 #block_nav h4 img {
pankso@38 127 margin: 0 4px 0 0;
pankso@38 128 padding: 0;
pankso@38 129 }
pankso@38 130
pankso@38 131 /* Languages */
pankso@38 132
pankso@38 133 #lang {
pankso@38 134 float: right;
pankso@38 135 padding: 6px;
pankso@38 136 font-size: 11px;
pankso@38 137 }
pankso@38 138
pankso@38 139 #lang a {
pankso@38 140 text-decoration: none;
pankso@38 141 padding: 0 2px;
pankso@38 142 }
pankso@38 143
pankso@38 144 #lang a:hover {
pankso@38 145 text-decoration: underline;
pankso@38 146 }
pankso@38 147
pankso@38 148 /* Content */
pankso@38 149
pankso@38 150 #content {
pankso@38 151 padding: 30px 80px;
pankso@38 152 text-align: justify;
pankso@38 153 }
pankso@38 154
pankso@38 155 #news li {
pankso@38 156 list-style-type: square;
pankso@38 157 border-bottom: 1px dotted #BEBEBE;
pankso@38 158 margin-left: -25px;
pankso@38 159 padding: 4px 0px 4px 0px;
pankso@38 160 }
pankso@38 161
pankso@38 162 #news a, .feed-grid a { text-decoration: none; }
pankso@38 163 #news p a { text-decoration: underline; }
pankso@38 164 #news p a:hover { text-decoration: none; }
pankso@38 165 #twitter { margin: 20px 0; }
pankso@38 166 #gallery { text-align: center; }
pankso@38 167
pankso@38 168 /* Classes */
pankso@38 169
pankso@38 170 .right_box { width: 48%; float: right; }
pankso@38 171 .left_box { width: 48%; float: left; }
pankso@38 172
pankso@38 173 .box {
pankso@38 174 margin: 20px 60px;
pankso@38 175 padding: 12px;
pankso@38 176 background: #efefef;
pankso@38 177 border: 1px solid #ddd;
pankso@38 178 }
pankso@38 179
pankso@38 180 .searchbox {
pankso@38 181 margin: 20px 80px;
pankso@38 182 padding: 12px;
pankso@38 183 background: #f8f8f8;
pankso@38 184 text-align: center;
pankso@38 185 border: 1px solid #ddd;
pankso@38 186 }
pankso@38 187
pankso@38 188 .feed-grid { height: 180px; overflow: hidden; text-align: left; }
pankso@38 189 .feed-grid h3 {
pankso@38 190 margin: 15px 0 0; font-size: 16px;
pankso@38 191 padding: 0 22px;
pankso@38 192 background: url(images/feed.png) no-repeat left; }
pankso@38 193 .feed-grid span { font-size: 10px; color: #888; margin-left: 24px; }
pankso@38 194 .feed-grid ul { color: #666; }
pankso@38 195 .feed-grid a { color: #666; }
pankso@38 196 .feed-grid a:hover { color: blue; }
pankso@38 197
pankso@38 198 /* Button */
pankso@38 199
pankso@38 200 .button a {
pankso@38 201 background-color: #b64b22;
pankso@38 202 color: #ffffff;
pankso@38 203 margin-right: 6px;
pankso@38 204 padding: 6px 10px;
pankso@38 205 font-size: 12px;
pankso@38 206 text-decoration: none;
pankso@38 207 font-weight: bold;
pankso@38 208 }
pankso@38 209 .button a:hover, input[type=submit]:hover {
pankso@38 210 background-color: #a3431f;
pankso@38 211 color: #ffffff;
pankso@38 212 }
pankso@38 213
pankso@38 214 /* Round corner */
pankso@38 215
pankso@38 216 #block_nav, pre, .box, .searchbox, .button a, #twitter {
pankso@38 217 -moz-border-radius: 4px;
pankso@38 218 -webkit-border-radius: 4px;
pankso@38 219 border-radius: 4px;
pankso@38 220 }
pankso@38 221
pankso@38 222 /* Transition */
pankso@38 223
pankso@38 224 .box {
pankso@38 225 -webkit-transition-property: background-color;
pankso@38 226 -webkit-transition-duration: 2s;
pankso@38 227 -moz-transition-property: background-color;
pankso@38 228 -moz-transition-duration: 2s;
pankso@38 229 transition-property: background-color;
pankso@38 230 transition-duration: 2s;
pankso@38 231 }
pankso@38 232
pankso@38 233 /* Form */
pankso@38 234
pankso@38 235 input[type=submit] {
pankso@38 236 border: 1px solid #b64b22;
pankso@38 237 background-color: #b64b22;
pankso@38 238 color: white;
pankso@38 239 font-weight: bold;
pankso@38 240 cursor: pointer;
pankso@38 241 padding: 4px 10px;
pankso@38 242 font-size: 14px;
pankso@38 243 margin-left: -5px;
pankso@38 244 -webkit-border-top-right-radius: 4px;
pankso@38 245 -webkit-border-bottom-right-radius: 4px;
pankso@38 246 -moz-border-radius-topright: 4px;
pankso@38 247 -moz-border-radius-bottomright: 4px;
pankso@38 248 border-top-right-radius: 4px;
pankso@38 249 border-bottom-right-radius: 4px;
pankso@38 250 }
pankso@38 251
pankso@38 252 input[type=submit]:hover { background-color: #a3431f; }
pankso@38 253
pankso@38 254 input[type=text] {
pankso@38 255 border: 1px solid #333333;
pankso@38 256 padding: 4px;
pankso@38 257 height: 17px;
pankso@38 258 width: 100%;
pankso@38 259 -webkit-border-top-left-radius: 4px;
pankso@38 260 -webkit-border-bottom-left-radius: 4px;
pankso@38 261 -moz-border-radius-topleft: 4px;
pankso@38 262 -moz-border-radius-bottomleft: 4px;
pankso@38 263 border-top-left-radius: 4px;
pankso@38 264 border-bottom-left-radius: 4px;
pankso@38 265 }
pankso@38 266
pankso@38 267 /* Footer */
pankso@38 268
pankso@38 269 #footer {
pankso@38 270 background: #f1f1f1;
pankso@38 271 text-align: center;
pankso@38 272 border-top: 1px solid #ddd;
pankso@38 273 padding: 40px;
pankso@38 274 color: #666;
pankso@38 275 }
pankso@38 276
pankso@38 277 #footer a { color: #666; padding: 0 2px; }
pankso@38 278
pankso@38 279 .year:after {
pankso@38 280 /* content: "2007-2011"; */
pankso@38 281 content: "2011";
pankso@38 282 }