﻿.site-id {
    height      : 75px;
    width       : 454px;
    background  : url(site-id.gif) 20px 10px no-repeat;
    float       : left;
    display     : block;
}

.twitter {
    float       : right;
    background  : url(twitter-background.jpg) top left no-repeat;
    height      : 261px;
    width       : 255px;
}

.twitter .message {
    padding     : 65px 0 0 60px;
    width       : 170px;
    text-align  : justify;
    color       : #fff;
    font-size   : 0.85em;
    font-weight : bold;
    font-family : sans-serif;
}

.twitter .message td {
    vertical-align : middle;
    height      : 80px;
}

.twitter .message a { color : #ffde00; }
.twitter .message a:hover { color : #fff196; }

.twitter .detail {
    text-align  : right;
    font-size   : 0.85em;
    color       : #fff600;
    padding     : 0 25px 0 120px;
    height      : 56px;
    font-family : sans-serif;
    font-style  : italic;
    font-weight : bold;
}

.twitter .follow {
    padding     : 0 21px 0 0;
}

.twitter .follow a {
    display     : block;
    float       : right;
    background  : url(twitter-follow.gif) top right no-repeat;
    height      : 42px;
    width       : 80px;
}

.projects {
    clear       : left;
    background  : url(projects-background.jpg) top left no-repeat;
    height      : 186px;
    width       : 501px;
    overflow    : hidden;
}

.projects-container {
    padding     : 57px 0 0 20px;
}

.project-icons {
    height      : 80px;
}

.project-icon {
    float       : left;
    height      : 70px;
    width       : 155px;
}

.project-icon a {
    display     : block;
    height      : 70px;
    width       : 155px;
    background  : no-repeat center;
}

.project-detail {
    padding     : 0 15px 0 10px;
    font-weight : bold;
    font-size   : 0.9em;
}

.project-tip {
    color       : #fff;
    float       : left;
    width       : 350px;
    text-align  : center;
}

.project-all {
    color       : #53d9ff;
    float       : right;
    display     : block;
    margin      : 0 0 0 15px;
}

.project-all:hover { color : #a2ff50; }

.project-jlinq a { background-image : url(../logos/jlinq.png); }
.project-nkrypt a { background-image : url(../logos/nkrypt.png); }
.project-mvcwebforms a { background-image : url(../logos/mvcwebform.png); }
.project-custom-webmail a { background-image : url(../logos/custom-webmail.png); }
.project-cobaltmvc a { background-image : url(../logos/cobaltmvc.png); }

.blog-header {
    background  : url(blog-header-background.jpg) top left no-repeat;
    height      : 67px;    
}

ul.tabs {
    float       : right;
    margin      : 0;
    padding     : 0;
    height      : 67px;
    width       : 380px;
    list-style  : none;
}

ul.tabs li {
    display     : block;
    float       : left;
    margin      : 0;
    padding     : 0;
}

ul.tabs li a {
    display     : block;
    height      : 54px;
    background  : 0 0 no-repeat
}

ul.tabs li a:hover {
    background-position : 0 -54px;
}

ul.tabs a.about {
    background-image : url(tab-about.gif);
    width       : 66px;
}

ul.tabs a.projects {
    background-image : url(tab-projects.gif);
    width       : 82px;
}

ul.tabs a.resume {
    background-image : url(tab-resume.gif);
    width       : 80px;
}

ul.tabs a.contact {
    background-image : url(tab-contact.gif);
    width       : 106px;
}

.blog-tabs {
    padding     : 0 0 0 246px;
}

.blog-subscribe {
    display     : block;
    background  : url(blog-subscribe.gif) top left no-repeat;
    height      : 46px;
    width       : 104px;
    float       : left;
    position    : relative;
    top         : 13px;
}

.blog-post {
    width       : 718px;
    padding     : 10px 0 60px 0;
}

.blog-post-extra {
    padding-top : 30px;
    background  : url(post-split.jpg) top left repeat-x;
}

.post-detail {
    float       : left;
    padding     : 0;
    width       : 580px;
}

.post-detail a:hover { text-decoration : underline; }

.post-summary {
    padding     : 10px;
    margin      : 0 10px;
    border-top  : 1px dotted #4c6353;
    clear       : both;
}

.post-summary .tags {
    font-weight : bold;
    padding     : 0 0 3px 0;
    float       : right;
    width       : 300px;
}

.post-summary .info {
    float       : left;
}

.post-summary .info ul {
    margin      : 0;
    padding     : 0 0 0 15px;
    list-style  : none;
}

.post-summary .info li {
    margin      : 0;
    padding     : 5px 0 5px 25px;
    background  : left no-repeat;
}

.post-summary .info li.read {
    background-image : url(../icons/action_go.gif);
}

.post-summary .info li.comments {
    background-image : url(../icons/comment.gif);
}


.post-summary .tags .list {
    font-size   : 0.9em;
}

.post-summary .tags a:hover { color : #50d0ff; }
.post-summary .tags a { color : #a2ff50; }

.post-content {
    clear       : both;
}

.date-container {
    height      : 62px;
    width       : 62px;
    background  : url(date-container.gif) top left no-repeat;
    float       : left;
    margin      : 0 20px;
}

.date-container-first {
    background-image : url(date-container-first.gif)
}

.date-container span {
    position    : absolute;
    background  : url(date-sheet.gif) no-repeat;
}

.date-container .day {
    display     : block;
    height      : 30px;
    width       : 42px;
    margin      : 26px 0 0 10px;
    background-position : 0 -166px;    
}

.date-container .month {
    display     : block;
    height      : 14px;
    width       : 24px;
    margin      : 5px 0 0 7px;
    background-position : 0 0;    
}

.date-container .year {
    display     : block;
    height      : 14px;
    width       : 23px;
    margin      : 5px 0 0 30px;
    background-position : 0 0;    
}

.date-container .day-1 { background-position : 0 -155px; }
.date-container .day-2 { background-position : 0 -187px; }
.date-container .day-3 { background-position : 0 -219px; }
.date-container .day-4 { background-position : 0 -251px; }
.date-container .day-5 { background-position : 0 -283px; }
.date-container .day-6 { background-position : 0 -315px; }
.date-container .day-7 { background-position : 0 -347px; }
.date-container .day-8 { background-position : 0 -379px; }
.date-container .day-9 { background-position : 0 -411px; }
.date-container .day-10 { background-position : 0 -443px; }
.date-container .day-11 { background-position : 0 -475px; }
.date-container .day-12 { background-position : 0 -507px; }
.date-container .day-13 { background-position : 0 -539px; }
.date-container .day-14 { background-position : 0 -571px; }
.date-container .day-15 { background-position : -47px -0px; }
.date-container .day-16 { background-position : -47px -32px; }
.date-container .day-17 { background-position : -47px -64px; }
.date-container .day-18 { background-position : -47px -96px; }
.date-container .day-19 { background-position : -47px -128px; }
.date-container .day-20 { background-position : -47px -160px; }
.date-container .day-21 { background-position : -47px -192px; }
.date-container .day-22 { background-position : -47px -224px; }
.date-container .day-23 { background-position : -47px -256px; }
.date-container .day-24 { background-position : -47px -288px; }
.date-container .day-25 { background-position : -47px -320px; }
.date-container .day-26 { background-position : -47px -352px; }
.date-container .day-27 { background-position : -47px -384px; }
.date-container .day-28 { background-position : -47px -416px; }
.date-container .day-29 { background-position : -47px -448px; }
.date-container .day-30 { background-position : -47px -480px; }
.date-container .day-31 { background-position : -47px -512px; }

.date-container .month-1 { background-position : 0 0; }
.date-container .month-2 { background-position : 0 -14px; }
.date-container .month-3 { background-position : 0 -28px; }
.date-container .month-4 { background-position : 0 -42px; }
.date-container .month-5 { background-position : 0 -56px; }
.date-container .month-6 { background-position : 0 -70px; }
.date-container .month-7 { background-position : 0 -84px; }
.date-container .month-9 { background-position : 0 -98px; }
.date-container .month-10 { background-position : 0 -112px; }
.date-container .month-11 { background-position : 0 -126px; }
.date-container .month-12 { background-position : 0 -140px; }
.date-container .month-8 { background-position : -24px -112px; }

.date-container .year-2009 { background-position : -24px 0; }
.date-container .year-2010 { background-position : -24px -14px; }
.date-container .year-2011 { background-position : -24px -28px; }
.date-container .year-2012 { background-position : -24px -42px; }
.date-container .year-2013 { background-position : -24px -56px; }
.date-container .year-2014 { background-position : -24px -70px; }
.date-container .year-2015 { background-position : -24px -84px; }
.date-container .year-2016 { background-position : -24px -98px; }
