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