/*  
Theme Name: New Personal 2
Theme URI: http://wwww.ikirudesign.com/themes/bwo/
Description: A throwback to my earliest forays into web designs, with some necessary refinements
Version: 0.83
Author: Ikiru Design
Author URI: http://www.ikirudesign.com
Licensed under: GPL (http://www.opensource.org/licenses/gpl-license.php

INDEX
I) Removing Browser Default Styling
II) Basic Layout -- what goes where
III) Basic Typography -- general fonts and links (the rest is where it styles)
IV) Styling Header
V) Styling Navigation
VI) Styling Main Content Column
IX) Styling Footer
X) Creating Classes for Images/Ads
*/

/* ===================================
      I) REMOVING BROWSER DEFAULTS 
  ===================================*/
* {
  margin: 0;
  padding: 0;
  font-size: 1em;
}
a {
  text-decoration: none;
}
a img {
  border: none;
}
/* ===================================
        II) BASIC LAYOUT
  ===================================*/
body {
  text-align: center; /*centers #page for IE*/
}
#page { /*container for everything, below elements inside of it*/
  width: 94em;
  margin: 0 auto; /*centers #page in most browsers*/
  text-align: left; /*corrects for above IE fix*/
}
#widecolumn {
  width: 58em;
  float: left;
  margin: 1em 0 0 0;
}
#narrowcolumn {
  width: 34em;
  float: right;
  margin: 1em 0 0 2em;
}
#footer {
  clear: both; /*stops footer from drifting up*/
  margin: 0 0 5em 0;
}

/* ===================================
        III) BASIC TYPOGRAPHY
  ===================================*/
/* more specific stuff is in the section that it styles*/
body {
  font: 62.5% Verdana, sans-serif; /*makes 1em=10px in most cases*/
  background: white;
  color: black;
}
input, textarea {
  font-family: Verdana, sans-serif;
}
a {
  color: #999;
  text-decoration: underline
}
a:visited {
  text-decoration: none;
}
a:hover {
  background-color: #bbb;
  color: white;  
  text-decoration: none;
}
/* ===================================
        IV) HEADER STYLING
  ===================================*/
/*body>#page>#header                */ 
#header {  
  margin: 5em 0 1em 0;
}
h1 {
  font-size: 5.6em;
  line-height: 1.3;
  font-weight: normal;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-style: italic;
}
h1 a, h1 a:visited {
  color: black;
}
.description {
  font-size: 1.6em;
  line-height: 1.3;
  margin: 1em 13em 1em 3.8em;
/*  text-transform: lowercase;*/
}
/* ===================================
        V) NAVIGATION STYLING
  ===================================*/
/*body>#page>#mainnav (under #header)*/
#mainnav {
  padding: 2px 0;
  background: #eee;
  text-align: right;
  border: 1px dotted black;
}
#mainnav li {
  font-size: 1.6em;
  text-transform: lowercase;
  list-style: none;
  display: inline;
  padding: 0 .5em 0 0;
}
#mainnav a {
  padding: 0em .6em;  
  color: black;
}
/* ===================================
        VI) CONTENT STYLING
  ===================================*/
/*body>#page>#content>.post>.topmeta,.entry (under #mainnav)*/
#content {
  margin: 0 0 1em 0;
  padding: 0;
}
.post {
  margin: 1em 0 1em 0;
  border: 1px solid black;
  padding: .6em .8em;
}
#content h2 {
  border-bottom: 1px dotted black;
  clear: both;
  font-size: 2.2em;
  font-weight: bold;
  font-family: Georgia, "Times New Roman", Times, serif;
}
h2 a {
  color: orange;
}
#content h2 a:hover {
  color: black;
}
#content h3 { /*use h3 for subsections within a single post; also comments titles*/
  margin-top: .8em;
  border-bottom: 1px dotted black;
  font-size: 1.6em;
}
#content h3.search {
  margin-top: 0;
}
#content h4 {/*used for months in archives*/
  font-size: 1.4em;
  margin: .5em 0 -.3em .3em;
}
.topmeta {
  font-size: 1em;
}
.entry p {
  margin: .8em 0;
  font-size: 1.1em;
  line-height: 1.4em;
}
.entry code {
  font-size: 1.1em;
}
.excerpt { /*used for search results*/
  margin: .8em 0;
  font-size: 1em;
  line-height: 1.3em;
  color: #ddd;
}
blockquote {
  margin: .8em 2.5em .8em 1.5em;
  border-left: 2px solid #444;
  padding: 0 1em;
  color: #444;
}
#content li {
  margin: .1em 2em;
  font-size: 1.2em
  line-height: 1.2em;
}
#content ul, #content ol {
  margin: .8em 0 .8em 0;
}
.postmetadata {
  margin-top: .8em;
  border-top: 1px dotted black;
  font-size: 1.1em;
  font-weight: bold;
}
#content.page .post {
  padding: 1em 5em;
}
#content.page p {
  font-size: 1.3em;
}
#content.page li {
  font-size: 1.3em;
}
/* ===================================
        IX) FOOTER STYLING
  ===================================*/
/*body>#page>#footer> (below #content & #sidebar)*/
#footer {
  background: #eee;
  border: 1px black dotted;
  text-align: center;
  font-size: 1.1em;  
  padding: .5em;
}

/* ===================================
      X) CREATING CLASSES FOR IMGS
  ===================================*/
/*Whenever you want to use the "align" html tag, 
    avoid the urge and use the much better "class" tag, 
    which accepts the same values: "left" and "right".
  And, it's not considered depricated, as "align" is.*/
img.left {
  float: left;
  margin: .1em .5em .1em 0;
}
img.right {
  float: right;
  margin: .1em 0 .1em .5em;
}
img.center {
  display: block;
  clear: both;
  margin: .2em auto .2em auto; 
}
.ad, .ad_right {
  float: right;
  margin: .1em 0em .1em .5em;
}
.ad_left {
  float: left;
  margin: .1em .5em .1em 0;
}