fluxbb/style/Archer.css

   1 /****************************************************************/
   2 /* 1. imported stylesheets */
   3 /****************************************************************/
   4
   5 /* import the basic setup styles */
   6 @import url(imports/base.css);
   7 /* import the colour scheme */
   8 @import url(imports/Archer_cs.css);
   9
  10 /****************************************************************/
  11 /* 2. text settings */
  12 /****************************************************************/
  13
  14 /* 2.1 this sets the default font group */
  15
  16 .pun, .pun input, .pun select, .pun textarea, .pun optgroup {
  17         font-family: verdana, arial, helvetica, sans-serif
  18 }
  19
  20 .pun {font-size: 11px; line-height: normal}
  21
  22 /* iewin font size only - to allow iewin to zoom. do not remove comments \*/
  23 * html .pun {font-size: 68.75%}
  24 /* end ie win font size */
  25
  26 /* set font size for tables because ie requires it */
  27 .pun table, .pun input, .pun select, .pun optgroup, .pun textarea, div.postmsg p.postedit {font-size: 1em}
  28
  29 /* 2.2 set the font-size for preformatted text i.e in code boxes */
  30
  31 .pun pre {font-family: monaco, "bitstream vera sans mono", "courier new", courier, monospace}
  32
  33 /* 2.3 font size for headers */
  34
  35 .pun h2, .pun h4 {font-size: 1em}
  36 .pun h3 {font-size: 1.1em}
  37 #brdtitle h1 {font-size: 1.4em}
  38
  39 /* 2.4 larger text for particular items */
  40
  41 div.postmsg p {line-height: 1.4}
  42 div.postleft dt {font-size: 1.1em}
  43 .pun pre {font-size: 1.2em}
  44
  45 /* 2.5 bold text */
  46
  47 div.postleft dt, div.postmsg h4, td.tcl h3, div.forminfo h3, p.postlink, div.linkst li,
  48 div.linksb li, div.postlinksb li, .blockmenu li, #brdtitle h1, .pun span.warntext, .pun p.warntext {font-weight: bold}
  49
  50 /****************************************************************/
  51 /* 3. links */
  52 /****************************************************************/
  53
  54 /* 3.1 remove underlining for main menu, post header links, post links and vertical menus */
  55
  56 #brdmenu a:link, #brdmenu a:visited, .blockpost dt a:link, .blockpost dt a:visited, .blockpost h2 a:link,
  57 .blockpost h2 a:visited, .postlink a:link, .postlink a:visited, .postfootright a:link, .postfootright a:visited,
  58 .blockmenu a:link, .blockmenu a:visited {
  59         text-decoration: none
  60 }
  61
  62 /* 3.2 underline on hover for links in headers and main menu */
  63
  64 #brdmenu a:hover, .blockpost h2 a:hover {text-decoration: underline}
  65
  66 /****************************************************************/
  67 /* 4. border width and style */
  68 /****************************************************************/
  69
  70 /* 4.1 by default borders are 1px solid */
  71
  72 div.box, .pun td, .pun th, .pun blockquote, div.codebox, div.forminfo, div.blockpost label {
  73         border-style: solid;
  74         border-width: 1px
  75 }
  76
  77 /* 4.2 special settings for the board header. */
  78
  79 #brdheader div.box {border-top-width: 4px}
  80
  81 /* 4.3 borders for table cells */
  82
  83 .pun td, .pun th {
  84         border-bottom: none;
  85         border-right: none
  86 }
  87
  88 .pun .tcl {border-left: none}
  89
  90 /* 4.4 special setting for fieldsets to preserve ie defaults */
  91
  92 div>fieldset {
  93         border-style: solid;
  94         border-width: 1px
  95 }
  96
  97 /****************************************************************/
  98 /* 5. vertical and page spacing */
  99 /****************************************************************/
 100
 101 /* 5.1 page margins */
 102
 103 html, body {margin: 0; padding: 0}
 104
 105 /* 5.2 creates vertical space between main board elements (margins) */
 106
 107 div.blocktable, div.block, div.blockform, div.block2col, #postreview {margin-bottom: 12px}
 108 #punindex div.blocktable, div.blockpost {margin-bottom: 6px}
 109 div.block2col div.blockform, div.block2col div.block {margin-bottom: 0px}
 110
 111 /* 5.3 remove space above breadcrumbs, postlinks and pagelinks with a negative top margin */
 112
 113 div.linkst, div.linksb {margin-top: -12px}
 114 div.postlinksb {margin-top: -6px}
 115
 116 /* 5.4 put a 12px gap above the board information box in index because the category tables only
 117 have a 6px space beneath them */
 118
 119 #brdstats {margin-top: 12px}
 120
 121 /****************************************************************/
 122 /* 6. spacing around content */
 123 /****************************************************************/
 124
 125 /* 6.1 default padding for main items */
 126
 127 div.block div.inbox, div.blockmenu div.inbox {padding: 3px 6px}
 128 .pun p, .pun ul, .pun dl, div.blockmenu li, .pun label, #announce div.inbox div {padding: 3px 0}
 129 .pun h2 {padding: 4px 6px}
 130
 131 /* 6.2 special spacing for various elements */
 132
 133 .pun h1 {padding: 3px 0px 0px 0}
 134 #brdtitle p {padding-top: 0px}
 135 div.linkst {padding: 8px 6px 3px 6px}
 136 div.linksb, div.postlinksb {padding: 3px 6px 8px 6px}
 137 #brdwelcome, #brdfooter dl a, div.blockmenu li, div.rbox input  {line-height: 1.4em}
 138 #viewprofile dt, #viewprofile dd {padding: 0 3px; line-height: 2em}
 139
 140 /* 6.4 create some horizontal spacing for various elements */
 141
 142 #brdmenu li, div.rbox input, div.blockform p input  {margin-right: 12px}
 143
 144 /****************************************************************/
 145 /* 7. spacing for tables */
 146 /****************************************************************/
 147
 148 .pun th, .pun td {padding: 4px 6px}
 149 .pun td p {padding: 5px 0 0 0}
 150
 151 /****************************************************************/
 152 /* 8. spacing for posts */
 153 /****************************************************************/
 154
 155 /* 8.1 padding around left and right columns in viewtopic */
 156
 157 div.postleft dl, div.postright {padding: 6px}
 158
 159 /* 8.2 extra spacing for poster contact details and avatar */
 160
 161 dd.usercontacts, dd.postavatar {margin-top: 5px}
 162 dd.postavatar {margin-bottom: 5px}
 163
 164 /* 8.3 extra top spacing for signatures and edited by */
 165
 166 div.postsignature, div.postmsg p.postedit {padding-top: 15px}
 167
 168 /* 8.4 spacing for code and quote boxes */
 169
 170 div.postmsg h4 {margin-bottom: 10px}
 171 .pun blockquote, div.codebox {margin: 5px 15px 15px 15px; padding: 8px}
 172
 173 /* 8.5 padding for the action links and online indicator in viewtopic */
 174
 175 div.postfootleft p, div.postfootright ul, div.postfootright div {padding: 10px 6px 5px 6px}
 176
 177 /* 8.6 this is the input on moderators multi-delete view */
 178
 179 div.blockpost input, div.blockpost label {
 180         padding: 3px;
 181         display: inline
 182 }
 183
 184 p.multidelete {
 185         padding-top: 15px;
 186         padding-bottom: 5px
 187 }
 188
 189 /* 8.7 make sure paragraphs in posts don't get any padding */
 190
 191 div.postmsg p {padding: 0}
 192
 193 /****************************************************************/
 194 /* 9. special spacing for forms */
 195 /****************************************************************/
 196
 197 /* 9.1 padding around fieldsets */
 198
 199 div.blockform form, div.fakeform {padding: 20px 20px 15px 20px}
 200 div.inform {padding-bottom: 12px}
 201
 202 /* 9.2 padding inside fieldsets */
 203
 204 .pun fieldset {padding: 0px 12px 0px 12px}
 205 div.infldset {padding: 9px 0px 12px 0}
 206 .pun legend {padding: 0px 6px}
 207
 208 /* 9.3 the information box at the top of the registration form and elsewhere */
 209
 210 div.forminfo {
 211         margin-bottom: 12px;
 212         padding: 9px 10px
 213 }
 214
 215 /* 9.4 bbcode help links in post forms */
 216
 217 ul.bblinks li {padding-right: 20px}
 218
 219 ul.bblinks {padding-bottom: 10px; padding-left: 4px}
 220
 221 /* 9.5 horizontal positioning for the submit button on forms */
 222
 223 div.blockform p input {margin-left: 12px}
 224
 225 /****************************************************************/
 226 /* 10. post status indicators */
 227 /****************************************************************/
 228
 229 /* 10.1 these are the post status indicators which appear at the left of some tables.
 230 .inew = new posts, .iredirect = redirect forums, .iclosed = closed topics and
 231 .isticky = sticky topics. by default only .inew is different from the default.*/
 232
 233 div.icon {
 234         float: left;
 235         margin-top: 0.1em;
 236         margin-left: 0.2em;
 237         display: block;
 238         border-width: 0.6em 0.6em 0.6em 0.6em;
 239         border-style: solid
 240 }
 241
 242 div.searchposts div.icon {margin-left: 0}
 243
 244 /* 10.2 class .tclcon is a div inside the first column of tables with post indicators. the
 245 margin creates space for the post status indicator */
 246
 247 td div.tclcon {margin-left: 2.3em}
 248
 249
 250
 251
 252 /* custom stuff below */
 253 body
 254 {
 255         background: url("../img/titlebar.png") repeat-x top left #fff;
 256         min-width: 600px;
 257         font-size: 14px;
 258         font-family: "dejavu sans", "bitstream vera sans", "lucida grande", arial, sans-serif;
 259 }
 260
 261 body.plain
 262 {
 263         background-image: none;
 264 }
 265
 266 #punwrap
 267 {
 268         margin: 0px 25px;
 269 }
 270
 271 #brdheader div.box
 272 {
 273         border: none;
 274         background: transparent url("../img/titlelogo.png") no-repeat scroll left 10px;
 275     height: 220px;
 276 }
 277
 278 #brdtitle
 279 {
 280         border: 0px;
 281         padding: 0px;
 282 }
 283
 284 #brdtitle p, #brdtitle h1
 285 {
 286         display: none;
 287 }
 288
 289 #main_nav
 290 {
 291         position: absolute;
 292         top: 123px;
 293         right: 30px;
 294         width: 600px;
 295         background: #333;
 296 }
 297
 298 #brdmenu
 299 {
 300         position: absolute;
 301         top: 149px;
 302         right: 30px;
 303         width: 600px;
 304         background: #55C246;
 305         padding: 0px;
 306 }
 307
 308 #main_nav ul, #brdmenu ul
 309 {
 310         list-style: none;
 311         margin: 0;
 312         padding: 0;
 313 }
 314
 315 #brdmenu ul
 316 {
 317         float: right;
 318 }
 319
 320 #main_nav ul li, #brdmenu ul li
 321 {
 322         display: block;
 323         float: right;
 324         margin: 0 3px;
 325         padding: 0;
 326         text-align: center;
 327         font-size: 13px;
 328         line-height: 26px;
 329         height: 26px;
 330 }
 331
 332 #brdmenu ul li
 333 {
 334         float: left;
 335 }
 336
 337 #main_nav ul li.selected
 338 {
 339         background: #55C246;
 340 }
 341
 342 #brdmenu ul li.selected
 343 {
 344         background: #333;
 345 }
 346
 347 #main_nav ul li a, #brdmenu ul li a
 348 {
 349         display: block;
 350         padding: 0 8px;
 351         color: #fff;
 352         font-weight: bold;
 353         text-decoration: none;
 354         font-family: "dejavu sans", "bitstream vera sans", "lucida grande", arial, sans-serif;
 355 }
 356
 357 #main_nav ul li a:hover
 358 {
 359         background: #55C246;
 360 }
 361
 362 #brdmenu ul li a:hover
 363 {
 364         text-decoration: none;
 365 }
 366
 367 #brdwelcome
 368 {
 369         padding-top: 175px;
 370 }
 371
 372
 373 /* ie fix due to the ad. don't ask questions, move along. */
 374 div.linkst div.inbox
 375 {
 376         width: 100%;
 377 }
 378
 379 #punredirect div.block, #punmaint div.block
 380 {
 381         margin-top: 190px;
 382         margin-left: 20%;
 383         margin-right: 20%;
 384 }
 385
 386 #punredirect, #punmaint, #helpfile
 387 {
 388         background: url("../img/titlelogo.png") no-repeat top left;
 389         position: absolute;
 390         top: 10px;
 391         right: 25px;
 392         left: 25px;
 393 }
 394
 395 #helpfile
 396 {
 397         padding-top: 180px;
 398 }
 399
 400 div#idx1 div.tclcon p, div#idx2 div.tclcon p, div#idx3 div.tclcon p, div#idx4 div.tclcon p, div#idx5 div.tclcon p
 401 {
 402         display: none;
 403 }
 404
 405 div#foot {
 406    margin:2em 0;
 407    color:#46494D;
 408    font-family:"DejaVu Sans","Bitstream Vera Sans","Lucida Grande",Arial,sans-serif;
 409    clear:both;
 410    font-size:1.0em;
 411    line-height:1.5em;
 412    padding:2em 0;
 413    text-align:center;
 414 }