/*
Theme Name: Stories
Theme URI:  http://themes.jestro.com/titan/
Description:  A refined, balanced, and exceptionally handsome WordPress theme. Designed and coded by <a href="http://www.jestro.com">Jestro</a>.
Version:    1.20
Author:   Drew Strojny
Author URI: http://www.jestro.com
Tags: fixed-width, two-columns, white, brown, right-sidebar, threaded-comments, theme-options, translation-ready
*/

/* Main Stylesheets
-----------------------------------------------------------*/

/*Undo browser defaults
------------------------------------------------------------ */
:link,:visited {text-decoration: none;}
ul,ol {list-style: none;}
h1,h2,h3,h4,h5,h6,pre,code,p {font-size: 1em;}
ul,ol,dl,li,dt,dd,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;}

/* Body & Links 
------------------------------------------------------------ */
body {
  font: 62.5% "Century Gothic", "Avant Garde", Arial,Helvetica,Sans-serif;
  color: #444;
  line-height: 2.2em;
  background: url(images/main-bg.jpg);
  }
a:link, a:visited { color: #4265A7; }
.entry a:link, .entry a:visited { font-weight: bold; }
a:hover {
  color: #993333;
}

/* Basic Structure
------------------------------------------------------------ */
.wrapper {
  width: 960px;
  margin: 0 auto;
  text-align: left;
}

#content {
  background: url(images/content-top-bg.jpg) no-repeat top center;
  width: 100%;
}

#content .wrapper {
  padding-top: 15px;
  background: url(images/content-bg.jpg) repeat-y center;
}

#footer { 
  clear: both;
  height: 334px;
  padding-top: 5px; 
}

.clear:after, li.comment:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/*Header
------------------------------------------------------------ */
#header {
  width: 100%;
  height: 427px;
  background: #cce0e1 url(images/header-bg.jpg) repeat-x center;
  margin: 0 auto;
}

#headwrapper {
  width: 100%;
  margin: 0 auto;
  padding: 30px 0 0 0;
  height: 412px;
  background: url(images/header-focus-bg.jpg) no-repeat top center;
}

/* Stories header logo */  
h1 { 
  background: url(images/logo-stories.png) no-repeat;  
  width: 342px;
  height: 90px;
  position: relative;
  margin: 0 auto;
}  
   
h1 a {
  display: block;
  width: 342px;  
  height: 90px;
  text-indent: -9000px;  
}

#photobox {
  width: 960px;
  height: 310px;
  background: url(images/photo-box-bg.png) no-repeat;
}

#photobox img {
  padding-top: 20px;
  padding-left: 23px;
}

#flashfader {
  margin: 0 0 0 22px;
}

/* Nav
---------------------------------------*/
#navigation {
  height: 35px;
  width: 890px;
  background: url(images/ribbon-bg.gif) no-repeat;
  margin-left: 37px;
  padding: 9px 0 0 30px;
  font-family: Arial, Verdana, sans-serif;
  font-size: 11px;
}

.navlinks {
  width: 855px;
  height: 25px;
  margin-left: 53px;
  padding: 30px 0 20px 0;
}

#navwrap {
	width: 900px;
	position: relative;
        z-index: 100;
}

/* The container wrapping ul.dropdown */
 
/* Top level Unordered list */
ul.dropdown {
list-style:none;
float:left;
width:780px;
height:35px;
}
 
ul.dropdown li{
float:left; /* makes horiz list */
position:relative; /* hey Submenu ULs, appear below! */
padding: 0 8px;
}

ul.dropdown a {
padding:5px; /*space the items, occupy entire height too.*/
color:#fff;
text-decoration:none;
text-shadow:0 1px 0 #000;
text-transform: uppercase;
}
 
/* Style the link hover 
ul.dropdown li:hover a {
border-top:1px solid #777;
border-bottom: 1px solid #000;
border-right:1px solid #666;
}
*/
 
