style/awesomesauce/style.css

   1 /* Created by http://freehtml5templates.com */
   2
   3 * {margin: 0; padding: 0;}
   4 header, nav, section, article, aside, footer {display: block;}
   5 body {
   6         font: 16px/18px Arial, Tahoma, sans-serif;
   7         color: #555;
   8         width: 960px;
   9   margin-left:auto;
  10   margin-right:auto;
  11   text-align:center;
  12 }
  13
  14 a {
  15         color: #333;
  16         outline: none;
  17 }
  18
  19 a:hover { color: #A80202;}
  20
  21 p {margin: 0 0 18px;}
  22
  23 img {border: none;}
  24
  25 blockquote {
  26         margin: 0 20px 18px 20px;
  27         padding: 1px 12px;
  28         background: #F2F2F2;
  29         border-left: 3px solid #A80202;
  30         border-right: 3px solid #A80202;
  31 }
  32
  33 blockquote p {
  34         padding: 8px 0;
  35         margin: 0;
  36 }
  37
  38 .clear {
  39         clear: both;
  40         height: 0;
  41         overflow: hidden;
  42 }
  43
  44 .aligncenter,
  45 div.aligncenter {
  46         display: block;
  47         margin-left: auto;
  48         margin-right: auto;
  49 }
  50
  51 .alignleft {float: left;}
  52
  53 img.alignleft {margin: 5px 15px 5px 0;}
  54
  55 .alignright {float: right;}
  56
  57 img.alignright {margin: 5px 0 5px 15px;}
  58
  59 #wrapper {
  60         width: 960px;
  61         text-align:left;
  62 }
  63
  64 /* Header
  65 -----------------------------------------------------------------------------*/
  66
  67 header {
  68         height: 200px;
  69         position: relative;
  70   background: url(images/roundedheader.png);
  71   margin-top: 10px;
  72 }
  73
  74 #headerlogo {
  75         position: absolute;
  76         top: 23px;
  77         right: 47px;
  78 }
  79
  80
  81
  82 #sitename a {
  83         position: absolute;
  84         top: 30px;
  85         left: 10px;
  86         font: 40px/1 Georgia, "Times New Roman", Times;
  87         color: #F2F2F2;
  88         text-shadow: 2px 2px 2px #000;
  89   text-decoration: none;
  90 }
  91
  92 #description {
  93         position: absolute;
  94         top: 80px;
  95         left: 15px;
  96         width: 600px;
  97   font-size: 16px;
  98   font-weight: bold;
  99   line-height: 16px;
 100         color: #F2F2F2;
 101         text-shadow: 1px 1px 0 #000;
 102 }
 103
 104 header nav {
 105         position: absolute;
 106         top: 173px;
 107         width: 915px;
 108         left: 25px;
 109         height: 26px;
 110   font: 14px/1 Tahoma, Arial;
 111   text-transform: uppercase;
 112         overflow: hidden;
 113 }
 114
 115 header nav li {
 116         float: left;
 117         list-style: none;
 118         background: #FFF;
 119         margin: 2px;
 120         border: 2px solid #696969;
 121         -moz-border-radius-topleft: 5px;
 122         -moz-border-radius-topright: 5px;
 123         -webkit-border-top-left-radius: 5px;
 124         -webkit-border-top-right-radius: 5px;
 125 }
 126
 127 header nav a {
 128         float: left;
 129         color: #333;
 130   text-decoration: none;
 131         padding: 7px 10px 6px;
 132   border-bottom: 3px solid #F0EFEF;
 133 }
 134
 135 /* Middle
 136 -----------------------------------------------------------------------------*/
 137
 138 section {
 139         width: 946px;
 140         margin-top: 5px;
 141   -moz-border-radius: 5px;
 142   -webkit-border-radius: 5px;
 143   border: 1px solid #AEB0AD;
 144   padding: 5px;
 145   background-color: #F2F2F2;
 146 }
 147
 148 section:after {
 149         content: '.';
 150         display: block;
 151         clear: both;
 152         visibility: hidden;
 153         height: 0;
 154 }
 155
 156 #container {
 157         width: 100%;
 158         float: left;
 159         overflow: hidden;
 160 }
 161
 162 #content {
 163         margin: 0 199px;
 164         padding: 15px 15px 1px;
 165   -moz-border-radius: 5px;
 166   -webkit-border-radius: 5px;
 167   border: 1px solid #AEB0AD;
 168         height: 1%;
 169         background-color: #FFF;
 170 }
 171
 172 #content h2 {
 173         font: 24px/1 Arial, Tahoma;
 174         margin: 0 0 18px;
 175         color: #333;
 176 }
 177
 178 #content h2 a {
 179         color: #333;
 180         text-decoration: none;
 181         text-shadow: 2px 1px 2px #CCC;
 182 }
 183
 184 #content h2 a:hover {
 185         color: #A80202;
 186         text-decoration: underline;
 187         text-shadow: none;
 188 }
 189
 190 #content .entry h2,
 191 #content .entry h3,
 192 #content .entry h4,
 193 #content .entry h5,
 194 #content .entry h6 {
 195         font: 24px/1 Arial, Tahoma;
 196         margin: 25px 0 18px;
 197         color: #333;
 198         text-shadow: 2px 1px 2px #CCC;
 199 }
 200
 201 #content .entry h3 {font-size: 22px;}
 202
 203 #content .entry h4 {font-size: 20px;}
 204
 205 #content .entry h5 {font-size: 18px;}
 206
 207 #content .entry h6 {font-size: 16px;}
 208
 209 #content h3 {
 210         color: #333;
 211   font-size: 22px;
 212   font-weight: normal;
 213   line-height: 1;
 214         text-shadow: 2px 1px 2px #CCC;
 215         margin: 0 0 28px;
 216 }
 217
 218 /* Sidebars
 219 -----------------------------------------------------------------------------*/
 220
 221 aside {
 222         float: left;
 223         width: 199px;
 224         position: relative;
 225   font-size: 14px;
 226 }
 227
 228 #left {
 229         margin-left: -100%;
 230 }
 231
 232 #right {
 233         margin-left: -200px;
 234 }
 235
 236 aside h3 {
 237         line-height: 35px;
 238         color: #A80202;
 239   font-size: 14px;
 240   text-transform: uppercase;
 241         text-shadow: 1px 1px 1px #DDD;
 242         height: 35px;
 243   padding-left: 10px;
 244 }
 245
 246 aside#right h3 {
 247         color: #A80202;
 248 }
 249
 250 aside ul {list-style-position: inside;
 251 list-style-image: url(images/redarrow.gif);}
 252
 253 aside li {
 254         color: #696969;
 255         padding: 4px 6px 5px 5px;
 256 }
 257
 258 aside a {
 259         color: #6E7761;
 260   text-decoration: none;
 261 }
 262
 263 .box {
 264         padding: 0 0 5px;
 265 }
 266
 267 .inner {
 268         margin-left: 10px;
 269         margin-right: 10px;
 270         overflow: hidden;
 271   -moz-border-radius: 5px;
 272   -webkit-border-radius: 5px;
 273   border: 1px solid #A80202;
 274   padding: 5px;
 275         margin-top: -7px;
 276         margin-bottom: 10px;
 277 }
 278
 279
 280 /* Footer
 281 -----------------------------------------------------------------------------*/
 282
 283 footer {
 284         background: #F2F2F2;
 285   font-size: 11px;
 286   -moz-border-radius: 5px;
 287   -webkit-border-radius: 5px;
 288   border: 1px solid #AEB0AD;
 289   padding: 5px;
 290   margin-top: 5px;
 291   margin-bottom: 5px;
 292 }
 293
 294 #copyright {
 295         font: 10px/16px Tahoma, Arial;
 296   text-align: right;
 297         color: #333;
 298         padding: 22px 10px 0 0;
 299 }
 300
 301 #copyright span {
 302         display: block;
 303   text-transform: uppercase;
 304 }
 305
 306 #copyright a {
 307         color: #6E7761;
 308   text-decoration: none;
 309 }
 310
 311 #copyright a:hover { color: #A80202;}