@import url('./reset.css');
@import url('./legacy.css');
@import url('./typography.css');

	body {
		background: rgb(109, 0,0);		
		margin:0px;
		padding:0px;
	}
	
	body#home {
	}
	
	h1, h2, h3, h4, h5, h6, p { 
	margin:1em 0;}
	
	a {
	}
	
	
	a:hover {
	}
	
	a {
	}
	
	#pagination { float:right; }
	
	a.page, span.page {
	  padding:0.25em;
	  margin:0.25em 0.125em;
		border:1px solid rgba(76, 0, 0,.33);
	}
	
	.disabled_page {
	  opacity:0.66;
	}
	strong.type {
	  display:none;
	}
	
	ul, ol {
	  list-style:none;
	}
	
	.entry ul {
		padding:0 0.5em;
		list-style-type: none;
	}
	.entry ul li {
		border-bottom: 1px solid #eee;
		padding:4px 1em;
	}
	
	input[type="text"], textarea {
    margin:.75em 0 2em 0;
    padding:0.5em;
    width:37.5em;
    max-width:37.5em;
    font-size:0.75em;
    border:1px solid rgba(76, 0, 0,0.33);
    overflow:hidden;
  }

  input#story_title {
    margin:.5em 0 1.2em 0; 
    font-size:1em;
    width:28em;
    max-width:28em;
  }
	
	#home a, ul#nav li a {
	}
	
	#home a:hover, ul#nav li a:hover {
	}
	
	#header {
	  position:relative;
	  width:100%;
	  min-width:57em;
	  max-width:64em;
	}
	
	#header {
	  top:0;
	  background: rgb(109,0,0);		
		height:6.5em;
		border-bottom:0.5em solid rgba(0, 0, 0, .3);
		z-index:99;
	}
	
	#prefs {
	  display:none;
	  background-color:rgba(76,0,0,0.6);
	  padding:.25em;
	  width:6em;
	  position:fixed;
	  top:0;
	  left:0;
	  z-index:199;
	}
	
	#prefs:hover {
	  opacity:1;
	}
	
	#home #prefs {
	  display:block;
	}
	
	#prefs a {
	  display:inline-block;
	  height:1.5em;
	  width:1.5em;
	  overflow:hidden;
	}
	
	.sprite {
    height:1.5em;
    width:6em;
    opacity:0.8;
  }

  .sprite.on {
  }
  
  .sprite.off {
    opacity:0.33;
  }

  .stories {
    /* background-image:url(../images/story_sprites.png); */
  }

  .stories.image {
    margin-left:-1.5em;
  }
  .stories.poem {
    margin-left:-3em;
  }
  .stories.tweet {
    margin-left:-4.5em;
  }
	
	#logo {
    position:absolute;
    right:1.66em;
    top:1em;
    z-index:1;	  
  }
	
	ul#nav {
	  padding-top:4.5em;
	  position:relative;
	  
	  float:left;
	  margin-left:4em;
	}
	ul#nav li { 
	  display:inline-block;
	  margin-right:4em;
	}
	
	#shades {
	  margin-top:-1px;
	  background:transparent url(/images/shade.png) repeat-x 0 0; 
	  position:fixed; top:-1em;left:0;height:36px;width:100%;
	  overflow:visible;
	  z-index:9999;
	}
	
	#content {
	  position:relative;
	  min-height:73.8em;
	  min-width:57em;
	  max-width:63.5em;
		background-color: rgb(255, 255, 255);
		margin:0 0 0 0;
		padding:1em 0em;
		border:0.5em solid rgba(76, 0, 0, .1);
		border-left-width:0;
		margin:0 0 4em 0;
		
	}
	
	body#home #header {
	  position:relative;
	  background: rgb(109, 0,0);		
	}
	
	body#home #content {
		background-color:rgba(255,255,255,0.05);
		background-image:none;
		border-bottom-width:0.5em;
		border-right-width:0.5em;
	}
	
	#main {
		float:left;
		margin:0 1.5em 0 8em;
	}
	#extras {
    min-width:18em;
	  max-width:25em;
		float:right;
	}
	.cf {
		clear:both;
	}
	/* Entry styles */
	.entry {
		width:29em;
		margin:1.5em 0;
	}
	
	li.entry {
	  width:29em;
	  margin-left:-8em;
	  padding-left:8em;
	}

  #collection-bar {
		margin:-0.5em 0 0.5em -8em;
    padding:0.75em;
	  background-color: rgba(76, 0, 0, .1);
	  border:1px solid rgba(76, 0, 0,.33);
	  border-left:1em solid rgba(76, 0, 0,.33);
	  border-top-width:0;
	  text-align:center;
  }

  #collection-bar p {
    padding:0;
    margin:0;
  }

	.title h3 {
	  margin:0 0 0 -.25em;
	  padding:.5em 0 0 0;
	  text-transform:uppercase;
	}
	.entry .title, #comments h2, form label {
		margin:.25em 0 0.5em -8em;
		padding-left:3em;
		border-left:1em solid rgb(76, 0, 0);
		
		border-bottom:1px solid rgba(76, 0, 0,.33);
	}
	
	
	#comment-form label {
	  border-width:0;
	  margin:0;
	  text-align:right;
	}
	
	body#home .entry.image.right .title {
	  text-align:right;
	  margin:.25em 0 0 -8em;
		border-right:1em solid rgb(76, 0, 0);
		border-bottom:1px solid rgba(76, 0, 0,.33);
	}
	
	body#home .entry.image.right .preview {
	  margin-left:0.5em;
	}
	
	.entry.image .title {
    border-width:0;
    padding-left:0;
    
    border-bottom:1px solid rgba(76, 0, 0,.33);
	}
	
	.entry.image .preview a {
	  display:block;
	  width:100%;
	  height:100%;
	}
	
	.entry.tweet .title {
	  padding:0 1em 0 2em;
	  background-color:rgba(0, 0, 0,.1);
    border-width:0;
    border-right:1em solid rgb(76, 0, 0);		
	}
	
	.entry.poem .title {
	  padding:0 1em 0 2em;
	  background-color:rgba(255, 255, 255,.075);
    border-width:0;
    border-right:1em solid rgb(76, 0, 0);
    border-bottom:1px solid rgba(76, 0, 0,.33);	
    -webkit-box-shadow: 3px 3px 5px rgba(76, 0, 0, 0.3);
	}
	
	.entry.poem .title:hover {
	  background-color:rgba(255, 255, 255,.1);
	}
	
	.entry.quote .title {
	  background-color:rgba(60, 45, 45, 0.1);
	  padding:1em 1em 1em 2em;
    border-width:0;
    border-right:1em solid rgb(76, 0, 0);
		border-top:1px solid rgba(76, 0, 0,.33);
		-webkit-box-shadow: 2px 2px 3px rgba(76, 0, 0, 0.3);
	}
	
	.entry.quote .title:hover {
	  background-color:rgba(60, 45, 45, 0.3);
	  
	}

	#home .entry.collection.any .title,
	#home .entry.collection.gallery .title {
	  background-color:rgba(255, 255, 255,.075);
		margin:0 -2em 0.5em -8em;
		padding:0.5em 5em 1em 2em;
		border-left:0 solid transparent;
		
		border-bottom:1px solid rgba(76, 0, 0,.33);
		border-right:1px solid rgba(76, 0, 0,.33);	
		-webkit-box-shadow: 3px 3px 5px rgba(76, 0, 0, 0.6);
	}
	
	#home .entry.collection.any .title {
	  border-top:1em solid rgba(255, 255, 255,.66);
  }
	
	#home .entry.poem .title, #home .entry.quote .title {
	  -webkit-transition-duration: 0.3s;
    -webkit-transition-property: background-color, -webkit-box-shadow;
	  -webkit-transition-timing-function: ease-in-out;
	}
	#home { -webkit-perspective:500;}
	#home .entry.poem .title:hover, #home .entry.quote .title:hover {
	  -webkit-transition-timing-function: ease-in-out;
	  -webkit-box-shadow: 3px 3px 5px rgba(76, 0, 0, 0.6);	
	}
	
	#home .entry.post .title {
	  -webkit-transition-duration: 0.25s;
    -webkit-transition-property: text-shadow;
	  -webkit-transition-timing-function: ease-in;
	}
	
	#home .entry.post .title:hover {
	  -webkit-transition-timing-function: ease-out;
	  text-shadow:rgba(76, 0, 0, 0.6) 1px 1px 3px;
	}

	.preview {
	  vertical-align:middle;
	  display:inline-block;
	  height:3.25em;
	  width:3em;
	  margin-right:0.5em;
		
	  border-top:1px solid rgba(76, 0, 0,.33);
		border-right:1px solid rgba(76, 0, 0,.33);
		
		border-left:.5em solid rgba(76, 0, 0,.33);
	}
	
	body#home .entry.image.right .preview {
	  margin-right:-0.5em;
    float:right;		
    border-left-width:0;
		border-right:.5em solid rgba(76, 0, 0,.33);
	}
	
	
	#home .entry h4 {
	}
	.entry h1 {
		margin:0;
	}
	
	.entry h1 input[type='text'] {
	  width:95%;
	  margin:0;
		border:1px solid rgba(76, 0, 0,.05);
	}
	
	.entry h2 {
	}
	
	.entry.image .title h1 {
	}
	
	.entry.tweet .title h1, .entry.poem .title h1 {
		padding:0.5em 0.5em 0.5em 0;
		margin:0;
	}
	
	.entry h4, #extras h4, .collection .title p {
		margin:0;
		width:auto;
	}
	
	.collection .title p {
	  margin:0.25em 0;
	}
	
	#home .entry h1 {
	}
	
	.entry p {
	}
	.entry p strong {
	}
	
	p.hilite, blockquote p {
	  background-color:rgba(60, 45, 45, 0.1);

	  padding:1em 2.66em;
	  margin:0 -3.66em 0 -7.33em;
	  
	  border-left:1em solid rgba(60, 45, 45, 0.1);
	}
	
	body#home blockquote p {
	  background-color:transparent;
    padding:0;	  margin:0;
	  border-left-width:0;
	}
	
	div.entry > p:first-child {
	}
	
	div.entry > p:first-child textarea {
	  width:95%;
	  border:1px solid rgba(76, 0, 0,.05);
	}
	
	.entry p textarea {
	  width:95%;
	  border:1px solid rgba(76, 0, 0,.05);
	  overflow:auto;
	}
	
	.entry .title + p { 
	  margin:1.5em 0 2em 0;
	}
	
	.entry p.excerpt {
	}
	
	.entry.poem p.excerpt {
	  margin:0;
	}
	
	/* Sidebar */
	#extras {
	  width:18em;
	  margin-right:-0.5em;
	}
	#extras h2 {
	  overflow:hidden;
		border-bottom:1px solid rgba(76, 0, 0,.33);
	  padding-right:1em;
	  margin-bottom:0;
	  margin-top:2em;
	}
	
	#home #extras h2 {
		border-bottom:1px solid rgba(76, 0, 0,.5);
	}
	
	
	#about-content {
	  background-color: rgba(76, 0, 0, .1);
		margin-left:2.5em;
    border:1px solid rgba(76, 0, 0,.1);
    border-top-width:0;
    overflow:hidden;
	}
	
	#home #about-content {
		background-color: rgba(76, 0, 0, .2);
		border-color:rgba(76, 0, 0,.5);	  
		-webkit-box-shadow: 0 0 3px rgba(76, 0, 0, 0.6);	
 	 
	}
	
	#about-content p {
	  padding:0 1.5em 0 0.5em;
	}
	
	#jake-pic {
	 -webkit-background-size:21.5em auto;
	 height:5em;
	 background: transparent url(../images/jake_sm.jpg) no-repeat 50% -0.6em;	 
	 border-bottom:1px solid rgba(76, 0, 0,.1);
	 	-webkit-box-reflect:below 0 -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.5, transparent), to(rgba(255, 255, 255, 0.25)));
	 	
	
	}
	
	#home #jake-pic {
	  border-color:rgba(76, 0, 0,.5);
	}

	
	#extras li a, #extras li span {
	  display:block;
		padding:0.5em 1.5em 0.5em 0;
		margin-left:2.5em;
		
		border-width:1px 0 1px 1px;
		border-style:solid;
		border-color:white;
		border-bottom-color:rgb(220, 207, 207);
	}
	
	#home #extras li a {
	  border-width:1px;
		border-color:transparent;
		border-bottom-color:rgba(76, 0, 0,.2);
	}
	
	
	#extras li a:hover, #extras li span:hover {
		background-color: rgba(76, 0, 0, .1);
		border:1px solid rgba(76, 0, 0,.1);
		border-top-color:transparent; /* rgb value of border + background at 10% */
    border-right-width:0;	
	}
	
	#home #extras li a:hover {
		background-color: rgba(76, 0, 0, .2);
		border:1px solid rgba(76, 0, 0,.5);
	}
	
	#home #extras ol li:first-child a { border-top-width:0; }

	
	#extras input[type='text']{
	  display:block;
	  margin:0 0 0 2.5em;
    width:19.5em;
	  background-color: rgba(76, 0, 0, .1);
		border:1px solid rgba(76, 0, 0,.1);
		border-top-color:transparent;
    border-right-width:0;
		padding:0.5em 1.5em 0.5em 0.5em;
	}
	
	
	#home #extras input[type='text'] {
    width:19.4em;
	  background-color: rgba(76, 0, 0, .2);
		border:1px solid rgba(76, 0, 0,.5);
		border-top-width:0;    
		
	}
	
	ol.search-results { 
	}
	
	ol.search-results li.result-header {
	  padding:0.1em 1.5em 0.1em 0;
	  margin:0 0 0 2.5em;
	  height:0.33em;
	  background-color:rgba(76, 0, 0,0.9);	  
		border:1px solid rgba(76, 0, 0,.1);
    border-right-width:0;
    overflow:hidden;
	}
	/* Comments */
	#comments {
	}
	
	#comments h2 {
	  border-left-width:0;
		margin:2em 0 0 0;
		padding-left:2.67em;
		overflow:hidden;
	}
	
	ol.comment-list { 
	  float:left;
	  width:33em;
	  margin:1.5em 1em 1.5em 4em;
  }
  
  .comment span.date {
    float:right;
    padding:0 .5em;
  }
  
  li.comment {
		border-bottom:1px solid rgba(76, 0, 0,.33);
    margin-bottom:2em;
  }
  
  .comment dt {
    margin-left:1em;
  }
    
  .comment dd {
    overflow:hidden;
  }
  
  dd.details h3 {
    margin:0 0 -1em 6px;
    padding:0 0 0 0;
  }
    
  .comment p { 
		margin-left:3.38em; /*47.3px*/
	}
	
	#comment-form {
	  width:16em;
	  font-size:1em;
	  float:right;
	  margin:1.5em 1.5em 0 0;  
	}
	
	#comment-form input[type='text'], #comment-form textarea {
	  width:21.5em;
	  display:block;
	  margin:0 2em 0 0em;
		border:1px solid rgba(76, 0, 0,.1);
		padding:0.5em 0 0 0.5em;
	}
	
	#comment-form textarea {
	  margin-left:0em;
	  height:10em;
	}
	
	
		
	/* Callout Text */
	
	div.callout {
	  margin:0.5em 0 0.5em -4em;
	  padding:0.5em;
	  border:1px solid rgba(76,0,0,0.1);
	}
	
	div.callout p {
	  margin:0;
	  padding:0;
	}
	
	div.callout.wide {
	  margin-right:-4em;
	}
	
	div.callout.left-wrap {
	  width:14.5em;
	  margin-right:1em;
	  float:left;
	}
	
	div.callout.right-wrap {
	  width:14.5em;
	  margin-right:-4em;
	  margin-left:1em;
	  float:right;
	}
	
	/* Callout Images */
	
	div.callimg {
	  margin:0.5em 0 0 -4em;
	}
	
	.photo div.callimg {
	  margin-top:2em;
	}
	
	div.callimg.wide {
	  margin:0.5em -4em 0 -4em;
	}
	
	div.callimg.left-wrap {
	  margin:0.5em 1em 0 -4em;
	  float:left;
	}
	
	div.callimg.right-wrap {
	  margin:0.5em -4em 0 1em;
	  float:right;
	}
	
	div.callimg img {
	  outline:1px solid rgb(76,0,0);
	  margin:0;
	  width:31.25em;
	  max-width:99%;
	}
	
	div.callimg.wide img {
	  width:44.25em;
	}
	
	div.callimg.left-wrap img, div.callimg.right-wrap img {
	  width:20.875em;
	}
	
	
	.gallery-preview {
	  margin:-0.5em -5em 0.75em -2em;
	  border-bottom:1em solid rgba(255, 255, 255,.66);
	  overflow:hidden;
	}
	
	.gallery-preview .images {
	  margin:0;
	  width:44em;
	}
	
	.gallery-preview .images img {
	  width:4.6875em;
	  height:4.6875em;
	}
	
	.finis {
		height:1em;
		width:100%;
		margin-left:-8em;
		margin-top:4em;
		background-color:rgba(76, 0, 0,0.75);
		border:2px solid rgba(255,255,255, .8);
		border-left-width:0px;
	}
	