/* Displays the link as blocks. */
ul.dropdown li ul a {
display:block;
}
 
/* sub menus!!  */
 
ul.dropdown ul {
list-style: none;
background-color:#8aa4a4;
margin:0; /* Appear just below the hovering list */
padding:0;
width:200px; /* specify the width. */
position:absolute; /* needed */
z-index:500; /* specify the order */
border-top: 1px solid #000;
}
 
ul.dropdown li ul {
top:22px; /* Positioning:Calc with top level horz list height */
-moz-box-shadow:0 2px 10px #fff; /* CSS 3 */
}
 
ul.dropdown ul ul {
top:0;
left:100%; /* Position the sub menus to right. */
}
 
ul.dropdown ul li {
float:none; /* umm.. Appear below the previous one. mmkay? */
padding: 0;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
}
 
/* Drop Down! */
 
/* Hide all the dropdowns (submenus) */
ul.dropdown ul,
ul.dropdown li:hover ul ul,
ul.dropdown ul li:hover ul ul
{ display: none; }
 
/* Display the submenus only when li are hovered */
ul.dropdown li:hover ul,
ul.dropdown ul li:hover ul ,
ul.dropdown ul li ul li:hover ul
{ display: block;}
 
ul.dropdown li * a:hover {
/* Change color of links when hovered */
background: #748a8a;
background: -moz-linear-gradient( top, #200, #400); /* CSS 3 */
/*
border-bottom:1px solid #900;
border-top:1px solid #222;
*/
}


#socialmedia {
  float: right;
  padding-right: 50px;
}


/* Page/Post Styling
------------------------------------------------------------ */
.post { padding-bottom: 30px; }

/*Post Header
---------------------------------------*/
.post-header {
  margin: 0 0 15px 0;
  padding-top: 25px;
  width: 855px;
  margin-left: 53px;
}

.post-header h2 { 
  font-size: 2em; 
  line-height: 1.1em;
  margin-left: 1px;
  text-transform: uppercase;
}
.post-header h2 a:link, .post-header h2 a:visited, .post-header h3 a:link, .post-header h3 a:visited {
  color: #5D4227;
}

.post-header h2 a:hover, .post-header h3 a:hover {
  border-bottom: 1px dashed #5D4227;
}

.post-header h3 { 
  font-size: 1.8em; 
  line-height: 1.1em;
  margin-left: 1px;
  text-transform: uppercase;
}

.author, .date, .comments a {
  margin: 3px 0 0 0px;
  color: #C0B2A5;
  font-size: 12px;
}

.comments a:hover {
  color: #453729;
  text-decoration: none;
}

.addthis {
  width: 95px;
  float: right;
}

/* Post Body
---------------------------------------*/
.entry { 
  width: 855px;
  font-size: 1.3em;
  margin-left:53px;
}
.entry p { margin-bottom: 10px; }
.entry h2, .entry h3, .entry h4 {
  font-size: 1.3em;
  padding: 15px 0 5px 0;
  }
.entry h3 { 
  padding-top: 10px;
  font-size: 14px;
  }
.entry h4, .entry h5, .entry h6 { 
  padding-top: 10px;
  font-size: .9em;
}
.entry IMG {
  border: 1px #CCC solid;
  padding: 9px;
}

pre {
  margin: 10px 0;
  padding: 1em 10px;
  overflow: auto;
  background-color: #E9EBD9;
  color: #000;
  }
code { 
  padding: 2px 3px;
  font: 1.1em Consolas, Courier New, sans-serif;
  background-color: #E9EBD9;
  color: #000;
  }
pre code { font-size: 1.3em; }
blockquote {
  display: block;
  margin: 20px 0 20px 20px;
  padding: 0 0 0 20px;
  border-left: 3px solid #CBCAC8;
  color: #666;
  font-style: italic;
  line-height: 1.5em;
  }
.entry ul, .c-body ul {
  margin: 0 0 10px 10px;
  }
