:root {
    font-size: 18px;

    --bg-color: #f8f5f0;
    --text-color: #2e2a25;
    --primary-color: #3A7BDE;
    --accent-color: #D95B43;
    --highlight-color: #F2C849; /* #FFBE0B; */

    /* color; value=80 */
    --text-tint: #4A4A4A;
    --primary-tint:  #EDF1FB;
    --primary-tint-dark: #9FC8F0;
    --accent-tint: #FBE7E3;
    --highlight-tint: #FEF7D9;

    --text-shade: #1A1A1A;
    --primary-shade: #3B5C85;
    --accent-shade: #B5422E;
    --highlight-shade: #B89A2D;

    --blues-1: #1B1E2B;
    --blues-2: #121627;
    --blues-3: #0F111C;

    --greys-1: #EAE8E3;
    --greys-2: #C4C2BD;
    --greys-3: #1F1F1F;
    --greys-4: #0C0C0C;

    --dark-bg-color: #1A1A1A;

    --success-color: #5CA653;
    --success-tint: #ECF8F0;
    --success-shade: #1E6D33;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: var(--body-font);
}

body.centered #container, body.centered #container-top, body.centered #container-bottom, .center-child {
    justify-content: center;
}

body.wide #container {
    max-width: 100%;
}


a {
    color: var(--accent-color);
    text-decoration: none;
}


.article-header-center h1, .article-header-center h2 {
    text-align: left;
}

.subtitle-block {
    max-width: 800px;
    text-align: center;
    margin: 2.5rem auto;
    color: #0C1020aa;
    font-family: var(--body-font);
    font-weight: normal;
    font-style: italic;
    opacity: 0.8;
}

.subtitle-block * { margin: 0; }

body.landing #main {
    max-width: none;
}


/* Header tweaks */

h2.headline {
    font-size: 1.5rem;
}


/* Header separator */

.heading-separator {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    font-weight: 300;
    font-size: 1rem;
    max-width: 50rem;
    margin: 3rem auto 1rem auto;
}

.heading-separator:before,
.heading-separator:after {
    content: '';
    border-top: 1px solid;
    margin: 0 20px 0 0;
    flex: 1 0 20px;
}

.heading-separator:after {
    margin: 0 0 0 20px;
}


.content-spacer{
    margin-top: 2rem;
}

.article-header-image {
    height: 30rem;
    margin: 0;
    background-size: cover;
    background-position: 50% 50%;
    width: 100%;
    background-repeat: no-repeat;
}

/* Header */

#header.header-large {
    padding: 0;

}

#header .header-large-navigation {
    max-width: 1080px;
    margin: 0 auto;
    text-align: center;
}





.header-image-container {
    padding: 0;
    height: 30rem;
}




.header-image {
    height: 30rem;
    border: 0;
    padding: 0;
}


.logo {
    padding: 0 1rem;
}


.logo img {
    width: 100%;
    max-width: 200px;
    display: block;
}

.site-title a {
    font-weight: bold;

}



.center {
    text-align: center;
}


/* Home blocks */

.about p {
    margin-top: 0;

}

.links h4 {
    margin: 0.5em 0 0 0;
    text-transform: uppercase;
}

.navlist {
    list-style: none;
    margin: 0 0 2rem 0;
    padding-left: 0;
    font-size: 1rem;
    font-weight: 500;
}

.navlist a {
    text-decoration: none;
}

.wyltkm {
    text-transform: uppercase;
    font-weight: normal;
    font-size: 0.8em;
}


/* Blocks */

.block-container {
    color: #000a;
}

#academy .block-container {
    margin-bottom: 1rem;
}

.block-container img {
    max-height: 25rem;
    margin: 0 auto;
}

.block h1 a {
    color: #000a;
    font-weight: 400;
}

.block h2 {
    font-weight: normal;
    font-size: 1.2rem;
    color: #EB5160;
}

.block {
    max-width: 1080px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.block li a, .block-label {
    color: #FFD141;
    font-size: 0.8em;
    background-color: rgba(255,255,255,0.1);
    padding: 0.25rem 0.5rem;
    white-space: nowrap;
}


.block ul {
    margin: 0;
    padding: 0;
}

.block li {
    display: inline;
}

.block li a {
    text-decoration: none;
}


.social-links a {
    margin: 0 1rem;
}

.social-links a:hover {
}


.fa-external-link-square-alt {
    font-size: 0.75em;
}



/* Navigation */

.navigation-bars {
    display: block;
    text-align: left;
    padding: 0;
}

.navigation-bar {
    margin: 2rem auto 2rem auto;
}

.navigation-top {
    margin-top: 0.5rem;
    text-align: right;
    padding: 0 1rem;
}

.pure-menu-item {
    float: left;
    font: 400 1rem var(--body-font);
    letter-spacing: 0.1em;
}

.pure-menu-item .pure-button, .pure-menu-item .user-btn {
    letter-spacing: normal;
}


.pure-menu-link {
    padding: 0.5rem 1rem;
}

.pure-menu-item small {
    opacity: 0.7;
}

.pure-menu-children .pure-menu-item {
    font-weight: 400;
    text-align: center;
}

.pure-menu-children .pure-menu-item a {
    font: 0.9rem var(--code-font);
    text-transform: none;
    color: #000a;
    background-color: #222;
}

.pure-menu-children .pure-menu-item a small {
    color: #888;
}

li.pure-menu-allow-hover:hover .pure-menu-link,
li.pure-menu-allow-hover:hover .pure-menu-children {
    background-color: #222;
    color: #000a;
}

.pure-menu-children a.pure-menu-link:hover {
    /* color: #000a; */
    background: rgba(255, 255, 255, 0.1);
}

#navigation {
    max-width: 1080px;
    margin: 2rem auto 0;
    position: relative;
}

