docs/glest_factions/style.css

   1 body {
   2     margin: 0 auto;
   3     width: 1016px;
   4
   5     background-color: #161616;
   6     font-size: 0.8em;
   7     color: #fff6c0;
   8     font-family: "Lucida Sans Unicode","Lucida Grande","Lucida Sans", sans-serif;
   9 }
  10
  11 /*
  12  * Structure
  13  */
  14
  15 /* Header */
  16 #header {
  17     width: 1016px;
  18     height: 175px;
  19     margin: 0 auto;
  20     background: url("header/header.jpg") no-repeat;
  21 }
  22
  23 /* Horizontal menu */
  24 #menu {
  25     background-image: url("menu.jpg");
  26     background-repeat: no-repeat;
  27     height: 65px;
  28 }
  29
  30 /* Side menus */
  31 #menu #first { float: left }
  32 #menu #second { float: right }
  33
  34 /* Main content */
  35 #content {
  36     width: 1024px;
  37     margin: 0 auto;
  38     background: url("wood_panel.jpg") repeat;
  39 }
  40 img {
  41     padding-right: 3px;
  42     padding-bottom: 1px;
  43 }
  44
  45 /* Article (core text of the page) */
  46 #article {
  47     font-size: 1.1em;
  48     line-height: 1.5em;
  49     padding: 2em;
  50     text-align: justify;
  51 }
  52
  53 /* end of article has to be below side modules */
  54 #end_article {
  55     clear: both;
  56 }
  57
  58 /* Side modules */
  59 #aside_left {
  60     float: left;
  61     width: 420px;
  62     margin-left: -168px;
  63 }
  64 #aside_left ul {
  65     padding: 0 17px 0 168px;
  66     margin: 0 2em 2em 2em;
  67 }
  68
  69 #aside_right {
  70     float: right;
  71     width: 420px;
  72     margin-right: -168px;
  73 }
  74 #aside_right ul {
  75     padding: 0 140px 0 25px;
  76     margin: 0 2em;
  77 }
  78
  79 .aside .up_image {
  80     width: 420px;
  81     height: 278px;
  82 }
  83 .aside .down_image {
  84     width: 420px;
  85     height: 191px;
  86 }
  87
  88 /* fill .up_image and .down_image with content */
  89 .aside .content {
  90     margin-top: -210px;
  91     margin-bottom: -80px;
  92 }
  93
  94 /* Footer */
  95 #footer {
  96     width: 1016px;
  97     height: 143px;
  98     margin: 0 auto;
  99     background-image: url("footer/footer.jpg");
 100 }
 101
 102
 103 /*
 104  * Text display: side, colors, etc.
 105  */
 106 p { text-indent: 2em }
 107 a { color: #ecc72d }
 108 a:link { text-decoration: none }
 109 a:hover { text-decoration: underline }
 110 a img { border: 0; }
 111 img.right {
 112     float: right;
 113     margin: 0 0 10px 10px;
 114 }
 115 img.left {
 116     float: left;
 117     margin: 0 10px 10px 0;
 118 }
 119
 120 /* news dates, scores: gold */
 121 .info, .date, #content h3 { color: #ecc72d; }
 122 #content h3 { font-weight: normal; text-indent: 3em }
 123
 124 /* Logo */
 125 #header #logo {
 126     width: 365px;
 127     margin: 0 auto;
 128         margin-top: 1em;
 129 }
 130
 131 /* Download image */
 132 h2#download {
 133     margin: 0 auto;
 134     margin-top: -2em;
 135     text-align: center;
 136 }
 137
 138 /* Module titles */
 139 .aside h3 { display: block; }
 140
 141 .aside h3#news { margin-left: 240px; }
 142 .aside h3#servers { margin-left: 50px; }
 143 .aside h3.forums { margin-left: 230px; }
 144 .aside h3#links { margin-left: 110px; }
 145
 146 /* Menu links */
 147 #menu ul { margin: 0; padding: 0}
 148 #menu li { display: inline; }
 149 /* left horizontal menu should not "touch" the wood */
 150 #menu #second li:first-child { margin-left: 10px; }
 151
 152 #menu a {
 153     /* fixed available space: fixed size */
 154     font-size: 14px;
 155     color: #b5dbb5;
 156     font-variant: small-caps;
 157     margin: 0 8px;
 158 }
 159
 160 /*
 161  * Modules
 162  */
 163 #aside_left { background: url("modules/l_repeat.jpg") repeat-y }
 164 #aside_left .up_image {   background: url("modules/l_up.jpg") }
 165 #aside_left .down_image { background: url("modules/l_down.jpg") }
 166
 167 #aside_right {background: url("modules/r_repeat.jpg") repeat-y}
 168 #aside_right .up_image {background: url("modules/r_up.jpg")}
 169 #aside_right .down_image {background: url("modules/r_down.jpg")}
 170
 171 .aside ul li {
 172     list-style-image: url("modules/star.png");
 173     clear: right;
 174 }
 175
 176 /* News module */
 177 .date {
 178     display: block;
 179     float: right;
 180     margin-top: 1em;
 181     margin-bottom: 1.5em;
 182     /* Font */
 183     font-family: "DejaVu Serif Condensed", serif;
 184     font-style: italic;
 185     font-size: 0.9em;
 186 }
 187
 188 /* Servers module */
 189 .aside table {
 190     width: 200px;
 191     margin-left: 50px;
 192     text-align:center;
 193 }
 194
 195 .aside table td:first-child {
 196     text-align: left;
 197 }
 198
 199
 200
 201 /* Forums module */
 202 .forums .date {
 203     margin-top: 3px;
 204     font-size: 1em;
 205 }
 206
 207 /* Footer */
 208 #footer ul {
 209     margin: 0 auto;
 210     padding-top: 90px;
 211     width: 25em;
 212 }
 213 #footer li {
 214     list-style-type: none;
 215     display: inline;
 216     margin: 0 1em;
 217 }
 218 /* links in the dark space, images above */
 219 #footer img {
 220     vertical-align: -20%;
 221 }
 222
 223 /*
 224  * Additional background images
 225  */
 226 #header_left {
 227     float: left;
 228     width: 140px;
 229     height: 882px;
 230
 231     background-image: url("header/left.jpg");
 232     background-repeat: no-repeat;
 233     margin-left: -140px;
 234 }
 235
 236 #header_right {
 237     float: right;
 238     height: 843px;
 239     width: 143px;
 240
 241     background-image: url("header/right.jpg");
 242     background-repeat: no-repeat;
 243     margin-right: -143px;
 244 }
 245
 246 #footer_left {
 247     float: left;
 248     height: 143px;
 249     width: 101px;
 250     margin-left: -101px;
 251     background: url("footer/footer_left.jpg") no-repeat;
 252 }
 253
 254 #footer_right {
 255     float: right;
 256     height: 143px;
 257     width: 106px;
 258     margin-right: -106px;
 259     background: url("footer/footer_right.jpg") no-repeat;
 260
 261 }
 262
 263
 264 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 265  * DataTables sorting
 266  */
 267
 268 .sorting_asc {
 269         background-image: url('images/datatables/sort_asc.png');
 270         background-repeat: no-repeat;
 271         background-position: center right;
 272 }
 273
 274 .sorting_desc {
 275         background-image: url('images/datatables/sort_desc.png');
 276         background-repeat: no-repeat;
 277         background-position: center right;
 278 }
 279
 280 .sorting {
 281         background-image: url('images/datatables/sort_both.png');
 282         background-repeat: no-repeat;
 283         background-position: center right;
 284 }
 285
 286 .sorting_asc_disabled {
 287         background-image: url('images/datatables/sort_asc_disabled.png')  ;
 288         background-repeat: no-repeat;
 289         background-position: center right;
 290 }
 291
 292 .sorting_desc_disabled {
 293         background-image: url('images/datatables/sort_desc_disabled.png')  ;
 294         background-repeat: no-repeat;
 295         background-position: center right;
 296 }
 297
 298 tr.odd {
 299         background-color: #7E2217;
 300 }
 301
 302 tr.even {
 303         background-color: #7F462C;
 304 }
 305