/*
 * Rule Order:
 * display
 * position
 * float
 * clear
 * width
 * height
 * margin
 * padding
 * overflow
 * list-style
 * border
 * background
 * color
 * font
 * text-decoration
 * text-align
 * vertical-align
 * white-space
 */
 
/*******************************************************************************
  Imported StyleSheets
*******************************************************************************/
@import 'common.css';



/*******************************************************************************
  General Styles
*******************************************************************************/

a {
   color:#333399;
}

a:hover {
   color:#7DAE12;
}

code {
   font-size:1.2em;
}

dl {
   margin : 1em 0 1em 0;
}

dt {
   padding-left:20px;
   background: 0 center url('/img/bullet_orange.png') no-repeat;
}

dd {
   margin : 0.25em 0 1em 20px;
}

.left_col {
   float:left;
   width:48%;
   text-align:left;
}

.right_col {
   float:right;
   width:48%;
   text-align:left;
}

/*******************************************************************************
  Main Structure
*******************************************************************************/

body {
   background: #EEEEEE;
   font-size:100%;
   color  : #333333;
   font-family:"Trebuchet MS";
}

#page {
   position:relative;
   background: #FFFFFF;
   font-size:.8em;
   width:782px;
   margin:0 auto;
   border-left:1px solid #1A4E88;
   border-right:1px solid #1A4E88;
}

#header {
   background: #4A7EB8 url(/img/header.png) repeat-x;
   position:relative;
   padding:20px;
   color: #FFFFFF;
}

#site_name {
   font-size:250%;
   font-weight:bold;
}

#content {
   padding:20px 20px 20px 20px;
   width:480px;
   float:left;
}

#content.nosidebar {
   padding:2em;
   width:auto;
}

#sidebar {
   float:right;
   width:215px;
   padding:20px;
}

#footer {
    padding:10px 20px 10px 20px;
    clear:both;
    background: #1A4E88;
    color:#ffffff;
}


/*******************************************************************************
  Navigation Bar
*******************************************************************************/

#nav {
   background : #1A4E88;
}

#nav ul {
   list-style : none;
}

#nav li {
   display : inline;
}

#nav li a {
   float           : left;
   padding         : 10px 10px 10px 32px;
   text-decoration : none;
   color           : #FFFFFF;
}
	
#nav li a:hover {
   color            : #FFFFFF;
   background-color : #4A7EB8;
}
	
#nav li a.active {
   color : #FFFFFF;
}

#nav li a img {
   border : none;
   float  : left;
}

#nav a.blog {
   background : #1A4E88 10px center url('/img/blog.png') no-repeat;
}

#nav a.projects {
   background : #1A4E88 10px center url('/img/projects.png') no-repeat;
}

#nav a.library {
   background : #1A4E88 10px center url('/img/library.png') no-repeat;
}

#nav a.links {
   background : #1A4E88 10px center url('/img/links.png') no-repeat;
}

#nav a.about {
   background : #1A4E88 10px center url('/img/vcard.png') no-repeat;
}

#nav a.email {
   background : #1A4E88 10px center url('/img/email.png') no-repeat;
}

#nav a.feed {
   background : 10px center url('/img/feed.png') no-repeat;
   padding-left:25px;
}

#nav a.feed:hover {
   background-color:transparent;
}


/*******************************************************************************
  Sidebar
*******************************************************************************/

#sidebar h2 {
   font-size:1.35em;
}

#sidebar div.header {
   border:1px solid #1A4E88;
   margin-bottom:0.75em;
}

#sidebar div.header h3 {
   font-size:1.1em;
   padding:0.25em 1em 0.25em 0.5em;
   border:1px solid #8CA5C6;
   background: #1A4E88 url(/img/sidebar_header.png) repeat-x;
   color:#ffffff;
}

#sidebar ul {
   margin-bottom:2em;
   margin-left:1em;
   list-style-type:none;
   
}