.pure-menu-link:focus,
.pure-menu-link:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.navigation-bar .pure-menu-link,
.subscribe-button a {
    color: var(--text-color);
}

.navigation-bar .pure-menu-selected .pure-menu-link {
    background-color: #080F0F !important;
    color: #000a;
    transform: rotate(-1deg);
}

.navigation-left,
.user-links,
.user-links li {
    text-align: right;
}

.navigation-right {
    text-align: left;
}

.menu-highlight {
    color: #FFD141 !important;
}

.user-links {
    margin: 0;
    padding-left: 0;
}

.user-links li {
    display: inline;
    list-style: none;
}




.user-btn {
    background: #000;
    color: #fff;
    padding: 0.25rem 1rem;
    text-decoration: none;
    border-radius: var(--radius);
    white-space: nowrap;
    line-height: 1.75;
    border: none;
    cursor: pointer;
    margin-right: 0.25rem;
    margin-left: 0.25rem;
    position: relative;
    bottom: -0.25rem;
}


/* Scrollable on smaller pages */

@media screen and (max-width: 64em) {
    #navigation.header {
        overflow-x: scroll;
    }
}

@media screen and (min-width: 64em) {
    #navigation .pure-menu-has-children {
        display: inline-block;
    }
}

.dateline {
    text-transform: uppercase;
    font-size: 0.75em;
}

.dateline:after {
    content: "\2014";
}

/* Book showcase */

#book-showcase {
    display: none;
    position: absolute;
    right: 1.5rem;
    bottom: 0.5rem;
}



.metadata-footer {
    font-family: var(--code-font);
    margin: 1rem 0;
}
.metadata-footer a {
    text-decoration: none;
    color: var(--accent-color);
}


.article-series-list li.active, .article-series-list li.active a {
    color: #81C784 !important;
}

h4.continuereading {
    color: #B0B0B6;
    margin-bottom: 0.25rem;
}

/* Article lists */

.article-after {
    margin: 3rem 0;
}

.article-after h2 {
    margin: 0;
}

.article-after-item  {
    padding: 0 0.5rem;
    font-size: 1rem ;
    line-height: 1.5;
}

.article-after-item a {
    text-decoration: none;
}

.article-after-item {
    margin-bottom: 1rem;
}

.article-after-item small {
    font-size: 0.9rem;
    color: #0C1020aa;
}
/* Article series */

.article-series {
    margin: 2rem 0;
    background-color: #080F0F11;
    padding: 1rem 1rem;
}

.article-series h4 {
    margin: 0;
}

.article-series li {
    line-height: 1.75rem;
}

.article-series a {
    text-decoration: none;
}


/* Notes */

.footnote {
    font-size: 0.9rem;
    line-height: 1.5em;
}


/* Jupyter notebook import */

.article-wrap-notebook .prompt {
    display: none;
}

.article-wrap-notebook .cell, .article-wrap-notebook .text_cell_render {
    padding-left: 0;
    padding-right: 0;
}



.special-menu-link {
    background-color: #FCD741;
    transform: rotate(1deg);
}

.special-menu-link:hover {
    background-color: rgba(255,186,8,0.5) !important;
}


/* Footer */
footer {
    line-height: 1.5em;
    margin-top: 4rem;
    padding: 5rem;
    font-size: 1rem;
}

footer h5 {
    color: #0C1020;
}

.footer-section {
    margin: 0 1rem;
    text-align: center;
}

.footer-final {
    margin: 1rem 0;
    color: #0C102088;
}

footer p {
    font-size: 1rem;
    margin: 0;
    text-align: center;
}

footer a {
    text-decoration: none;
}

footer li {
    padding-bottom: 0.5rem;
}

.footer-links {
    max-width: 1600px;
    margin: 1rem auto;
}

.footer-links h5 {
    margin: 0.5rem 0;
}

.footer-links ul {
    list-style: none;
    line-height: 1.25em;
    font-weight: 500;
    margin:0 0 1.5rem 0;
    padding: 0 1rem;
    font-size: 1rem;
}



/* Series */

.series-label {
    background-color: rgb(66, 184, 221, 0.5);
    padding: 3px 8px;
    white-space: nowrap;
    line-height: 2em;
    color: #333333;
    font-weight: normal;
}

.series-metadata {
    line-height: 1.5em;
    max-width: 50rem;
    margin: 0 auto;
}

.series-metadata h2 {
    font-size: 3rem;
    line-height: 1.1em;
    margin-bottom: 0;
}

.series-metadata ol {
    font-family: 'Raleway', 'Futura', 'Century Gothic', 'AppleGothic', sans-serif;
    font-size: 1rem;
    margin: 1rem;
}

.series-metadata li a {
    color: #E85F5C;
    text-decoration: none;
}

.series-block-highlight {
    background-color: #f7f7f7;
    width: 100%;
    padding: 2rem 0;
}

