mod/template/templates/Default_Template/css

   1 /*
   2 Elgg general CSS
   3 CSS last updated 16/01/07
   4 Theme adapted from:
   5 Theme Name: Light
   6 Theme URI: http://vaguedream.com/wordpress-themes/
   7 Description: A theme created by <a href="http://vaguedream.com" target="_blank">Stephen Reinhardt</a>.
   8 Version: 1.0
   9 Author: Stephen Reinhardt
  10 Author URI: http://vaguedream.com/
  11 */
  12
  13 /*
  14    GLOBALS: used to set all the general elements
  15 */
  16
  17 body {
  18         background:#e5e5e5; url({{url}}mod/template/templates/Default_Template/images/wrap.gif) repeat-y;
  19 color:#697C83;
  20 font-family:'Trebuchet MS','Lucida Grande', Arial, sans-serif;
  21 text-align:left;
  22 margin:0 auto;
  23 padding:0;
  24 font-size: 80%;
  25 line-height:1.6em;
  26 }
  27
  28 p {
  29   color:#555;
  30   margin:0 0 10px 0;
  31 }
  32
  33 a {
  34   text-decoration:none;
  35   color:#336699;
  36 }
  37
  38 ol, ul {
  39   color:#697C83;
  40 }
  41
  42 h1 {
  43   font-size:130%;
  44 }
  45
  46 h2, h3, h4, h5 {
  47    font-size:100%;
  48 }
  49
  50 blockquote{
  51         background: #EEE url({{url}}mod/template/templates/Default_Template/images/blockquote.png) no-repeat bottom left;
  52         padding: 10px;
  53         padding-bottom: 40px;
  54         margin: 1em;
  55 }
  56
  57 /*
  58    TABLES IN ELGG
  59 */
  60
  61 td {
  62   border:1px solid #eee;
  63   padding:0;
  64   margin:0;
  65 }
  66
  67 td h4, h3, h5 {
  68   padding:0;
  69   margin:0;
  70 }
  71
  72 /*
  73    CONTAINER: WRAPS THE HEADER AND MAIN CONTENT AREA BELOW THE USER TOOLBAR
  74 */
  75
  76 div#container {
  77         width:940px;
  78         margin:0 auto;
  79         padding:0;
  80         background:#fff;
  81         border-top:1px solid #fff;
  82 }
  83
  84 /*
  85    HEADER: THE HEADER INCLUDES THE LOGO AND SEARCH BAR
  86 */
  87
  88 div#header {
  89    margin:0;
  90    padding:0;
  91    text-align:left;
  92    background:url({{url}}mod/template/templates/Default_Template/images/header-bg.gif) repeat-x;
  93    position:relative;
  94    width:100%;
  95    height:120px;
  96  }
  97
  98 /*
  99    LOGO: LOCATED WITHIN HEADER
 100 */
 101
 102 div#header #logo{
 103         margin: 0px;
 104         padding:10px;
 105         float:left;
 106 }
 107
 108 div#header #logo h1 {
 109    font-size:30px;
 110    padding:0;
 111    margin:10px 0 6px 0;
 112 }
 113
 114 div#header #logo h1 a{
 115    color:#fff;
 116    font-family:Helvetica, "Myriad Web", Arial, sans-serif;
 117 }
 118
 119 div#header #logo h2{
 120    color:#F17D00;
 121    padding:0;
 122    margin:0;
 123    font-size:1.2em;
 124 }
 125
 126 /*
 127    SEARCH BAR: LOCATED WITHIN HEADER
 128 */
 129
 130 div#header #search-header {
 131    float:right;
 132    background:url({{url}}mod/template/templates/Default_Template/images/search_icon.gif) no-repeat left top;
 133    width:330px;
 134    margin:0;
 135    padding:0;
 136    position:absolute;
 137    top:10px;
 138    right:0;
 139 }
 140
 141 div#header #search-header img {
 142    margin:0 0 0 10px;
 143 }
 144
 145 div#header #search-header p {
 146    padding:0 0 0 15px;
 147    margin:0;
 148 }
 149
 150 div#header #search-header span a {
 151    color:#fff;
 152 }
 153
 154 /*
 155    CONTENT-HOLDER: WRAPS THE MAIN PAGE CONTENT. THIS CAN INCLUDE
 156    THE SINGLE PAGE LAYOUT AND THE SPLIT PANE (CONTENT AND SIDEBAR)
 157 */
 158
 159 #content-holder {
 160    padding:0px;
 161    margin:0px;
 162    width:100%;
 163    min-height:500px;
 164    overflow:hidden;
 165    position:relative;
 166  }
 167
 168 div#content-holder a:hover {
 169     text-decoration:underline;
 170 }
 171
 172 div#content-holder h1 {
 173     font-size:150%;
 174 }
 175
 176 div#content-holder h2 {
 177           border:0;
 178           border-bottom:1px solid #eee;
 179           padding:0;
 180           margin:0 0 10px 0;
 181           color:#666;
 182          font-size:1.1em;
 183 }
 184
 185 /*
 186    VARIOUS LAYOUTS WITHIN CONTENT-HOLDER
 187 */
 188
 189 /*
 190    THE MAIN CONTENT AREA WHEN IT IS A SINGLE PAGE, NO SIDEBAR
 191 */
 192
 193 div#single-page {
 194     margin: 0;
 195     padding: 0 15px 0 0;
 196     width:900px;
 197     text-align: left;
 198     border:1px solid #eee;
 199 }
 200
 201 /*
 202    THE MAIN CONTENT AREA WHEN THE SIDEBAR IS IN PLACE
 203 */
 204
 205 div#splitpane-content {
 206     margin: 0;
 207     padding: 0 0 0 10px;
 208     width:690px;
 209     text-align: left;
 210     color:#000;
 211     float: left;
 212     overflow-x:hidden;
 213     min-height:500px;
 214 }
 215
 216 /*
 217    SIDEBAR: THIS IS ONLY PRESENT WHEN SPLITPANE-CONTENT IS IN USE
 218 */
 219
 220 div#splitpane-sidebar {
 221    width: 220px;
 222    margin:0;
 223    padding:0;
 224    background:#fff url({{url}}mod/template/templates/Default_Template/images/side-back.gif) repeat-y;
 225    margin:0;
 226    float: right;
 227 }
 228
 229 /*
 230    THE SIDEBAR CONTENTS
 231 */
 232
 233 div#splitpane-sidebar td {
 234    width: 200px;
 235    margin:0 0 0 20px;
 236   }
 237
 238 div#splitpane-sidebar ul {
 239     margin: 0;
 240     padding: 0;
 241     list-style: none;
 242 }
 243
 244 div#splitpane-sidebar ul li {
 245     margin:10px 0;
 246     padding-left: 5px;
 247     border-bottom:1px dashed #eee;
 248 }
 249
 250 div#splitpane-sidebar ul li ul li a {
 251      padding:0 0 0 5px;
 252 }
 253
 254 div#splitpane-sidebar h2 {
 255     text-align:left;
 256     border-bottom:1px solid #ccc;
 257     color:#777;
 258     font-size:0.9em;
 259     width:200px;
 260 }
 261
 262 /*
 263    FOOTER
 264 */
 265
 266 div#footer {
 267     background:url({{url}}mod/template/templates/Default_Template/images/footer.gif) repeat-x top;
 268     text-align: center;
 269     padding:10px 0 0 0;
 270     font-size:1em;
 271     height:80px;
 272     margin:0;
 273     color:#fff;
 274     width:100%;
 275 }
 276
 277 div#footer a {
 278    color:#fff;
 279 }
 280 div#footer img {
 281    margin:20px 0 0 0;
 282 }
 283
 284 div#footer a:hover {
 285    text-decoration:underline;
 286  }
 287
 288 div#footer a:link, div#footer a:visited {
 289     text-align:right;
 290 }
 291
 292 /*
 293    SYSTEM MESSAGES
 294 */
 295
 296 div#system-message{
 297     border:1px solid #D3322A;
 298     background:#F7DAD8;
 299     color:#000;
 300     padding:3px 50px;
 301     margin:20px 20px 0 20px;
 302 }
 303
 304 div#system-message p{
 305    padding:0px;
 306    margin:2px;
 307  }
 308
 309 /*
 310   CLEAR BOTH
 311 */
 312
 313 .clearing {
 314     clear:both;
 315 }
 316
 317 /*
 318    THIS IS THE END OF THE MAIN PAGE COMPONENTS - EVERYTHING BELOW THIS IS ASSOCIATED WITH VARIOUS ELEMENTS
 319    WITHIN ELGG, THIS INCLUDES THE BLOG CLASSESS, PROFILE, FILES, SIDEBAR WIDGETS, PROFILE WIDGETS ETC.
 320 */
 321
 322 /*
 323    BLOGGING ENGINE
 324 */
 325
 326 .weblog-post {
 327    margin:20px 0 10px 0;
 328 }
 329
 330 .user {
 331   float:left;
 332   margin:5px 10px 10px 0;
 333   height:120px;
 334 }
 335
 336 .user img {
 337    border:1px solid #eee;
 338    padding:2px;
 339 }
 340
 341 .weblog-keywords p a {
 342    margin:20px 0 0 0;
 343    padding:0;
 344    clear:both;
 345 }
 346
 347 .weblog-title {
 348    margin:10px 0 10px 105px;
 349 }
 350
 351 .post {
 352    margin:10px 0 10px 105px;
 353    background:url({{url}}mod/template/templates/Default_Template/images/infoholder_bg.gif) left repeat-y;
 354 }
 355
 356 .info {
 357   border:1px solid #ccc;
 358   margin:10px 0 10px 105px;
 359   clear:both;
 360 }
 361
 362 .info p {
 363    padding:0 0 0 10px;
 364    margin:0;
 365    color:#99000;
 366 }
 367
 368 .info p a {
 369    font-size:0.9em;
 370    color:#555;
 371 }
 372
 373 /* this is the thin line between the actual post and comments */
 374
 375 #comments-divide {
 376    height:1px;
 377    background:#ccc;
 378 }
 379
 380 .comment-owner {
 381     border:1px solid #eee;
 382     background:#f2f7fb;
 383     padding:5px;
 384     margin:20px 0 5px 0;
 385     height:50px;
 386     width:550px;
 387 }
 388
 389 .comment-owner img {
 390    margin:0px 5px 0px 0px;
 391    text-align:left;
 392 }
 393
 394 .comment-owner a {
 395    background:#f2f7fb;
 396 }
 397
 398 .comment-owner p {
 399   padding:0;
 400   margin:0;
 401 }
 402
 403 /* END OF BLOGGING ENGINE */
 404
 405 /*
 406    SUB MENU OPTIONS: THESE WILL BE MOVED TO THE NEW SIDEBAR SHORTLY
 407 */
 408
 409 div#sub-menu p {
 410   margin:10px 0 10px 0;
 411   padding:3px;
 412   background:#efefef;
 413   border:1px solid #ccc;
 414 }
 415
 416 /* END OF SUB-MENU DIV */
 417
 418 /*
 419   INFOHOLDER: this holds profile data, account settings and administration content
 420 */
 421
 422 .infoholder {
 423    margin:10px 0 20px 0;
 424 }
 425
 426 .infoholder p {
 427    padding:5px 0 5px 10px;
 428    background:url({{url}}mod/template/templates/Default_Template/images/infoholder_bg.gif) left repeat-y;
 429 }
 430
 431 /* the end of INFOHOLDER */