.entry ul li, .c-body ul li {
  display: block;
  margin: 5px 0;
  padding: 0 0 0 17px;
  background: url(images/list-item.gif) no-repeat 0 .3em;
  }
.entry ol, .c-body ol {
  list-style-type: decimal;
  list-style-position: inside;
  margin: 5px 0 5px 10px;
  }
.entry ol li ol li, .c-body ol li ol li { list-style-type: lower-roman; }
.entry ol li, .c-body ol li { margin: 5px 0; }

.index { padding: 0; }

  
/*Single
---------------------------------------*/
.tags {
  float: left;
  width: 104px;
}
.tags span {
  display: block;
  font-size: 1.5em;
  font-weight: bold;
  text-transform: uppercase;
  color: #beaa99;
  padding: 0 0 10px 28px;
  background: url(images/icon-tags.png) no-repeat 0 .3em;
}
.tags p {
  font-size: 1.2em;
  line-height: 1.4em;
  color: #beaa99;
}
.tags a { 
  color: #beaa99;
}
.post-header h1 { 
  margin-left: 131px;
  padding-bottom: 4px;
  font-size: 2.2em; 
}

.meta {
  width: 855px;
  border-top: 1px solid #EFEAE4;
  margin: 10px 0 0 55px;
  font-size: 1.2em;
  text-align: right;
  color: #666;
}

/* Comments
------------------------------------------------------------ */
#livefyre { width: 820px; padding-left:65px; }

#comments {
  width: 855px;
  margin-left: 53px;
}

.awpcomments {
  background-color:#DDECE8;
  height:220px;
  width:850px;
  margin:2em 0 3em;
  overflow:auto;
  padding:5px;
}

.awpcomments IMG {
  padding: 0;
  border: 0;
}

/* Top
---------------------------------------*/
.comment-number {
  display: block;
  padding: 30px 0 5px 0;
  font-weight: bold;
}

.comment-number span {
  font-size: 1.3em;
  color: #777;
}

.none { border-bottom: 1px solid #EFEAE4; }

a#leavecomment { 
  font-size: 1.6em;
  padding-left: 2px; 
}

/* Body
---------------------------------------*/
li.comment {
  padding-bottom: 12px;
  border-bottom: 1px solid #FFF;
}

li.comment.depth-2 {
  margin-bottom: 10px;
  }
ul.children {
  margin: 10px 0 0 131px;
  clear: both;
  }
div.c-grav {
  float: left;
  width: 40px;
  margin: 0;
  text-align: right;
  }
div.c-grav img {
  padding: 4px;
  border: 1px solid #E6E1DB;
  border-right-color: #D6D1CC;
  border-bottom-color: #D6D1CC;
  background: #fff;
}
div.c-body {
  margin-left: 131px;
  width: 600px;
  font-size: 1.3em;
  }
ul.children div.c-body { margin-left: 70px; width: 427px; }
div.c-body p { margin-bottom: 10px; }
div.c-head {
  margin: 0 0 10px 0;
  font-weight: bold;
  }
.c-permalink a:link, .c-permalink a:visited {
  color: #777;
  font-size: .7em;
  }
div.reply { padding-bottom: 10px; }
div.reply a:link, div.reply a:visited { color: #beaa99; }
/*Form
---------------------------------------*/
form#commentform { margin: 0 0 0 131px; }

#respond { 
  width: 855px;
  margin-left: 53px;
  padding-bottom: 20px;
  font-size: 1.3em;
}

h4#postcomment {
  margin: 20px 0;
  padding: 5px 0 0 0;
  color: #555;
  border-top: 1px solid #EFEAE4;
  }
form#commentform label.comment-field {
  display: block;
  margin: 10px 0 3px 0;
  font-size: 1.1em;
  }
input.text-input, form#commentform textarea {
  padding: 7px 3px;
  background: #fff;
  font-family: inherit;
  border: 1px solid #E6E1DB;
  border-right-color: #D6D1CC;
  border-bottom-color: #D6D1CC;
  width: 477px;
  }