.series-block-highlight .series-block-title {
    font-family: 'Raleway', 'Futura', 'Century Gothic', 'AppleGothic', sans-serif;
    font-size: 2rem;
    opacity: 0.3;
    text-align: center;
    margin-top: 0;
    margin-bottom: 0;
}

.series-block-highlight .object-small, .series-block-highlight .object-container {
    mix-blend-mode: multiply;

}

.object-featured {
    margin: 0.5rem;
}

.object-featured a {
    display: block;
    position: relative;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    height: 15rem;
}

.site-name {
    max-width: 28rem;
    font-size: 1rem;
    margin: 3rem auto;
    padding: 0.75rem 1rem;
    font-weight: bold;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
}

.site-name small {
    font-weight: normal;
    font-size: 0.8em;
}

.site-name a {
    text-decoration: none;
    color: #080F0F;
}

.welcome {
    max-width: 28rem;
    font-size: 2rem;
    margin: 3rem auto;
    padding: 0 1rem;
    text-align: left;
}

.welcome .small {
    font-size: 0.5em;
    line-height: 1;
}

.welcome a {
    text-decoration: none;
    color: #080F0F;
    font-weight: bold;
}

.welcome p {
    margin: 0;
}


/* Tags */


.tag {
    font-family: var(--code-font);
    line-height: 1em;
    padding: 0.125rem 0.5rem;
    margin-right: 0.125rem;
    text-decoration:none;
    text-transform: uppercase;
    color: #fff  !important;
    white-space: nowrap;
    letter-spacing: 0.001em;
    background-color: #0C1020 !important;
    border-radius: var(--radius);
}



h1.tag-page {
    margin-top: 5rem;
    line-height: 1.5;
}

h1.tag-page .tag {
    font-size: 3rem !important;
}


/* Callouts */

.excerpt {
    margin: 0 0 0 -2rem;
    padding: 1rem 1.5rem;
    border-left: 5px solid #FCD741;
    background-color: #FCFDFE;
    font-size: 1rem;
    font-family: var(--code-font);

}



/* Relate */

.series-continue {
    font-size: 1rem;
    text-align: right;
    margin: 1.5rem auto;
    font-style: italic;

}

.related a {
    text-decoration: none;
}

.service-note {
    font-style: italic;
    font-size: 0.9rem;
}


/* Product list (book) */
.product-list-item {
    margin: 1rem 0;
    padding: 2rem;
}


.product-list-title {
    margin: 0.5rem 0 0 0;
}

.product-list-metadata {
    color: #555;
    font-size: 0.8rem;
    margin: 0.5rem 0;
}

.product-list-what {
    color: #aaa;
    font-size: 0.8rem;
    margin: 0.5rem 0 2rem 0;
}

.also-available {
    margin: 3rem auto;
    text-align: center;
    font-size: 0.8rem;
}

/* Products */

.product {
    position: relative;
    background-color: #222;
    margin: 2rem 0 0.5rem 0;
    padding: 2rem 1.5rem;
    border-radius: 5px;
}

.product .sale-notice {
    background-color: #FFD141;
    color: #0D1F2D;
    font-size: 0.9rem !important;
    padding: 0.5rem 1rem;
    margin: 1rem -1.5rem -2rem -1.5rem;
    border-radius: 0 0 5px 5px;
    text-align: center;
}

.product-snippet {
    margin: 2rem 0 0.5rem -2rem;
    border-color: #eee;
    border-style: solid;
    border-width: 1px 0;
    padding: 1rem 1.5rem;
}


.product-snippet a {
    whitespace: nobreak;
    color: #009FB7;
}


.product-snippet p {
    font-family: var(--code-font);
    margin: 0;
    line-height: 1.5em;
}





.toc {
    margin: 2rem auto;
    background: #EDF4F8;
    padding: 1rem 2rem;
    max-width: 50rem;
    border-radius: 5px;
}

.toc ul {
    margin-bottom: 0.5rem;
}

.toctitle {
    font-size: 1.5rem;
}

.toc a,
.toc span {
    color: #272838;
}


.landing-part .product-alternate {
    margin: 2rem 0 0 0;
    font-size: 0.9rem;
    color: rgba(255,255,255,0.5);
}

.landing-part .product-alternate a {
    color: #000a;
}

.product h3 {
    margin: 0 0 0.5em;
    font-size: 2rem;
}

.product h3 a {
    font-weight: bold;
    color: #ccc !important;
}


.product p {
    color: #FEFCFD;
    font-family: var(--code-font);
    margin: 0;
    line-height: 1.5em;
}

.product p a {
    color: #009FB7;
}


.product-smallprint p {
    margin-top: 1rem;
    font-size: 0.9rem !important;
    color: rgba(255,255,255,0.4);
    text-align: center;
}

.product-details {
    margin-top: 0.5rem;
}

.product .product-actions {
    margin: 1rem 0 0;
}

.product-components {
    font-style: italic;
}

.product .button-info {
    background: none;
}

.product-image {
    margin: 0;
}




/* Social */

#social-links {
    text-align: right;
    position: fixed;
    z-index: 100;
    right: 1rem;
    bottom: 1rem;
}

a.social {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    margin-right: 0.25rem;
    min-width: 1em;
    color: #000a;
    opacity: 0.9;
    text-decoration: none;
}

a.social:hover, a.social:active, a.social:visited {
    color: #000a;
    opacity: 1;
    text-decoration: none;
}


