@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@200&family=Roboto+Slab&display=swap');

/* Varaibles */
:root {
--background-color: #0b1021;
--link-color: #00CCB4;
--header-border-color: #00CCB4;
--header-author-name: #00CCB4;
--header-listed-name: #00CCB4;
--wordcount-color: #00CCB4;
--body-text-color: #d8d8d8;
--sn-stylekit-foreground-color: #00CCB4;
--post-code-background-color: #141b33;
--post-code-border-color: #00ccb438;
--page-menu-link-color: #00CCB4;
--more-posts-post-background-color: #060913;
--callout-info-border-color: #00CCB4;
}

/* Basics */
body, div, p, span, a {
font-family: 'Roboto Mono', monospace;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5 {
font-family: 'Roboto Slab', serif;
}
h1, h1 a { font-size: 2.5rem; }
h2, .post-content .post-body h2 { font-size: 1.6rem; }
h3, .post-content .post-body h3 { font-size: 1.3rem; }

blockquote {
border-left: 2px solid #00CCB4;
border-radius: 3px;
background: #ffffff0d;
padding-left: 1rem;
}

.page-header__container {
padding: 1rem 0;
}

page-header {

max-width: 1200px;
margin: 0 auto;
padding: 0;
}

footer {

background: #060913;
}

footer .footer__container {

padding: 0.5rem 0 0 0;
}
.button svg path { /* Burger menu icon */
fill: #00CCB4;
}

.footer--blog-page {
background: #060913;
box-shadow: 0 1px 3px 3px #000000c4;
}

.scroll-to-top__container {
background: #00CCB4;
}

ul {
list-style: square;
margin-top: 0;
}

ul li {
margin: 0;
line-height: normal;
}
/.post-content .post-body p:not(:last-child) {
margin: 1rem 0 0 0;
}/

svg path {
fill: #00CCB4;
}

/* Home Page */

.page-header__container {
background: #060913;
}

author-profile {

background: #0b1021;
padding: 0 4vw;
max-width: 1200px;
margin: 0 auto;
}

author-posts .author-post {

background: #060913;
height: 10rem;
box-shadow: 1px 1px 2px #000000cf;
transition: box-shadow 250ms;
border-color: #ffffff1a;
overflow: hidden;
}

author-posts .author-post:hover,

author-posts .author-post:focus {

box-shadow: 1px 1px 6px #00ccb4;
}

@media screen and (max-width: 992px) {
#author-posts .author-post {
height: auto;
}
}

author-posts .post-title {

font-size: 1.2rem;
line-height: 1.8rem;
}

.header-author-info {
display: none;
}

author-profile .older {

padding: 1rem 0;
}

.post-preview .read-more-link {
display: none;
}

/* Post Page */

.single-post-show {
background: #060913 !important;
padding-top: 0.5rem;
}

.single-post-show .post-content {
background: #0b1021;
border-radius: 10px;
border: 7px solid #141b33;
padding: 1% 5%;
max-width: 1200px;
margin: 1rem auto;
box-shadow: 1px 2px 4px 2px #000000cf;
}

.page-header__container--post {
background: #060913;
}

.single-post-show, #single-post-footer {
background: #0b1021;
border-top: 1px solid #00CCB4;
}

h3.more-from .headline-separator {
display: none;
}

@media (min-width: 992px) {
.single-post-show {
padding: 0 8vw 56px;
}
}

.callout, .card {
background: #060913;
color: #d8d8d8;
box-shadow: 1px 2px 4px #000000cf;
}

/* Code Highlighting */
pre.highlight {
background: #141b33;
}
code.prettyprint {
background: #141b33 !important;
border-color: #00ccb438 !important;
}

.highlight .c, .highlight .ch, .highlight .cd, .highlight .cpf { color: #626483; }
.highlight .s, .highlight .s1, .highlight .sx { color: #00f769; }
.highlight .nb, .highlight .nx, .highlight .nc { color: #ea51b2; }
.highlight .kd, .highlight .ni { color: #b45bcf; }
.highlight .o, .highlight .m { color: #b45bcf; }
.highlight .nl, .highlight .na { color: #62d6e8; }
.highlight .k { color: #62d6e8; }
.highlight .nt { color: #b45bcf; }
.highlight .nv { color: #a1efe4; }
.highlight .err { color: #ff0073; background: #262e4c; }

input.text-field {
background: #141b33;
color: #fff;
}

/* Post Page Mobile Adjustments */
@media screen and (max-width: 992px) {
.single-post-show .post-content {
border: 0;
border-radius: 3px;
padding: 1rem;
}
}

/* Scroll to top arrow */
.button.scroll-to-topbutton {
background: #00CCB4;
opacity: 0.8;
}
.button.scroll-to-topbutton:hover {
opacity: 1;
}
.scroll-to-topcontainer {
background: #141b33 !important;
}
.scroll-to-topicon path {
fill: #00CCB4 !important;
}

/* Horizontal Rule */
hr {
height: 0;
padding: 0;
margin: 1.5rem 0;
border-bottom: 1px dashed #12cdd757 !important;
}
hr::before {
content: none;
}

/* Thank Page */
.callout--success {
border-left: 3px solid #00CCB4;
}

/* Guestbook Page */
.button--primary {
background-image: linear-gradient(0deg, #9660ec 50%,var(--page-menu-link-color) 0);
}

/* Form Elements */
textarea.text-field:focus, input.text-field:focus {
border: 1px solid #00CCB4;
outline: none;
box-shadow: 1px 1px 6px #00ccb4;
}

textarea.text-field, input.text-field {
background: #141b33;
}

.button--disabled {
background: #272f4d;
cursor: not-allowed;
color: #d8d8d899;
}

/* Author Settings */
.my-postsitem,
a.my-postspost,
.p3.postdetails,
.resourceslink,
.payment-detailscredential,
.entry-detailsitem,
.entry__details--private strong {
color: #d8d8d8 !important;
}
textarea#author-bio, button.button--no-fill {
background: #141b33;
color: #d8d8d8 !important;
}
button.button--active {
background: #00CCB4;
color: #060913 !important;
}

button.button--no-fill svg path {
fill: #00CCB4 !important;
}
button.button--active svg path {
fill: #0b1021 !important;
}

.my-postsitem a.my-postspost .postdetails .post-detailsicon g path {
fill: #00CCB4;
}
.hover-content .hover-content__icon-container {
background: #00CCB4;
}

resources .resourceslist li, .my-postsitem {

border-bottom: 1px dashed #12cdd757;
}

.error-message {
color: #f80363;
}

li.section__container {
box-shadow: 2px 2px 4px #000;
}

/* All Posts Page */

author-all #author-posts {

display: flex;
flex-direction: column;
max-width: 1000px;
margin: 0 auto;
padding: 1rem;
}

author-all #author-posts .author-post {

height: auto;
padding: 1rem;
margin: 0.5rem auto;
}

/* Text Highlight */
::selection {
background-color: #00ccb4;
color: #0b1021;
}