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