#sidebar ul li {
   margin-bottom:0.25em;
   padding-left:20px;
   background:0 1px url('/img/bullet_orange.png') no-repeat;
}


/*******************************************************************************
  Footer
*******************************************************************************/

#footer a {
   color:#ffffff;
}

#footer #text-nav {
   margin-bottom:0.5em;
}

/*******************************************************************************
  Posts
*******************************************************************************/

div.post {
   padding-bottom:20px;
   margin-bottom:20px;
   border-bottom:1px solid #c0c0c0;
   text-align: justify;
}

div.post p.post_nav {
   margin-bottom:10px;
}

div.post p.post_nav span.next {
   float:right;
}

div.post p.post_nav span.previous a {
   background: 0 center url('/img/previous.png') no-repeat;
   padding-left:15px;
}

div.post p.post_nav span.next a {
   background: right center url('/img/next.png') no-repeat;
   padding-right:15px;
}

div.post div.date {
   float:left;
   width:4em;
   height:3.8em;
   margin-right:15px;
   border:1px solid #e9e9e9;
   background:#F36D29 url('/img/date_bg.png') no-repeat;
   text-align:center;
}

div.post div.date span.month {
   display:block;
   margin-top:2px;
   color:#FFD7C2;
   font-weight:bold;
}

div.post div.date span.day {
   display:block;
   margin-top:-4px;
   color:#ffffff;
   font-family:Georgia;
   font-size:2em;
}

div.post p.details {
   margin-bottom:20px;
   text-align:left;
}

div.post span.category a,
div.post span.comments a {
   padding-left:15px;
   margin-right:1em;
}

div.post p.details span.category a {
   background: 0 center url('/img/category.png') no-repeat;
}

div.post p.details span.comments a {
   background: 0 center url('/img/comment.png') no-repeat;
}

div.post h1 {
   font-size:1.7em;
   padding-bottom:0.25em;
}

div.post h1.page {
   padding-bottom:0.5em;
}

div.post .entry {
   line-height: 1.4em;
}

div.post .entry h2 {
   font-size:1.3em;
   padding-bottom:0;
   margin : 1em 0 0 0;
}

div.post .entry h3 {
   font-size:1.25em;
   padding-bottom:0;
   margin : 1em 0 0 0;
}

div.post .entry p {
   margin : 10px 0 0 0;
}

div.post .entry ul {
   margin-bottom:0;
   padding-top:0.5em;
   list-style-type:none;
   list-style-position:inside;
}

div.post .entry ul li {
   padding-left:20px;
   padding-bottom:0.5em;
   background:0 1px url('/img/bullet_orange.png') no-repeat;
}

div.post .entry ul.compact {
   margin-bottom:15px;
}

div.post .entry ul.compact li {
   padding-bottom:0;
}

div.post .entry hr {
   border:none;
   border-bottom:1px  dotted #c0c0c0;
}

div.post .entry blockquote {
   margin:1em;
   padding-left: 1.5em;
   border-left: 5px solid #dddddd;
   color:#777777;
}

div.post .entry img.left {
   float:left;
   margin:10px 20px 10px 0;
   padding:5px;
   border:1px solid #1A4E88;
}

div.post .entry img.right {
   float:right;
   margin:10px 0 10px 20px;
   padding:5px;
   border:1px solid #1A4E88;
}

div.post .ad {
   margin-top : 20px;
}


div.post .entry div.section {
   border:1px solid #1A4E88;
   margin-bottom:0.75em;
}

div.post .entry div.section h2 {
   font-size:1.1em;
   margin:0;
   padding:0.25em 1em 0.25em 0.5em;
   border:1px solid #8CA5C6;
   background: #1A4E88 url(/img/sidebar_header.png) repeat-x;
   color:#ffffff;
}

div.post .entry table {
   margin : 1em 0 0em 0;
}

div.post .entry table.small {
   font-size:90%;
}

div.post .entry table th {
   padding : 2px  .5em 2px .5em;
   background:#c0c0c0;
}

