// Started from http://getbootstrap.com/examples/blog/blog.css
/*
 * Globals
 */

body {
    font-family: Georgia, "Times New Roman", Times, serif;
    color: #555;
}

a, .btn-link {
    color: #ff5555;
}
a:hover, .btn-link:hover {
    color: #ff5555;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    margin-top: 0;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: normal;
    color: #333;
}

/*
 * Override Bootstrap's default container.
 */

@media (min-width: 1200px) {
    .container {
	width: 970px;
    }
}


/*
 * Masthead for nav
 */

.blog-masthead {
    padding-top: 20px;
    border-bottom: #333 2px solid;
    color: #333;
}

.blog-masthead h1 a {
    color: #333;
}

.blog-masthead .punct {
    color: #ff5555;
}

/* Nav links */
.blog-nav-item {
    position: relative;
    display: inline-block;
    padding: 10px;
    font-weight: 500;
    color: #333;
}
.blog-masthead h1:hover, .blog-nav-item:hover, .blog-nav-item:focus {
    color: #666;
}

.blog-nav form.navbar-form {
    margin-top: 2px;
    margin-bottom: 2px;
}

/* Active state gets a caret at the bottom */
.blog-nav .active {
    color: #333;
}
.blog-nav .active:after {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -5px;
    vertical-align: middle;
    content: " ";
    border-right: 5px solid transparent;
    border-bottom: 5px solid;
    border-left: 5px solid transparent;
}


/*
 * Blog name and description
 */

.blog-header {
    padding-top: 20px;
    padding-bottom: 20px;
}
.blog-title {
    margin-top: 30px;
    margin-bottom: 20px;
    font-size: 40px;
    font-weight: normal;
}
.blog-description {
    font-size: 16px;
    color: #999;
}

.blog-inline-date {
    font-style: italic;
    color: #999;
    padding-right: 10px;
}

.blog-description .blog-tag, .blog-tags .blog-tag {
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-description .blog-tag:after, .blog-tags .blog-tag:after {
    content: ", ";
}

.blog-description .blog-tag:last-child:after, .blog-tags .blog-tag:last-child:after {
    content: "";
}


/*
 * Main column and sidebar layout
 */

.blog-main {
    font-size: 16px;
    line-height: 1.5;
}

/* Sidebar modules for boxing content */
.sidebar-module {
    margin: 0 -15px 15px;
}
.sidebar-module-inset {
    padding: 15px;
    background-color: #fafafa;
    border-radius: 4px;
}

.sidebar-module ol li {
    margin-bottom: 5px;
}
.sidebar-module ol li:last-child {
    margin-bottom: 0;
}

.sidebar-module-inset p:last-child,
.sidebar-module-inset ul:last-child,
.sidebar-module-inset ol:last-child {
    margin-bottom: 0;
}




/* Pagination */
.pager {
    margin-bottom: 60px;
    text-align: left;
    color: #333;
}
.pager > li > a {
    width: 140px;
    padding: 10px 20px;
    text-align: center;
    border-radius: 30px;
}


/*
 * Blog posts
 */

.blog-post {
    margin-bottom: 60px;
}
.blog-post-title {
    margin-bottom: 5px;
    font-size: 30px;
}
.blog-post-title:first-child {
    margin-top: 0;
}

.blog-post-meta {
    margin-bottom: 20px;
    color: #999;
}

.blog-post p {
    margin-top: 10px;
    margin-bottom: 20px;    
}

.blog-post li {
    margin-top: 10px;
    margin-bottom: 10px;
}

.blog-post h1, .blog-post h2, .blog-post h3, .blog-post h4, .blog-post h5 {
    margin-top: 20px;
    margin-bottom: 20px;
}

.blog-post p, .blog-post li, .blog-post ol {
    max-width: 500px;
}

.blog-post p.lead {
    max-width: 100%;
}


.blog-post hr {
    max-width: 500px;
    margin-left: 0;
    text-align: left;
}

@media (min-width: 768px) {
  .blog-post p, .blog-post li, .blog-post ol {
    text-align: justify;
  }
  .blog-post ul, .blog-post ol {
    padding-left: 0;
  }
}

.blog-post img {
    max-width: 100%;
}

img.blog-hero {
    width: 100%;
}

@media (max-width: 600px) {
    .blog-post li {
	max-width: auto;
    }
    .blog-post p {
	width: auto;
    }
    .blog-post img {
	max-width: 100%;
    }
}

/*
 * Paginator
 */

nav.blog-pagination {
    border-top: 1px solid #333;
    text-align: center;    
}

nav.blog-pagination a {
    color: #333;
}

nav.blog-pagination .active span {
    background-color: #777;
}

nav.blog-pagination .active span:hover {
    background-color: #ddd;
    color: #333;
}

/*
 * Google prettyify
 */
pre.prettyprint.prettyprinted {
    padding-left: 10px;
    padding: 10px;
    margin: 1em 0px;
    border: 1px solid #ccc;
}


/*
 * Page lists
 */
.blog-post-list p.lead.blog-description {
    margin-top: 0;
    margin-bottom: 0;
}

.blog-post-list img.blog-hero {
    margin-bottom: 20px;
}

/*
 * Tags
 */

.tags {
    list-style: none;
}


.blog-post-list li.blog-tag {
    list-style: none;
}

.blog-post-list .blog-tag .badge, .blog-tags .badge, .tags .badge {
    color: #aaa;
    font-weight: normal;
    background-color: #eee;

}

.tags .badge {
    float: right;
    margin-right: 2em;
}

/*
 * Social Sharing / RRSSB
 */
.blog-post .rrssb-buttons {
    max-width: 500px;
}

/*
 * Footer
 */

.blog-footer {
    padding: 40px 0;
    color: #333;
    text-align: center;
    border-top: 2px solid #333;
}
.blog-footer p:last-child {
    margin-bottom: 0;
}