body {
    background-color: #fafafa;
}

.pagination li.active, nav, .page-footer {
    background-color: #673AB7;
}

h1, h2, h3, h4, h5, h6 {
    color: #673AB7;
}

h1+p, h2+p, h3+p, h4+p, h5+p, h6+p {
    margin-top: 0px;
}

blockquote {
    border-left: 5px solid #673AB7;
}

.flow-text>h4 {
    margin: 3.22rem 0 .912rem 0;
}

.flow-text>h4:first-of-type {
    margin: 0rem 0 .912rem 0;
}

.flow-text>h5 {
    margin: 2rem 0 .656rem 0;
}

.card .card-action a:not(.btn):not(.btn-large):not(.btn-large):not(.btn-floating) {
    color: #039be5;
}

.article .img {
    float: left;
}

ul {
    margin-top: 0px;
    margin-bottom: 0px;
}

.flex-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 -10px;
}

.flex-col {
    flex-grow: 1;
    width: 32%;
    padding: 0 10px;
}

@media only screen and (max-width: 1100px) {
    .flex-col {
        width: 50%;
    }
}

@media only screen and (max-width: 760px) {
    .flex-col {
        width: 100%;
    }
}

html {
    font-size: 100%;
}

@media only screen and (min-width: 960px) {
    .flow-text {
        font-size: 1.4rem;
    }
}

.card.waves-effect, .card .waves-effect {
    display: block;
}

.nav-wrapper {
    overflow: hidden;
}

/* label color */

.input-field label {
    color: #fff;
}

/* label focus color */

.input-field input[type=text]:focus+label {
    color: #fff;
}

/* label underline focus color */

.input-field input[type=text]:focus, input[type=text]:not(.browser-default):focus:not([readonly]) {
    border-bottom: 1px solid #fff;
    box-shadow: 0 1px 0 0 #fff;
}

/* valid color */

.input-field input[type=text].valid {
    border-bottom: 1px solid #fff;
    box-shadow: 0 1px 0 0 #fff;
}

/* invalid color */

.input-field input[type=text].invalid {
    border-bottom: 1px solid #fff;
    box-shadow: 0 1px 0 0 #fff;
}

/* icon prefix focus color */

.input-field .prefix.active {
    color: #fff;
}

@media only screen and (min-width: 993px) {
    .card.waves-effect, .card .waves-effect {
        min-height: 245px;
    }
}

@media only screen and (min-width: 1201px) {
    .card.waves-effect, .card .waves-effect {
        min-height: 275px;
    }
}

.card .card-title {
    font-size: 20px;
}

.carousel .carousel-item {
    height: 350px;
    width: 350px;
}

.page-footer {
    padding-top: 0px;
}

.page-footer a {
    text-decoration: underline;
}

.page-footer i {
    font-size: large;
    margin-left: 15px;
}

table.article {
    display: inline-table;
}

table.article td {
    padding: 0px 10px 0px 0px;
    height: 32px;
}

table.summary td {
    font-size: smaller;
    padding: 0px 10px 0px 0px;
    vertical-align: top;
}

table.checkmarks {
    font-size: 18px;
}

table.checkmarks td {
    padding: 0;
}

.collection a.collection-item {
    color: #039be5;
}

.prettyprint {
    font-size: 60%;
}

a[href^="http://"]:after, a[href^="https://"]:after {
    content: url(https://blog.roysolberg.com/images/external_link.png);
    margin: 0 0 0 5px;
}

a[href*="//blog.roysolberg.com/"]:after, a[href*="//"].no-ext:after, nav a[href*="//"]:after, footer a[href*="//"]:after {
    content: '';
    margin: 0;
}

a.remove-link-color {
    color: rgba(0, 0, 0, 0.87);
}

.skip-link {
    font-size: 90%;
    clear: right;
    display: inline-block;
    margin-bottom: 15px;
}

.direct-link {
    font-size: 50%;
}

em, .markup {
    background-color: rgba(12, 242, 143, .3);
    -webkit-print-color-adjust: exact !important;
    font-style: normal;
}

code, .code {
    font-family: Courier New, monospace;
}

.old-list {
    white-space: pre-wrap;
}

@media print {
    .prepare-print {
        display: none;
    }
    .skip-link {
        display: none;
    }
}

.gsc-control-cse {
    padding: 0!important;
}

/**
    START Mailchimp
*/

#mc_embed_signup {
    background-color: #F5F2F0;
    padding: 20px;
    border-radius: 5px;
}