div.post .entry table td {
   padding : 2px  .5em 2px .5em;
}


/*******************************************************************************
  Comments
*******************************************************************************/

#comments {
   padding-top:20px;
   padding-bottom:1px;
   border-top:2px solid #1A4E88;
   background:#EEEEEE;
}

#comments ol {
   list-style-type: square;
}

#comments li {
   font-weight:bold;
   margin-left:20px;
}

#comments li div.comment_text {
   background: #ffffff url('/img/comment_bg.png') no-repeat;
   margin:5px 20px 20px 20px;
   padding:20px 10px 10px 10px;
   font-weight:normal;
}

#comments li .comment_text img {
   float:left;
   margin-right:10px;
}

#comments h3 {
   font-size:1.25em;
   margin: 0 0 0 20px;
   padding:0;
}

#frm_comment {
   margin-top:5px;
   padding:5px 20px 10px 20px;
}

#frm_comment p {
   margin-bottom:1em;
}

#frm_comment label {
   float:left;
   width :7em;
}

#frm_comment textarea {
   width:75%;
}

#frm_comment button {
   padding:3px 1em 3px 1em;
}

/*******************************************************************************
  Projects Page
*******************************************************************************/

div.shelf {
   margin-top:1.5em;
}

div.shelf div.project {
   width:48%;
   text-align:left;
}

div.shelf div.project img {
   float:left;
   margin-right:10px;
   border:1px solid #778899;
}

div.shelf div.project p {
   margin: 0 0 10px 0;
}


/*******************************************************************************
  About Page
*******************************************************************************/

#about {
   margin : 1em 0 1em 1em;
}

#skill-cloud {
   margin-bottom : 2em;
}

#skill-cloud span {
   margin-right:5px;
   white-space:nowrap;
}

#skill-cloud span.size7 { font-size: 0.9em }
#skill-cloud span.size6 { font-size: 1.3em }                         
#skill-cloud span.size5 { font-size: 1.7em }                         
#skill-cloud span.size4 { font-size: 2.1em }                         
#skill-cloud span.size3 { font-size: 2.5em }                         
#skill-cloud span.size2 { font-size: 2.9em }                         
#skill-cloud span.size1 { font-size: 3.3em }                         
#skill-cloud span.size7c { font-size: 0.9em; color: #69c }           
#skill-cloud span.size6c { font-size: 1.2em; color: #69c }           
#skill-cloud span.size5c { font-size: 1.5em; color: #69c }           
#skill-cloud span.size4c { font-size: 1.8em; color: #369 }           
#skill-cloud span.size3c { font-size: 2.1em; color: #c95000 }        
#skill-cloud span.size2c { font-size: 2.4em; color: #c95000 }        
#skill-cloud span.size1c { font-size: 2.7em; color: #c95000 }        
#skill-cloud span.size1c { font-size: 2.7em; color: #c95000 }        


/*******************************************************************************
  Links Page
*******************************************************************************/

#links {
   margin-bottom:0 !important;
}

#links li{
   padding-bottom:0.75em;
}

#links span.category,
#links span.date {
   padding-left:15px;
   margin-right:1em;
   font-size:0.85em;
}

#links span.category {
   background: 0 center url('/img/category.png') no-repeat;
}

#links span.date {
   background: 0 center url('/img/date.png') no-repeat;
}


/*******************************************************************************
  Library Page
*******************************************************************************/

div.bookshelf {
   margin-top:20px;
   margin-bottom:20px;
   padding-bottom:20px;
   border-bottom:1px solid #c0c0c0;
}

div.last {
   margin-bottom:0;
   padding-bottom:0;
   border-bottom:none;
}

div.bookshelf div.book {
   width:48%;
   text-align:left;
}

div.bookshelf div.book img {
   float:left;
   border:1px solid #778899;
   margin-right:15px;
}

div.bookshelf div.book h3 {
   margin: 0 0 10px 0;
}

div.bookshelf div.book p {
}

