www/themes/theme_Outdoor1-0/img/Outdoor.css

   1 /********************************************
   2    AUTHOR:                      Erwin Aligam
   3    WEBSITE:                     http://www.styleshout.com/
   4         TEMPLATE NAME:          Outdoor
   5    TEMPLATE CODE:       S-0020
   6    VERSION:          1.0
   7  *******************************************/
   8
   9 /********************************************
  10    HTML ELEMENTS
  11 ********************************************/
  12
  13 /* Top Elements */
  14 * { margin: 0; padding: 0; outline: 0 }
  15
  16 body {
  17         background: #f7f0e3 url(bg.jpg) repeat-x;
  18         font: 70%/1.6em Verdana, Tahoma, Arial, Geneva, sans-serif;
  19         color: #666666;
  20         text-align: center;
  21         margin: 0 0 50px 0;
  22 }
  23
  24 /* links */
  25 a, a:visited {
  26         color: #5A93C9;
  27         background: inherit;
  28         text-decoration: none;
  29 }
  30 a:hover {
  31         color: #88ac0b;
  32         background: inherit;
  33         text-decoration: underline;
  34 }
  35
  36 /* headers */
  37 h1, h2, h3 {
  38         font-family: 'Trebuchet MS', Tahoma, Sans-serif;
  39         color: #444;
  40 }
  41 h1 {
  42         font-size: 230%;
  43         font-weight: normal;
  44         letter-spacing: -1px;
  45 }
  46 h2 {
  47         font-size: 180%;
  48         color: #88ac0b;
  49 }
  50 h3 {
  51         font-size: 150%;
  52         font-weight: normal;
  53 }
  54
  55 h1, h2, h3, p {
  56         padding: 10px;
  57         margin: 0;
  58 }
  59 ul, ol {
  60         margin: 5px 20px;
  61         padding: 0 20px;
  62 }
  63 ul {
  64         list-style: none;
  65 }
  66
  67 /* images */
  68 img {
  69         background: #fafafa;
  70    border: 1px solid #dcdcdc;
  71         padding: 5px;
  72 }
  73 img.float-right {
  74         margin: 5px 0px 10px 10px;
  75 }
  76 img.float-left {
  77         margin: 5px 10px 10px 0px;
  78 }
  79
  80 code {
  81         margin: 5px 0;
  82         padding: 10px;
  83         text-align: left;
  84         display: block;
  85         overflow: auto;
  86         font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  87         /* white-space: pre; */
  88         border: 1px solid #F4F3EC;
  89         background: #FAFAE7;
  90 }
  91 acronym {
  92   cursor: help;
  93   border-bottom: 1px dashed #777;
  94 }
  95 blockquote {
  96         margin: 10px;
  97         padding: 0 0 0 35px;
  98    border: 1px solid #F4F3EC;
  99         background: #FAFAE7 url(quote.jpg) no-repeat 7px 10px;
 100         font: bold 1.3em/1.5em 'Trebuchet MS', Tahoma, Sans-serif;
 101         color: #976957;
 102 }
 103
 104 /* start - table */
 105 table {
 106         border-collapse: collapse;
 107         margin: 10px;
 108 }
 109 th strong {
 110         color: #fff;
 111 }
 112 th {
 113         background: #93BC0C url(nav.jpg) repeat-x;
 114         height: 35px;
 115         padding-left: 12px;
 116         padding-right: 12px;
 117         color: #fff;
 118         text-align: left;
 119         border-left: 1px solid #B6D59A;
 120         border-bottom: solid 2px #fff;
 121 }
 122 tr {
 123         height: 32px;
 124 }
 125 td {
 126         padding-left: 11px;
 127         padding-right: 11px;
 128         border-left: 1px solid #fff;
 129         border-bottom: 1px solid #fff;
 130 }
 131 td.first,th.first {
 132         border-left: 0px;
 133 }
 134 tr.row-a {
 135         background: #F8F8F8;
 136 }
 137 tr.row-b {
 138         background: #EFEFEF;
 139 }
 140 /* end - table */
 141
 142 /* form elements */
 143 form {
 144         margin:10px; padding: 0 5px;
 145         border: 1px solid #f1f1f1;
 146         background-color: #f5f5f5;
 147 }
 148 label {
 149         display:block;
 150         font-weight:bold;
 151         margin:5px 0;
 152 }
 153 input {
 154         padding:2px;
 155         border:1px solid #eee;
 156         font: normal 1em Verdana, sans-serif;
 157         color:#777;
 158 }
 159 textarea {
 160         width:400px;
 161         padding:2px;
 162         font: normal 1em Verdana, sans-serif;
 163         border:1px solid #eee;
 164         height:100px;
 165         display:block;
 166         color:#777;
 167 }
 168 input.button {
 169         font: bold 12px Arial, Sans-serif;
 170         height: 24px;
 171         margin: 0;
 172         padding: 2px 3px;
 173         color: #FFF;
 174         background: #8EB50C url(nav.jpg) repeat-x 0 0;
 175         border: 1px solid #88AD0C;
 176 }
 177
 178 /* search form */
 179 .searchform {
 180         background-color: transparent;
 181         border: none;
 182         margin: 0; padding: 5px 0 15px 0;
 183         width: 250px;
 184 }
 185 .searchform p { margin: 0; padding: 0; }
 186 .searchform input.textbox {
 187         width: 170px;
 188         color: #777;
 189         height: 18px;
 190         padding: 2px;
 191         border: 1px solid #E5E5E5;
 192         vertical-align: top;
 193 }
 194 .searchform input.button {
 195         width: 60px;
 196         height: 24px;
 197         padding: 2px 5px;
 198         vertical-align: top;
 199 }
 200
 201 /********************************************
 202    LAYOUT
 203 ********************************************/
 204 #wrap {
 205         position: relative;
 206         background: #fff url(wrap-bg.jpg) repeat-y;
 207         width: 900px;
 208         margin: 50px auto 0 auto;
 209         text-align: left;
 210 }
 211 #content-wrap {
 212         position: relative;
 213         background: #fff url(content-bg.jpg) repeat-x;
 214         clear: both;
 215         float: left;
 216         width: 870px;
 217         padding: 0;
 218         margin-left: 15px;
 219         display: inline;
 220         border-top: 5px solid #fff;
 221         border-bottom: 1px solid #e5e5e5;
 222         border-left: 1px solid #fff;
 223         border-right: 1px solid #fff;
 224 }
 225 #header {
 226         position: relative;
 227         background: #fff url(header-bg.jpg) repeat-x;
 228         width: 870px;
 229         height: 100px;
 230         padding: 0;
 231         margin: 0px auto;
 232 }
 233 #header h1#logo-text a {
 234         position: absolute;
 235         margin: 0; padding: 0;
 236         font: normal 42px Georgia, "Times New Roman", Times, serif;
 237         letter-spacing: -1.5px;
 238         color: #111;
 239         text-transform: none;
 240         text-decoration: none;
 241
 242         /* change the values of top and left to adjust the position of the logo*/
 243         top: 22px; left: 20px;
 244 }
 245 #header p#slogan {
 246         position: absolute;
 247         margin: 0; padding: 0;
 248         font: normal 12px Georgia, "Times New Roman", Times, serif;
 249         text-transform: none;
 250         color: #5b4a29;
 251
 252         /* change the values of top and left to adjust the position of the slogan*/
 253         top: 67px; left: 25px;
 254 }
 255
 256 /* header links */
 257 #header #header-links {
 258         position: absolute;
 259         top: 25px; right: 10px;
 260         color: #5b4a29;
 261         font: normal 11px Georgia, "Times New Roman", Times, serif;
 262         text-transform: uppercase;
 263 }
 264 #header #header-links a {
 265         color: #5b4a29;
 266         text-decoration: none;
 267         padding: 0 2px;
 268         font-weight: bold;
 269 }
 270 #header #header-links a:hover {
 271         color: #111;
 272 }
 273
 274 /* header-photo */
 275 #header-photo {
 276         clear: both;
 277         background: #fff;
 278         margin: 5px auto;
 279         padding: 0;
 280         height:206px;
 281         width: 870px;
 282 }
 283 #header-photo img {
 284         border: none;
 285         margin: 0; padding: 0;
 286 }
 287
 288 /* Navigation */
 289 #nav {
 290         clear: both;
 291         margin: 0; padding: 0;
 292         height: 45px;
 293 }
 294 #nav ul {
 295         float: left;
 296         list-style: none;
 297         background: url(nav.jpg) repeat-x;
 298         width: 870px;
 299         height: 45px;
 300         text-transform: uppercase;
 301         margin: 0 0 0 15px;
 302         padding: 0;
 303         display: inline;
 304 }
 305 #nav ul li {
 306         display: inline;
 307         margin: 0; padding: 0;
 308 }
 309 #nav ul li a {
 310         display: block;
 311         float: left;
 312         width: auto;
 313         margin: 0;
 314         padding: 0 14px;
 315         border-right: 1px solid #899D00;
 316         border-left: 1px solid #A7D101;
 317         font: bold 14px/45px "Century Gothic", "Trebuchet MS", Helvetica, Arial, Geneva, sans-serif;
 318         text-transform: uppercase;
 319         text-decoration: none;
 320         letter-spacing: 1px;
 321         color: #fff;
 322 }
 323 #nav ul li a:hover,
 324 #nav ul li a:active {
 325         background: url(nav-hover.jpg) repeat-x;
 326 }
 327 #nav ul li#current a {
 328         background: url(nav-current.jpg) repeat-x;
 329 }
 330
 331 /* Main Column */
 332 #main {
 333         float: left;
 334         width: 550px;
 335         padding: 15px 0 0 0; margin: 0 0 0 10px;
 336         display: inline;
 337 }
 338 #main h2 {
 339         margin-top: 10px;
 340         padding-bottom: 3px;
 341         font: normal 2.3em 'Trebuchet MS', Tahoma, Sans-serif;
 342         color: #895F30;
 343         letter-spacing: -1px;
 344         text-transform: none;
 345 }
 346 #main h2 a {
 347         color: #895F30;
 348         text-decoration: none;
 349 }
 350 #main ul li {
 351         list-style-image: url(bullet.gif);
 352 }
 353
 354 /* Sidebar */
 355 #sidebar {
 356         float: right;
 357         width: 280px;
 358         padding: 25px 0 0 0; margin: 0;
 359 }
 360 #sidebar h3 {
 361         margin-top: 10px;
 362         padding: 5px 5px;
 363         font: normal 1.6em 'Trebuchet MS', Tahoma, Sans-serif;
 364         color: #899B0D;
 365 }
 366 #sidebar ul.sidemenu {
 367         text-align: left;
 368         margin: 7px 10px 8px 0px; padding: 0;
 369         text-decoration: none;
 370         border-top: 1px solid #EBEBEB;
 371 }
 372 #sidebar ul.sidemenu li {
 373         list-style: none;
 374         border-bottom: 1px solid #EBEBEB;
 375         padding: 5px 0 5px 5px;
 376         margin: 0 2px;
 377 }
 378 * html body #sidebar ul.sidemenu li {
 379         height: 1%;
 380 }
 381 #sidebar ul.sidemenu li a {
 382         text-decoration: none;
 383         background-image: none;
 384         color: #895F30;
 385 }
 386 #sidebar ul.sidemenu li a:hover {
 387         color: #1773BC;
 388 }
 389 #sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; }
 390 #sidebar ul.sidemenu ul li { border: none; }
 391
 392 /* footer */
 393 #footer-wrap {
 394         clear: both;
 395         width: 900px;
 396         font-size: 95%;
 397         text-align: left;
 398         padding: 15px 0;
 399         border-bottom: 15px solid #fff;
 400         border-top: 1px solid #fff;
 401 }
 402 #footer-wrap a:hover {
 403         color: #000;
 404 }
 405 #footer-wrap h3 {
 406         color: #976834;
 407         margin: 0;
 408         padding: 0 10px;
 409         text-transform: uppercase;
 410         font-weight: bold;
 411 }
 412
 413 #footer-columns {
 414         color: #888;
 415         margin: 0 auto;
 416         padding: 0;
 417         width: 840px;
 418 }
 419 #footer-columns a {
 420         text-decoration: none;
 421         font-weight: bold;
 422         color: #666666;
 423 }
 424 #footer-columns ul {
 425         list-style: none;
 426         margin: 10px 0 0 0;
 427         padding: 0;
 428         border-top: 1px solid #e5e5e5;
 429 }
 430 #footer-columns li {
 431         border-bottom: 1px solid #e5e5e5;
 432 }
 433 #footer-columns li a {
 434         display: block;
 435         font-weight: normal;
 436         padding: 5px 0 5px 10px;
 437         width: 96%;
 438 }
 439 #footer-columns .col3, .col3-center {
 440         float: left;
 441         width: 32%;
 442 }
 443 #footer-columns .col3-center {
 444         margin: 0 15px;
 445 }
 446
 447 /* bottom */
 448 #footer-bottom {
 449         clear: both;
 450         color: #666;
 451         margin: 0 auto;
 452         width: 870px;
 453         padding: 15px 0 0 0;
 454         text-align: center;
 455 }
 456 #footer-bottom  a {
 457         color: #976834;
 458 }
 459
 460 /* postmeta */
 461 .postmeta {
 462         padding: 5px; margin: 20px 10px 15px 10px;
 463         font-size: 95%;
 464         color: #99997D;
 465         border: 1px solid #EAE7DB;
 466         background: #FAFAE7;
 467 }
 468 .postmeta .date{ margin: 0 10px 0 5px;  }
 469 .postmeta a.comments { margin: 0 10px 0 5px;    }
 470 .postmeta a.readmore { margin: 0 10px 0 5px;    }
 471
 472 .post-info { font-size: .95em;  padding-top: 0; margin-left: 5px;       }
 473
 474 /* alignment classes */
 475 .float-left  { float: left; }
 476 .float-right { float: right; }
 477 .align-left  { text-align: left; }
 478 .align-right { text-align: right; }
 479
 480 /* display and additional classes */
 481 .clear { clear: both; }
 482
 483