/*
 * Ravelrumba Styles
 * Author: Rob Flaherty | rob@ravelrumba.com
 * Date: February 8, 2010
 */

/* Meyer 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}body{line-height:1;color:black;background:white}ol,ul{list-style:none}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:""""}

/* Fonts */
@font-face {
    font-family: 'LeagueGothicRegular';
    src: url('../fonts/League_Gothic.eot');
 	src: local('☺'), url('../fonts/League_Gothic.woff') format('woff'), url('../fonts/League_Gothic.ttf') format('truetype'), url('../fonts/League_Gothic.svg#LeagueGothic') format('svg');
}

/* Core */
html{ font-size:100%; } 
body { font-size: 62.5%; line-height: 1.5; overflow-y:scroll; color: #373e42; font-family: Georgia, "Times New Roman", Serif; background: #fff; border-top: 5px solid #3e474b;}
input, select, textarea { font-family: Georgia, "Times New Roman", Serif; font-size: 1em; }
:focus { outline: 1px; }
strong{ font-weight:bold; }
em { font-style: italic; }
hr { display: none; }
a img { border: none; } 
cite { font-style: normal; } 
code { background: #e4e7e8; padding: 0 3px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
blockquote { margin:0 0 24px 32px; border-left:7px solid #e4e7e8; padding-left:16px; }
blockquote p { margin:0 }
sup { vertical-align: super; font-size: smaller; }

/* Links */
a:link, a:visited, a:active { color: #373e42; text-decoration: underline; }
a:hover { color: #373e42; text-decoration:none; }

/* General */
#content, .inner { width: 960px; margin: 0 auto; overflow: hidden; position: relative;}
.main-column {  }
.left,.post-prev  { float: left; }
.right,.post-next { float: right; }
.half-left { width: 450px; float: left; }
.half-right { width: 450px; float: right; }
.alignright { margin: 0 0 16px 16px; float: right; display:block; }
.alignleft { margin: 0 16px 16px 0; float: left; display:block; }
.aligncenter { background: #e4e7e8; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 10px; margin: 0 auto; display:block; } 

/* Type */ 
h1 { font-size: 2.4em; margin-bottom: 0em; }
h3 { font-size: 2.4em; margin: 0; }
h4,h5 { font-size: 2.0em; }
p { font-size: 1.6em; margin: 0 0 1.5em; }

/* Header */
#header { padding: 20px 0 20px; margin: 0; position:relative; }
#logo { font-family: LeagueGothicRegular, Verdana, Arial, Sans-Serif; font-size:100px; text-transform:uppercase; float:left; line-height:1; bottom:0; vertical-align:bottom;}
#logo a { text-decoration: none; color: #373e42;
-webkit-transition: opacity .2s linear; 
   -moz-transition: opacity .2s linear;
     -o-transition: opacity .2s linear;
        transition: opacity .2s linear;
}
#logo a:hover { opacity: 0.7; }

/* Nav */
#nav { position: absolute; right:0; bottom:0; }
#nav li { float: left; margin: 0 0 0 15px; font-size: 3.0em; font-family: LeagueGothicRegular, Verdana, Arial, Sans-Serif; }
#nav li a { float: left; text-decoration: none; opacity: 1; 
-webkit-transition: opacity .2s linear; 
   -moz-transition: opacity .2s linear;
     -o-transition: opacity .2s linear;
        transition: opacity .2s linear;
}
#nav li a:hover{ opacity: 0.7; }

/* Post */
.post-header h1 { font-size: 30px; overflow: hidden; font-weight: bold; margin-bottom: 15px;  margin-top: 20px; width: 600px; } 
.main-column { overflow: hidden; width: 600px; }  
.post-title a{ text-decoration: none; }
.post-meta-wrap{ width: 185px; float: right; }
.post-meta { width: 161px; background: #e4e7e8; padding: 10px; color: #; clear: none; margin: 0 0 24px; text-shadow: rgba(255,255,255,.7) 0 1px 0;
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px;
        
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3); 
   -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
  
.post-meta p { margin: 0; }
.post-meta a { color: #3e474b; text-decoration: none; }
.post-navigation a { margin-right: 8px; }
.main-column ol,.main-column ul { margin: 0 0 24px; font-size: 1.6em; margin-left: 50px; }
.main-column ol li {  list-style-type: decimal; list-style-position: outside; }
.main-column ul li { list-style-type: disc; list-style-position: outside; }
.main-column .footnotes { margin: 0 0 24px; list-style-type:none; }
.main-column .footnotes sup { font-weight: bold; }
.comments-closed { background: #e4e7e8; padding: 10px; font-style: italic; 
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px;
} 
.main-column h5 { font-weight: bold; font-size: 18px; }
/* Search */
#search { width: 298px; background: #e4e7e8; padding: 10px; color: #3e474b;
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px;
        
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3); 
   -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
#search-text { font-size: 1.6em; border: 0; padding: 5px 5px 5px; color: #3e474b; width: 250px; margin: 0; float: left;}
#search-submit { background: url(../images/search-btn.png) no-repeat 0 1px; width: 30px; height: 30px; border: 0; text-indent: -9999em; cursor: pointer; margin: 0; float: right; }
#search label { position: absolute; left: -9999em; }

/* Homepage */  
.post { text-shadow: rgba(255,255,255,.8) 0 1px 0; }
.entry { overflow: hidden; margin: 0 0 40px; }
.hp-image { background: #e4e7e8; width: 200px; float: left; margin-right: 20px; text-align: center; padding: 10px; margin-bottom: 5px;
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px; 
        
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3); 
   -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
.hp-image img { display: block; }
.post-title { margin: 0; }
.post-title a:hover { opacity: 0.8; }
.post-title a:hover:after{ content: " \00bb"; }
.post-excerpt { width: 500px; float: left; }
.hp-post-right { width: 185px; float: right; }

/* Comments */ 
#comments-wrap { background: #e4e7e8; overflow: hidden; padding: 24px 0; text-shadow: rgba(255,255,255,.4) 0 1px 0; } 
#comments-wrap h4 { margin: 0; border-bottom: 2px dashed #c8ced1; padding-bottom: 24px; }
.comment { overflow: hidden; border-bottom: 2px dashed #c8ced1; padding: 24px 0 0; }
.comment-author { width: 250px; color: #3e474b; clear: none; float: left; margin-right: 30px;}
.comment-gravatar { float: left; margin-right: 10px; }
.comment-main { float: left; width: 650px;  }
.comment-author a { text-decoration: none; color: #3e474b; }
.commentlist { margin: 0 0 48px; }
#trackbacks .comment { }
.track-ping { font-size: 1.6em; margin: 0 0 1em; color: #3e474b; }
.track-ping a { color: #3e474b; }
#trackbacks ol { padding: 24px 0 0; margin-bottom: 48px; }
.commentlist pre { font-size: 16px; background-color: #e4e7e8; margin: 0 0 24px 0; overflow: auto; padding: 10px; 
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px;
} 

/* Comment Form */
#respond h4{ margin: 0 0 24px; }
#respond .text-input{ border: 0; padding: 5px; width: 225px; color: #3e474b;
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px;
}
#respond textarea{ border: 0; padding: 5px; width: 450px; color: #3e474b; overflow: auto; 
-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px; 
}
#respond label { display: block; }
.form-tip{ font-size: 0.90em; color: #3e474b; font-style: italic; padding-left: 10px; }
#commentform #submit { background: url(../images/send-btn.png) no-repeat; width: 70px; height: 37px; display: block; text-indent: -9999em; border: 0; margin: 0; padding: 0; cursor: pointer;}
#commentform #submit:active { background-position: 0 -37px; }

/* Footer */
#footer { background: #d1d6d9; overflow: hidden; padding: 20px 0; text-shadow: rgba(255,255,255,.4) 0 1px 0; }
#footer-left { width: 50%; float: left; }
#footer-right { width: 50%; float: right; }
#the-end { padding: 20px 0 0; background: #bfc6c9; color: #3e474b; text-shadow: rgba(255,255,255,.4) 0 1px 0;  }
#credits { float: left; font-size: 1.3em; }
#hosted{ float: right; font-size: 1.3em; }
#hosted span { float: left; margin: 0 10px 0 0; } 
#hosted a { display: block; width: 100px; height: 20px; background: url(../images/webfaction-logo.png) no-repeat 0 -25px; text-indent: -999em; float: left; margin-top: -2px; }
#hosted a:hover { background-position: 0 0;}
.bio { background: url(../images/me.jpg) no-repeat 0 0; padding: 0 0 20px 115px; }

/* Contact */
#contact-bar { background: #e4e7e8; overflow: hidden; padding: 16px 0;  text-shadow: rgba(255,255,255,.2) 0 1px 0; display: none; }
#contact-bar p{ line-height: 1; display: inline; margin-right: 0px; font-weight: 700; }
#contact-bar span { width: 19px; height: 18px; display: block; background: url(../images/close-x.png) no-repeat; position: absolute; right: 0px; top: 0px; cursor: pointer; }
#contact-list { font-size: 1.6em; }
#contact-bar a {  font-weight: 400;  }

/* Misc */ 
.navigation a, .post-navigation a, a.btn-link, #recent-posts li a { color:#3e474b; padding:5px 8px 6px 8px; text-decoration: none; text-shadow: rgba(255,255,255,.7) 0 1px 0; margin-right: 5px;
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #e4e7e8),color-stop(1, #dadfe1));
background-image: -moz-linear-gradient(top, #e4e7e8, #dadfe1);

-webkit-border-radius: 4px; 
   -moz-border-radius: 4px; 
        border-radius: 4px; 
        
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3); 
   -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
.navigation a:hover, .post-navigation a:hover, a.btn-link:hover, #recent-posts li a:hover { background: #dadfe1; text-shadow: rgba(255,255,255,.4) 0 1px 0;
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #dadfe1),color-stop(1, #e4e7e8));
background-image: -moz-linear-gradient(top, #dadfe1, #e4e7e8);

-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3); 
   -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
        box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
} 

/* Recent Posts */
#recent-posts { padding-top: 24px; }
#recent-posts li { list-style-type: none; font-size: 1.6em; }
#recent-posts li a { display: block; margin: 0 0 16px; width: 165px; }

/* 
Top border
Slow animation idea courtesy of Sam Brown http://www.massiveblue.com/
*/ 
@-webkit-keyframes color-shift {
0% { border-color: #49bacd; }
25% { border-color: #40879a; }
50% { border-color: #35566a; }
75% { border-color: #40879a; }
100% { border-color: #49bacd; }
}
body{
-webkit-animation-direction: normal;
-webkit-animation-duration: 10s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-name: color-shift;
-webkit-animation-timing-function: ease;
}