input#author, input#email, input#url { width: 300px; }
form#commentform input:focus, form#commentform textarea:focus { background: #fff; }
form#commentform input#submit {
  padding: 5px;
  width: 150px; 
  }
form#commentform p.guidelines {
  margin: 10px 0;
  color: #555;
  }
p.subscribe-to-comments, p.comments-rss{ margin: 0 0 10px 0; }
p.comments-rss a {
  font-size: 1.1em;
  padding: 0 0 0 19px;
  background: url(images/feed-icon.png) no-repeat 0 .1em;
  }
fieldset { border: none;}
/*Note
---------------------------------------*/
p.note {
  font-style: italic;
  font-size: 1.3em;
  }
/*Pingbacks/Trackbacks
---------------------------------------*/
h3.pinghead {
  font-size: 1.3em;
  color: #444444;
  }
ol.pinglist {
  list-style-type: decimal;
  list-style-position: inside;
  margin: 0 0 10px 10px;
  font-size: 1.3em;
  }

/*Pages
---------------------------------------*/
#page {
  padding-bottom: 30px;
}

h1.pagetitle, h2.pagetitle {
  margin: 0 0 15px 53px;
  padding-top: 20px;
  font-size: 2.2em;
}

/* Archives List
---------------------------------------*/
.entries ul {
  width: 855px;
  margin: 0 0 0 53px;
  font-size: 1.3em;
}

.entries ul li {
  padding: 20px 0;
  border-bottom: 1px dashed #DFDAD5;
}
.entries span {
  color: #777;
}
 
/* Sidebar
------------------------------------------------------------ */
#sidebox { font-size: 1.2em; } 
#sidebox p { 
  margin-bottom: 15px; 
  line-height: 1.6em;
  }
#sidebox img {
  padding: 14px;
  border: 1px solid #E6E1DC;
  background: #F0EBE6;
  }

/* Footer
------------------------------------------------------------ */
#footer {
  background: #879C9F url(images/footer-bg.jpg);
  color: #555;
}

#footerwrapper {
  width: 100%;
  margin: 0 auto;
  height: 334px;
  background: url(images/footer-focus-bg.jpg) no-repeat top center;
}

#footer a:link, #footer a:visited { color: #444; }
#footer a:hover { text-decoration: underline; }

#footer h4 {
  font-size:1.4em;
}

/* Footer Columns
---------------------------------------*/
.widget {
  font-size: 11px;
  margin-bottom: 20px;
}

#footer-widgets {
  height: 260px;
}

#footer-col1 {
  float: left;
  width: 300px;
  margin: 0 12px;
  padding: 0 0 0 42px;
  color: #413f3e;
}

#footer-col2 {
  float: left;
  width: 250px;
  margin: 0 12px;
  color: #413f3e;
}

#footer-col3 {
  float: left;
  width: 270px;
  color: #413f3e;
}

/* Copyright
---------------------------------------*/
#copyright {
  clear: both;
  background: url(images/footer-logo-stories.png) no-repeat;
  width: 160px;
  height: 42px;
  margin-left: 50px;
  position: relative;
}
   
#copyright a {
  display: block;
  width: 160px;  
  height: 42px;
  text-indent: -9000px;  
}


/*Miscellaneous
---------------------------------------*/
img.border {
  padding: 14px;
  border: 1px solid #E6E1DC;
  background: #F0EBE6; 
  }


/* Required Wordpress Classes, don't remove these.
-----------------------------------------------------------*/
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  }
.alignleft { float: left; }
.alignright { float: right; }

/* Make all custom CSS changes in a Child Theme. See this tutorial for instructions:
     ----> http://themes.jestro.com/vigilance/easy-upgrading-wordpress-child-themes/ <----
 Any custom changes you make here will not be overidden when you upgrade the theme.
-----------------------------------------------------------*/