/*
	Name: Free Spirit Media
	Description: Global Style Sheet
	Version: 1.0
*/

/***** Global *****/
	/* Reset */
		html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, font, img, ins, kbd, q, s, samp,
		small, strike, strong, sub, sup, tt, var,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend,
		table, caption, tbody, tfoot, thead, tr, th, td {
			margin: 0;
			padding: 0;
			border: 0;
			outline: 0;
			font-weight: inherit;
			font-style: inherit;
			font-size: 100%;
			font-family: inherit;
			vertical-align: baseline
		}
		
		:focus {outline: 0}
		
		ol, ul {list-style: none}
		
		/* Tables need 'cellspacing="0"' on markup */
		table {
			border-collapse: separate;
			border-spacing: 0
		}
		
		caption, th, td {
			text-align: left;
			font-weight: normal
		}
		
		blockquote:before, blockquote:after, q:before, q:after {content: ""}
		blockquote, q {quotes: "" "" }

/* Body */
	body {
    line-height: 1;
    font-size: 87.5%;
    color: #3e3e3e;
    background: white;
		margin: 0;
		padding: 0;
		text-align: left;
		font-family: 'Lucida Sans Unicode', 'Lucida Grande', verdana, sans-serif;
		color: #333
	}

/* Headers */
	h2 {font-size: 171.42%; font-family: 'trebuchet ms', helvetica, tahoma, sans-seri; margin-bottom: .8em}
	h3 {font-size: 142.85%; color: #2977ee; margin-bottom: .8em}
	h4 {font-size: 128.57%; color: #2977ee; margin-bottom: .8em}
	h5 {font-size: 114.28%; color: #2977ee; margin-bottom: .8em}
	h6 {font-size: 100%; color: #2977ee; margin-bottom: .8em}
	
	h2.section-head {color: #2977ee; text-decoration: underline}
	
/* Links */
	a {outline: 0}
	a img {border: 0px; text-decoration: none}
	a:link, a:visited {text-decoration: underline; color: #2977ee}
	a:hover, a:active {color: #3e3e3e}
	
/* Paragraphs */
	p {
    margin-bottom: 1.3em;
    line-height: 1.4;
    text-align: left
	}
	
	strong, b {font-weight: bold}
	em, i {font-style: italic}
	
	.styled-image {border: 1px solid #aeccf9; background: #e3eefd; padding: 5px; margin: 0 auto 1.5em auto; display: block}
	
	blockquote {
    margin: 1.5em 3em;
    display: block;
    border: 1px solid #aeccf9;
    background: #e3eefd;
    padding: 1.5em 1.5em .5em 1.5em;
    font-size: 92.85%
  }

/* Lists */
ul {
  margin: 1em 0 1.5em 2em;
  line-height: 1.5;
  list-style: disc outside url('../images/list-bullet.gif')
}

ol {
  margin: 1em 0 1.5em 2.5em;
  line-height: 1.5;
  list-style: outside decimal
}

/* Tables */
table {width: 98%; margin: 1.5em auto; border: 1px solid #333}

thead th {background: #333; color: #fff; text-align: left; padding: .5em .4em}

tbody td {padding: .5em .4em}
tbody .alt td {background: #E9F2FE}

/* Clears */
#body:after, #post-list li:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  height: 0
}

/***** Layout *****/
/* Navigation */
#navigation {
  background: #262626;
  color: #ededed;
  font-weight: bold;
  font-size: 92.85%;
  margin: 0;
  padding: 0;
  height: 51px;
  line-height: 51px;
  list-style: none;
  text-align: center
}

#navigation li {display: inline; margin: 0 1.5em}
#navigation a:link, #navigation a:visited {text-decoration: none; color: #ededed}
#navigation a:hover, #navigation a:active, #navigation .active a:link, #navigation .active a:visited {text-decoration: underline}

/* Logo */
#logo {margin: 35px auto 60px auto; display: block; width: 413px; height: 86px; overflow: hidden}

#logo a {display: block; width: 413px; height: 51px}
#logo a:hover, #logo a:active {margin-top: -86px}

/* Body */
#body {
  width: 815px;
  margin: 0 auto;
  border-top: 1px solid #ddd;
  padding: 20px 0
}

  /* Content */
  #content {width: 580px; float: left; margin: 0 45px 0 0}
  
  #content h2.section-header {
    color: #fff;
    background: #2977ee;
    padding: 13px 18px;
    font-size: 128.57%;
    margin-bottom: 30px
  }
  
  #content h2.section-header a:link, #content h2.section-header a:visited {
    color: #fff;
    text-decoration: none
  }
  
  /* Sidebar */
  #sidebar {
    width: 190px;
    float: left;
    font-family: 'trebuchet ms', helvetica, tahoma, sans-serif
  }
  
  #sidebar ul {font-size: 107.14%; margin: 0 0 1.5em 1em}
  #sidebar ul li {margin: 0 0 .3em 0; padding: 0}
  
  #sidebar h2 {font-size: 128.57%; color: #2977ee; margin: 0 0 .7em 0; padding: 0}
  #sidebar h2 a:link, #sidebar h2 a:visited {color: #2977ee}
  #sidebar h2 a:hover, #sidebar h2 a:active {color: #262626}
  
  #sidebar a:link, #sidebar a:visited {color: #4e4e4e}
  #sidebar a:hover, #sidebar a:active {color: #2977ee}
  
  /* Search Box */
  #search-box {
    margin: 0 0 1.2em 0;
    overflow: hidden;
    height: 1%
  }
  
  #search-box .text {
    border: 1px solid #ddd;
    color: #b2b2b2;
    padding: 5px;
    font-size: 100%;
    font-family: 'trebuchet ms', helvetica, tahoma, sans-serif;
    width: 140px;
    display: block;
    float: left
  }
  
  #search-box .button {
    border: 0;
    padding: 0;
    margin: 0 0 0 5px;
    height: 30px;
    width: 33px;
    float: left;
    font-family: 'trebuchet ms', helvetica, tahoma, sans-serif;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    background: #4389f3;
    cursor: pointer
  }
  
  #search-box .button:hover {background: #262626}
  
  /* Subscribe Box */
  #subscribe-box {
    margin-bottom: 1.5em;
    font-family: 'Lucida Sans Unicode', 'Lucida Grande', verdana, sans-serif;
    font-size: 92.85%;
    border-width: 1px 0 1px 0;
    border-color: #ddd;
    border-style: solid;
    padding: 1em 0 1.3em 0
  }
  
  #rss-readers {margin-bottom: 1em; overflow: hidden; height: 1%}
  #rss-readers img {float: left; margin: 0 10px 0 0}
  
  #subscribe-box a:link, #subscribe-box a:visited {color: #2977ee}
  #subscribe-box a:hover, #subscribe-box a:active {color: #262626}
  
  /* Tweeter Box */
  #tweet-message {
    width: 170px;
    margin: 0 auto;
    background: url('../images/tweet-bg.gif') no-repeat top left;
    padding: 10px 10px 0 10px;
    font-size: 92.85%;
    color: #676767
  }
  
  #tweet-message p {margin: 0}
  
  #tweet-time {
    width: 190px;
    background: url('../images/tweet-end.gif') no-repeat top left;
    padding: 23px 0 5px 0;
    margin: 0 0 1.5em 0;
    color: #4e4e4e;
    font-size: 92.85%;
    height: 20px;
    line-height: 20px
  }
  
  #tweet-time span {
    display: block;
    background: url('../images/tweet.gif') no-repeat center left;
    padding: 0 0 0 28px;
    margin: 0 0 0 2px
  }
  
  #tweet-time a:link, #tweet-time a:visited {color: #2977ee}
  #tweet-time a:hover, #tweet-time a:active {color: #262626}

