html/html/themes/ipfire-new/include/css/style.css

   1
   2 /* This controls the width of the fixed width layouts */
   3
   4 .fixed {
   5         width: 910px !important;
   6 }
   7
   8 /* Basic Stuff */
   9
  10 * {
  11         margin: 0;
  12         padding: 0;
  13 }
  14
  15 html {
  16         height: 100%;
  17 }
  18
  19 body {
  20         /* SVG as background image (IE9/Chrome/Safari/Opera) */
  21         background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2ODQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTAwJSIgeTE9IjEwMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgo8c3RvcCBzdG9wLWNvbG9yPSIjMDAwMDAwIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjODgwNDAwIiBvZmZzZXQ9IjU3JSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c2ODQpIiAvPgo8L3N2Zz4=);
  22
  23         background-image: linear-gradient(
  24                 bottom,
  25                 #000000 0%,
  26                 #880400 57%
  27         );
  28         background-image: -o-linear-gradient(
  29                 bottom,
  30                 #000000 0%,
  31                 #880400 57%
  32         );
  33         background-image: -moz-linear-gradient(
  34                 bottom,
  35                 #000000 0%,
  36                 #880400 57%
  37         );
  38         background-image: -webkit-linear-gradient(
  39                 bottom,
  40                 #000000 0%,
  41                 #880400 57
  42         );
  43         background-image: -ms-linear-gradient(
  44                 bottom,
  45                 #000000 0%,
  46                 #880400 57%
  47         );
  48         background-image: -webkit-gradient(
  49                 linear,
  50                 left bottom,
  51                 left top,
  52                 color-stop(0, #000000),
  53                 color-stop(0.57, #880400)
  54         );
  55         background-attachment: fixed;
  56
  57         font-size: 9pt;
  58         font-family: "trebuchet ms", helvetica, sans-serif;
  59 }
  60
  61 h1, h2, h3, h4, h5, h6 {
  62         font-size: 20px;
  63         font-weight: normal;
  64         letter-spacing: -1px;
  65         text-transform: lowercase;
  66         text-align: left;
  67 }
  68
  69 h2, h3, h4, h5, h6 {
  70         color: #66000F;
  71 }
  72
  73 br.clear {
  74         clear: both;
  75 }
  76
  77 img {
  78         padding: 3px;
  79 }
  80
  81 a {
  82         text-decoration: underline;
  83         color: #d90000;
  84 }
  85
  86 a:hover {
  87         text-decoration: none;
  88 }
  89
  90 p {
  91         line-height: 1.8em;
  92 }
  93
  94 hr {
  95         margin: 0.3em 0 0.3em 0;
  96 }
  97
  98 iframe {
  99         border: 0;
 100 }
 101
 102 .pull-right {
 103         float: right !important;
 104 }
 105
 106 /* Header */
 107
 108 #header {
 109         height: 70px;
 110         margin: 0 auto;
 111 }
 112
 113 /* Logo */
 114
 115 #logo {
 116         height: 65px;
 117         margin-top: 1em;
 118         background: url('/themes/ipfire-new/images/tux2.png') no-repeat;
 119 }
 120
 121 #logo h1 {
 122         color: #fff;
 123         font-size: 3.6em;
 124         font-weight: bold;
 125         padding-left: 1.7em;
 126 }
 127
 128 /* Main */
 129
 130 .bigbox {
 131         margin: 0 auto;
 132         margin-top: 1em;
 133         padding: 1.5em 2em 0 2em;
 134         border-radius: 8px 8px 8px 8px;
 135         -webkit-border-radius: 8px 8px 8px 8px;
 136         background: #fff url('/themes/ipfire-new/images/n2.gif') 0px 0px repeat-x;
 137         border: 1px solid black;
 138 }
 139
 140 #main_inner {
 141         padding-bottom: 1.5em;
 142 }
 143
 144 #main_inner p {
 145         text-align: justify;
 146         margin-bottom: 2em;
 147 }
 148
 149 #main_inner ul {
 150         margin-bottom: 2em;
 151 }
 152
 153 #main_inner h1 {
 154         font-size: 1.8em;
 155         margin-bottom: 1em;
 156 }
 157
 158 #main_inner .post {
 159         border-radius: 8px 8px 8px 8px;
 160         -webkit-border-radius: 8px 8px 8px 8px;
 161         border: 1px solid silver;
 162         padding: 1em 2em 1em 2em;
 163         margin-bottom: 1em;
 164         clear: both;
 165 }
 166
 167 #main_inner .post h2 {
 168         border-bottom: dotted 1px #e1e1e1;
 169         font-size: 1.7em;
 170         margin-bottom: 1em;
 171 }
 172
 173 #footer {
 174         height: 2.5em;
 175         margin-bottom: 1em;
 176 }
 177
 178 #footer a {
 179         color: inherit;
 180         text-decoration: none;
 181 }
 182
 183 #footer a:hover {
 184         text-decoration: underline;
 185 }
 186
 187 input {
 188         margin: 0.2em;
 189 }
 190
 191 input.button {
 192         background: #ca2f2f url('/themes/ipfire-new/images/n3.gif') repeat-x;
 193         color: #fff;
 194         border: solid 1px #a94b4b;
 195         font-weight: bold;
 196         text-transform: lowercase;
 197         font-size: 0.8em;
 198         height: 2.0em;
 199 }
 200
 201 input.text {
 202         border: solid 1px #f1f1f1;
 203         padding: 0.25em;
 204 }
 205
 206 #traffic {
 207         float: right;
 208         min-width: 20em;
 209         line-height: 32px;
 210 }
 211
 212 /* Menu */
 213 #cssmenu {
 214         margin: 0 auto;
 215         margin-top: 0;
 216         padding-top: 0;
 217         border-radius: 8px 8px 8px 8px;
 218         -webkit-border-radius: 8px 8px 8px 8px;
 219         font-weight: 600;
 220         height: 32px;
 221         border: 1px solid black;
 222 }
 223
 224 #cssmenu a {
 225         border-radius: 8px 8px 8px 8px;
 226         -webkit-border-radius: 8px 8px 8px 8px;
 227         color: #111111;
 228         display: inline-block;
 229         line-height: 32px;
 230         padding: 0 1em;
 231         text-decoration: none;
 232 }
 233
 234 #cssmenu ul {
 235         list-style: none;
 236 }
 237
 238 #cssmenu > ul > li {
 239         display: inline-block;
 240 }
 241
 242 #cssmenu > ul > li.active a, #cssmenu > ul > li:hover > a {
 243         color: white;
 244         background: #aaaaaa;
 245 }
 246
 247 #cssmenu .has-sub:hover > ul {
 248         display: block;
 249 }
 250
 251 #cssmenu .has-sub ul {
 252         display: none;
 253         position: absolute;
 254 }
 255
 256 #cssmenu .has-sub ul li a {
 257         min-width: 12em;
 258         border-radius: 7px 7px 7px 7px;
 259         background: #ffffff;
 260         color: grey;
 261         display: block;
 262         line-height: 40%;
 263         padding: 12px 5px;
 264         border: 1px solid black;
 265 }
 266
 267 #cssmenu .has-sub ul li:hover a {
 268         background: #dddddd;
 269         box-shadow: inset 0  5px 1px rgba(0, 0, 0, 0.15);
 270         -webkit-box-shadow: inset 0  5px 1px rgba(0, 0, 0, 0.15);
 271 }
 272
 273 /* Table */
 274 /* when using class='bordered' after tabletag */
 275
 276 table {
 277         *border-collapse: collapse; /* IE7 and lower */
 278         border-spacing: 0;
 279 }
 280
 281 .bordered th{
 282         border-top: 1px solid grey;
 283         border-bottom: 1px solid grey;
 284         background: #cccccc;
 285 }
 286
 287 .bordered th:first-child{
 288         -moz-border-radius: 6px 0 0 0;
 289         -webkit-border-radius: 6px 0 0 0;
 290         border-radius: 6px 0 0 0;
 291         border-left: 1px solid grey;
 292         border-top: 1px solid grey;
 293         border-bottom: 1px solid grey;
 294 }
 295
 296 .bordered th:last-child {
 297         -moz-border-radius: 0 6px 0 0;
 298         -webkit-border-radius: 0 6px 0 0;
 299         border-radius: 0 6px 0 0;
 300         border-right: 1px solid grey;
 301         border-top: 1px solid grey;
 302         border-bottom: 1px solid grey;
 303 }
 304
 305 .bordered th:only-child{
 306         -moz-border-radius: 6px 6px 0 0;
 307         -webkit-border-radius: 6px 6px 0 0;
 308         border-radius: 6px 6px 0 0;
 309         border: 1px solid grey;
 310 }
 311
 312 .bordered tr:first-child td:first-child{
 313         -moz-border-radius: 6px 0 0 0;
 314         -webkit-border-radius: 6px 0 0 0;
 315         border-radius: 6px 0 0 0;
 316         border-left: 1px solid grey;
 317         border-top: 1px solid grey;
 318 }
 319
 320 .bordered tr:first-child td:last-child{
 321         -moz-border-radius: 0 6px 0 0;
 322         -webkit-border-radius: 0 6px 0 0;
 323         border-radius: 0 6px 0 0;
 324         border-top: 1px solid grey;
 325 }
 326
 327 .bordered tr:first-child td:only-child{
 328         -moz-border-radius: 6px 6px 0 0;
 329         -webkit-border-radius: 6px 6px 0 0;
 330         border-radius: 6px 6px 0 0;
 331         border-left: 1px solid grey;
 332         border-right: 1px solid grey;
 333         border-top: 1px solid grey;
 334 }
 335
 336 .bordered tr:first-child td{
 337         border-top: 1px solid grey;
 338 }
 339
 340 .bordered tr:last-child{
 341         border-left: 1px solid grey;
 342         border-right: 1px solid grey;
 343 }
 344
 345 .bordered tr:last-child td:first-child {
 346         -moz-border-radius: 0 0 0 6px;
 347         -webkit-border-radius: 0 0 0 6px;
 348         border-radius: 0 0 0 6px;
 349         border-bottom: 1px solid grey;
 350 }
 351
 352 .bordered tr:last-child td:last-child {
 353         -moz-border-radius: 0 0 6px 0;
 354         -webkit-border-radius: 0 0 6px 0;
 355         border-radius: 0 0 6px 0;
 356         border-bottom: 1px solid grey;
 357 }
 358
 359 .bordered tr:last-child td:only-child {
 360         -moz-border-radius: 0 0 6px 6px;
 361         -webkit-border-radius: 0 0 6px 6px;
 362         border-radius: 0 0 6px 6px;
 363         border-bottom: 1px solid grey;
 364 }
 365
 366 .bordered tr:last-child td {
 367         border-bottom: 1px solid grey;
 368 }
 369
 370 .bordered td:first-child {
 371         border-left: 1px solid grey;
 372 }
 373
 374 .bordered td:last-child {
 375         border-right: 1px solid grey;
 376 }