#mc_embed_signup h6 {
    font-weight: bold;
}

#mc_embed_signup label {
    color: #000;
}

/**
    END Mailchimp
*/

/**
    START Fontello
*/

@font-face {
    font-family: 'fontello';
    src: url('../fonts/fontello/fontello.eot?34524556');
    src: url('../fonts/fontello/fontello.eot?34524556#iefix') format('embedded-opentype'), url('../fonts/fontello/fontello.woff2?34524556') format('woff2'), url('../fonts/fontello/fontello.woff?34524556') format('woff'), url('../fonts/fontello/fontello.ttf?34524556') format('truetype'), url('../fonts/fontello/fontello.svg?34524556#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */

/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */

/*
  @media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
      font-family: 'fontello';
      src: url('../fonts/fontello/fontello.svg?95786988#fontello') format('svg');
    }
  }
  */

[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;
    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-mail:before {
    content: '\e800';
}

/* '' */

.icon-twitter:before {
    content: '\f099';
}

/* '' */

.icon-github-circled:before {
    content: '\f09b';
}

/* '' */

.icon-rss:before {
    content: '\f09e';
}

/* '' */

.icon-gplus:before {
    content: '\f0d5';
}

/* '' */

.icon-mail-alt:before {
    content: '\f0e0';
}

/* '' */

.icon-linkedin:before {
    content: '\f0e1';
}

/* '' */

.icon-rss-squared:before {
    content: '\f143';
}

/* '' */

.icon-stackoverflow:before {
    content: '\f16c';
}

/* '' */

/**
    END Fontello
*/

/* desert scheme ported from vim to google prettify */

pre.prettyprint {
    display: block;
    background-color: #111
}

pre .nocode {
    background-color: none;
    color: #000
}

pre .str {
    color: #ffa0a0
}

/* string  - pink */

pre .kwd {
    color: #f0e68c;
    font-weight: bold
}

pre .com {
    color: #87ceeb
}

/* comment - skyblue */

pre .typ {
    color: #98fb98
}

/* type    - lightgreen */

pre .lit {
    color: #cd5c5c
}

/* literal - darkred */

pre .pun {
    color: #fff
}

/* punctuation */

pre .pln {
    color: #fff
}

/* plaintext */

pre .tag {
    color: #f0e68c;
    font-weight: bold
}

/* html/xml tag    - lightyellow */

pre .atn {
    color: #bdb76b;
    font-weight: bold
}

/* attribute name  - khaki */

pre .atv {
    color: #ffa0a0
}

/* attribute value - pink */

pre .dec {
    color: #98fb98
}

/* decimal         - lightgreen */

/* Specify class=linenums on a pre to get line numbering */

ol.linenums {
    margin-top: 0;
    margin-bottom: 0;
    color: #AEAEAE
}

/* IE indents via margin-left */

li.L0, li.L1, li.L2, li.L3, li.L5, li.L6, li.L7, li.L8 {
    list-style-type: none
}

/* Alternate shading for lines */

li.L1, li.L3, li.L5, li.L7, li.L9 {}

@media print {
    pre.prettyprint {
        background-color: none
    }
    pre .str, code .str {
        color: #060
    }
    pre .kwd, code .kwd {
        color: #006;
        font-weight: bold
    }
    pre .com, code .com {
        color: #600;
        font-style: italic
    }
    pre .typ, code .typ {
        color: #404;
        font-weight: bold
    }
    pre .lit, code .lit {
        color: #044
    }
    pre .pun, code .pun {
        color: #440
    }
    pre .pln, code .pln {
        color: #000
    }
    pre .tag, code .tag {
        color: #006;
        font-weight: bold
    }
    pre .atn, code .atn {
        color: #404
    }
    pre .atv, code .atv {
        color: #060
    }
}