/* Footer */
#footer {
  width: 100%;
  clear: both;
  margin: 0 auto;
  color: #7c7c7c;
  background: #f4f4f4;
  padding: 1.4em 0;
  overflow: hidden
}

#footer div {width: 815px; margin: 0 auto}
#footer p {float: left; line-height: 30px; margin: 0}

#footer #rolled-logo {float: right; width: 133px; height: 30px; overflow: hidden}

#rolled-logo a:link, #rolled-logo a:visited {display: block; width: 133px; height: 30px}
#rolled-logo a:hover, #rolled-logo a:active {margin-top: -30px}
	
/***** Sections *****/
/* Post List */
#post-list {
    margin: 0 0 -35px 0;
    padding: 0;
    list-style: none
}

#post-list > li, #post {
  padding: 0 0 15px 0;
  margin: 0 0 35px 0;
  width: 100%;
  border-bottom: 1px solid #ddd
}

#post-list li {height: 1%}

#post {margin: 0 0 10px 0}

#post-list img.image {display: block; margin-bottom: 1.3em}

  /* Title */
  h2.title {margin: 0; padding: 0; line-height: 1}

  h2.title a:link, h2.title a:visited {color: #2977ee}
  h2.title a:hover, h2.title a:active {color: #262626}

  /* Meta */
  .meta {color: #a4a4a4; font-size: 85.71%; display: block; margin-bottom: 20px}
  #post .meta {margin-top: .25em; margin-bottom: 23px}
  .meta a:link, .meta a:visited {color: #787878}
  .meta a:hover, .meta a:active {color: #2977ee}

  /* Comments */
  .comments {
    display: block;
    text-align: right;
    clear: both;
    margin: 0 1em 0 0;
    font-family: 'trebuchet ms', helvetica, tahoma, sans-serif;
    font-size: 114.28%
  }

  .comments a:link, .comments a:visited {color: #2977ee; font-weight: bold}
  .comments a:hover, .comments a:active {color: #262626}
  
  /* Posts Navigation */
  .posts-navigation {
    clear: both;
    margin: 0 auto;
    width: 100%;
    padding: 10px 0;
    overflow: hidden
  }
  
  .posts-navigation a:link, .posts-navigation a:visited {
    display: block;
    color: #fff;
    background: #4389f3;
    font-family: 'trebuchet ms', helvetica, tahoma, sans-serif;
    font-weight: bold;
    padding: 0 10px;
    height: 33px;
    line-height: 33px;
    text-decoration: underline
  }
  .posts-navigation a:hover, .posts-navigation a:active {background: #262626}
  
  .posts-navigation .older {float: left}
  .posts-navigation .newer {float: right}
  
  .posts-navigation .older a {float: none !important; float: left}
  .posts-navigation .newer a {float: none !important; float: right}
  
  /* Download Boxes */
  a.download:link, a.download:visited {
    display: block;
    background-color: #e3eefd;
    padding: 15px 25px 25px 100px;
    border: 1px solid #aecff9;
    color: #333;
    text-decoration: none;
    line-height: 1.3;
    position: relative;
    background-repeat: no-repeat;
    background-position: 10px center;
    margin-bottom: 1.3em
  }
  a.download:hover, a.download:active {border: 1px solid #222; background-color: #333; color: #fff; background-position: -640px center}
  
  a.download strong {display: block; font-size: 128.57%; font-weight: normal; margin-bottom: .6em; border-bottom: 1px solid #999; padding-bottom: .2em}
  a.download:hover strong, a.download:active strong {border-color: #999}
  
  a.download span {margin-bottom: .2em; display: block}
  a.download em {font-size: 76.92%; color: #777; display: block}
  
    /* Icons */
    .download.wordpress {background-image: url('../images/download-icons/wordpress-logo.gif')}
    .download.code-igniter {background-image: url('../images/download-icons/code-igniter-logo.gif')}
    .download.expression-engine {background-image: url('../images/download-icons/expression-engine-logo.gif')}
    .download.generic {background-image: url('../images/download-icons/generic-logo.gif')}
  
/* Comments List */
#comments-list {margin: 0; padding: 0; list-style: none; font-size: 92.85%; list-style-image: none; list-style-type: none}
#comments-list li {
  background: #efefef;
  padding: 5px 11px 8px 11px;
  margin: 0 0 11px 0;
  clear: both;
  overflow: hidden;
  height: 1%;
  color: #5d5d5d
}

#comments-list li.author {background: #575757; color: #d7d7d7}

#comments-list blockquote {
  margin: 0;
  border: 0;
  background: none;
  padding: 0;
  font-size: 100%
}

#comments-list a img {float: left; margin: 0 13px 0 0; border: 3px solid #e6e8e7}
#comments-list .author a img {border: 3px solid #636365}

#comments-list a:link, #comments-list a:visited {color: #2b77ef}
#comments-list a:hover, #comments-list a:active {text-decoration: none}

#comments-list .comment {float: left; width: 480px}
#comments-list .comment p {margin-bottom: .5em}
#comments-list .comment cite {display: block; color: #262626; margin-bottom: .5em}
#comments-list .author .comment cite {color: #fefefe}

#comments-list .comment .date {
  display: block;
  font-size: 76.92%;
  font-family: verdana, arial, serif
}

#comments-list .author .comment a:link, #comments-list .author .comment a:visited {color: #81b2fe}
#comments-list .author .comment a:hover, #comments-list .author .comment a:active {text-decoration: none}

/* Comments Form */
#add-comment {
  border-top: 1px solid #ddd;
  margin: 2em 0;
  padding: 1em 0
}

#add-comment h2 {
  font-size: 142.85%;
  color: #2977ee;
  margin-bottom: .5em
}

#add-comment textarea {
  border: 1px solid #bbb;
  color: #666;
  width: 560px;
  height: 150px;
  padding: 5px;
  font-family: 'helvetica neue', helvetica, arial, sans-serif;
  font-size: 100%;
  margin-bottom: 1em
}

#add-comment label {line-height: 2.5}
#add-comment h2 label {line-height: 1.4}
#add-comment .button {margin-top: 1em}

/* Work List */
#past-work-list {margin: 0; padding: 0; list-style: none; list-style-image: none; list-style-type: none}
#past-work-list li {
  border-top: 2px dashed #e6e6e6;
  padding: 20px 0;
  overflow: hidden;
  height: 1%;
  color: #3e3e3e
}

#past-work-list p {margin: 0}

#past-work-list a img {border: 3px solid #ddd; float: left; margin: 0 18px 0 0; display: block}

#past-work-list .info {float: left; width: 345px}

#past-work-list .info h3 {color: #262626; font-size: 128.57%; margin-bottom: .3em}

/* Tag Cloud */
.wp-tag-cloud {margin: 0 0 3.5em 0; padding: 0; list-style: none; list-style-image: none; list-style-type: none; text-align: center}

.wp-tag-cloud li {display: inline; margin: 0 .3em}

.wp-tag-cloud a:link, .wp-tag-cloud a:visited {color: #3e3e3e}
.wp-tag-cloud a:hover, .wp-tag-cloud a:active {color: #2977ee}

/* Archives By Date */
#archives-per-month, #archives-per-month ul {margin: 0; padding: 0; list-style: none; list-style-image: none}
#archives-per-month ul {margin: 0 0 2em 0; height: 1%; overflow: hidden}

#archives-per-month h3 {font-size: 128.57%; font-weight: bold; margin: 0 0 .5em 0; color: #262626}

#archives-per-month ul li {margin: 0 0 .5em 0}
#archives-per-month ul li strong {color: #a4a4a4; font-size: 85.71%; font-style: normal; font-weight: normal; display: block; width: 40px; float: left}
#archives-per-month ul li h4 {margin: 0 0 -.3em 0}

/* 404 error page */
#error-404 {width: 630px; margin: 8em auto 0 auto}
#error-404 img {float: left; margin: 0 15px 0 0}

#error-message {float: left; width: 298px; margin: 1.5em 0 0 0}
#error-message h1 {font-size: 171.42%; color: #000; margin-bottom: .5em}

/* Contact Me Page */
.contact-columns {overflow: hidden; height: 1%; margin-top: 1.7em; border-bottom: 1px solid #ddd}
.contact-column {width: 50%; float: right; margin: 0 0 .2em 0}
.contact-column.left {width: 40%; float: left; clear: left}

.contact-column ul {lmargin-bottom: 0}
.contact-column h3 {margin: 0 0 1.45em 0; padding: 0; color: #333; font-size: 100%; font-weight: bold}

.addthis_container { padding-bottom: 15px; }