.sidebar-clear-marker {
    height: 2rem;
}

.clear-marker {
    height: 2rem;
    clear: both;
}


.google-ad-block {
    margin: 2rem 0;
}

/* Tags & Category */


h2 .tag, h3 .tag {
    font-size: 0.6em;
}


/* Pagination */


.paginator {
    margin-top: 1rem;
    text-align: center;
    color: #0C102088;
}

.paginator a {
    display: inline-block;
    padding: 0.25em 1rem;
    margin-left: 0.5em;
    margin-bottom: 0.25rem;
    font-size: 1em;
    font-weight: bold;
    border: none;
    word-spacing: 0;
    text-decoration: none;
    background-color: #0C102011;
    border-radius: 5px;
}

.paginator a.active { background-color: #0C1020; color: #fff;}


/* Jumbotron */

.jumbo-container {
    max-width: 50rem;
    margin: 2rem auto;
}

#jumbotron {
    padding: 0 1rem;
    }

#jumbotron h1 {
    color: #000a;
    text-transform: none;
}
#jumbotron p {
    font-family: var(--code-font);
    margin: 0;
    font-size: 1.5rem;
    line-height: 1.5em;
    color: #90A4AE;
    text-align: center;
}

#jumbotron a {
    color: #000a;
    font-weight: bold;
    text-decoration: none;
}

#jumbotron p strong { color: #000a; }

/* Intro blocks for tag/category pages */



.intro, .callout {
    margin: 0 auto;
}

.intro p, .outro p {
    font-size: 1rem;
    line-height: 1.75;
    color: #333333;
}

.snippet p {
    font-size: 1.1rem;
}


