/*   
Theme Name: TenTonne
Theme URI: http://www.tentonnebaby.com
Description: Custom theme for tentonnebaby.com
Author: Oli
Author URI: http://www.tentonnebaby.com
Version: 1.0
*/

/*===============================================================================================*
 * Revert browser default styles
 *===============================================================================================*/   
:link,:visited { text-decoration:none }
ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }
a img,:link img,:visited img { border:none }
address { font-style:normal }

/*===============================================================================================*
 * Overall layout
 *===============================================================================================*/   
body {
    font-size: 82%;
    color: #3F3F3F;
    font-family: verdana, sans-serif}

a {
    color: #BD0000}

a:hover, a:focus {
    text-decoration: underline}
    
h1, h2, h3, h4, h5 {
    font-family: Arial, Sans-Serif;
    font-weight: normal}
        
.structure {
    position: absolute;
    left: -9999px}

.clear {
    clear: both}
           
#wrapper {
    position: relative;
    width: 897px;
    min-height: 1100px;
    padding-bottom: 500px;
    margin: 30px auto 0;
    background: url(images/sidebar/strip.gif) repeat-y 603px 0} 

/*===============================================================================================*
 * Header
 *===============================================================================================*/   
#header {
    position: relative;
    height: 421px;
    background: url(images/header.jpg) no-repeat top left}
   
#header h2 a {
    display: block;
    width: 272px;
    height: 74px;
    background: url(images/brand.gif) no-repeat top left;
    overflow: hidden;
    text-indent: -9999px;
    position: absolute;
    top: 60px;
    right: 60px}
    
#header p {
    width: 135px;
    height: 18px;
    background: url(images/strapline.gif) no-repeat top left;
    overflow: hidden;
    text-indent: -9999px;
    position: absolute;
    top: 155px;
    right: 60px}    

/*===============================================================================================*
 * Nav
 *===============================================================================================*/       
#nav {
    position: absolute;
    top: 298px;
    right: 20px}    
    
#nav li {
    float: left;
    margin-right: 20px}
    
#nav a {
    display: block;
    height: 30px;
    overflow: hidden;
    text-indent: -9999px;
    background-position: 0 7px;
    background-repeat: no-repeat}

#nav .current a,
#nav a:hover,
#nav a:focus {
    background-position: 0 -30px;
    height: 62px}    
    
#navHome a {
    background-image: url(images/nav/home.gif);
    width: 56px}        
    
#navArchive a {
    background-image: url(images/nav/archive.gif);
    width: 77px}            
    
#navTags a {
    background-image: url(images/nav/tags.gif);
    width: 53px}            

#navNews a {
    background-image: url(images/nav/news.gif);
    width: 51px}            
        
#navPortfolio a {
    background-image: url(images/nav/portfolio.gif);
    width: 97px}
    
#navAbout a {
    background-image: url(images/nav/about.gif);
    width: 62px}
    
#navContact a {
    background-image: url(images/nav/contact.gif);
    width: 80px}    

#navLinks a {
    background-image: url(images/nav/links.gif);
    width: 52px}    
    
/*===============================================================================================*
 * Main content layout
 *===============================================================================================*/           
#main {
    width: 520px;
    float: left;
    margin: 0 0 0 38px}     

#main h1 {
    font-size: 1.9em;
    margin-bottom: 0.8em}

#main h1 em {
    color: #727272}

#main p {
    line-height: 1.4em;
    margin: 0.8em 0}
    
/*===============================================================================================*
 * Post styles
 *===============================================================================================*/           
.post {
    margin-bottom: 40px}
    
#main .post h1, 
#main .post h2 {
    font-size: 1.9em;
    margin-bottom: 0.2em}

.post .content {
    margin-bottom: 0.7em}

.post .meta {
    margin-top: 20px;
    background: #f3f3f3;
    padding: 10px 20px;
    font-size: 0.8em;
    color: #828282;
    border: solid 1px #e6e6e6;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px}        

.post .meta div {
    clear: left;
    margin-bottom: 0.5em}
        
.post .meta h3 {
    display: block;
    float: left;
    width: 70px;
    text-align: right;
    font-weight: bold;
    margin-right: 5px}

#main .post .meta p {
    display: inline;
    line-height: normal}

.post .meta a {
    color: #3F3F3F;
    font-style: italic}    