/* guides */

.guide {
  position:fixed;
  top:0;
  height:100%;
  outline:1px dotted rgba(0,0,0,.5);
}

.guide.red {
  outline-color:rgba(109,0,0,.5);
}

.guide.blue {
  outline-color:rgba(0,0,109,.5);
}

.em1 {
  left:1em;
}

.em2 {
  left:2em;
}

.em4 {
  left:4em;
}

.em8 {
  left:8em;
}

.em37 {
  left:37em;
}

.em54 {
  left:54em;
}

/* playground */ 
div.callimg a {
  display:block;
  border:1px solid transparent;
  background-color: transparent;
  padding:0.75em;
  -webkit-border-radius:0.25em;
  -webkit-transform-origin:top left;
  -webkit-transition-property: background-color, border-color, -webkit-box-shadow;
  -webkit-transition-duration: .2s; -webkit-transition-timing-function: ease-in;
  -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 2px;
  
}

div.callimg a:hover {
  -webkit-transition-timing-function: ease-out;
  background-color: rgba(0, 0, 0, 0.2);
  border-color:rgba(76, 0, 0, 0.1);
  -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 5px;
  
}
div.callimg img {
  -webkit-border-radius:0.25em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 2px;
  
  outline-width:0;
  padding:0;
  margin:0;
  max-width:100%;
}

.rt {
  margin-top:1em;
  padding-top:0.5em; 
  text-align:right;
}

a.retweet span { 
  line-height:1.5em;
   text-shadow:rgba(255, 255, 255,0.5) -1px -1px 1px;
  padding:0.2em 0.5em;
  -webkit-border-top-left-radius:3px;
  -webkit-border-top-right-radius:3px;
}

a.retweet span:first-letter {
  display:none;
}

a.retweet strong {
  line-height:1.5em;
  text-shadow:rgba(255, 255, 255,0.5) -1px -1px 1px;
  padding:0.2em 0.5em;
  -webkit-border-top-left-radius:3px;
  -webkit-border-top-right-radius:3px;
}