website annotate slitaz.css @ rev 1343

Add Balinor technologies to sponsors
author Christophe Lincoln <pankso@slitaz.org>
date Fri Jan 22 22:38:00 2021 +0100 (2021-01-22)
parents 3f9491492ae2
children
rev   line source
pankso@1 1 /*
pascal@1243 2 CSS style for SliTaz Network - (C) 2015 SliTaz GNU/Linux
pankso@1 3 */
pankso@1 4
pankso@555 5 html {
pankso@710 6 min-height: 102%;
pankso@555 7 }
pankso@768 8
pankso@1 9 body {
pankso@555 10 background: #ffffff;
pankso@1 11 color: black;
pankso@1298 12 font: 100% sans-serif, vernada, arial;
pankso@1 13 margin: 0;
pankso@818 14 min-width: 780px;
pankso@815 15 height: 100%;
pankso@1 16 }
pankso@768 17
pankso@768 18 a { text-decoration: underline; color: #215090; }
pankso@1200 19 a:hover { text-decoration: none; }
pankso@768 20 img { border: 0pt none; vertical-align: middle; }
pankso@1299 21 h2 { color: #444; }
pankso@768 22 h3 { color: #666; font-size: 140%; }
pankso@768 23 h4 { color: #888; font-size: 120%; }
pankso@1200 24 h2, h3 { border-bottom: 1px dashed #afafaf; padding-bottom: 5px; }
pankso@1241 25 li { list-style-type: square; }
pankso@768 26 pre {
pankso@768 27 background-color: #f8f8f8;
pankso@768 28 border: 1px solid #ddd;
pankso@768 29 padding: 10px;
pankso@1 30 }
pankso@1 31
pankso@741 32 /* Header */
pankso@1 33
pankso@768 34 #header {
pankso@768 35 height: 40px;
pankso@1200 36 background: #111 url(images/logo.png) no-repeat left;
pankso@1 37 }
pankso@768 38
pankso@768 39 #header h1 {
pankso@768 40 margin: 0;
pankso@1200 41 padding: 8px 0 8px 42px;
pankso@1200 42 width: 280px;
pankso@1200 43 font-size: 20px;
pankso@1200 44 font-style: italic;
pankso@1 45 }
pankso@768 46
pankso@768 47 #header h1 a {
pankso@768 48 color: white;
pankso@768 49 text-decoration: none;
pankso@768 50 }
pankso@768 51
pankso@1175 52 #header h1 a:hover, #network a:hover, #network span {
pankso@1175 53 color: #afafaf;
pankso@768 54 }
pankso@768 55
pankso@1200 56 #searchbtn {
pankso@1200 57 position: absolute;
pankso@1200 58 right: 8px;
pankso@1200 59 top: 48px;
pankso@1200 60 }
pankso@1200 61
pankso@768 62 /* Logo */
pankso@768 63
pankso@1 64 #logo {
pankso@768 65 background: url(images/logo.png) no-repeat left;
pankso@1 66 position: absolute;
pankso@1 67 float: left;
pankso@768 68 left: 0px;
pankso@768 69 top: 0px;
pankso@768 70 width: 40px;
pankso@768 71 height: 40px;
pankso@1 72 }
pankso@1 73
pankso@768 74 /* SliTaz Network */
pankso@1 75
pankso@768 76 #network {
pankso@768 77 float: right;
pankso@1175 78 padding: 14px 5px 0;
pankso@555 79 font-size: 12px;
pankso@1 80 }
pankso@768 81
pankso@1175 82 #network a, #network span { padding: 0 4px; }
pankso@1175 83 #network span { font-weight: bold; }
pankso@768 84
pankso@768 85 /* Block */
pankso@768 86
pankso@768 87 #block {
pankso@1175 88 min-height: 180px;
pankso@1175 89 background: #ccc;
pankso@1175 90 padding: 20px 10% 0px;
pankso@768 91 text-align: center;
pankso@1044 92 color: #222;
pankso@1175 93 border-bottom: 1px solid #afafaf;
pankso@768 94 }
pankso@768 95
pankso@768 96 #block_info {
pankso@768 97 text-align: justify;
pankso@768 98 width: 48%;
pankso@768 99 padding: 10px 10px 0 0;
pankso@768 100 }
pankso@768 101
pankso@768 102 #block a, #network a {
pankso@1175 103 color: #fff;
pankso@555 104 font-weight: bold;
pankso@768 105 text-decoration: none;
pankso@555 106 }
pankso@768 107
pankso@768 108 #block h4 {
pankso@1175 109 color: #222;
pankso@768 110 margin: 0px;
pankso@768 111 font-weight: bold;
pankso@768 112 font-size: 110%;
pankso@768 113 }
pankso@768 114
pankso@768 115 #block_info p { margin: 6px 0; padding: 0 12px 0 0; }
pankso@1175 116 #block_info a { font-weight: normal; color: #215090; }
pankso@1175 117 #block_info a:hover { text-decoration: underline; }
pankso@768 118 #block ul { list-style-type: square; }
pankso@1175 119 #block_nav a:hover { color: #afafaf; }
pankso@768 120
pankso@768 121 /* Navigation */
pankso@768 122
pankso@768 123 #block_nav {
pankso@1175 124 background: #666;
pankso@1175 125 padding: 10px 10px 20px;
pankso@768 126 text-align: justify;
pankso@768 127 width: 48%;
pankso@768 128 float: right;
pankso@768 129 }
pankso@768 130
pankso@768 131 #block_nav ul {
pankso@768 132 list-style-type: none;
pankso@768 133 margin: 6px 0;
pankso@768 134 padding: 0;
pankso@768 135 }
pankso@768 136
pankso@784 137 #block_nav h4 img {
pankso@784 138 margin: 0 4px 0 0;
pankso@784 139 padding: 0;
pankso@784 140 }
pankso@784 141
pankso@1200 142 .dlbutton {
al@1279 143 display: inline-block;
al@1280 144 margin: 0.5ex;
pankso@1200 145 background: #333 url("/images/download-30.png") no-repeat 4px center;
pankso@1200 146 padding-left: 38px;
pankso@1200 147 -webkit-transition: background-color 0.6s;
pankso@1200 148 transition: background-color 0.5s;
pankso@1200 149 }
al@1280 150 .dldiv { margin: 30px 0; text-align: center; }
pankso@1200 151
pankso@1200 152 /*
pankso@1200 153 *
pankso@1200 154 *
pankso@1200 155 * Navigation NG
pankso@1200 156 *
pankso@1200 157 *
pankso@1200 158 * */
pankso@1200 159
pankso@1200 160 nav {
pankso@1200 161 min-height: 100px;
pankso@1200 162 background: #ddd;
pankso@1200 163 padding: 56px 6% 0;
pankso@1200 164 text-align: center;
pankso@1200 165 color: #222;
pankso@1200 166 border-bottom: 1px solid #afafaf;
pankso@1200 167 top: 40px;
pankso@1200 168 }
pankso@1200 169
pankso@1200 170 nav ul {
pankso@1200 171 margin: 0; padding: 0;
pankso@1200 172 list-style: none;
pankso@1200 173 }
pankso@1200 174 nav li { display: inline; }
pankso@1200 175
pankso@1200 176 nav a, .dlbutton {
pankso@1200 177 text-decoration: none;
pankso@1200 178 padding: 12px;
pankso@1200 179 color: #fff;
pankso@1200 180 font-weight: bold;
pankso@1200 181 vertical-align: middle;
pankso@1200 182 -webkit-transition: background-color 0.6s;
pankso@1200 183 transition: background-color 0.5s;
pankso@1200 184 }
pankso@1299 185 nav p { padding: 8px; color: #333; font-size: 90%; }
pankso@1200 186
pankso@1200 187 .nav1 { background-color: #333; }
pankso@1200 188 .nav1:hover { background-color: #128da9; }
pankso@1200 189 .nav2 { background-color: #ab3c00; }
pankso@1200 190 .nav2:hover { background-color: #ff9b00; }
pankso@1200 191 .navpi { background-color: #444; }
pankso@1200 192 .navpi:hover { background-color: #bc1142; }
pankso@1200 193
pankso@768 194 /* Languages */
pankso@768 195
pankso@768 196 #lang {
pankso@1200 197 padding: 8px;
pankso@1200 198 font-size: 12px;
pankso@1044 199 position: absolute;
pankso@1044 200 right: 0px;
pankso@1200 201 color: #666;
pankso@768 202 }
pankso@1200 203 #lang .flag { font-size: 14px; }
pankso@1200 204 #lang .flag:hover { text-decoration: none; }
pankso@768 205
pankso@1200 206 #lang a, #lang strong, #lang span {
pankso@1 207 text-decoration: none;
pankso@768 208 padding: 0 2px;
pankso@1 209 }
pankso@768 210
pankso@768 211 #lang a:hover {
pankso@768 212 text-decoration: underline;
pankso@1 213 }
pankso@768 214
pankso@1044 215 .box #lang { text-align: center; position: relative;
pankso@1044 216 font-size: 13px; } /* for /i18n page */
al@1033 217
pankso@768 218 /* Content */
pankso@768 219
pankso@768 220 #content {
pankso@768 221 padding: 30px 80px;
pankso@555 222 text-align: justify;
pankso@741 223 }
pankso@1241 224 #content li { line-height: 1.6em; }
pankso@741 225
pankso@809 226 .news li {
pankso@741 227 border-bottom: 1px dotted #BEBEBE;
pankso@741 228 margin-left: -25px;
pankso@741 229 padding: 4px 0px 4px 0px;
pankso@741 230 }
pankso@741 231
pankso@809 232 .news a, .feed-grid a { text-decoration: none; }
pankso@809 233 .news p a { text-decoration: underline; }
pankso@809 234 .news p a:hover { text-decoration: none; }
pankso@1171 235 #twitter { margin: 20px 0; text-align: center; }
pankso@768 236 #gallery { text-align: center; }
pankso@741 237
pankso@945 238 #sponsor {
pankso@945 239 font-size: 90%;
pankso@975 240 background-color: #fbfbfb;
pankso@975 241 border: 2px solid #ddd;
pankso@945 242 width: 200px;
pankso@1267 243 height: 140px;
pankso@945 244 float: right;
pankso@945 245 text-align: center;
pankso@1241 246 margin: 20px 0px 20px 20px;
pankso@945 247 }
pankso@945 248
pankso@768 249 /* Classes */
pankso@768 250
pankso@1200 251 .mobile { display: none !important; }
pankso@1200 252
pankso@768 253 .right_box { width: 48%; float: right; }
pankso@768 254 .left_box { width: 48%; float: left; }
pankso@768 255
pankso@768 256 .box {
pankso@741 257 margin: 20px 60px;
pankso@741 258 padding: 12px;
pankso@768 259 background: #efefef;
pankso@768 260 border: 1px solid #ddd;
pankso@768 261 }
pankso@768 262
al@1321 263 .box-dl, .box-up, .box-warning {
pankso@1200 264 margin: 20px 0;
al@1019 265 min-height: 48px;
al@1019 266 border: 1px solid #ddd;
al@1019 267 vertical-align: middle;
al@1019 268 }
al@1032 269 .box-dl {
pankso@1200 270 background: url("/images/download.png") no-repeat 12px center;
pankso@1200 271 padding: 16px 16px 16px 72px;
al@1032 272 }
al@1032 273 .box-up {
pankso@1200 274 background: url("/images/update.png") no-repeat 12px center;
pankso@1200 275 padding: 16px 16px 16px 62px;
al@1032 276 }
al@1321 277 .box-warning {
al@1321 278 background: url("/images/warning.png") no-repeat 12px center;
al@1321 279 padding: 16px 16px 16px 62px;
al@1321 280 }
pankso@1200 281 .box-dl a { font-weight: bold; text-decoration: none; }
pankso@1200 282 .dlbutton { padding-left: 38px; }
pankso@1200 283 pre, .box, .box-dl, .box-up, .box-share, .box-rpi {
pankso@1200 284 background-color: #efefef;
pankso@1200 285 border: 1px solid #ddd;
pankso@1200 286 }
al@1019 287
pankso@768 288 .searchbox {
pankso@768 289 margin: 20px 80px;
pankso@768 290 padding: 12px;
pankso@741 291 background: #f8f8f8;
pankso@768 292 text-align: center;
pankso@768 293 border: 1px solid #ddd;
pankso@741 294 }
pankso@768 295
pankso@796 296 /* Activity Box */
pankso@796 297
pankso@796 298 .activity {
pankso@796 299 margin: 0 0 20px;
pankso@945 300 background: #efefef;
pankso@807 301 padding: 5px 2px 0;
pankso@796 302 border: 1px solid #ddd;
pankso@796 303 }
pankso@807 304 .activity div { padding: 5px 10px; background: #fff; margin-top: 5px; }
pankso@796 305 .activity p { margin: 0; padding: 5px 10px; font-weight: bold; }
pankso@796 306 .activity a { text-decoration: none; }
pankso@1241 307 .activity ul { margin: 4px 0; padding: 0 4px; line-height: 150%; }
pankso@1241 308 .activity li { list-style-type: none; }
pankso@796 309 .activity_more { text-align: right; }
pankso@796 310 .activity_more a { font-weight: normal; color: #000; padding: 0 4px; }
pankso@796 311 .activity_more a:hover { text-decoration: underline; }
pankso@768 312
pankso@809 313 .activity span, .news span {
pankso@809 314 color: #666;
pankso@809 315 font-size: 11px;
pankso@809 316 font-weight: normal;
pankso@809 317 }
pankso@809 318
pankso@768 319 /* Button */
pankso@768 320
pankso@1175 321 #block_info .button a {
pankso@1175 322 background-color: #666;
pankso@768 323 color: #ffffff;
pankso@1175 324 margin: 0px 4px;
pankso@768 325 padding: 6px 10px;
pankso@768 326 font-size: 12px;
pankso@768 327 text-decoration: none;
pankso@768 328 font-weight: bold;
pankso@741 329 }
pankso@1175 330 #block_info .button a:hover, input[type=submit]:hover {
pankso@1175 331 background-color: #444;
pankso@768 332 color: #ffffff;
pankso@741 333 }
pankso@768 334
pankso@768 335 /* Round corner */
pankso@768 336
pankso@1200 337 #block_nav, pre, .box, .box-dl, .box-up, .searchbox, .button a,
pankso@1200 338 #twitter, .activity, .activity div, #sponsor, nav a, .dlbutton {
pankso@768 339 -moz-border-radius: 4px;
pankso@768 340 -webkit-border-radius: 4px;
pankso@768 341 border-radius: 4px;
pankso@741 342 }
pankso@768 343
pankso@768 344 /* Form */
pankso@768 345
pankso@715 346 input[type=submit] {
pankso@1175 347 border: 1px solid #666;
pankso@1175 348 background-color: #666;
pankso@715 349 color: white;
pankso@715 350 font-weight: bold;
pankso@715 351 cursor: pointer;
pankso@768 352 padding: 4px 10px;
pankso@715 353 font-size: 14px;
pankso@734 354 margin-left: -5px;
pankso@768 355 -webkit-border-top-right-radius: 4px;
pankso@768 356 -webkit-border-bottom-right-radius: 4px;
pankso@768 357 -moz-border-radius-topright: 4px;
pankso@768 358 -moz-border-radius-bottomright: 4px;
pankso@768 359 border-top-right-radius: 4px;
pankso@768 360 border-bottom-right-radius: 4px;
pankso@715 361 }
pankso@768 362
pankso@1175 363 input[type=submit]:hover { background-color: #444; }
pankso@768 364
pankso@715 365 input[type=text] {
pankso@715 366 border: 1px solid #333333;
pankso@768 367 padding: 4px;
pankso@768 368 height: 17px;
pankso@737 369 width: 100%;
pankso@768 370 -webkit-border-top-left-radius: 4px;
pankso@768 371 -webkit-border-bottom-left-radius: 4px;
pankso@768 372 -moz-border-radius-topleft: 4px;
pankso@768 373 -moz-border-radius-bottomleft: 4px;
pankso@768 374 border-top-left-radius: 4px;
pankso@768 375 border-bottom-left-radius: 4px;
pankso@715 376 }
pankso@715 377
pankso@710 378 /* Footer */
pankso@710 379
pankso@710 380 #footer {
pankso@768 381 background: #f1f1f1;
pankso@768 382 text-align: center;
pankso@768 383 border-top: 1px solid #ddd;
pankso@768 384 padding: 40px;
pankso@768 385 color: #666;
pankso@814 386 clear: both;
pankso@814 387 margin-bottom: -2%;
pankso@710 388 }
pankso@768 389
pankso@768 390 #footer a { color: #666; padding: 0 2px; }
pankso@741 391
pankso@741 392 .year:after {
pascal@1243 393 /* content: "2007-2015"; */
pankso@1323 394 content: "2018";
pankso@710 395 }
al@1019 396
al@1019 397 p, li {
al@1019 398 -moz-hyphens: auto;
al@1019 399 -webkit-hyphens: auto;
al@1019 400 hyphens: auto;
al@1019 401 }
al@1019 402
al@1019 403 /* --- SEARCH --- */
al@1019 404
al@1019 405 input.gsc-search-button {
al@1019 406 border: 1px solid #b64b22;
al@1019 407 background-color: #b64b22;
al@1019 408 color: white;
al@1019 409 font-weight: bold;
al@1019 410 cursor: pointer;
al@1019 411 padding: 2px 10px;
al@1019 412 font-size: 14px;
al@1019 413 margin-left: -4px;
al@1019 414 -webkit-border-top-right-radius: 4px;
al@1019 415 -webkit-border-bottom-right-radius: 4px;
al@1019 416 -moz-border-radius-topright: 4px;
al@1019 417 -moz-border-radius-bottomright: 4px;
al@1019 418 border-top-right-radius: 4px;
al@1019 419 border-bottom-right-radius: 4px;
al@1019 420 }
al@1019 421
al@1019 422 .gs-webResult.gs-result a.gs-title:link,
al@1019 423 .gs-webResult.gs-result a.gs-title:link b {
al@1019 424 color: #103a5e;
al@1019 425 }
al@1019 426
al@1023 427 #cse {
al@1023 428 margin-bottom: 120px;
al@1023 429 width:100%;
al@1023 430 }
al@1019 431
al@1019 432
al@1019 433 /* --- GALLERY --- */
al@1019 434
al@1019 435 #gallery div {
al@1019 436 width: 496px;
al@1019 437 border: none;
al@1019 438 border-radius: 12px;
al@1019 439 padding-bottom: 8px;
al@1019 440 margin: 12px auto;
pascal@1255 441 -webkit-box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 442 -moz-box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 443 box-shadow: 0 0 6px rgba(0,0,0,0.5);
al@1019 444 }
al@1019 445 #gallery img {
al@1019 446 width: 480px;
al@1019 447 margin: 8px;
al@1019 448 }