/* Define Variables */
:root {
    --corner-curve: 10px;
    /* Use 0px for square corners */
    --bg-image-blend: overlay;
    /* normal|multiply|screen|overlay|darken|lighten|color-dodge|saturation|color|luminosity */
    --grad-size: farthest-side;
    /* closest-corner|farthest-corner|closest-side|farthest-side */
    --grad-center-x: 15%;
    --grad-center-y: 25%;
    --bg-grad-midpoint: 45%;
    --bg-grad-color1: #243;
    --bg-grad-color2: #443;
    --bg-grad-color3: #467;
    --modal-bg-color: rgba(0, 0, 0, .85);
    --side-bg-color: #222;
    --side-text-color: #eee;
    --avatar-border-color: #58c;
    --comm-label-color: #cc9944;
    --header-bg-color: #335511;
    --header-border-color: #611a04;
    --header-link-color: #DD9944;
    --comment-parent-color: #557733;
    --blockquote-bg: #bcd0e6;
    --followers-color: #ccaa22;
    --following-color: #66BB33;
    --mutuals-color: #22aacc;
    --link-color: #DD9944;
    --link-hover-color: #00FF00;
}


/* Bigger post text */
.post .citation,
.post .content,
.post .tags,
.fr-view,
.comment-subheader,
span[ng-bind-html='c.body'] {
    font-size: 1.15em !important;
}

/* Space out lines of text in comments */
span[ng-bind-html='c.body'] {
    line-height: 1.25em !important;
}

/* Header Navbar */
.navbar-inverse {
    background-color: var(--header-bg-color);
    border-color: var(--header-border-color);
}

.nav-highlight a,
.nav-logout a {
    color: var(--header-link-color);
}

.navbar {
    height: 54px;
}
/* Removes slight gap between header and sidebar */
/* Modal stuff */
.modal-backdrop {
    background-color: var(--modal-bg-color);
}

/* Feed Area and Sidebar */
/* Posted to Community label */
span[ng-if$="null"] a[href^="/community"]::after {
    content: " community";
    font-weight: bolder;
    letter-spacing: 1px;
    color: var(--comm-label-color);
}

/* Link color */
a {
    color: var(--link-color);
}
a:hover {
    color: var(--link-hover-color);
}

/* rounded corners and borders */
.main,
.avatar img,
.side-info .timestamp {
    border: 1px solid var(--avatar-border-color);
    border-radius: var(--corner-curve);
}

/* Round just the top of the poster header */
.post .header {
    border: 1px solid var(--avatar-border-color);
    border-top-left-radius: var(--corner-curve);
    border-top-right-radius: var(--corner-curve);
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

/* Reset the permalink icon color so it shows up on the header */
.post .post-perma-link a {
    color: var(--side-text-color);
}

/* Round the bottom tabs to fit the main post body */
.post .post-nav .post-nav-right .tab-leftmost {
    border-bottom-right-radius: var(--corner-curve);
    border-bottom: transparent;
}

/* Remove bottom tab link hover color */
.post-nav a:hover {
    background: transparent !important;
}

/* Round the blockquote box */
blockquote {
    background-color: var(--blockquote-bg);
    border-radius: var(--corner-curve);
}

/* Post header and sidebars match */
.post .header,
.side-info .timestamp,
.sidebar,
.sidebar-boxes .sidebar-box,
.sidebar .sidebar-row,
.sidebar-header,
.sidebar-toggle-indicator,
.sidebar-boxes .sidebar-box:hover,
.sidebar-icon {
    background-color: var(--side-bg-color);
    border-color: var(--side-bg-color);
    border-radius: var(--corner-curve);
}

/* Remove rounded corner on sidebar */
.sidebar {
    border-radius: 0px !important;
}

/* Post heaader and sidebar text */
.side-info .timestamp,
.post .header,
.sidebar,
.sidebar a,
.post-nav,
.post-nav a {
    color: var(--side-text-color);
}

/* Make the right edge of the sidebar sharper against the background */
.sidebar {
    border-right: 1px solid var(--avatar-border-color);
}

/* Set colors of the sidebar info tiles */
.sidebar-boxes .sidebar-box.followers {
    color: var(--followers-color);
}

.sidebar-boxes .sidebar-box.following {
    color: var(--following-color);
}

.sidebar-boxes .sidebar-box.mutuals {
    color: var(--mutuals-color);
}

/* Recolor that button on the messages page */
.btn-primary {
    background-color: var(--side-bg-color);
    border-color: var(--avatar-border-color);
    color: var(--side-text-color);
}

/* Comment styling */
/* Comments Reblogs Likes tabs */
#single-post-nav-tabs li > a {
    background-color: var(--header-bg-color);
    border-radius: var(--corner-curve);
}
/* Remove the bar under the tabs */
#single-post-nav-tabs .nav-tabs {
    border-bottom: transparent;
}

.thread {
    margin-bottom: 15px;
}
/* Separate parent comments with a bit more space */
.child-comment {
    margin-top: 5px;
}
/* Separate child comments just a bit more */
/* Child comment headers */
.thread .main .header {
    background-color: var(--side-bg-color);
    border-top-left-radius: var(--corner-curve);
    border-top-right-radius: var(--corner-curve);
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;color:#DDA;
}

/* Parent comment headers */
.thread > .main .header {
    background-color: var(--comment-parent-color);
    border-top-left-radius: var(--corner-curve);
    border-top-right-radius: var(--corner-curve);
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

/* Hide the border around the tiny avatars in comment headers */
.comment .header .avatar-container {
    border-color: transparent;
}

/* Round the corners of the comment header avatar */
.comment .header .avatar-container .avatar {
    border-radius: var(--corner-curve);
}

/* Comment header buttons */
.comment .header .comment-buttons button,
.comment .header .comment-buttons .fa {
    color: var(--sidebar-text-color);
}

/* Push the comment reply form down slightly */
.main[style='padding:10px; margin-left:10px;'] {
    margin-top: 5px;
}


/* Community pages */
/* Move the description bar to meet the collapsed sidebar */
.community {
    margin-left: 59px;
}

.community .nav,
.community .nav .info .description,
.community .forum .header {
    background-color: var(--comment-parent-color);
    color: var(--blockquote-bg) !important;
}

/* Remove the community name from the info box */
.community .nav .info .title {
    display: none;
}

/* Make the descriotion bigger since removing the name leaves room for it */
.community .nav .info .description {
    font-size: 14px;
}

.community .comm-button {
    background-color: var(--side-bg-color);
    border-radius: var(--corner-curve);
}

/* Only show scrollbars if they are needed */
.community #comm-discs,
.community #comm-posts {
    overflow: auto;
}


/* Embedded Background Image Overlay and Gradient (last section) */
body {
    background-attachment: fixed !important;
    background-blend-mode: var(--bg-image-blend);
    background: url(http://getwallpapers.com/wallpaper/full/1/0/a/995915-sam-winchester-wallpaper-1920x1200-1080p.jpg), radial-gradient(var(--grad-size) at var(--grad-center-x) var(--grad-center-y), var(--bg-grad-color1) 0%, var(--bg-grad-color2) var(--bg-grad-midpoint), var(--bg-grad-color3) 100%);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

/* Base code created by Tephra */
/* SPN layout created by Minerva*