.post .meta a:hover,
.post .meta a:focus {
    color: #BD0000}    

.post ul,
.post ol {
    margin-left: 10px}
    
.post li {
    margin: 0.8em 0;
    background: url(images/bullet.gif) no-repeat 0 0;
    padding-left: 25px}
    
/*===============================================================================================*
 * Comment styles
 *===============================================================================================*/           
#comments h2 {
    font-size: 1.6em;
    margin: 1em 0 0.2em}

#comments ol {
    margin: 25px 0 30px 50px}
    
#comments li {
    position: relative;
    padding: 0 20px 10px 70px;
    font-size: 0.8em;
    min-height: 80px;
    color: #5a5a5a;
    background: #f3f3f3;
    border: solid 1px #e6e6e6;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px;
    margin: 15px 50px 20px 0}
    
#comments .thumb {
    position: absolute;
    top: 10px;
    left: 10px}

#comments .thumb img {
    border: solid 1px #dcdcdc}

#comments .meta {
    font-style: italic;
    color: #646464}

/*===============================================================================================*
 * Archive styles
 *===============================================================================================*/           
#archive {
    margin-left: 10px}
    
#archive li {
    margin: 0.8em 0;
    background: url(images/bullet.gif) no-repeat left center;
    padding-left: 25px}

/*===============================================================================================*
 * Blogroll
 *===============================================================================================*/           
#links h2 {
    font-size: 1.7em;
    margin: 1em 0 0.2em}
    
#links li li {
    margin: 0.8em 0;
    background: url(images/bullet.gif) no-repeat left center;
    padding-left: 25px}

/*===============================================================================================*
 * News
 *===============================================================================================*/           
#main .twitter {
    width: 400px;
    margin-bottom: 30px}
    
#main .twitter-item {
    margin: 0.8em 0;
    line-height: 1.5em;
    background: url(images/bullet.gif) no-repeat 0 1px;
    padding-left: 25px}

#main .twitter-timestamp {
    display: block;
    font-size: 0.8em;
    color: #8b8b8b}
    
/*===============================================================================================*
 * Sidebar
 *===============================================================================================*/           
#sidebar {
    width: 293px;
    float: right;
    display: inline;
    margin-right: 5px}

#sidebar div {
    min-height: 70px;
    padding: 9px 25px 40px;
    background: url(images/sidebar/blockStd.gif) no-repeat top left}
    
#sidebar .block1 {
    min-height: 95px;
    padding: 28px 25px 10px;
    background: url(images/sidebar/block1.gif) no-repeat top left}

#sidebar .block2 {
    min-height: 80px;
    padding: 29px 25px 0;
    background: url(images/sidebar/block2.gif) no-repeat top left}        

#sidebar .block3 {
    min-height: 126px;
    padding: 33px 25px 10px;
    background: url(images/sidebar/block3.gif) no-repeat top left}        

#sidebar h3 {
    overflow: hidden;
    text-indent: -9999px;
    background-repeat: no-repeat;
    background-position: top left;
    margin-bottom: 15px}

#sidebar p {
    line-height: 1.4em;
    margin: 0.5em 0}

#sidebar ul {
    margin: 20px 0 10px}
    
#sidebar li {
    margin: 0.7em 0}
    
/* headings */        
#sidebar .currently {
    background-image: url(images/sidebar/subheadCurrently.gif);
    width: 128px;
    height: 25px}

#sidebar .tags {
    background-image: url(images/sidebar/subheadTags.gif);
    width: 39px;
    height: 24px}

#sidebar .contact {
    background-image: url(images/sidebar/subheadGetInTouch.gif);
    width: 103px;
    height: 25px;
    margin-left: 8px}

#sidebar .categories {
    background-image: url(images/sidebar/subheadCategories.gif);
    width: 89px;
    height: 24px}

#sidebar .similar {
    background-image: url(images/sidebar/subheadSimilar.gif);
    width: 113px;
    height: 25px}

#sidebar .recent {
    background-image: url(images/sidebar/subheadRecent.gif);
    width: 108px;
    height: 25px}

/* tag cloud */
.wp-tag-cloud {
    line-height: 2em}
    
.wp-tag-cloud li {
    display: inline;
    margin-right: 8px}

/* sites */
#sites li {
    display: inline}                        

#sites .email {
    display: block}    
    
/*===============================================================================================*
 * Footer
 *===============================================================================================*/           
#footer {
    clear: both;
    height: 450px;
    width: 900px;
    background: white url(images/footer.jpg) no-repeat 6px 0;
    position: absolute;
    bottom: 0;
    left: 0}