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