.intro p strong, .outro p strong { color: #080F0F; }

.outro p, .snippet p {
    text-align: center;
    transform: rotate(1deg);
}




.object-group {
    width: 100%;
    max-width: 1600px;
    margin: 1rem auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}


.object-group-narrow {
    width: 100%;
    max-width: 1000px;
    margin: 1rem auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}


.object-wrapper {
    position: relative;
}


.object-container {
    display: block;
    position: relative;
    padding: 1.5rem 2rem;
    margin: 0.5rem;
    min-height: 18rem;
}


.object-image {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

.object-hero {
    min-height: 25rem;
}

.object-hero .object-image {
    background-size:contain;
}


.object-small {
    position: relative;
    margin: 2rem 0rem;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    padding: 0;
    vertical-align: top;
}

.object-small .post-card-excerpt a {
    font-size: 1.1rem;
    color: #0C102088;
}


.object-small-top {
    display: block;
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    aspect-ratio: 1080 / 566;
    margin: -2rem -1rem 1rem -1rem;
}

.collection-object-tall {
    display: block;
    position: relative;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
    height: 20rem;
}

.collection-object-bottom a {
    text-decoration: none;
    color: #080F0F;
}

.object-small-bottom {
    display: block;
    padding: 0.25rem 0rem;
    line-height: 1.3;
}

.object-small h2 {
    font-size: 1.75rem;
    line-height: 1;
    margin: 0;
}

.object-small h2 a {
    color: #0C1020;
}


.object-small-bottom {
    text-decoration: none;
}

.object-container .article-tag {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    font-size: 0.9rem;
}

.object-small-category-tags {
    margin: 0.5rem 0rem;
}


.object-category-tags a, .object-category-tags span, .object-category-tag {
    font-family: var(--code-font);
    padding: 1px 5px;
    margin-right: 1px;
    text-decoration:none;
    text-transform: uppercase;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.001em;
    border-radius: 5px;
}

h1 .object-category {
    font-size: 3rem !important;
    border-radius: 5px;
}

.article-header .object-category-tags {
    margin-bottom: -1em;
}

.object-category, .object-category-tag, .object-site {
    border: 1px solid #0C102088 !important;
    color: #0C1020 !important;
}

.object-tag {
    background-color: #0C1020 !important;
    color: #fff !important;
}

.object-issue {
    background-color: #0C1020;
    color: #fff !important;
}

.object-list-icons {
    position: absolute;
    top: 0.25rem;
    right: 1rem;
    font-size: 1.5rem;
}

.object-list-icons a {
    color: #000a;
}

.object-description {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    display: block;
    text-decoration: none;
    line-height: 1.2;
}

.object-description h2 a {
    background-color: #080F0F;
    color: #000a;
}

.object-description h2 {
    color: #000a;
    margin: 0.5rem 0;
    font-size: 2.1rem;

}

.object-syndicated {
    color: #0C102088;
    margin: 0.5rem 0;
    line-height: 1.5rem;
}

.object-syndicated-title {
    margin-left: 0.5rem;
}

.object-description h2, .article-description h2 a {
    color: #000a;
}

.object-description p {
    margin-top: 0;
    color: #0C102088;
    font-size: 1.3rem;
}

.object-timestamp {
    position: absolute;
    font-size: 0.7rem;
    top: 1rem;
    left: -0.25rem;
    color: #080F0F;
    background-color: #FCD741;
    padding: 0.1rem 0.25rem;
    border-left: 3px solid #CFB036;
}


.object-no-image {
    margin: 0.5rem;
    padding: 2rem 1rem;
    background-color: #fff;
    border-radius: var(--radius);
    border: solid 3px var(--text-color);
    box-shadow: inset 0 -5px 0 0 rgba(0, 0, 0, 0.1);
}

.object-no-image h2, .object-no-image h2 a {
    font-size: 1.25rem;
    font-weight: normal;
    color: var(--text-color);
    font-weight: 800;
    margin: 0.5rem 0;
}

.object-course-logo {
    padding: 0px 5px;
    width: 150px;
    margin: auto;
    border-radius: 5px;
}

.object-course-logo .course-logo {
    width: 120px;
    height: 40px;
}

.object-no-image h2 .object-category, .object-no-image h2 .tag {
    font-weight: normal !important;
}

.object-no-image-description {
    font-size: 1.1rem;
    color: var(--text-color);
    margin: 1rem 0 0 0 ;
}

.object-no-image-tags {
    margin: 1em 0;
}



.object-gallery a {
    margin: 0.5rem 0 0 0;
    display: block;
    height: 5rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.object-indicator-source, .primary-tag {
    background-color: var(--accent-color);
    color: #fff;
    padding: 0 0.5rem;
    transform: rotate(-1deg);
    margin-left: -1.5rem;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 700;
}

.primary-tag {
    font-size: 1.25rem;
}

.syndicated-site-name {
    text-align: center;
    margin: 4rem 0 0 0;
}

/* Callouts & Mailing list signup */


.callout-box {
    clear: both;
    margin: 5rem auto 1rem auto;
    max-width: 50rem;
}


.landing-sample {
    margin-top: -1rem;
    padding-bottom: 1.5rem;
}



.article-listing {
    width: 100%;
    max-width: 900px;
    margin: 2rem auto;
}


.email-signup {
     background: #f5f5f5;
     padding: 1rem 2rem;
     margin: 1rem 0;
     border-radius: 5px;
}

.email-signup-icon {
    opacity: 0.2;
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    font-size: 1.5rem;
}

.email-interest-groups {
    margin: 1rem 0;

}

.email-interest-groups label {
    font-family: var(--code-font);
}

.email-signup h4 {
    margin: 0;
}

.email-signup p {
    font-family: var(--code-font);
    font-size: 1rem;
    margin-top: 0;
    margin-bottom: 0.5rem;
}



.email-signup input {
    color: #080F0F;
    line-height: 2rem;
}



.tag-list {
    line-height: 2;
}


.moneyback {
    text-align: center;
    padding: 2rem 0;
}

.sampledownload {
    text-align:center;
}

/* Home and indexes */


article video {
    margin: 1rem auto;
    width: 100%;
}

/* Article pages */



div.requirements thead {
    background: none;
    line-height: 0;
}

div.requirements tr th {
    font-weight: bold;
    padding-bottom: 1rem;
}

.email-signup h3 {
    color: #009FB7;
    margin-top: -2rem;
    margin-bottom: 1rem;
    font-size: 3rem;
    text-shadow: 2px 2px #080F0F, 4px 4px #080F0F;
    margin: none;
    padding: 0;
}

.footnote-ref {
    padding: 0.5rem 0.25rem;
    margin: 0 0.25rem;
    background-color: #EDDD3E;
    transform: rotate(5deg);
    color: #080F0F;
    text-decoration: none;
    display: inline-block;
}



.see-also .navigation-bar {
    font-size: 1rem;

}

.product-callouts {
    max-width: 640px;
    margin: 3rem auto;
}

.product-callout {
    font-family: var(--code-font);
    display: block;
    margin: 1rem auto;
}

.product-callout-notice {
    font-size: 1.25rem;
    transform: rotate(-0.25deg);
}

.product-callout-image {
    height: 300px;
    z-index: -5;
    margin: 0 auto -150px auto;
}

/* Timeline */

.added-marker {
    font-family: var(--code-font);
    background-color:#080F0F;
    color: #000a;
    font-size: 0.8rem;
    padding: 0.05em 0.5em;
    text-transform: uppercase;
}



/* Buttons */

.pure-button {
    background: #080F0F;
    color: #FEFCFD;
}

.button-success,
.button-error,
.button-warning,
.button-secondary,
.button-product {
    text-shadow: 0px 2px 1px rgba(0, 0, 0, 0.3);
}


.button-product, a.button-product {
    color: #FEFCFD !important;
    background: #4CAF50;
    border: #367c39;
    border-width: 0 0px 3px 0;
    font-size: 1.25em;
}

.link-affiliate, a.link-affiliate {
    color: #009FB7 !important;
}



.button-transparent {
    background-color: transparent;
}

.button-success {
    background: rgb(28, 184, 65); /* this is a green */
}

.button-error {
    background: rgb(202, 60, 60); /* this is a maroon */
}

.button-warning {
    background: rgb(223, 117, 20); /* this is an orange */
}

.button-secondary {
    background: rgb(66, 184, 221); /* this is a light blue */
}

.button-info {
    background: rgb(22, 23, 33); /* this is a dark grey */
}

.button-product, a.button-product {
    color: #FEFCFD !important;
    background: #DE3C4B;
    border: solid #b13028;
    border-width: 0 0px 3px 0;
    font-size: 1.25em;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.button-toggle {
    padding: 0.5rem 0.5rem;
    font-size: 0.8rem;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.button-checked, a.button-checked, button.button-checked, input.button-checked  {
    background: rgb(28, 184, 65) !important; /* this is a green */
    color: #000a !important;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.button-favorite, a.button-favorite, button.button-favorite, input.button-favorite  {
    background: #EDDD3E !important; /* this is a green */
    color: #000a !important;
    border: solid #c6ba2f;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.pure-button-primary, a.pure-button-primary, button.pure-button-primary, input.pure-button-primary {
    color: #000a !important;
    background: #DE3C4B;
    margin-right: 0.5rem;
}

.button-join, a.button-join, button.button-join, input.button-join {
    color: #000a !important;
    background: #DE3C4B;
    border: solid #b13028;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    margin-right: 0.5rem;
}

.button-subscribe {
    color: #000a !important;
    background: #DE3C4B;
    border: solid #b13028;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.button-unlock, span.button-unlock, a.button-unlock, button.button-unlock, input.button-unlock  {
    color: #745F1E !important;
    background: #FFD141;
    border: solid #BA9930;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    margin-right: 0.5rem;
}

.button-start, span.button-start, a.button-start, button.button-start, input.button-start  {
    color: #EAF8EB !important;
    background: #1CB824;
    border: solid #17971E;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    margin-right: 0.5rem;
}


.button-buy, a.button-buy, button.button-buy, input.button-buy {
    color: #fff !important;
    background: #DE3C4B;
    border: solid #b13028;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    margin-right: 0.5rem;
    margin-bottom: 0.5rem;
}

.button-info {
    color: #fff !important;
    background: #111;
    border: solid #000;
    border-width: 0 0px 3px 0;
    text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    margin-right: 0.5rem;
    margin-bottom: 0.5rem;
}



.downloads-line {
    line-height: 2.2em;
}


a.button-download {
    color: #fff;
    background-color: #0d1f2d;
}

/* Breadcrumbs */

#breadcrumbs {
    margin: 0.25rem 0;
}

#breadcrumbs ol {
    padding: 2rem 0 0 0;
    margin: 0;
    list-style: none;
}

#breadcrumbs li {
    display: inline;
    font-size: 0.8rem;
}

#breadcrumbs li a {
    text-decoration: none;
    color: #888;
}


/* Progress bars */


.controls-container {
    margin-top: 1rem;
}

.progress-container {
    margin-top: 1rem;
}


.progress-bar {
}

a.progress-left, span.progress-left {
    line-height: 1rem;
    font-size: 1.5rem;
    background-color: #E9EBEF;
    border-radius: 5px 0 0 5px;
    color: #0D1F2D;
}

a.progress-right, span.progress-right {
    line-height: 1rem;
    font-size: 1.5rem;
    background-color: #E9EBEF;
    color: #0D1F2D;
    border-radius: 0 5px 5px 0;
}


.progress-middle {
    position: relative;
    text-align: center;
    background-color: #0D1F2D;
}

.progress-text {
    position: relative;
    line-height: 1.25rem;
    padding-top: 1rem;
    font-size: 1.5rem;
    vertical-align: middle;
    display: inline-block;
    color: #000a;
    z-index: 2;
}

.progress-bar {
    position: absolute;
    background-color: #376F9F;
    opacity: 0.7;
    height: 3rem;
    top: 0rem;
    z-index: 1;
}


.localized-price {
    background: rgba(0,0,0,0.05);
    border-radius: 20px;
    padding: 0.25em 0.5rem;
}

/* Metadata */


.byline {
    font-size: 1rem;
    line-height: 1.5em;
    margin-bottom: 1rem;
}

.byline-avatar {
    display: inline-block;
    vertical-align: bottom;
}

.byline a {
    color: #E85F5C;
}

.byline-block {
    display: inline-block;
    padding-left: 0.25rem;
}

.byline-part {
    padding-right: 0.5em;
}



/* Social */

.social-complete {
    margin: 1rem 0;
    padding: 0.5rem 1rem;
    background-color: #000AED;
    color: #D1AC36;
    font-size: 0.8rem;
    text-align: center;
    line-height: 1.5;
}


.social-complete a {
    text-decoration: none;
    color: #D1AC36;
}

.comment { color: #0d1f2d !important; }
.twitter { color: #1da1f2 !important; }
.rss { color: #ff6600 !important; }
.linkedin { color: #0077b5 !important; }
.top { color: #f44336 !important; }
.facebook { color: #3b5998 !important; }
.reddit { color: #FF5700 !important; }
.youtube { color: #ff0000 !important; }
.email { color: #888888 !important; }


.sso-twitter { background-color: #1da1f2 !important; }
.sso-linkedin { background-color: #0077b5 !important; }
.sso-facebook { background-color: #3b5998 !important; }
.sso-reddit { background-color: #FF5700 !important; }
.sso-google { background-color: #DB4437 !important; }

/* Video Unlock Box */


.helptext {
    display: block;
    color: #888;
    font-size: small;
}

.video-unlock-box {
    width: 100%;
    color: #080F0F;
    padding: 2rem 0;
    position: relative;
    line-height: 1.8em;
    font-size: 1rem;
    text-align: center;

    background-color: #eee;
    background:repeating-linear-gradient(
      45deg,
      #eaeaea,
      #eaeaea 10px,
      #f5f5f5 10px,
      #f5f5f5 20px
/*    #326591,
      #326591 10px,
      #2E5B83 10px,
      #2E5B83 20px
      */
    );
}



.video-unlock-box a {
    color: #E85F5C;
    text-decoration: none;
}

.tell-me-more {
    font-size: 0.9rem;
    text-decoration: none;
}

.video-unlock-container {
}

.video-unlock-container p {
    margin: 0.5rem 0;
}

.fade {
    opacity: 0.3;
}


small.submenu-notice {
    color: #000a;
    padding-top: 1em !important;
    padding-bottom: 1em !important;
    text-transform: uppercase;
    font-size: 0.6rem;
}

/* Authors */

.author-block {
    font-family: var(--code-font);
    font-size: 1.1em;
    font-weight: 300;
    padding: 1rem;
    border-radius: 5px;
    background-color: rgba(29,161,242,0.05);
    margin: 1rem 0;
}

.author-block strong {
    font-weight: 600;
}

.author-block .author-avatar {
    float: left;
    width: 64px;
    height: 64px;
}

.author-block .author-bio {
    margin-left: 80px;
    color: rgba(0,0,0,0.5);
}

.author-block .author-bio p {
    margin-top: 0;
}

.author-block .author-invite {
    margin: 1rem 0 0 0;
    text-align: right;
    color: rgba(0,0,0,0.5);
}



.product-box {
    margin: 0.5rem 0;
}

.product-inner {
    background: rgba(255,255,255,0.1);
    padding: 3rem 2rem;
}

.landing-part .product-about {
    font-size: 0.9rem;
}

.feature-list {
    list-style: none;
    padding: 0;
}

.feature-key {
    padding: 0.25em 1em;
    background-color: #000a;
    color: #080F0F;
    text-transform: uppercase;
    font-size: 0.8rem;
    margin: 0 0.25em;
    white-space: nowrap;
}

.feature-key-highlight {
    background-color: #FFD141
}

.product-box p, .product-box h2 {
    text-align: center;
    margin: 0.5rem 0;
}

.product-about {
    font-size: 0.9rem;
}


.small {
    font-size: 0.9rem !important;
}


.smallprint {
    font-size: 0.9rem !important;
    color: rgba(0,0,0,0.5);
}

/* Academy */

#academy .course-block {
    margin-top: 1rem;
}

.tag-course-block {
    margin: 2rem 0 5rem 0;
}

body.academy .course-statistics {
    text-align: center;
    text-transform: uppercase;
    font-size: 0.8rem;
    padding-right: 1.8rem;
}

body.academy .course-stat {
    color: #EB5160;
    margin-left: 1rem;
    white-space: nowrap;
}

/* Header themes */


@media screen and (max-width: 768px) {
    .padding-collapse {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .margin-collapse {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

}




.course-logo {
    display: inline-block;
    width: 150px;
    height: 40px;
    margin: 0 1rem;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}




.strikethrough span {
    text-decoration: line-through;
}

.profile-avatar {
    width: 32px;
    height: 32px;
}

#profile-nav, .user-profile-link {
    padding: 0;
}

.bolt {
    color: #FFD141;
}

.testimonial {
    margin-bottom: 1rem;
}

.testimonial-text {
    margin: 0.25rem 0;
}

.testimonial-name {
    text-align: right;
    font-weight: 500;
}

.drop {
    position: relative;
    display: inline-block;
    top: 0.5rem;
    transform: rotate(10deg);
    color: #FFBA08;
    font-size: 0.9em;
}



.tagline {
    padding: 1rem;
    max-width: 50rem;
    font-size: 2rem;
    font-family: var(--body-font);
    margin-bottom: 2rem;
}

.tagline h2, .tagline p {
    margin: 0;
}


article p em {

}

.article-header-primary-tag {
    margin-bottom: -1rem;
}

.object-series {
    color: #0C1020;
    border: 1px solid #0C102088;
}





p.admonition a {
    color: inherit;
    text-decoration: underline;
}

.syndicated {
    margin-top: 2rem;
}







/* Book showcase */

#book-showcase {
    display: none;
    position: absolute;
    right: 1.5rem;
    bottom: 0.5rem;
}

.localized-price {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 20px;
    padding: 0.25em 0.5rem;
}

.normal-price {
    font-weight: normal;
    font-size: 0.9em;
}

.strike-price {
    text-decoration: line-through;
    opacity: 0.7;
    font-weight: normal;
}

.discounted-price {
    margin-left: 0.5rem;
    font-weight: bold;
}



/* Product blocks */

.article-products {
    margin-top: 1rem;
}

.article-main-body>.product-block-container {
    margin: 5rem 0;
}

.product-block {
    background: #EDF4F8;
    margin-bottom: 1rem;
}

.product-block h2,
.product-block h2 a {
    font-family: "Raleway";
    font-weight: normal;
    font-size: 2rem;
    margin: 2rem 0;
}

.product-banner {
    position: relative;
    background-color: #222;
}

.product-banner-spacing {
    padding: 1rem 0;
}

.product-block-buttons {
    padding: 1rem 0;
    text-align: center;
    background-color: #222;
}

.product-block-buttons a {}

.product-block-buttons a.button-buy {
    font-size: 1.25rem;
}

.product-block-buttons a.button-info {
    font-size: 1.25rem;

}



img.product-header {
    margin: 0;
    width: 100%;
    max-width: 100%;
}

.product-block-label {
    font-style: italic;
}

.product-callout {
    text-align: center;
    font-size: 0.9rem;
    margin: 0;
}

.product-block-coupon p {
    margin: 0;
    text-align: center;
}

.couponcode,
.discount {
    font-weight: bold;
    text-transform: uppercase;

}

.couponcode {
    color: #FFD141;
    background-color: #000;
    padding: 0.1em 0.5em;
}




/* End blocks */




/* Product list (book) */


.product-list-item {
    padding: 1rem;
}

.product-highlight img {
    border: 5px solid #FCD741;
    margin: -5px;
}

.product-inner {
    padding: 1rem;
    margin-bottom: 1rem;
}


.product-list-title {
    text-align: center;
    margin: 1rem 0 2rem 0;
}

.product-list-metadata {
    color: #555;
    font-size: 0.8rem;
    margin: 0.5rem 0;
}

.product-list-what {
    color: #aaa;
    font-size: 0.8rem;
    margin: 0.5rem 0 2rem 0;
}

.product-list-versions {
    padding: 0.5rem 0;
    border-top: 1px solid #555;
    font-size: 0.8em;
}

.product-list-versions p {
    margin: 0;
}

.product-list-versions ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.product-list-versions a {
    text-decoration: none;
}

.product-actions {
    text-align: center;
    margin: 2rem auto;
}

.product-description {
    text-align: center;
    font-size: 1rem;
    color: #0C1020;
    padding: 0 1rem;
    max-width: 25rem;
    margin: 1rem auto;
}

/* Products */

/* Products */

.product {
    position: relative;
    background-color: #222;
    margin: 2rem 0 0.5rem 0;
    padding: 2rem 1.5rem;
    border-radius: 5px;
}

.sale-notice {
    background-color: #FFD141;
    color: #0D1F2D;
    font-size: 0.9rem !important;
    padding: 0.5rem 1rem;
    border-radius: 0 0 5px 5px;
    text-align: center;
}

.sale-notice.black-friday {
    background-color: #000;
    color: #fff;
}

.sale-notice.ppp {
    background-color: #e8e8ff;
}

.sale-notice h4 {
    margin: 0.1rem 0;
    font-size: 0.75rem;
    font-weight: bold;
    text-transform: uppercase;
}

.product-snippet {
    margin: 2rem 0 0.5rem -2rem;
    border-color: #eee;
    border-style: solid;
    border-width: 1px 0;
    padding: 1rem 1.5rem;
}


.product-snippet a {
    whitespace: nobreak;
    color: #009FB7;
}


.product-snippet p {
    font-family: var(--body-font);
    margin: 0;
}


.product h3 {
    margin: 0 0 0.5em;
    font-size: 2rem;
}

.product h3 a {
    font-weight: bold;
    color: #ccc !important;
}


.product p {
    color: #FEFCFD;
    font-family: var(--body-font);
    margin: 0;
}

.product p a {
    color: #009FB7;
}


.product-smallprint p {
    margin-top: 1rem;
    font-size: 0.9rem !important;
    color: rgba(255, 255, 255, 0.4);
    text-align: center;
}

.product-details {
    margin: 1rem 2rem;
    color: #0C1020;
}

.product .product-actions {
    margin: 1rem 0 0;
}

.product-components {
    font-style: italic;
}


.product-image {
    margin: 0;
}




.product-what {
    font-family: 'Inconsolata', monospace;
}

.product-variant {
    display: block;
    position: relative;
    border-radius: 5px;
    padding: 1rem 2rem;
    margin: 1rem 0;
    text-decoration: none;
    color: #272838;
    background-color: #f5f5f5;
    border: 1px solid #f5f5f5;
}

.product-variant:hover {
    border: 1px solid #e5e5e5;
}

.product-variant.preferred {
    background-color: #ffffc5;
    border: 1px solid #ffffc5;
}

.product-variant.preferred:hover {
    border: 1px solid #ddddc5;
}


.product-kofi {
    border: 1px solid #00b9fe;
    background-color: #00b9fe11;
}



.product-price-label {
    font-family: var(--body-font);
    display: inline-block;
}

.product-upsell-price,
.product-upsell-price:hover {
    color: #272838 !important;
    background-color: #FFD141;
    padding: 0.25rem 0.5rem;
}

.product-variant-title {
    font-weight: bold;
}

.product-variant-title a {
    text-decoration: none;
    color: #272838;
}

.product-variant-label {}

.product-variant-notes {
    margin-top: 0.5rem;
    font-size: 0.9rem;
    color: #888;
}

.product-variant-popular {
    font-weight: normal;
    color: #FFBA08;
}



.product-variant-buy {
    margin: 0.5rem auto;
    text-align: center;
}


.product-interval {
    font-size: 0.8em;
    opacity: 0.8;
}





.product-small-block-container {
    background: #0C102011;
    border-radius: 5px;
    padding: 1rem 0;
    line-height: 1.5;
}

.product-small-block-container img {
    margin: 0;
}


.product-small-block-container {
    margin: 3rem 0;
}

.product-small-block-container p {
    margin: 0;
}

.product-small-block-container .product-small-controls {
    margin-top: 0.5rem;
}

.product-small-block-container .product-small-link {
    font-weight:bold;
}

.product-small-block-container a.pure-button {
    padding: 0.15rem 0.5rem;
    vertical-align: baseline;
}



/* Elements */
hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    display: block;
    border: none;
    height: 5rem;
    width: 100%;
    background-image: url('../images/pulse-light.svg');
    background-repeat: no-repeat;
    background-size:contain;
    background-position: center center;
    margin: 5rem auto;
}


.slow-code {
    font: var(--code-font);
}