html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup,
main, nav, section, summary {
    display: block
}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden], template {
    display: none
}

a {
    background: transparent
}

a:active, a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b, strong {
    font-weight: bold
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -0.5em
}

sub {
    bottom: -0.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button, select {
    text-transform: none
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled], html input[disabled] {
    cursor: default
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0
}

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
    height: auto
}

input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: bold
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td, th {
    padding: 0
}

h1, h2, h3, h4, h5, h6, dl, dd, ol, ul, menu, figure, blockquote, p, pre, form {
    margin: 0
}

menu, ol, ul {
    padding: 0;
    list-style: none;
    list-style-image: none
}

figcaption {
    -webkit-nbsp-mode: normal
}

@media print {
    h2, h3 {
        page-break-after: avoid;
        page-break-inside: avoid
    }
}

@media print and (color) {
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact
    }
}

.u-muted {
    color: rgba(0, 0, 0, 0.3)
}

.u-clearfix {
    *zoom: 1
}

.u-clearfix:before, .u-clearfix:after {
    display: table;
    content: " "
}

.u-clearfix:after {
    clear: both
}

.hide {
    display: none !important
}

@media screen and (max-width:500px) {
    .hide-on-mobile {
        display: none !important
    }
}

.wf-sans-n3, .wf-sans-n4, .wf-sans-n7 {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em
}

.wf-serif-n4, .wf-serif-i4, .wf-serif-n7, .wf-serif-i7 {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: .01rem
}

.wf-display-serif-n4 {
    font-family: "freight-big-pro", "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: .01rem
}

.wf-sans-n3 {
    font-weight: 300
}

.wf-sans-n4, .wf-serif-n4, .wf-serif-i4, .wf-display-serif-n4 {
    font-weight: 400
}

.wf-sans-n7, .wf-serif-n7, .wf-serif-i7 {
    font-weight: 700
}

.wf-sans-n3, .wf-sans-n4, .wf-serif-n4, .wf-sans-n7, .wf-serif-n7 {
    font-style: normal
}

.wf-serif-i4, .wf-serif-i7 {
    font-style: italic
}

.screen-reader-text {
    position: absolute;
    top: -9999px;
    left: -9999px
}

.post-content-hyphenate {
    word-break: break-word;
    -webkit-hyphens: auto;
    -webkit-hyphenate-limit-before: 2;
    -webkit-hyphenate-limit-after: 3;
    -webkit-hyphenate-limit-lines: 2
}

.wf-loading .hero-title, .wf-loading .hero-description, .wf-loading .btn,
.wf-loading .post-item, .wf-loading .collection-item, .wf-loading .butter-bar,
.wf-loading .bucket, .wf-loading .bucket-title, .wf-loading .overlay-dialog,
.wf-loading .metabar-text, .wf-loading .metabar-message, .wf-loading .tooltip,
.wf-loading .popover-inner, .wf-loading .sortable-table, .wf-loading .chart-tabs,
.wf-loading .chart-title, .wf-loading .referrers-table, .wf-loading .nav-tabs-anchor,
.wf-loading .site-nav-list-item-btn, .wf-loading .notifications-list-heading,
.wf-loading .notifications-list-item-btn, .wf-loading .setting-item-title,
.wf-loading .setting-item-desc, .wf-loading .post-header .post-title,
.wf-loading .post-field.subtitle, .wf-loading .post-item-meta, .wf-loading .post-field.body,
.wf-loading .post-article .caption, .wf-loading .post-footer-card,
.wf-loading .post-preview, .wf-loading .input-text {
    visibility: hidden
}

@font-face {
    font-family: 'Cambria';
    src: local('Arial'), local('Helvetica');
    unicode-range: U+2500-259F
}

@-webkit-keyframes pop-upwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, 12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, 12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, 12);
        -o-transform: matrix(.97, 0, 0, 1, 0, 12);
        transform: matrix(.97, 0, 0, 1, 0, 12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, 2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, 2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, 2);
        -o-transform: matrix(.99, 0, 0, 1, 0, 2);
        transform: matrix(.99, 0, 0, 1, 0, 2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
        -moz-transform: matrix(1, 0, 0, 1, 0, -1);
        -ms-transform: matrix(1, 0, 0, 1, 0, -1);
        -o-transform: matrix(1, 0, 0, 1, 0, -1);
        transform: matrix(1, 0, 0, 1, 0, -1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes pop-upwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, 12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, 12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, 12);
        -o-transform: matrix(.97, 0, 0, 1, 0, 12);
        transform: matrix(.97, 0, 0, 1, 0, 12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, 2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, 2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, 2);
        -o-transform: matrix(.99, 0, 0, 1, 0, 2);
        transform: matrix(.99, 0, 0, 1, 0, 2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
        -moz-transform: matrix(1, 0, 0, 1, 0, -1);
        -ms-transform: matrix(1, 0, 0, 1, 0, -1);
        -o-transform: matrix(1, 0, 0, 1, 0, -1);
        transform: matrix(1, 0, 0, 1, 0, -1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes pop-upwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, 12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, 12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, 12);
        -o-transform: matrix(.97, 0, 0, 1, 0, 12);
        transform: matrix(.97, 0, 0, 1, 0, 12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, 2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, 2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, 2);
        -o-transform: matrix(.99, 0, 0, 1, 0, 2);
        transform: matrix(.99, 0, 0, 1, 0, 2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
        -moz-transform: matrix(1, 0, 0, 1, 0, -1);
        -ms-transform: matrix(1, 0, 0, 1, 0, -1);
        -o-transform: matrix(1, 0, 0, 1, 0, -1);
        transform: matrix(1, 0, 0, 1, 0, -1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes pop-upwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, 12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, 12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, 12);
        -o-transform: matrix(.97, 0, 0, 1, 0, 12);
        transform: matrix(.97, 0, 0, 1, 0, 12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, 2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, 2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, 2);
        -o-transform: matrix(.99, 0, 0, 1, 0, 2);
        transform: matrix(.99, 0, 0, 1, 0, 2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, -1);
        -moz-transform: matrix(1, 0, 0, 1, 0, -1);
        -ms-transform: matrix(1, 0, 0, 1, 0, -1);
        -o-transform: matrix(1, 0, 0, 1, 0, -1);
        transform: matrix(1, 0, 0, 1, 0, -1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-webkit-keyframes pop-downwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, -12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, -12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, -12);
        -o-transform: matrix(.97, 0, 0, 1, 0, -12);
        transform: matrix(.97, 0, 0, 1, 0, -12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, -2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, -2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, -2);
        -o-transform: matrix(.99, 0, 0, 1, 0, -2);
        transform: matrix(.99, 0, 0, 1, 0, -2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 1);
        -moz-transform: matrix(1, 0, 0, 1, 0, 1);
        -ms-transform: matrix(1, 0, 0, 1, 0, 1);
        -o-transform: matrix(1, 0, 0, 1, 0, 1);
        transform: matrix(1, 0, 0, 1, 0, 1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes pop-downwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, -12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, -12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, -12);
        -o-transform: matrix(.97, 0, 0, 1, 0, -12);
        transform: matrix(.97, 0, 0, 1, 0, -12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, -2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, -2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, -2);
        -o-transform: matrix(.99, 0, 0, 1, 0, -2);
        transform: matrix(.99, 0, 0, 1, 0, -2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 1);
        -moz-transform: matrix(1, 0, 0, 1, 0, 1);
        -ms-transform: matrix(1, 0, 0, 1, 0, 1);
        -o-transform: matrix(1, 0, 0, 1, 0, 1);
        transform: matrix(1, 0, 0, 1, 0, 1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes pop-downwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, -12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, -12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, -12);
        -o-transform: matrix(.97, 0, 0, 1, 0, -12);
        transform: matrix(.97, 0, 0, 1, 0, -12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, -2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, -2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, -2);
        -o-transform: matrix(.99, 0, 0, 1, 0, -2);
        transform: matrix(.99, 0, 0, 1, 0, -2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 1);
        -moz-transform: matrix(1, 0, 0, 1, 0, 1);
        -ms-transform: matrix(1, 0, 0, 1, 0, 1);
        -o-transform: matrix(1, 0, 0, 1, 0, 1);
        transform: matrix(1, 0, 0, 1, 0, 1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes pop-downwards {
    0% {
        -webkit-transform: matrix(.97, 0, 0, 1, 0, -12);
        -moz-transform: matrix(.97, 0, 0, 1, 0, -12);
        -ms-transform: matrix(.97, 0, 0, 1, 0, -12);
        -o-transform: matrix(.97, 0, 0, 1, 0, -12);
        transform: matrix(.97, 0, 0, 1, 0, -12);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    20% {
        -webkit-transform: matrix(.99, 0, 0, 1, 0, -2);
        -moz-transform: matrix(.99, 0, 0, 1, 0, -2);
        -ms-transform: matrix(.99, 0, 0, 1, 0, -2);
        -o-transform: matrix(.99, 0, 0, 1, 0, -2);
        transform: matrix(.99, 0, 0, 1, 0, -2);
        filter: alpha(opacity=70);
        -khtml-opacity: .7;
        -moz-opacity: .7;
        opacity: .7
    }

    40% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 1);
        -moz-transform: matrix(1, 0, 0, 1, 0, 1);
        -ms-transform: matrix(1, 0, 0, 1, 0, 1);
        -o-transform: matrix(1, 0, 0, 1, 0, 1);
        transform: matrix(1, 0, 0, 1, 0, 1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -moz-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
        -o-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-webkit-keyframes shift-rightwards {
    0% {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    40% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    60% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@-moz-keyframes shift-rightwards {
    0% {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    40% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    60% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@-o-keyframes shift-rightwards {
    0% {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    40% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    60% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@keyframes shift-rightwards {
    0% {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    40% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    60% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@-webkit-keyframes shimmy-shake {
    0% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    20% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    40% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    60% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    80% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-moz-keyframes shimmy-shake {
    0% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    20% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    40% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    60% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    80% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-o-keyframes shimmy-shake {
    0% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    20% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    40% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    60% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    80% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes shimmy-shake {
    0% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    20% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    40% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    60% {
        -webkit-transform: translateX(1%);
        -moz-transform: translateX(1%);
        -ms-transform: translateX(1%);
        -o-transform: translateX(1%);
        transform: translateX(1%)
    }

    80% {
        -webkit-transform: translateX(-1%);
        -moz-transform: translateX(-1%);
        -ms-transform: translateX(-1%);
        -o-transform: translateX(-1%);
        transform: translateX(-1%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes big-shimmy-shake {
    0% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    20% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    40% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    60% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    80% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-moz-keyframes big-shimmy-shake {
    0% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    20% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    40% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    60% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    80% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-o-keyframes big-shimmy-shake {
    0% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    20% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    40% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    60% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    80% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes big-shimmy-shake {
    0% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    20% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    40% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    60% {
        -webkit-transform: translateX(5%);
        -moz-transform: translateX(5%);
        -ms-transform: translateX(5%);
        -o-transform: translateX(5%);
        transform: translateX(5%)
    }

    80% {
        -webkit-transform: translateX(-5%);
        -moz-transform: translateX(-5%);
        -ms-transform: translateX(-5%);
        -o-transform: translateX(-5%);
        transform: translateX(-5%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes scale-fade {
    0% {
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
        -webkit-transform: scale(.8) rotateX(-40deg);
        -moz-transform: scale(.8) rotateX(-40deg);
        -ms-transform: scale(.8) rotateX(-40deg);
        -o-transform: scale(.8) rotateX(-40deg);
        transform: scale(.8) rotateX(-40deg)
    }

    50% {
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: scale(1.05) rotateX(0);
        -moz-transform: scale(1.05) rotateX(0);
        -ms-transform: scale(1.05) rotateX(0);
        -o-transform: scale(1.05) rotateX(0);
        transform: scale(1.05) rotateX(0)
    }

    100% {
        -webkit-transform: scale(1) rotateX(0);
        -moz-transform: scale(1) rotateX(0);
        -ms-transform: scale(1) rotateX(0);
        -o-transform: scale(1) rotateX(0);
        transform: scale(1) rotateX(0)
    }
}

@-moz-keyframes scale-fade {
    0% {
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
        -webkit-transform: scale(.8) rotateX(-40deg);
        -moz-transform: scale(.8) rotateX(-40deg);
        -ms-transform: scale(.8) rotateX(-40deg);
        -o-transform: scale(.8) rotateX(-40deg);
        transform: scale(.8) rotateX(-40deg)
    }

    50% {
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: scale(1.05) rotateX(0);
        -moz-transform: scale(1.05) rotateX(0);
        -ms-transform: scale(1.05) rotateX(0);
        -o-transform: scale(1.05) rotateX(0);
        transform: scale(1.05) rotateX(0)
    }

    100% {
        -webkit-transform: scale(1) rotateX(0);
        -moz-transform: scale(1) rotateX(0);
        -ms-transform: scale(1) rotateX(0);
        -o-transform: scale(1) rotateX(0);
        transform: scale(1) rotateX(0)
    }
}

@-o-keyframes scale-fade {
    0% {
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
        -webkit-transform: scale(.8) rotateX(-40deg);
        -moz-transform: scale(.8) rotateX(-40deg);
        -ms-transform: scale(.8) rotateX(-40deg);
        -o-transform: scale(.8) rotateX(-40deg);
        transform: scale(.8) rotateX(-40deg)
    }

    50% {
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: scale(1.05) rotateX(0);
        -moz-transform: scale(1.05) rotateX(0);
        -ms-transform: scale(1.05) rotateX(0);
        -o-transform: scale(1.05) rotateX(0);
        transform: scale(1.05) rotateX(0)
    }

    100% {
        -webkit-transform: scale(1) rotateX(0);
        -moz-transform: scale(1) rotateX(0);
        -ms-transform: scale(1) rotateX(0);
        -o-transform: scale(1) rotateX(0);
        transform: scale(1) rotateX(0)
    }
}

@keyframes scale-fade {
    0% {
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0;
        -webkit-transform: scale(.8) rotateX(-40deg);
        -moz-transform: scale(.8) rotateX(-40deg);
        -ms-transform: scale(.8) rotateX(-40deg);
        -o-transform: scale(.8) rotateX(-40deg);
        transform: scale(.8) rotateX(-40deg)
    }

    50% {
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    70% {
        -webkit-transform: scale(1.05) rotateX(0);
        -moz-transform: scale(1.05) rotateX(0);
        -ms-transform: scale(1.05) rotateX(0);
        -o-transform: scale(1.05) rotateX(0);
        transform: scale(1.05) rotateX(0)
    }

    100% {
        -webkit-transform: scale(1) rotateX(0);
        -moz-transform: scale(1) rotateX(0);
        -ms-transform: scale(1) rotateX(0);
        -o-transform: scale(1) rotateX(0);
        transform: scale(1) rotateX(0)
    }
}

@-webkit-keyframes slide-up-in {
    0% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
}

@-moz-keyframes slide-up-in {
    0% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
}

@-o-keyframes slide-up-in {
    0% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes slide-up-in {
    0% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%)
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes slide-left-in {
    0% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-moz-keyframes slide-left-in {
    0% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-o-keyframes slide-left-in {
    0% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slide-left-in {
    0% {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%)
    }

    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes slide-up-out {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@-moz-keyframes slide-up-out {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@-o-keyframes slide-up-out {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@keyframes slide-up-out {
    0% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@-webkit-keyframes fade-back-out {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -moz-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(-10%) scale(.8);
        -moz-transform: translateY(-10%) scale(.8);
        -ms-transform: translateY(-10%) scale(.8);
        -o-transform: translateY(-10%) scale(.8);
        transform: translateY(-10%) scale(.8);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-moz-keyframes fade-back-out {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -moz-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(-10%) scale(.8);
        -moz-transform: translateY(-10%) scale(.8);
        -ms-transform: translateY(-10%) scale(.8);
        -o-transform: translateY(-10%) scale(.8);
        transform: translateY(-10%) scale(.8);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-o-keyframes fade-back-out {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -moz-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(-10%) scale(.8);
        -moz-transform: translateY(-10%) scale(.8);
        -ms-transform: translateY(-10%) scale(.8);
        -o-transform: translateY(-10%) scale(.8);
        transform: translateY(-10%) scale(.8);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@keyframes fade-back-out {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -moz-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(-10%) scale(.8);
        -moz-transform: translateY(-10%) scale(.8);
        -ms-transform: translateY(-10%) scale(.8);
        -o-transform: translateY(-10%) scale(.8);
        transform: translateY(-10%) scale(.8);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-webkit-keyframes fade-up-in {
    0% {
        -webkit-transform: translateY(25%);
        -moz-transform: translateY(25%);
        -ms-transform: translateY(25%);
        -o-transform: translateY(25%);
        transform: translateY(25%);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes fade-up-in {
    0% {
        -webkit-transform: translateY(25%);
        -moz-transform: translateY(25%);
        -ms-transform: translateY(25%);
        -o-transform: translateY(25%);
        transform: translateY(25%);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes fade-up-in {
    0% {
        -webkit-transform: translateY(25%);
        -moz-transform: translateY(25%);
        -ms-transform: translateY(25%);
        -o-transform: translateY(25%);
        transform: translateY(25%);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes fade-up-in {
    0% {
        -webkit-transform: translateY(25%);
        -moz-transform: translateY(25%);
        -ms-transform: translateY(25%);
        -o-transform: translateY(25%);
        transform: translateY(25%);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-o-keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        -moz-transform: rotate(0);
        -ms-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes slide-notes {
    0% {
        -webkit-transform: translate3d(20px, 0, 0);
        -moz-transform: translate3d(20px, 0, 0);
        -ms-transform: translate3d(20px, 0, 0);
        -o-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes slide-notes {
    0% {
        -webkit-transform: translate3d(20px, 0, 0);
        -moz-transform: translate3d(20px, 0, 0);
        -ms-transform: translate3d(20px, 0, 0);
        -o-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes slide-notes {
    0% {
        -webkit-transform: translate3d(20px, 0, 0);
        -moz-transform: translate3d(20px, 0, 0);
        -ms-transform: translate3d(20px, 0, 0);
        -o-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes slide-notes {
    0% {
        -webkit-transform: translate3d(20px, 0, 0);
        -moz-transform: translate3d(20px, 0, 0);
        -ms-transform: translate3d(20px, 0, 0);
        -o-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

html, body, .container {
    height: 100%
}

.container {
    background: #fff;
    -webkit-transition: -webkit-transform .2s cubic-bezier(.2, .3, .25, .9);
    -moz-transition: -moz-transform .2s cubic-bezier(.2, .3, .25, .9);
    -o-transition: -o-transform .2s cubic-bezier(.2, .3, .25, .9);
    transition: transform .2s cubic-bezier(.2, .3, .25, .9)
}

.surface {
    top: 0;
    height: 100%;
    width: 100%;
    *zoom: 1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: padding-bottom .1s;
    -moz-transition: padding-bottom .1s;
    -ms-transition: padding-bottom .1s;
    -o-transition: padding-bottom .1s;
    transition: padding-bottom .1s
}

.surface:before, .surface:after {
    display: table;
    content: " "
}

.surface:after {
    clear: both
}

.diagnostics-visible .container {
    padding-bottom: 50px
}

.screen-content {
    outline: 0;
    background-color: #fff
}

.surface-scroll-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    overflow: auto
}

.surfaces-transitioning {
    overflow: hidden
}

.surfaces-transitioning .surface-scroll-overlay {
    display: block
}

.surfaces-transitioning .surface-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}

.surfaces-transitioning .surface {
    position: absolute;
    top: 0;
    overflow: auto
}

.surfaces-transitioning .surface-transitioning-in {
    z-index: 200
}

.surfaces-transitioning .surface-transitioning-out {
    z-index: 100
}

.surfaces-transitioning .surface-container.surface-container-fixed {
    position: fixed;
    top: 0
}

.disable-pointer-events {
    pointer-events: none !important
}

.layout-single-column {
    width: 640px;
    margin: 0 auto
}

.post-article .layout-single-column, .logged-out-post-footer .layout-single-column {
    width: 700px
}

.layout-multi-column {
    width: 75%;
    max-width: 1200px;
    margin: 0 auto
}

.layout-multi-column .layout-single-column {
    width: auto
}

.layout-multi-column-half, .layout-multi-column-primary, .layout-multi-column-secondary {
    display: inline-block;
    vertical-align: top
}

.layout-multi-column-primary {
    width: 65%
}

.layout-multi-column-secondary {
    width: 35%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 40px
}

.layout-multi-column-header {
    margin: 75px 0 40px
}

.layout-multi-column-half {
    width: 50%
}

.layout-foreground {
    position: relative;
    z-index: 100
}

.layout-fill, .layout-fill-width {
    width: 100%
}

.layout-fill, .layout-fill-height {
    height: 100%
}

.layout-table-row {
    display: table-row
}

@media all and (max-width:800px) {
    .post-article .layout-single-column, .logged-out-post-footer .layout-single-column {
        width: 640px
    }

    .layout-multi-column-primary, .layout-multi-column-secondary,
    .layout-multi-column-half {
        width: 100%
    }

    .layout-multi-column-secondary {
        padding-right: 0
    }

    .layout-multi-column-secondary+.layout-multi-column-primary {
        margin-top: 60px
    }

    .layout-multi-column .layout-single-column {
        margin: 0
    }
}

@media all and (max-width:680px) {
    .layout-single-column, .layout-multi-column, .post-article .layout-single-column,
    .logged-out-post-footer .layout-single-column {
        width: auto;
        margin-left: 20px;
        margin-right: 20px
    }

    .post-article .layout-single-column {
        margin-right: 25px
    }
}

@media all and (max-width:500px) {
    .layout-single-column, .layout-multi-column {
        margin-left: 16px;
        margin-right: 16px
    }
}

.background-white {
    background: #fff
}

.background-gradient {
    background: rgba(0, 0, 0, 0.44);
    position: relative
}

.background-gradient:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -20%;
    height: 20%;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.44)));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.44));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.44));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.44));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.44));
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#70000000', GradientType=0);
    pointer-events: none
}

.align-middle:before, .align-middle .align-block {
    display: inline-block;
    vertical-align: middle
}

.align-bottom:before, .align-middle:before {
    content: '';
    height: 100%
}

.align-bottom:before, .align-bottom .align-block {
    display: inline-block;
    vertical-align: bottom
}

.align-left {
    float: left
}

.align-right {
    float: right
}

.align-center {
    text-align: center
}

.align-middle-table {
    display: table
}

.align-middle-table:before {
    height: auto;
    display: inherit
}

.align-middle-table .align-block {
    display: table-cell;
    vertical-align: middle
}

.canvas-renderer {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff
}

@media not print {
    .screen-content {
        height: 100%
    }
}

@-ms-viewport {
    width: device-width
}

@media print {
    .layout-single-column, .post-article .layout-single-column, .logged-out-post-footer .layout-single-column {
        width: 80%;
        margin: 0 auto
    }

    .canvas-renderer {
        display: none
    }
}

body {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    color: rgba(0, 0, 0, 0.8);
    font-size: 18px;
    line-height: 1.4;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

h1, h2, h3, h4 {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

p {
    margin-bottom: 30px
}

a {
    color: inherit;
    text-decoration: none
}

@media screen and (max-device-width:1000px) {
    html {
        -webkit-text-size-adjust: none
    }
}

@font-face {
    font-family: 'medium-icons';
    src: url("https://s3.amazonaws.com/medium-static/_/fp/fonts/medium-icons.qOrLuor_bQMiWt231xBYCQ.eot");
    src: url("https://s3.amazonaws.com/medium-static/_/fp/fonts/medium-icons.qOrLuor_bQMiWt231xBYCQ.eot?#iefix") format("embedded-opentype"), url("https://s3.amazonaws.com/medium-static/_/fp/fonts/medium-icons.rftwmweHuv8coVasnlvsOA.woff") format("woff"), url("https://s3.amazonaws.com/medium-static/_/fp/fonts/medium-icons.yScjvSJB__nPn49KuKShRQ.ttf") format("truetype"), url("https://s3.amazonaws.com/medium-static/_/fp/fonts/medium-icons.5lITf0Zw_c1LYuoNys4mvQ.svg?#medium-icons") format("svg");
    font-weight: normal;
    font-style: normal
}

.icons {
    font-family: 'medium-icons';
    font-weight: normal;
    font-style: normal;
    speak: none;
    text-decoration: none;
    text-transform: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

.browser-android .icons {
    text-rendering: auto !important
}

.icons-UNUSED-diamond:before {
    content: "\e001"
}

.icons-UNUSED-full-diamond:before {
    content: "\e002"
}

.icons-UNUSED-solid-add:before {
    content: "\e003"
}

.icons-UNUSED-triangle:before {
    content: "\e004"
}

.icons-activity:before {
    content: "\e005"
}

.icons-add-circled:before {
    content: "\e006"
}

.icons-add-further-reading:before {
    content: "\e007"
}

.icons-add-to-collection:before {
    content: "\e008"
}

.icons-add:before {
    content: "\e009"
}

.icons-arrow-left:before {
    content: "\e00a"
}

.icons-arrow-right:before {
    content: "\e00b"
}

.icons-avatar:before {
    content: "\e00c"
}

.icons-blockquote:before {
    content: "\e00d"
}

.icons-bold:before {
    content: "\e00e"
}

.icons-camera:before {
    content: "\e00f"
}

.icons-check:before {
    content: "\e010"
}

.icons-circle-check:before {
    content: "\e011"
}

.icons-collections:before {
    content: "\e012"
}

.icons-draft:before {
    content: "\e013"
}

.icons-drop-cap:before {
    content: "\e014"
}

.icons-email:before {
    content: "\e015"
}

.icons-embed:before {
    content: "\e016"
}

.icons-enlarge:before {
    content: "\e017"
}

.icons-error-400:before {
    content: "\e018"
}

.icons-error-401:before {
    content: "\e019"
}

.icons-error-403:before {
    content: "\e01a"
}

.icons-error-404:before {
    content: "\e01b"
}

.icons-error-410:before {
    content: "\e01c"
}

.icons-error-500:before {
    content: "\e01d"
}

.icons-error-unknown:before {
    content: "\e01e"
}

.icons-facebook:before {
    content: "\e01f"
}

.icons-flag:before {
    content: "\e020"
}

.icons-group:before {
    content: "\e021"
}

.icons-h1:before {
    content: "\e022"
}

.icons-h2:before {
    content: "\e023"
}

.icons-h3:before {
    content: "\e024"
}

.icons-heart-outline:before {
    content: "\e025"
}

.icons-heart:before {
    content: "\e026"
}

.icons-image-fill-width:before {
    content: "\e027"
}

.icons-image-full-bleed:before {
    content: "\e028"
}

.icons-image-inset-center:before {
    content: "\e029"
}

.icons-image-inset-left:before {
    content: "\e02a"
}

.icons-image-outset-center:before {
    content: "\e02b"
}

.icons-image-outset-left:before {
    content: "\e02c"
}

.icons-info:before {
    content: "\e02d"
}

.icons-invisible:before {
    content: "\e02e"
}

.icons-italic:before {
    content: "\e02f"
}

.icons-link:before {
    content: "\e030"
}

.icons-logo-m:before {
    content: "\e031"
}

.icons-logo:before {
    content: "\e032"
}

.icons-milestone:before {
    content: "\e033"
}

.icons-more:before {
    content: "\e034"
}

.icons-new-post:before {
    content: "\e035"
}

.icons-note-plus:before {
    content: "\e036"
}

.icons-notes:before {
    content: "\e037"
}

.icons-ordered:before {
    content: "\e038"
}

.icons-part-color:before {
    content: "\e039"
}

.icons-part-image:before {
    content: "\e03a"
}

.icons-read-next:before {
    content: "\e03b"
}

.icons-read:before {
    content: "\e03c"
}

.icons-reading-list:before {
    content: "\e03d"
}

.icons-remove:before {
    content: "\e03e"
}

.icons-replace-image:before {
    content: "\e03f"
}

.icons-search:before {
    content: "\e040"
}

.icons-settings:before {
    content: "\e041"
}

.icons-share:before {
    content: "\e042"
}

.icons-shrink:before {
    content: "\e043"
}

.icons-solid-check:before {
    content: "\e044"
}

.icons-stats:before {
    content: "\e045"
}

.icons-trusted-tester:before {
    content: "\e046"
}

.icons-twitter:before {
    content: "\e047"
}

.icons-break:before {
    content: "";
    display: inline-block;
    width: 80%;
    height: 4px;
    background: #fff;
    margin-top: 13px;
    margin-bottom: 10px
}

.error-400 .icons-error:before {
    content: "\e018"
}

.error-401 .icons-error:before {
    content: "\e019"
}

.error-403 .icons-error:before {
    content: "\e01a"
}

.error-404 .icons-error:before {
    content: "\e01b"
}

.error-410 .icons-error:before {
    content: "\e01c"
}

.error-500 .icons-error:before {
    content: "\e01d"
}

.error-unknown .icons-error:before {
    content: "\e01e"
}

.highlight-menu-blockquote .icons-blockquote:after {
    content: "\e00d"
}

.icons-profile:before {
    content: "\e00c"
}

.icons-arrow-down:before {
    content: "\e00b";
    display: inline-block;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.highlight-menu-notes .icons-notes:after {
    content: "\e009"
}

.icons-follow:before {
    content: "\e009"
}

.btn-follow.active .icons-follow:before {
    content: "\e010"
}

.btn .icons-x:before {
    content: "×";
    top: -6px !important
}

.icons-avatar:before {
    color: rgba(0, 0, 0, 0.3);
    font-size: 75px;
    line-height: 75px
}

.avatar-micro.icons-avatar:before {
    font-size: 23px;
    line-height: 18px
}

.typeahead .icons.icons-avatar:before {
    color: rgba(0, 0, 0, 0.3)
}

.typeahead .active .icons.icons-avatar:before {
    color: #fff
}

.avatar .icons-avatar:before {
    line-height: 83px
}

.icons-avatar-user-inline, .icons-avatar-user {
    width: 22px;
    height: 22px;
    display: block;
    overflow: hidden;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.icons-avatar-user-inline {
    display: inline-block;
    position: relative;
    top: 6px;
    margin: -6px 3px 0 5px
}

.icons-avatar-user img {
    width: 22px;
    height: 22px;
    display: block
}

.icons.post-author-image {
    background: rgba(0, 0, 0, 0.05)
}

.icons.post-author-image:before {
    font-size: 80px;
    position: relative;
    top: 8px
}

@media all and (max-width:1000px) {
    .icons.post-author-image:before {
        font-size: 60px;
        top: 2px
    }
}

.icons-info:before {
    font-size: 22px;
    position: relative;
    top: 2px
}

.icons-twitter:before {
    font-size: 21px;
    position: relative;
    top: 2px
}

.btn .icons.icons-replace-image:before, .icons-replace-image:before {
    font-size: 72px;
    line-height: 0;
    top: 45px;
    position: relative
}

.control .icons.icons-replace-image:before, .post-page-wrapper .no-image .icons-replace-image:before,
.post-page-wrapper .background-size-full .icons-replace-image:before {
    top: 0;
    left: 0
}

.btn-replace-image .icons-replace-image {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 72px
}

.template-flex-article .icons-replace-image:before {
    display: none
}

.template-flex-article .control .icons:before {
    display: inline
}

.template-flex-article .no-image .icons-replace-image:before {
    display: block;
    color: rgba(0, 0, 0, 0.15)
}

.template-flex-article .image .replace-image-message .icons-replace-image:before {
    display: block
}

.icons-add-circled:before {
    color: rgba(0, 0, 0, 0.3);
    font-size: 24px;
    position: relative;
    top: 9px
}

.inline-tooltip-menu-active .icons-add-circled:before, .inline-tooltip-control:focus .icons-add-circled:before,
.inline-tooltip-control:hover .icons-add-circled:before {
    color: #57ad68
}

.collection-empty .icons-add-circled::before, .contribute-messaging .icons-add-circled::before {
    font-size: 50px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -24px
}

.collection-empty .icons-add-circled::before {
    top: 20px
}

.error-message .icons-logo:before, .icons-error:before {
    width: 150px;
    height: 150px;
    display: block;
    font-size: 301px;
    color: #fff;
    line-height: 100px
}

.error-signin .icons-logo:before {
    color: inherit
}

.icons-avatar.post-item-avatar:before {
    position: relative;
    top: -12px;
    font-size: 40px;
    left: 9px
}

.cover-icon {
    font-size: 700px;
    left: -200px;
    position: absolute;
    top: 50%;
    margin-top: -500px;
    filter: alpha(opacity=5);
    -khtml-opacity: .05;
    -moz-opacity: .05;
    opacity: .05
}

.notes-marker-icon {
    position: absolute;
    font-size: 25px;
    margin-left: 1px
}

.icons-note-plus:before {
    top: -1px;
    position: relative;
    font-size: 22px
}

.post-article .btn .icons-email:before {
    top: -1px
}

.avatar-shapeless {
    display: block;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;
    background-position: center;
    border: 2px solid rgba(0, 0, 0, 0.15);
    background: #fff;
    margin: 0 auto;
    overflow: hidden
}

.avatar, .avatar-chromeless {
    display: block;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;
    background-position: center;
    border: 2px solid rgba(0, 0, 0, 0.15);
    background: #fff;
    margin: 0 auto;
    overflow: hidden;
    width: 65px;
    height: 65px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-chromeless {
    border: none
}

.avatar-chromeless img, .avatar img {
    width: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-background-image {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center
}

.avatar-micro {
    width: 24px;
    height: 24px;
    text-align: center;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-icon {
    width: 32px;
    height: 32px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-small {
    width: 50px;
    height: 50px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-large {
    width: 75px;
    height: 75px;
    border-width: 5px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.avatar-icon .icons-avatar-user-img {
    width: 32px;
    height: 32px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.icons-avatar-user-img {
    width: 100%
}

.avatar-list-item {
    display: block;
    float: left;
    margin-right: 5px
}

.avatar-list-item:last-child {
    margin-right: 0
}

.hero {
    text-align: center;
    height: 500px
}

.hero-title {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 50px;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0, 0, 0, 0.8);
    margin-bottom: 8px;
    outline: 0;
    word-break: break-word
}

.hero-description {
    color: rgba(0, 0, 0, 0.6);
    font-size: 18px;
    outline: 0;
    word-break: break-word;
    letter-spacing: -0.02em
}

.hero-description>a {
    color: rgba(0, 0, 0, 0.8)
}

.hero-description>a:hover, .hero-description>a:focus, .hero-description>a:active {
    text-decoration: underline
}

.hero-home {
    height: 380px
}

.hero-home .align-block {
    margin-top: 50px
}

.hero-home .hero-title, .hero-home .hero-description {
    color: #fff
}

.hero-home .hero-title {
    margin-bottom: 0
}

.hero-home .hero-description {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    font-size: 22px;
    margin: 0 0 10px 0;
    padding: 0
}

.hero-home+.nav-tabs {
    padding-bottom: 0
}

.hero-collection {
    height: 80%
}

.hero-collection .hero-title {
    margin-top: 4%;
    color: #fff
}

.hero-collection .hero-description {
    color: rgba(255, 255, 255, 0.85)
}

.hero-collection-tags {
    margin-top: 25px
}

.hero-collection-settings .cover-picker-controls {
    margin-top: -100px
}

.hero-collection-settings .icons-replace-image:before {
    color: rgba(255, 255, 255, 0.5)
}

.hero-collection-settings .icons-replace-image:focus:before, .hero-collection-settings .icons-replace-image:active:before,
.hero-collection-settings .icons-replace-image:hover:before {
    color: #fff
}

.hero-collection-settings .hero-actions {
    margin-bottom: -46px
}

.hero-collection-settings .btn {
    width: 74px
}

.hero-profile, .editing .cover-picker.no-image+.layout-fill-height .hero-profile {
    height: auto;
    margin-top: 450px;
    margin-bottom: 50px
}

.cover-picker.no-image+.layout-fill-height .hero-profile {
    margin-top: 160px
}

.hero-avatar {
    margin-top: -60px;
    margin-bottom: 20px;
    display: inline-block;
    width: 120px;
    height: 120px;
    overflow: hidden;
    border: 3px solid #fff;
    z-index: 500;
    background-color: #fff;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3)
}

.hero-avatar-image {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.hero-standalone {
    padding: 100px 0 40px;
    height: auto
}

.hero-standalone-underline:after {
    content: '';
    background: rgba(0, 0, 0, 0.15);
    height: 1px;
    width: 100px;
    display: block;
    margin: 30px auto 0
}

.hero-fullscreen {
    height: 85%
}

@media screen and (max-width:500px) {
    .hero-title {
        font-size: 32px;
        margin-bottom: 4px
    }

    .hero-description {
        font-size: 16px
    }

    .hero-home {
        height: 250px
    }

    .hero-home .hero-description {
        font-size: 18px;
        margin-bottom: 24px
    }

    .hero-profile, .editing .cover-picker.no-image+.layout-foreground .hero-profile {
        margin-top: 200px;
        margin-bottom: 40px
    }

    .cover-picker.no-image+.layout-foreground .hero-profile {
        margin-top: 80px
    }

    .hero-avatar {
        width: 100px;
        height: 100px;
        margin-top: -50px;
        margin-bottom: 16px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .follow-count {
        max-width: 250px
    }

    .follow-count-value {
        font-size: 32px
    }

    .hero-standalone {
        padding: 0;
        margin-bottom: 10px
    }

    .hero-standalone .hero-title {
        font-size: 18px;
        height: 44px;
        line-height: 46px;
        margin: 0 -6px 20px;
        padding: 10px 0 10px 54px;
        text-align: left;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15)
    }

    .hero-standalone:after {
        display: none
    }

    .hero-standalone .input-text {
        width: 100%
    }
}

.btn {
    display: inline-block;
    position: relative;
    height: 38px;
    line-height: 37px;
    padding: 0 16px;
    border: 0;
    outline: 0;
    color: rgba(0, 0, 0, 0.44);
    background: rgba(0, 0, 0, 0);
    font-size: 14px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid rgba(0, 0, 0, 0.15);
    vertical-align: bottom;
    white-space: nowrap;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 999em;
    -moz-border-radius: 999em;
    border-radius: 999em;
    -webkit-transition: .1s background-color, .1s border-color, .1s color;
    -moz-transition: .1s background-color, .1s border-color, .1s color;
    -ms-transition: .1s background-color, .1s border-color, .1s color;
    -o-transition: .1s background-color, .1s border-color, .1s color;
    transition: .1s background-color, .1s border-color, .1s color
}

.btn:focus, .btn:active, .btn:hover {
    color: rgba(0, 0, 0, 0.6);
    border-color: rgba(0, 0, 0, 0.3)
}

.btn[disabled], .btn[disabled]:hover, .btn[disabled]:active {
    pointer-events: none;
    filter: alpha(opacity=25);
    -khtml-opacity: .25;
    -moz-opacity: .25;
    opacity: .25;
    cursor: default
}

.btn-circle {
    padding: 0;
    width: 38px;
    text-align: center
}

.btn-circle img {
    width: 38px;
    height: 38px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.btn-borderless {
    border: 0;
    height: 40px
}

.btn-borderless.btn-circle {
    width: 40px
}

.btn-borderless.btn-circle img {
    width: 40px;
    height: 40px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.btn-link, .btn-chromeless {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    background: rgba(0, 0, 0, 0);
    height: auto;
    line-height: inherit;
    border-width: 0;
    padding: 0;
    vertical-align: baseline;
    color: rgba(0, 0, 0, 0.3);
    white-space: normal
}

.btn-link:hover, .btn-link:active, .btn-link:focus, .btn-chromeless:hover,
.btn-chromeless:active, .btn-chromeless:focus {
    color: rgba(0, 0, 0, 1);
    border-width: 0;
    background: rgba(0, 0, 0, 0)
}

.btn-link {
    text-align: left
}

.btn .icons {
    line-height: 100%
}

.btn .icons:before {
    margin-right: 8px;
    font-size: 20px;
    line-height: 0;
    position: relative;
    top: 1px;
    color: rgba(0, 0, 0, 0.3)
}

.btn:focus .icons:before, .btn:active .icons:before, .btn:hover .icons:before {
    color: rgba(0, 0, 0, 0.44)
}

.btn-small .icons {
    font-size: 18px
}

.btn .icons-settings:before {
    font-size: 22px;
    top: 5px
}

.btn .icons-shrink:before, .btn .icons-enlarge:before, .btn .icons-twitter:before {
    top: 3px
}

.btn .icons-heart:before {
    top: 2px;
    font-size: 18px;
    margin-left: -2px
}

.btn .icons-pull-right:before, .btn-circle .icons:before {
    margin-right: 0
}

.btn .icons-pull-right:before {
    margin-left: 8px
}

.btn .icons-new-post:before {
    top: 2px;
    font-size: 19px
}

.btn .icons-add-to-collection:before {
    top: 4px
}

.btn .icons-info:before {
    top: 2px;
    font-size: 18px;
    margin-left: -4px
}

.btn-small .icons-arrow-right:before {
    font-size: 16px
}

.btn .icons-reading-list:before {
    top: 4px
}

.btn-circle .icons-share:before {
    top: 2px
}

.btn-with-icon-top .icons {
    display: block;
    margin-bottom: 5px
}

.btn-with-icon-top .icons:before {
    margin-right: 0;
    font-size: 30px;
    line-height: 30px;
    display: inline-block
}

.btn-with-icon-top .icons.icons-replace-image:before, .btn-with-icon-top .icons-replace-image:before {
    top: auto;
    font-size: 30px;
    line-height: 33px;
    left: 1px;
    height: 25px;
    overflow: hidden
}

.btn-count {
    margin-left: 10px
}

.btn-count:before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 18px;
    background: rgba(0, 0, 0, 0.3);
    margin-right: 10px;
    vertical-align: middle
}

.btn-count:hover:before, .btn-count:active:before {
    background: rgba(255, 255, 255, 0.65)
}

.btn-small .btn-count {
    margin-left: 6px
}

.btn-small .btn-count:before {
    margin-right: 6px;
    height: 14px
}

.btn-suffix.active .btn-label:after {
    content: attr(data-suffix)
}

.btn-set .btn {
    margin-right: 8px;
    vertical-align: middle
}

.btn-set>.btn:last-child {
    margin-right: 0
}

.btn-set-vertical>.btn {
    display: block;
    margin: 0 auto 10px
}

.btn-switch {
    display: inline-block;
    position: relative;
    height: 40px;
    background: rgba(0, 0, 0, 0);
    border: 1px solid rgba(0, 0, 0, 0.15);
    vertical-align: bottom;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 999em;
    -moz-border-radius: 999em;
    border-radius: 999em
}

.btn-switch .btn {
    border: 0;
    width: 62px;
    height: 100%;
    color: rgba(0, 0, 0, 0.3);
    padding: 0 16px;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none
}

.btn-switch .btn:hover, .btn-switch .btn:focus, .btn-switch .btn:active {
    background: rgba(0, 0, 0, 0);
    color: rgba(0, 0, 0, 0.6)
}

.btn-switch .btn:nth-child(2) {
    border-right: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0
}

.btn-switch .btn:first-child {
    border-right: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-border-top-left-radius: 999em;
    -moz-border-radius-topleft: 999em;
    border-top-left-radius: 999em;
    -webkit-border-top-right-radius: 0;
    -moz-border-radius-topright: 0;
    border-top-right-radius: 0;
    -webkit-border-bottom-right-radius: 0;
    -moz-border-radius-bottomright: 0;
    border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 999em;
    -moz-border-radius-bottomleft: 999em;
    border-bottom-left-radius: 999em
}

.btn-switch .btn:last-child {
    border: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topleft: 0;
    border-top-left-radius: 0;
    -webkit-border-top-right-radius: 999em;
    -moz-border-radius-topright: 999em;
    border-top-right-radius: 999em;
    -webkit-border-bottom-right-radius: 999em;
    -moz-border-radius-bottomright: 999em;
    border-bottom-right-radius: 999em;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-left-radius: 0
}

.btn-switch .btn[disabled] {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    background: #57ad68;
    color: #fff;
    border: 0;
    -webkit-box-shadow: 0 0 0 1px #57ad68;
    -moz-box-shadow: 0 0 0 1px #57ad68;
    box-shadow: 0 0 0 1px #57ad68
}

.btn-larger {
    height: 54px;
    line-height: 54px;
    padding: 0 24px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal
}

.btn-larger, .btn-larger.btn-link, .btn-larger.btn-chromeless {
    font-size: 20px
}

.btn-larger.btn-link, .btn-larger.btn-chromeless {
    padding: 0
}

.btn-large {
    height: 44px;
    line-height: 44px;
    padding: 0 18px
}

.btn-large, .btn-large.btn-link, .btn-large.btn-chromeless {
    font-size: 15px
}

.btn-large.btn-link, .btn-large.btn-chromeless {
    padding: 0
}

.btn-small {
    height: 32px;
    line-height: 31px;
    padding: 0 14px
}

.btn-small, .btn-small.btn-link, .btn-small.btn-chromeless {
    font-size: 12px
}

.btn-small.btn-link, .btn-small.btn-chromeless {
    padding: 0
}

.btn-primary, .btn-primary.btn-link, .btn-primary .icons:before {
    color: #57ad68
}

.btn-primary {
    border-color: #a9d8b2
}

.btn-primary:focus, .btn-primary:active, .btn-primary:hover {
    background: rgba(0, 0, 0, 0);
    border-color: #57ad68;
    color: #468c54
}

.btn-primary:focus .icons:before, .btn-primary:active .icons:before,
.btn-primary:hover .icons:before {
    color: #468c54
}

.btn-primary.btn-link:hover, .btn-primary.btn-link:active, .btn-primary.btn-link:focus,
.btn-primary.btn-chromeless:hover, .btn-primary.btn-chromeless:active,
.btn-primary.btn-chromeless:focus {
    color: #FFFFFF;
    background: rgba(0, 0, 0, 0)
}

.btn-toggle.active {
    background: #57ad68;
    border-color: #57ad68
}

.btn-toggle.active, .btn-toggle.active .icons:before {
    color: #fff
}

.btn-toggle.active:focus, .btn-toggle.active:active, .btn-toggle.active:hover {
    background: #51b364;
    border-color: rgba(0, 0, 0, 0)
}

.btn-delete:hover, .btn-delete:focus, .btn-delete:active {
    border-color: #cc5454;
    color: #cc5454
}

.btn-uppercase {
    text-transform: uppercase;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 2px
}

.btn-light, .btn-light.btn-link, .btn-light.btn-toggle, .metabar-light .btn,
.metabar-light .btn-link, .metabar-light .btn-toggle {
    color: rgba(255, 255, 255, 0.85);
    background: rgba(0, 0, 0, 0)
}

.btn-light, .metabar-light .btn, .btn-light.btn-toggle, .metabar-light .btn-toggle {
    border-color: rgba(255, 255, 255, 0.5)
}

.btn-light .icons:before, .metabar-light .btn .icons:before {
    color: rgba(255, 255, 255, 0.65)
}

.btn-light:focus, .btn-light:active, .btn-light:hover, .metabar-light .btn:focus,
.metabar-light .btn:active, .metabar-light .btn:hover {
    background: rgba(0, 0, 0, 0);
    border-color: rgba(255, 255, 255, 0.97)
}

.btn-light:focus, .btn-light:active, .btn-light:hover, .btn-light:focus .icons:before,
.btn-light:active .icons:before, .btn-light:hover .icons:before,
.btn-light.btn-toggle.active, .metabar-light .btn:focus, .metabar-light .btn:active,
.metabar-light .btn:hover, .metabar-light .btn:focus .icons:before,
.metabar-light .btn:active .icons:before, .metabar-light .btn:hover .icons:before,
.metabar-light .btn-toggle.active {
    color: #fff
}

.btn-light .btn-count:before, .metabar-light .btn .btn-count:before {
    background: rgba(255, 255, 255, 0.2)
}

.btn-light.btn-primary, .btn-light.btn-toggle.active, .metabar-light .btn-primary,
.metabar-light .btn-toggle.active, .btn-light.btn-toggle:focus,
.btn-light.btn-toggle:active, .btn-light.btn-toggle:hover, .metabar-light .btn-toggle:focus,
.metabar-light .btn-toggle:active, .metabar-light .btn-toggle:hover {
    background: rgba(87, 173, 104, 0.8);
    border-color: rgba(0, 0, 0, 0);
    color: #fff
}

.btn-light.btn-primary:focus, .btn-light.btn-primary:active, .btn-light.btn-primary:hover,
.metabar-light .btn-primary:focus, .metabar-light .btn-primary:active,
.metabar-light .btn-primary:hover, .btn-light.btn-toggle.active:focus,
.btn-light.btn-toggle.active:active, .btn-light.btn-toggle.active:hover,
.metabar-light .btn-toggle.active:focus, .metabar-light .btn-toggle.active:active,
.metabar-light .btn-toggle.active:hover {
    background: #57ad68;
    border-color: rgba(0, 0, 0, 0)
}

.btn-light.btn-delete:hover, .btn-light.btn-delete:focus, .btn-light.btn-delete:active,
.metabar-light .btn-delete:hover, .metabar-light .btn-delete:focus,
.metabar-light .btn-delete:active {
    border-color: rgba(0, 0, 0, 0);
    background: #cc5454;
    color: #fff
}

.btn-set .btn-link, .btn-set .btn-chromeless {
    height: 38px;
    line-height: 37px
}

.btn-set .btn-large.btn-link, .btn-set .btn-large.btn-chromeless {
    height: 44px;
    line-height: 43px
}

.btn-set .btn-small.btn-link, .btn-set .btn-small.btn-chromeless {
    height: 32px;
    line-height: 32px
}

.btn-set-profile .btn-cancel, .btn-set-profile .btn-save, .editing .btn-set-profile .btn-edit {
    display: none
}

.browser-ie .btn-set-profile .btn-edit {
    display: none
}

.editing .btn-set-profile .btn-cancel, .editing .btn-set-profile .btn-save {
    display: inline-block
}

.btn-facebook, .btn-facebook:hover {
    background-color: #3b5998;
    border: 0;
    color: #fff
}

.btn-facebook:hover {
    background-color: #1d315b
}

.btn-facebook .icons:before, .btn-facebook:hover .icons:before {
    color: #fff;
    top: 3px
}

.btn-twitter, .btn-twitter:hover {
    background-color: #55acee;
    border: 0;
    color: #fff
}

.btn-twitter:hover {
    background-color: #006daa
}

.btn-twitter .icons:before, .btn-twitter:hover .icons:before {
    color: #fff;
    top: 3px
}

@media screen and (max-width:500px) {
    .btn {
        height: 32px;
        line-height: 31px;
        font-size: 14px;
        padding: 0 14px
    }

    .btn-embed {
        display: none
    }

    .btn-circle {
        padding: 0;
        width: 32px
    }

    .btn-circle img {
        width: 32px;
        height: 32px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .btn-borderless {
        height: 34px
    }

    .btn-borderless.btn-circle {
        width: 34px
    }

    .btn-borderless.btn-circle img {
        width: 34px;
        height: 34px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .btn-link, .btn-chromeless {
        line-height: inherit;
        vertical-align: baseline;
        height: auto;
        padding: 0
    }

    .btn-large {
        height: 38px;
        line-height: 37px;
        font-size: 14px;
        padding: 0 16px
    }

    .btn-set .btn {
        margin-right: 4px
    }

    .btn-switch {
        height: 32px;
        line-height: 28px
    }

    .btn-switch .btn:first-child {
        padding-right: 6px
    }

    .btn-switch .btn:last-child {
        padding-left: 6px
    }

    .btn-switch .btn[disabled] {
        padding: 0 12px
    }

    .btn-larger {
        height: 38px;
        line-height: 37px;
        padding: 0 16px
    }
}

.link {
    color: inherit;
    text-decoration: none
}

.link:hover, .link:active, .link:focus {
    color: inherit;
    text-decoration: underline
}

.link-primary {
    color: rgba(0, 0, 0, 0.8);
    text-decoration: none
}

.link-primary:hover, .link-primary:active, .link-primary:focus {
    color: #57ad68;
    text-decoration: none
}

.link-secondary {
    color: rgba(0, 0, 0, 0.3)
}

.error .link, .error .link:hover, .error .link:active, .error .link:focus {
    color: #fff
}

.link-underline {
    text-decoration: underline
}

.link-accent {
    color: #57ad68;
    text-decoration: none
}

.link-accent:hover, .link-accent:active, .link-accent:focus {
    color: #57ad68;
    text-decoration: none
}

.link-butter {
    color: #57ad68;
    text-decoration: underline
}

.link-butter:hover, .link-butter:active, .link-butter:focus {
    color: #468c54
}

.link-overlay {
    color: rgba(0, 0, 0, 0.8)
}

.link-overlay:hover, .link-overlay:active, .link-overlay:focus {
    color: rgba(0, 0, 0, 0.9)
}

.post-item {
    display: block;
    padding: 30px 0;
    word-wrap: break-word
}

.bucket-item:last-child .post-item {
    margin-bottom: 30px
}

.post-item-title {
    margin-top: 4px
}

.post-item-title>a {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    display: block;
    font-size: 28px;
    line-height: 1.1;
    color: rgba(0, 0, 0, 0.8);
    margin-bottom: 4px
}

.post-item-snippet>p {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 20px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 4px
}

.post-item-meta {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3)
}

.post-item-meta-item {
    display: inline
}

.post-item-meta-item:before {
    content: ' · '
}

.post-item-meta-item:first-child:before {
    content: ''
}

.post-item-meta-avatar {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin-right: 8px;
    margin-bottom: -10px
}

.post-item-meta .btn-set {
    margin-top: 10px
}

.post-item-source {
    font-size: 14px;
    font-style: italic;
    color: rgba(0, 0, 0, 0.3)
}

.post-item-avatar {
    float: right;
    width: 44px;
    height: 44px;
    margin-left: 16px;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.05);
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.post-item-light .post-item-title>a {
    color: #fff
}

.post-item-light .post-item-snippet>p {
    color: rgba(255, 255, 255, 0.97)
}

.post-item-light .post-item-meta, .post-item-light .post-item-meta-item>a,
.post-item-light .reading-list-status .icons-reading-list {
    color: rgba(255, 255, 255, 0.5)
}

.post-item-light .reading-list-status:hover .reading-list-status-message,
.post-item-light .reading-list-status:hover .icons-reading-list {
    color: rgba(255, 255, 255, 0.85)
}

.ordered-posts {
    counter-reset: posts-counter
}

.ordered-posts .post-item {
    position: relative
}

.ordered-posts .post-item-small:before {
    content: counter(posts-counter) ". ";
    counter-increment: posts-counter;
    position: absolute;
    top: 50%;
    left: 0px;
    width: 40px;
    margin-top: -18px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 24px;
    letter-spacing: -0.04em;
    white-space: nowrap
}

.ordered-posts .post-item-small {
    padding-left: 44px
}

.post-item-small {
    padding: 20px 0
}

.post-item-small .post-item-title {
    line-height: 1.1
}

.post-item-small .post-item-title>a {
    font-size: 18px
}

.post-item-small .post-item-snippet {
    display: none
}

.post-item-small .post-item-title {
    margin-bottom: 0
}

.post-item-small .post-item-avatar {
    width: 40px;
    height: 40px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.post-status-draft .post-item-snippet>p {
    color: rgba(0, 0, 0, 0.3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.post-item-rich {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 45px 0
}

.post-item-rich .post-item-meta-rich-reason {
    display: block;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3);
    margin: 14px 0 4px 0
}

.post-item-rich .post-item-meta-avatar {
    width: 24px;
    height: 24px;
    margin-bottom: -7px
}

.post-item-rich .post-item-meta {
    margin-top: 10px
}

.hide-author .post-item-author, .hide-author .post-item-avatar,
.hide-collection .post-item-collection {
    display: none
}

.post-meta {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3)
}

.post-meta-avatar {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin-bottom: -10px
}

.post-meta-avatar-recommend {
    width: 25px;
    height: 25px
}

.post-meta-avatar-author {
    margin-right: 8px
}

.post-meta-recommends-icon {
    font-size: 14px;
    line-height: 25px;
    margin-right: 3px;
    color: rgba(0, 0, 0, 0.15)
}

.post-meta-actions {
    margin-top: 15px
}

.post-item-light .post-meta, .post-item-light .post-meta .link-secondary {
    color: rgba(255, 255, 255, 0.5)
}

.post-item-light .post-meta-recommends-icon {
    color: rgba(255, 255, 255, 0.35)
}

.post-item-connections {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 40px 0
}

.bucket-item:last-child .post-item-connections {
    border-bottom: 0
}

.post-item-connections .post-item-title {
    margin-bottom: 8px
}

.post-item-connections .post-item-snippet>p {
    margin-bottom: 12px
}

.post-item-connections .post-meta-bookmark {
    margin-top: 3px;
    margin-left: 15px;
    white-space: nowrap
}

.post-item-connections .post-meta-author-collection {
    line-height: 30px
}

.post-item-connections .post-meta-recommends {
    float: right
}

.post-meta-recommends:only-child {
    margin-top: 4px
}

.post-item-connections.post-item-light {
    border-color: rgba(255, 255, 255, 0.2)
}

@media all and (max-width:500px) {
    .post-item {
        padding: 20px 0
    }

    .post-item-title>a {
        font-size: 22px
    }

    .post-item-snippet>p {
        font-size: 16px
    }

    .post-item-meta .reading-list-status {
        display: inline-block
    }

    .post-item-avatar, .post-item-small .post-item-avatar {
        width: 36px;
        height: 36px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .post-item-rich .post-item-image {
        height: auto;
        width: 100%
    }
}

.collection-bucket>.bucket-item {
    display: inline-block;
    height: 260px;
    width: 31.33%;
    margin-left: 3%;
    margin-bottom: 3%;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    position: relative;
    overflow: hidden
}

.collection-item {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 30px 20px;
    background-color: rgba(0, 0, 0, 0.8);
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.bucket-two-column>.bucket-item {
    width: 48%;
    margin-left: 4%;
    margin-bottom: 4%
}

.browser-ie .collection-item:after {
    background: rgba(0, 0, 0, 0.44)
}

.collection-bucket>.bucket-item:nth-child(3n+1) {
    margin-left: 0
}

.collection-item.align-bottom:before {
    margin: 0
}

.collection-item .align-block {
    position: relative;
    z-index: 200
}

.collection-item-title {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 20px;
    line-height: 1.2;
    letter-spacing: -0.04em;
    color: #fff;
    padding-bottom: 6px;
    overflow: hidden;
    max-height: 154px;
    word-break: break-word
}

.collection-item-meta {
    color: rgba(255, 255, 255, 0.85);
    font-size: 14px;
    line-height: 1.1;
    word-break: break-word
}

.collection-item .btn-follow {
    margin-top: 10px
}

.collection-item[data-action="toggle-subscribe-collection"] {
    cursor: pointer
}

@media screen and (max-width:680px) {
    .collection-bucket>.bucket-item {
        width: 48%;
        margin-left: 4%;
        margin-bottom: 4%
    }

    .collection-bucket>.bucket-item:nth-child(3n+1) {
        margin-left: 4%
    }

    .collection-bucket>.bucket-item:nth-child(2n+1) {
        margin-left: 0
    }
}

@media screen and (max-width:400px) {
    .collection-bucket>.bucket-item, .bucket-two-column>.bucket-item {
        display: block;
        height: 200px;
        width: auto;
        padding: 30px 20px;
        margin-left: 0;
        margin-bottom: 20px
    }

    .collection-bucket>.bucket-item:nth-child(3n+1) {
        margin-left: 0
    }
}

.butter-bar {
    position: fixed;
    top: -100px;
    width: 58%;
    max-width: 640px;
    margin-left: 36%;
    z-index: 800;
    text-align: center;
    -webkit-transition: top 0.7s, opacity 0.7s;
    -moz-transition: top 0.7s, opacity 0.7s;
    -ms-transition: top 0.7s, opacity 0.7s;
    -o-transition: top 0.7s, opacity 0.7s;
    transition: top 0.7s, opacity 0.7s;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.butter-bar-center {
    left: 50%;
    margin-left: -320px
}

.butter-bar.active {
    top: 0;
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.butter-bar-message {
    display: inline-block;
    background: rgba(255, 255, 255, 0.97);
    padding: 12px 25px;
    margin-bottom: 0;
    font-size: 14px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-left-radius: 4px
}

.butter-bar-dismiss {
    margin-left: 20px
}

.butter-bar-actions {
    color: rgba(0, 0, 0, 0.44)
}

.butter-bar.error .butter-bar-message {
    background: #cc5454;
    color: #fff
}

@media all and (max-width:1000px) {
    .template-flex-article .butter-bar, .butter-bar {
        left: 0;
        margin-left: 10%;
        width: 80%;
        max-width: none
    }
}

@media all and (max-width:500px) {
    .butter-bar {
        margin-left: 5%;
        width: 90%
    }
}

@media all and (min-width:1666px) {
    .butter-bar {
        margin-left: 685px
    }

    .butter-bar-center {
        margin-left: -320px
    }
}

.loading-bar {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    z-index: 800;
    background: #60d778;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%)
}

.app-loading .loading-bar {
    display: block;
    -webkit-animation: shift-rightwards 1s ease-in-out infinite;
    -moz-animation: shift-rightwards 1s ease-in-out infinite;
    -ms-animation: shift-rightwards 1s ease-in-out infinite;
    -o-animation: shift-rightwards 1s ease-in-out infinite;
    animation: shift-rightwards 1s ease-in-out infinite;
    -webkit-animation-delay: .4s;
    -moz-animation-delay: .4s;
    -o-animation-delay: .4s;
    animation-delay: .4s
}

.image-header-bleed, .image-home-header-bleed {
    position: fixed;
    background: rgba(0, 0, 0, 0.9);
    top: 0;
    left: 0;
    right: 0;
    height: 450px;
    pointer-events: none
}

.image-full-bleed, .image-src {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.image-full-bleed {
    background: rgba(0, 0, 0, 0.9);
    position: fixed
}

.image-fill, .image-src {
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.image-blur {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    z-index: 20
}

.image-wrap {
    background-color: rgba(0, 0, 0, 0.6);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.is-usingCanvas .image-src {
    display: none
}

.is-usingCanvas.image-full-bleed, .is-usingCanvas.image-header-bleed,
.is-usingCanvas.image-home-header-bleed {
    background: rgba(0, 0, 0, 0)
}

.site-nav-transition .is-usingCanvas.image-full-bleed, .site-nav-transition .is-usingCanvas.image-header-bleed,
.site-nav-transition .is-usingCanvas.image-home-header-bleed {
    pointer-events: none
}

@media screen and (max-width:500px) {
    .image-home-header-bleed {
        height: 300px
    }

    .image-header-bleed {
        height: 200px;
        bottom: -70px
    }
}

.upload-feedback .btn-cancel {
    position: absolute;
    width: auto;
    right: 13px;
    top: 30px;
    font-size: 24px
}

.image-picker-wrap {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

.image-picker-wrap .upload-feedback-inner {
    margin: 16px auto;
    width: 275px;
    position: relative
}

.image-picker-wrap .upload-feedback {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 200;
    width: 315px;
    margin-left: -157px
}

.image-picker-wrap .progress-bar-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 250px;
    height: 13px;
    background: #468c54;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden
}

.image-picker-wrap .progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #fff;
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-left-radius: 4px
}

.image-picker-wrap .progress-bar.uploading-image {
    display: block
}

.image-picker-wrap .upload-feedback-preview {
    display: none;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.3);
    width: 75px;
    height: 75px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.no-image .resize-header-image, .no-image .remove-header-image {
    display: none
}

.image-picker-wrap .image-washes, .image-picker-wrap .remove-header-image,
.image-picker-wrap .icons-enlarge, .image-picker-wrap .icons-shrink {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -ms-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s
}

.image-picker-wrap .remove-header-image, .image-picker-wrap .resize-header-image {
    position: absolute;
    font-size: 30px;
    color: #fff;
    z-index: 200
}

.background-size-contain .remove-header-image {
    top: 0;
    right: 14px
}

.image-picker-wrap .resize-header-image {
    left: 12px;
    bottom: 5px
}

.image-picker-wrap.has-image.background-size-cover .icons-shrink,
.image-picker-wrap.has-image.background-size-contain .icons-enlarge {
    display: block
}

.image-picker-wrap.has-image.background-size-contain:hover .remove-header-image,
.image-picker-wrap.has-image.background-size-cover:hover .icons-shrink,
.image-picker-wrap.has-image.background-size-contain:hover .icons-enlarge,
.image-picker-wrap.has-image.background-size-full .remove-header-image,
.image-picker-wrap.has-image.background-size-full .image-washes {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.avatar-picker {
    padding: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-border-radius: 75px;
    -moz-border-radius: 75px;
    border-radius: 75px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.avatar-picker .feedback-area {
    position: absolute;
    top: -68px;
    left: -49px;
    height: 35px;
    background: #fff;
    width: 175px;
    padding: 16px 10px 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.avatar-picker .progress {
    width: 135px;
    height: 2px;
    border: none;
    background: rgba(0, 0, 0, 0.15)
}

.avatar-picker .progress-bar {
    height: 2px
}

.ie9-dialog .spinner-overlay {
    display: none
}

.uploading-image .ie9-dialog .spinner-overlay {
    display: block;
    position: absolute;
    z-index: 900;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5)
}

.image-washes {
    display: none;
    position: absolute;
    bottom: 13px;
    left: 50px;
    z-index: 200
}

.has-image .image-washes {
    display: block
}

.image-washes-item {
    float: left;
    list-style: none;
    margin-right: 4px
}

.btn-image-wash {
    border: 1px solid rgba(0, 0, 0, 0);
    background: transparent;
    outline: none;
    padding: 0;
    width: 16px;
    height: 16px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.btn-image-wash[data-action-value="grey"] {
    background: rgba(0, 0, 0, 0.8)
}

.btn-image-wash[data-action-value="blue"] {
    background: #0b6587
}

.btn-image-wash[data-action-value="yellow"] {
    background: #9d790a
}

.btn-image-wash[data-action-value="teal"] {
    background: #109681
}

.btn-image-wash[data-action-value="purple"] {
    background: #5b1f9f
}

.btn-image-wash[data-action-value="red"] {
    background: #90281a
}

.btn-image-wash[data-action-value=""] {
    border-color: #fff
}

.transition-picker-layout, .transition-picker-layout .picker-target,
.transition-picker-layout .picker-content {
    -webkit-transition: all .6s .25s;
    -moz-transition: all .6s .25s;
    -ms-transition: all .6s .25s;
    -o-transition: all .6s .25s;
    transition: all .6s .25s
}

.image-picker-wrap.has-image.transition-picker-layout .caption {
    display: none
}

.image-picker-wrap.has-image.transition-picker-layout .image-washes,
.image-picker-wrap.has-image.transition-picker-layout .remove-header-image {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.pre-transition-picker-image .story-cover-image {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transform: translateY(-5%) scale(.9);
    -moz-transform: translateY(-5%) scale(.9);
    -ms-transform: translateY(-5%) scale(.9);
    -o-transform: translateY(-5%) scale(.9);
    transform: translateY(-5%) scale(.9)
}

.transition-picker-image .story-cover-image {
    -webkit-transition: all .25s .1s;
    -moz-transition: all .25s .1s;
    -ms-transition: all .25s .1s;
    -o-transition: all .25s .1s;
    transition: all .25s .1s;
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.picker-target-clone {
    display: none
}

.pre-transition-picker-image .picker-target-clone, .transition-picker-image .picker-target-clone {
    display: block
}

.picker-layout-fill {
    color: #fff
}

.picker-layout-fill .post-field.subtitle {
    color: rgba(255, 255, 255, 0.65)
}

.picker-layout-fill .default-value.post-title p {
    color: rgba(255, 255, 255, 0.65)
}

.picker-layout-fill .default-value.subtitle p {
    color: rgba(255, 255, 255, 0.35)
}

.picker-layout-fill .default-value.caption p {
    color: rgba(255, 255, 255, 0.5)
}

.picker-layout-fill .post-item-meta, .picker-layout-fill .post-item-meta a,
.picker-layout-fill .post-item-author {
    color: rgba(255, 255, 255, 0.65)
}

.picker-layout-fill .post-item-meta a:hover {
    color: #fff
}

.picker-layout-fill .icons-reading-list {
    color: rgba(255, 255, 255, 0.65)
}

.picker-layout-fill .reading-list-status:hover .reading-list-status-message,
.picker-layout-fill .reading-list-status:hover .icons-reading-list {
    color: rgba(255, 255, 255, 0.97)
}

.picker-layout-fill .on-reading-list:hover .icons-reading-list {
    color: #57ad68
}

.bucket {
    padding-bottom: 80px
}

.editing .bucket {
    display: none
}

.bucket-label, .bucket-label>a {
    color: rgba(0, 0, 0, 0.3);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase
}

.bucket-label {
    text-align: left;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    padding: 20px 0
}

.bucket-item:last-child .post-item {
    margin-bottom: 0
}

.bucket-label+.collection-bucket {
    margin-top: 20px
}

.bucket-empty {
    text-align: center;
    padding-top: 20px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.44)
}

.bucket-empty:before {
    content: "";
    display: inline-block;
    width: 70px;
    margin-bottom: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.bucket-empty-hidden {
    display: none
}

.nav-tabs+.bucket .bucket-empty {
    margin: 60px 0
}

.nav-tabs+.bucket .bucket-empty:before {
    display: none
}

.nav-tabs-hidden+.bucket .bucket-empty {
    margin: 0
}

.nav-tabs-hidden+.bucket .bucket-empty:before {
    display: inline-block
}

.bucket-empty-action .icons-inline {
    padding: 0 2px;
    vertical-align: -1px
}

.bucket-empty-message, .bucket-empty-action {
    margin-bottom: 4px
}

.bucket-empty-light {
    color: rgba(255, 255, 255, 0.65)
}

.bucket-empty-light:before {
    border-top: 1px solid rgba(255, 255, 255, 0.65)
}

.image-home-header-bleed~.layout-foreground .bucket {
    padding-top: 30px
}

@media screen and (max-width:500px) {
    .bucket {
        padding-bottom: 40px
    }

    .bucket-label {
        padding: 18px 0;
        letter-spacing: .1em
    }

    .image-home-header-bleed~.layout-foreground .bucket {
        padding-top: 20px
    }
}

.list {
    margin-bottom: 150px
}

.list-light {
    color: #fff
}

.list-item {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 40px 0 35px
}

.list-item:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2)
}

.list-item>h4 {
    text-transform: uppercase
}

.list-item>p {
    margin-bottom: 15px
}

.control {
    position: absolute;
    margin-right: 20px;
    margin-top: 6px
}

.control .icons:before {
    color: rgba(0, 0, 0, 0.3)
}

.control .icons:hover:before {
    color: rgba(0, 0, 0, 0.44)
}

.control.is-overDarkContent .icons:before {
    color: rgba(255, 255, 255, 0.5)
}

.control.is-overDarkContent.is-showingColorControls .icons-part-color:before {
    color: #fff
}

.control-item {
    display: inline-block;
    line-height: 0;
    margin-right: 2px
}

.control-item .icons:before {
    font-size: 27px;
    vertical-align: middle;
    margin: 0
}

.control-item>.btn {
    width: 25px;
    height: 25px
}

.control-item--revert {
    display: none
}

.is-overDarkContent .control-item--revert {
    display: inline
}

.colorGrid {
    display: none;
    position: absolute;
    width: 80px;
    top: 0;
    right: 0;
    margin-top: 35px;
    margin-right: 2px;
    z-index: 200
}

.control.is-showingColorControls .colorGrid {
    display: block
}

.colorGrid-item {
    display: inline-block;
    float: left;
    list-style: none;
    margin: 0 4px 4px 0
}

.colorGrid-btn {
    border: 1px solid rgba(0, 0, 0, 0.15);
    background: transparent;
    outline: none;
    padding: 0;
    width: 16px;
    height: 16px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.colorGrid-btn.is-active {
    border: 1px solid #fff
}

section[data-background-color="seaweed"], .colorGrid-btn[data-action-value="seaweed"] {
    background: #47bcac
}

section[data-background-color="midday"], .colorGrid-btn[data-action-value="midday"] {
    background: #2fa5c6
}

section[data-background-color="midnight"], .colorGrid-btn[data-action-value="midnight"] {
    background: #5065a0
}

section[data-background-color="grimace"], .colorGrid-btn[data-action-value="grimace"] {
    background: #8764ae
}

section[data-background-color="magic"], .colorGrid-btn[data-action-value="magic"] {
    background: #a93f7f
}

section[data-background-color="crush"], .colorGrid-btn[data-action-value="crush"] {
    background: #c7465e
}

section[data-background-color="warm"], .colorGrid-btn[data-action-value="warm"] {
    background: #e57f4c
}

section[data-background-color="gray"], .colorGrid-btn[data-action-value="gray"] {
    background: #333332
}

section[data-background-color="lime"], .colorGrid-btn[data-action-value="lime"] {
    background: #98bc6b
}

section[data-background-color="fresh"], .colorGrid-btn[data-action-value="fresh"] {
    background: #69cb91
}

section[data-background-color="brook"], .colorGrid-btn[data-action-value="brook"] {
    background: #86a89d
}

section[data-background-color="lipstick"], .colorGrid-btn[data-action-value="lipstick"] {
    background: #a84a4e
}

section[data-background-color="seaweedLight"], .colorGrid-btn[data-action-value="seaweedLight"] {
    background: #c6eae5
}

section[data-background-color="middayLight"], .colorGrid-btn[data-action-value="middayLight"] {
    background: #b5e1ed
}

section[data-background-color="midnightLight"], .colorGrid-btn[data-action-value="midnightLight"] {
    background: #bfc7df
}

section[data-background-color="grimaceLight"], .colorGrid-btn[data-action-value="grimaceLight"] {
    background: #dfd6ea
}

section[data-background-color="magicLight"], .colorGrid-btn[data-action-value="magicLight"] {
    background: #e3b3d0
}

section[data-background-color="crushLight"], .colorGrid-btn[data-action-value="crushLight"] {
    background: #efcbd2
}

section[data-background-color="warmLight"], .colorGrid-btn[data-action-value="warmLight"] {
    background: #fbebe3
}

section[data-background-color="grayLight"], .colorGrid-btn[data-action-value="grayLight"] {
    background: rgba(0, 0, 0, 0.05)
}

section[data-background-color="limeLight"], .colorGrid-btn[data-action-value="limeLight"] {
    background: #ebf2e2
}

section[data-background-color="freshLight"], .colorGrid-btn[data-action-value="freshLight"] {
    background: #eaf8ef
}

section[data-background-color="brookLight"], .colorGrid-btn[data-action-value="brookLight"] {
    background: #ebf1ef
}

section[data-background-color="lipstickLight"], .colorGrid-btn[data-action-value="lipstickLight"] {
    background: #e2bdbf
}

section[data-background-color]+section[data-background-color],
section[data-background-color] {
    padding: 80px 280px 80px 0;
    width: 100%
}

section[data-background-color] {
    color: #fff;
    margin: 80px 0
}

section[data-background-color$="Light"] {
    color: rgba(0, 0, 0, 0.8)
}

section[data-background-color]+section[data-background-color] {
    margin-top: -80px
}

section[data-background-color]+.section-image-full, .section-image-full+section[data-background-color] {
    margin-top: -81px
}

section[data-background-color]:last-child {
    margin-bottom: 0
}

section[data-background-color]+section>.section-divider {
    display: none
}

.is-postCoverless section[data-background-color]:first-child {
    margin-top: 0
}

.diagnostics {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    position: fixed;
    text-align: left;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 20px;
    background: #fff;
    z-index: 1000;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -ms-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    -webkit-transform: translate3d(100%, 0, 0);
    -moz-transform: translate3d(100%, 0, 0);
    -ms-transform: translate3d(100%, 0, 0);
    -o-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.2)
}

.diagnostics-visible .diagnostics {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.diagnostic-item {
    float: left;
    padding-right: 20px;
    white-space: nowrap;
    position: relative
}

.diagnostic-title {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.6)
}

.diagnostic-detail {
    display: inline
}

.diagnostic-detail:before {
    content: ', '
}

.diagnostic-detail:first-child:before {
    content: ''
}

.diagnostics, .diagnostics .btn-link {
    font-size: 12px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.3)
}

.diagnostics .icons {
    line-height: 0
}

.diagnostics .icons:before {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.15)
}

.diagnostics .icons-info {
    cursor: pointer;
    padding-left: 2px
}

.diagnostics-graphs {
    float: right
}

.diagnostics-graphs .diagnostic-item {
    min-width: 60px;
    text-align: right
}

.diagnostic-graph-disable {
    position: absolute;
    top: 0;
    left: 0
}

.diagnostic-graph, .diagnostic-graph-item {
    height: 15px
}

.diagnostic-graph {
    margin-top: -1px;
    width: 60px;
    background: rgba(0, 0, 0, 0.15)
}

.diagnostic-graph-item {
    width: 1px;
    display: block;
    float: left;
    background: #fff
}

.show-diagnostics, .hide-diagnostics {
    position: absolute;
    top: 0
}

.show-diagnostics {
    left: -18px
}

.hide-diagnostics {
    right: 5px
}

.show-diagnostics .icons:before, .hide-diagnostics .icons:before {
    font-size: 20px;
    line-height: 44px
}

@media (max-width:500px){.diagnostics {
        padding: 12px 10px
    }

    .diagnostics, .diagnostics .btn-link {
        font-size: 11px
    }

    .diagnostic-item {
        padding-right: 10px
    }

    .diagnostic-title {
        font-size: 12px
    }

    .diagnostics-graphs {
        display: none
    }
}

.plovr-error-report {
    position: absolute;
    z-index: 1000;
    top: 0
}

.variants {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.variants table {
    width: 100%
}

.variants td {
    width: 50%;
    border-bottom: 1px dotted rgba(0, 0, 0, 0.3);
    padding: 5px 0;
    vertical-align: top
}

.prl-debug {
    margin-top: 15px;
    background-color: rgba(0, 0, 0, 0.05);
    padding: 10px
}

.prl-debug-item {
    display: inline;
    margin-right: 10px
}

.prl-debug-weight {
    font-size: 24px;
    padding-right: 10px
}

.prl-debug-item-provider {
    margin-top: 10px
}

.prl-debug-item-provider>ul {
    margin-left: 10px
}

.prl-debug-provider-header {
    font-size: 24px
}

.prl-debug-provider-name {
    display: block;
    font-size: 18px;
    margin: 15px 0 5px 0
}

.prl-debug-dimension {
    margin-right: 10px
}

.prl-debug-providers {
    background-color: rgba(0, 0, 0, 0.05);
    padding: 10px
}

@media print {
    .diagnostics {
        display: none
    }
}

.overlay-dialog-open {
    overflow: hidden
}

.overlay {
    position: fixed;
    overflow: auto;
    text-align: center;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 900;
    background-color: #fff
}

.overlay:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em
}

.overlay-dialog {
    display: inline-block;
    vertical-align: middle;
    outline: none;
    overflow: hidden;
    max-width: 580px;
    -webkit-transform-origin: bottom center;
    -moz-transform-origin: bottom center;
    -o-transform-origin: bottom center;
    transform-origin: bottom center;
    -webkit-animation: scale-fade 300ms forwards cubic-bezier(.8, .02, .45, .91);
    -moz-animation: scale-fade 300ms forwards cubic-bezier(.8, .02, .45, .91);
    -ms-animation: scale-fade 300ms forwards cubic-bezier(.8, .02, .45, .91);
    -o-animation: scale-fade 300ms forwards cubic-bezier(.8, .02, .45, .91);
    animation: scale-fade 300ms forwards cubic-bezier(.8, .02, .45, .91);
    padding: 40px
}

.overlay-dialog.overlay-dialog-form {
    overflow: visible
}

.overlay-title {
    color: rgba(0, 0, 0, 0.8);
    font-size: 32px;
    line-height: 1.1;
    margin-bottom: 6px
}

.overlay-content {
    color: rgba(0, 0, 0, 0.6);
    line-height: 1.4;
    margin-bottom: 30px
}

.overlay-actions>.btn {
    margin-bottom: 10px
}

.overlay-content>a {
    text-decoration: underline;
    color: rgba(0, 0, 0, 0.6)
}

.overlay-interstitial .overlay-content>p {
    width: 450px;
    line-height: 1.4
}

.overlay-dialog-update, .overlay-interstitial-stories .overlay-dialog {
    -webkit-transform-origin: none;
    -moz-transform-origin: none;
    -o-transform-origin: none;
    transform-origin: none;
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none
}

.overlay-title+.overlay-actions {
    margin-top: 20px
}

.overlay-close {
    border: 0;
    background: rgba(0, 0, 0, 0);
    position: absolute;
    top: 5px;
    right: 5px;
    padding-right: 5px;
    color: rgba(0, 0, 0, 0.3)
}

.overlay-close:hover {
    color: rgba(0, 0, 0, 0.8)
}

.overlay-dialog-signin, .overlay-dialog-alert, .overlay-dialog-confirm {
    text-align: center
}

.overlay-actions .btn:nth-child(2) {
    margin-left: 10px
}

.overlay-dialog-signin .btn {
    width: 195px
}

.overlay-dialog-signin .btn-set-vertical>.btn:last-child {
    margin: 0 auto
}

.overlay-form-container {
    width: 590px
}

.overlay-form-text-input {
    width: 100%
}

.overlay-interstitial-collab .overlay-dialog {
    width: 590px
}

.overlay-interstitial-collab .overlay-title {
    margin-bottom: 15px
}

.overlay-interstitial-collab .overlay-animation {
    display: block;
    height: 168px;
    width: 100%
}

.overlay-interstitial .overlay-actions {
    text-align: center
}

.overlay-dialog-keyboard-list {
    margin: 35px 0 0;
    *zoom: 1
}

.overlay-dialog-keyboard-list:before, .overlay-dialog-keyboard-list:after {
    display: table;
    content: " "
}

.overlay-dialog-keyboard-list:after {
    clear: both
}

.overlay-dialog-keyboard-def {
    text-align: left;
    margin-bottom: 10px;
    width: 31%;
    float: left
}

.overlay-dialog-keyboard-term {
    float: left;
    margin-right: 10px
}

.overlay-dialog-keyboard-key {
    position: relative;
    top: -2px;
    padding: 5px 10px;
    color: #fff;
    background: rgba(0, 0, 0, 0.8);
    box-shadow: 0 2px 0 #000;
    font-family: courier;
    font-size: 14px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.overlay-dialog-publish-inner {
    text-align: left;
    margin: 35px;
    width: 500px
}

.post-publish-input {
    width: 100%
}

.overlay-registration {
    max-width: 400px
}

.overlay-registration-description {
    margin-bottom: 20px
}

.overlay-registration .input-text {
    width: 100%;
    margin-bottom: 10px
}

.overlay-registration .btn-create-account {
    margin-top: 20px
}

.overlay-registration-terms, .overlay-registration-follow-twitter {
    font-size: 14px;
    text-align: left;
    margin: 10px 0 0
}

.overlay-registration-terms {
    margin-top: 25px
}

.overlay-registration-terms>a {
    text-decoration: underline
}

.overlay-registration-checkbox {
    vertical-align: 1px;
    margin-right: 4px
}

.overlay-signin-waiting {
    max-width: 300px;
    font-size: 14px;
    color: #b3b3b1;
    margin: 0 auto
}

.overlay-signin-loading {
    color: #b3b3b1;
    font-size: 18px
}

.embed {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0 1px 3px;
    -moz-box-shadow: rgba(0, 0, 0, 0.15) 0 1px 3px;
    box-shadow: rgba(0, 0, 0, 0.15) 0 1px 3px;
    border-width: 1px;
    border-style: solid;
    border-color: #eee #ddd #bbb;
    position: relative;
    overflow: hidden;
    max-width: 400px;
    margin: 0 auto
}

@media screen and (max-width:1000px) {
    .overlay-dialog-keyboard-def {
        float: none;
        width: auto
    }
}

@media screen and (max-width:500px) {
    .overlay-dialog {
        width: 90%;
        padding: 0
    }

    .overlay-title {
        font-size: 24px
    }

    .overlay-content {
        font-size: 16px
    }

    .overlay-interstitial-collab .overlay-animation {
        height: 84px
    }

    .overlay-interstitial .overlay-content>p {
        width: 100%
    }

    .overlay-form-container {
        width: auto
    }
}

.metabar {
    display: block;
    z-index: 500;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    font-size: 14px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    color: rgba(0, 0, 0, 0.3);
    pointer-events: none
}

.metabar-top {
    position: absolute;
    top: 0;
    height: 65px
}

.metabar-block {
    pointer-events: auto
}

.metabar-block.align-left {
    padding-left: 54px
}

.metabar .btn-set, .metabar .metabar-text {
    margin: 10px;
    line-height: 44px;
    display: inline-block;
    white-space: nowrap
}

.metabar-text+.btn-set {
    margin-left: 0
}

.metabar-text {
    color: rgba(0, 0, 0, 0.3)
}

.metabar-link {
    font-weight: 700
}

.metabar-center {
    position: absolute;
    left: 80px;
    right: 80px;
    text-align: center
}

.metabar-light:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: -200%;
    z-index: -1;
    display: block;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0)));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#4d000000', endColorstr='#00000000', GradientType=0)
}

.is-postCoverless .metabar-light:after {
    content: none
}

.metabar-light .metabar-text {
    color: rgba(255, 255, 255, 0.65)
}

.metabar-light .metabar-text a {
    color: #fff
}

.metabar-light .metabar-text a:hover, .metabar-light .metabar-text a:active,
.metabar-light .metabar-text a:focus {
    text-decoration: underline
}

.metabar-status {
    position: fixed;
    top: 0;
    left: 0
}

@media screen and (max-width:1000px) {
    .metabar-status {
        position: absolute
    }
}

@media screen and (max-width:800px) {
    .metabar-submission .metabar-center .metabar-text {
        margin-bottom: -20px
    }

    .metabar-submission .metabar-center .btn-set {
        margin-right: 0
    }
}

.metabar-message {
    display: none;
    color: rgba(0, 0, 0, 0.3);
    font-size: 14px;
    margin-left: 54px;
    margin-top: 10px;
    line-height: 44px;
    padding: 0 10px;
    position: relative;
    background-color: rgba(255, 255, 255, 0.97);
    -webkit-transition: margin-left .3s;
    -moz-transition: margin-left .3s;
    -ms-transition: margin-left .3s;
    -o-transition: margin-left .3s;
    transition: margin-left .3s
}

.metabar-message.active {
    display: block
}

@media screen and (max-width:500px) {
    .metabar .metabar-actions {
        display: none
    }

    .metabar .btn-set {
        line-height: 32px;
        margin: 16px 10px
    }

    .metabar-text+.btn-set {
        margin-left: 0
    }

    .collection-editor:before {
        content: attr(data-shorthand)
    }

    .collection-editor .collection-editor-label {
        display: none
    }

    .metabar-submission .metabar-text {
        display: none
    }

    .metabar-submission .metabar-center {
        text-align: right;
        right: 0
    }
}

@media print {
    .metabar {
        display: none
    }
}

.sidepanel {
    position: fixed;
    z-index: 800
}

.sidepanel-glass {
    position: fixed;
    overflow: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0);
    -webkit-transition: background-color .3s ease-out;
    -moz-transition: background-color .3s ease-out;
    -ms-transition: background-color .3s ease-out;
    -o-transition: background-color .3s ease-out;
    transition: background-color .3s ease-out
}

.sidepanel-open .sidepanel-glass {
    background-color: rgba(0, 0, 0, 0.44)
}

.sidepanel-panel {
    position: absolute;
    top: 0;
    min-height: 100%;
    left: -280px;
    width: 275px;
    background-color: rgba(0, 0, 0, 0.8);
    -webkit-box-shadow: 5px 0 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 5px 0 6px rgba(0, 0, 0, 0.15);
    box-shadow: 5px 0 6px rgba(0, 0, 0, 0.15);
    -webkit-transition: left .2s ease-out;
    -moz-transition: left .2s ease-out;
    -ms-transition: left .2s ease-out;
    -o-transition: left .2s ease-out;
    transition: left .2s ease-out;
    outline: 0
}

.sidepanel-open .sidepanel-panel {
    left: 0
}

.sidepanel-info {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    color: rgba(0, 0, 0, 0.05);
    padding: 15px 20px;
    text-transform: uppercase;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 11px;
    background-color: #000
}

.sidepanel-items {
    padding: 10px 0;
    width: 310px
}

.sidepanel-heading {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 11px;
    text-transform: uppercase;
    background: rgba(0, 0, 0, 0.3);
    color: rgba(0, 0, 0, 0.3);
    padding: 10px;
    margin: 0 10px;
    width: 235px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topright: 4px;
    border-top-right-radius: 4px;
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    border-top-left-radius: 4px
}

.sidepanel-item {
    color: rgba(0, 0, 0, 0.15);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 1;
    padding: 10px;
    margin: 0 10px;
    width: 235px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    cursor: pointer
}

.sidepanel-item:last-child {
    border-bottom: none
}

.sidepanel-item-text {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    line-height: normal;
    display: inline-block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.sidepanel-item:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.15)
}

.sidepanel-selected, .sidepanel-selected:hover {
    color: #57ad68;
    background-color: #000
}

.sidepanel-item-disabled, .sidepanel-item-disabled:hover {
    color: rgba(0, 0, 0, 0.6);
    background-color: rgba(0, 0, 0, 0.8)
}

.sidepanel-item .btn, .sidepanel-info .btn {
    float: right;
    border-radius: 4px;
    padding: 0 10px;
    font-size: 12px;
    line-height: 27px;
    height: 26px;
    margin-right: -6px;
    margin-left: 12px
}

.sidepanel-item .btn {
    display: none;
    margin-top: -6px
}

.sidepanel-selected .btn {
    display: inline-block
}

.sidepanel-selected .sidepanel-item-text {
    width: 100px
}

.popover-inner.list-choice-popover {
    padding: 0;
    max-width: none
}

.list-choice-open {
    overflow: hidden !important
}

.list-choice {
    width: 350px;
    position: relative
}

.list-choice-hero {
    padding: 25px 30px
}

.list-choice-hero>.input-group {
    margin-top: 20px
}

.list-choice-hero>p {
    margin-bottom: 8px
}

.list-choice-hero>p:last-child {
    margin-bottom: 0
}

.list-choice-hero>h2+.btn {
    margin-top: 5px
}

.list-choice-items {
    text-align: left;
    overflow: auto
}

.list-choice-item:first-child {
    border-top: 1px solid rgba(0, 0, 0, 0.05)
}

.list-choice-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05)
}

.list-choice-item:last-child {
    border-bottom: 0
}

.list-choice-item:last-child>.btn-link {
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-left-radius: 4px
}

.list-choice-item>.btn-link {
    width: 100%;
    padding: 10px;
    color: rgba(0, 0, 0, 0.9)
}

.list-choice-item>.btn-link:hover {
    background: rgba(0, 0, 0, 0.05)
}

.list-choice-image {
    float: left;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    display: block;
    position: relative;
    border: 2px solid rgba(0, 0, 0, 0.15);
    background: #fff;
    margin: 0 auto;
    overflow: hidden;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
    width: 50px;
    height: 50px;
    display: inline-block;
    margin-right: 20px;
    border: 0
}

.list-choice-text {
    height: 50px;
    position: relative
}

.list-choice-text.list-choice-text-with-image {
    margin-left: 60px
}

.list-choice-text>.align-block {
    width: 95%
}

.list-choice-text.list-choice-text-with-icon>.align-block {
    width: 90%
}

.list-choice-item-title>small {
    display: block;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 12px
}

.popover-inner.list-choice-popover .icons {
    font-size: 20px;
    position: absolute;
    right: 0;
    top: 8px
}

.popover-inner.list-choice-popover .actions {
    font-size: 20px;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -8px
}

.popover-inner.list-choice-popover .icons-search {
    right: auto;
    font-size: 18px
}

.popover-inner.list-choice-popover .icons-remove:before {
    color: rgba(0, 0, 0, 0.15)
}

.popover-inner.list-choice-popover .list-choice-item:hover .icons-remove:before {
    color: #cc5454
}

.popover-inner.list-choice-popover .action-remove {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.15)
}

.popover-inner.list-choice-popover .action-remove:hover {
    color: #cc5454
}

.list-choice-item-with-status {
    display: block
}

.list-choice-item-no-image>.btn-link {
    padding: 15px
}

.list-choice-item-no-image .list-choice-text {
    height: auto
}

.list-choice-empty {
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.44)
}

.list-choice-empty:before {
    content: "";
    display: inline-block;
    width: 70px;
    margin-bottom: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.list-choice-text-left {
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    font-size: 14px
}

.list-choice-text-right {
    vertical-align: middle;
    float: right;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.44);
    display: inline-block
}

@media all and (max-width:500px) {
    .list-choice {
        max-width: 320px
    }
}

.tooltip {
    overflow: hidden;
    position: absolute;
    z-index: 900;
    padding: 10px;
    visibility: visible;
    font-size: 12px;
    text-align: center;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .2s ease;
    -moz-transition: opacity .2s ease;
    -ms-transition: opacity .2s ease;
    -o-transition: opacity .2s ease;
    transition: opacity .2s ease;
    pointer-events: none
}

.tooltip-link {
    pointer-events: auto
}

.tooltip.fade {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.tooltip-inner {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    max-width: 250px;
    padding: 8px 10px 8px 10px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.8);
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.tooltip-cite {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    display: block
}

.tooltip-inner a {
    color: #fff;
    cursor: pointer
}

.tooltip-inner strong {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.tooltip-link .tooltip-inner {
    word-wrap: break-word
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: rgba(0, 0, 0, 0);
    border-style: solid
}

.tooltip-top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-bottom: 4px;
    margin-left: -5px;
    border-width: 6px 5px 0;
    border-top-color: rgba(0, 0, 0, 0.8)
}

.tooltip-right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-left: 5px;
    margin-top: -5px;
    border-width: 5px 6px 5px 0;
    border-right-color: rgba(0, 0, 0, 0.8)
}

.tooltip-bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-top: 4px;
    margin-left: -5px;
    border-width: 0 5px 6px 5px;
    border-bottom-color: rgba(0, 0, 0, 0.8)
}

.tooltip-left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-right: 5px;
    margin-top: -5px;
    border-width: 5px 0 5px 6px;
    border-left-color: rgba(0, 0, 0, 0.9)
}

.popover {
    overflow: hidden;
    position: absolute;
    z-index: 900;
    visibility: visible;
    font-size: 12px;
    text-align: center;
    padding: 15px;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .1s ease;
    -moz-transition: opacity .1s ease;
    -ms-transition: opacity .1s ease;
    -o-transition: opacity .1s ease;
    transition: opacity .1s ease
}

.popover-static {
    display: none;
    font-size: 12px;
    text-align: center;
    padding: 0 0 0 11px;
    float: left;
    position: relative
}

.popover.fade {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.popover-static.fade {
    display: block
}

.resizing .popover {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity 0 ease;
    -moz-transition: opacity 0 ease;
    -ms-transition: opacity 0 ease;
    -o-transition: opacity 0 ease;
    transition: opacity 0 ease
}

.popover-inner {
    position: relative;
    max-width: 250px;
    padding: 14px;
    background: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35)
}

.popover-inner .input-text {
    width: 250px
}

.browser-safari .popover-inner {
    -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.05), 0 0 1px 1px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.05), 0 0 1px 1px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.05), 0 0 1px 1px rgba(0, 0, 0, 0.15)
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .browser-safari .popover-inner {
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
        -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35)
    }
}

.popover-small .popover-inner {
    padding: 11px 10px 10px;
    min-width: 17px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.popover-inner.popover-large {
    padding: 20px
}

.popover-arrow {
    position: absolute
}

.popover-top .popover-arrow, .popover-bottom .popover-arrow {
    left: 50%;
    margin-left: -7px
}

.popover-left .popover-arrow, .popover-right .popover-arrow {
    top: 50%;
    margin-top: -7px
}

.popover-small.popover-top .popover-arrow, .popover-small.popover-bottom .popover-arrow {
    margin-left: -5px
}

.popover-small.popover-left .popover-arrow, .popover-small.popover-right .popover-arrow {
    margin-top: -5px
}

.popover-top .popover-arrow {
    bottom: 1px;
    clip: rect(0 18px 18px -4px)
}

.popover-right .popover-arrow {
    left: 1px;
    clip: rect(-4px 14px 18px 0)
}

.popover-bottom .popover-arrow {
    top: 1px;
    clip: rect(0 18px 14px -4px)
}

.popover-left .popover-arrow {
    right: 1px;
    clip: rect(-4px 14px 18px 0)
}

.popover-small.popover-right .popover-arrow {
    left: 0px;
    clip: rect(-4px 12px 18px 0)
}

.popover-arrow:after {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    background: #fff
}

.popover-small .popover-arrow:after {
    width: 8px;
    height: 8px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none
}

.popover-top .popover-arrow:after {
    -webkit-transform: rotate(45deg) translate(-5px, -5px);
    -moz-transform: rotate(45deg) translate(-5px, -5px);
    -ms-transform: rotate(45deg) translate(-5px, -5px);
    -o-transform: rotate(45deg) translate(-5px, -5px);
    transform: rotate(45deg) translate(-5px, -5px);
    -webkit-box-shadow: 1px 1px 1px -1px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 1px 1px 1px -1px rgba(0, 0, 0, 0.8);
    box-shadow: 1px 1px 1px -1px rgba(0, 0, 0, 0.8)
}

.popover-right .popover-arrow:after {
    -webkit-transform: rotate(45deg) translate(6px, -6px);
    -moz-transform: rotate(45deg) translate(6px, -6px);
    -ms-transform: rotate(45deg) translate(6px, -6px);
    -o-transform: rotate(45deg) translate(6px, -6px);
    transform: rotate(45deg) translate(6px, -6px);
    -webkit-box-shadow: -1px 1px 1px -1px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: -1px 1px 1px -1px rgba(0, 0, 0, 0.8);
    box-shadow: -1px 1px 1px -1px rgba(0, 0, 0, 0.8)
}

.popover-bottom .popover-arrow:after {
    -webkit-transform: rotate(45deg) translate(6px, 6px);
    -moz-transform: rotate(45deg) translate(6px, 6px);
    -ms-transform: rotate(45deg) translate(6px, 6px);
    -o-transform: rotate(45deg) translate(6px, 6px);
    transform: rotate(45deg) translate(6px, 6px);
    -webkit-box-shadow: -1px -1px 1px -1px rgba(0, 0, 0, 0.44);
    -moz-box-shadow: -1px -1px 1px -1px rgba(0, 0, 0, 0.44);
    box-shadow: -1px -1px 1px -1px rgba(0, 0, 0, 0.44)
}

.popover-left .popover-arrow:after {
    -webkit-transform: rotate(45deg) translate(-6px, 6px);
    -moz-transform: rotate(45deg) translate(-6px, 6px);
    -ms-transform: rotate(45deg) translate(-6px, 6px);
    -o-transform: rotate(45deg) translate(-6px, 6px);
    transform: rotate(45deg) translate(-6px, 6px);
    -webkit-box-shadow: 1px -1px 1px -1px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 1px -1px 1px -1px rgba(0, 0, 0, 0.8);
    box-shadow: 1px -1px 1px -1px rgba(0, 0, 0, 0.8)
}

.popover .subtitle {
    font-size: 14px;
    margin: 0 0 15px
}

.popover-inner-dark {
    padding: 20px 17px 20px 20px;
    color: #fff;
    background: #262625;
    box-shadow: 0 0 2px #262625;
    border: 1px solid;
    border-color: #262625 #1c1c1b #121211;
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.8);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(49, 49, 47, 0.97)), to(#262625));
    background-image: -moz-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: -webkit-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: -o-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: linear-gradient(to bottom, rgba(49, 49, 47, 0.97), #262625);
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f731312f', endColorstr='#ff262625', GradientType=0)
}

.popover-inner-dark+.popover-arrow:after {
    background: #262625;
    border: 1px solid #121211
}

.popover-right .popover-inner-dark+.popover-arrow {
    left: 2px
}

.popover-inner-dark .btn, .popover-inner-dark .icons:before {
    color: #fff
}

.popover-notes-vote {
    text-align: left;
    width: 250px
}

.chart-tabs {
    *zoom: 1
}

.chart-tabs:before, .chart-tabs:after {
    display: table;
    content: " "
}

.chart-tabs:after {
    clear: both
}

.chart-tabs li {
    float: left;
    width: 33%;
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15)
}

.chart-tabs li:last-child {
    width: 34%
}

.chart-tabs button {
    border: 0;
    color: rgba(0, 0, 0, 0.15);
    display: block;
    padding: 0 15px 10px;
    background: none;
    width: 100%;
    text-align: left;
    border-right: 1px solid rgba(0, 0, 0, 0);
    border-left: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -ms-transition: color .2s;
    -o-transition: color .2s;
    transition: color .2s
}

.chart-tabs li:first-child button {
    padding-left: 0
}

.chart-tabs button:hover {
    color: rgba(0, 0, 0, 0.3)
}

.chart-tabs .active, .chart-tabs .active:hover {
    border-bottom: 1px solid rgba(0, 0, 0, 0)
}

.chart-tabs .active button {
    color: #000
}

.chart-tabs li:first-child button {
    border-left: rgba(0, 0, 0, 0)
}

.bargraph {
    height: 245px;
    margin: 35px 30px 0;
    -webkit-user-select: none
}

.bargraph-bar {
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -ms-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
    fill: rgba(87, 173, 104, 0.8)
}

line.bargraph-grid-line {
    stroke: rgba(0, 0, 0, 0.3);
    stroke-dasharray: 1, 3
}

line.bargraph-grid-line:first-child {
    stroke: rgba(0, 0, 0, 0.3);
    stroke-dasharray: none
}

.bargraph-y-axis path, .bargraph .tick {
    display: none
}

.bargraph-x-axis path {
    display: none
}

.bargraph-x-axis .bargraph-y-axis, text {
    fill: rgba(0, 0, 0, 0.3);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 12px
}

.bargraph svg:hover .bargraph-bar {
    filter: alpha(opacity=50);
    -khtml-opacity: .5;
    -moz-opacity: .5;
    opacity: .5
}

.bargraph svg:hover .bargraph-bar:hover {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    cursor: pointer
}

@media screen and (max-width:1000px) {
    .bargraph {
        height: 80px;
        margin: 20px 5px 0
    }

    .bargraph svg:hover .bargraph-bar {
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    .bargraph-y-axis g {
        display: none
    }

    .bargraph-y-axis g:nth-last-child(2) {
        display: block
    }

    .bargraph-x-axis .bargraph-y-axis, text {
        font-size: 11px
    }
}

.sortable-table-wrapper table, .sortable-table-wrapper td, .sortable-table-wrapper th {
    border: none;
    text-align: left
}

.sortable-table-wrapper {
    margin: 10px 0
}

.sortable-table-wrapper .middot {
    margin: 0 5px
}

.sortable-table-wrapper tr {
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15)
}

.sortable-table-wrapper td {
    padding: 10px 45px 10px 10px;
    line-height: 1
}

.sortable-table th:last-child, .sortable-table td:last-child {
    padding-right: 80px
}

.sortable-table th:first-child, .sortable-table td:first-child {
    padding-left: 80px;
    padding-right: 10px
}

.sortable-table tr:hover td {
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer
}

.sortable-table .active:hover td, .sortable-table .active td {
    background: rgba(255, 255, 255, 0.5)
}

.sortable-table-wrapper h2 {
    color: rgba(0, 0, 0, 0.8);
    font-size: 24px;
    line-height: 1;
    margin: 6px 0 2px 0
}

.sortable-table-link, .sortable-table-text {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3)
}

.sortable-table-text em {
    font-style: normal
}

.sortable-table-value {
    color: rgba(0, 0, 0, 0.8);
    font-size: 24px
}

.sortable-table-value {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.sortable-table-link:hover {
    text-decoration: underline
}

.sortable-table-mute tr {
    filter: alpha(opacity=40);
    -khtml-opacity: .4;
    -moz-opacity: .4;
    opacity: .4
}

.sortable-table-mute .active {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.sortable-table-wrapper button {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    color: rgba(0, 0, 0, 0.3);
    border: none;
    padding: 15px 0;
    font-size: 16px;
    background: none;
    margin-bottom: -2px
}

.goog-tablesorter-sorted-reverse button, .goog-tablesorter-sorted button {
    color: rgba(0, 0, 0, 0.8);
    border-bottom: 1px solid rgba(0, 0, 0, 0.8)
}

.sortable-table {
    width: 100%;
    position: relative
}

.sortable-table-row-img {
    width: 60px
}

.sortable-table-img {
    width: 60px;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.15);
    line-height: 46px
}

.sortable-table-img:before {
    content: "T";
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    color: rgba(0, 0, 0, 0.3);
    text-align: center;
    display: block;
    position: relative;
    top: 5px;
    font-size: 32px
}

.sortable-table-img.sortable-table-img-cover {
    background-size: cover
}

.sortable-table-img.sortable-table-img-cover:before {
    content: ""
}

.sortable-table-hide {
    display: none
}

@media screen and (max-width:1000px) {
    .sortable-table-wrapper {
        margin-top: 70px
    }

    thead .sortable-table-hide {
        display: block
    }

    .sortable-table-text {
        word-break: break-word
    }

    .sortable-table tr:hover td {
        background: rgba(0, 0, 0, 0);
        cursor: default
    }

    .sortable-table-wrapper thead tr {
        display: block;
        margin: 0 15px;
        border-bottom: none;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px
    }

    .sortable-table-wrapper thead {
        display: block;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15)
    }

    .sortable-table-wrapper tbody {
        display: block;
        border-top: 1px solid #fff;
        padding-bottom: 15px
    }

    .sortable-table-wrapper th {
        padding: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        display: none
    }

    .sortable-table-wrapper .sortable-table-open th {
        display: block;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-top: none
    }

    .sortable-table-wrapper .sortable-table-open {
        padding-bottom: 15px
    }

    .sortable-table th:first-child {
        padding-left: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.15)
    }

    .sortable-table-wrapper button {
        padding: 15px;
        width: 100%;
        border-bottom: 0;
        text-align: left;
        color: #000
    }

    .sortable-table-wrapper .sortable-table-row-img, .sortable-table-wrapper .sortable-table-open .sortable-table-collapse {
        display: none;
        border-bottom: none
    }

    .sortable-table-wrapper .sortable-table-open tr {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        top: -1px;
        border-top: 1px solid rgba(0, 0, 0, 0.15)
    }

    .sortable-table-wrapper td {
        display: block;
        float: left;
        padding: 0;
        width: 25%;
        cursor: default;
        line-height: 1.3
    }

    .sortable-table-wrapper .sortable-table-value {
        padding-left: 6px
    }

    .sortable-table-wrapper td:nth-child(5) {
        text-align: center
    }

    .sortable-table-wrapper td:last-child {
        width: 24%;
        padding-right: 0;
        text-align: right
    }

    .sortable-table-wrapper .sortable-table-row-title {
        float: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        padding: 5px 5px 10px;
        width: auto;
        line-height: 1
    }

    .sortable-table-wrapper .sortable-table-row-title h2 {
        margin-top: 0
    }

    .sortable-table-wrapper tbody tr {
        padding: 24px 15px;
        display: block;
        *zoom: 1
    }

    .sortable-table-wrapper tbody tr:before, .sortable-table-wrapper tbody tr:after {
        display: table;
        content: " "
    }

    .sortable-table-wrapper tbody tr:after {
        clear: both
    }

    .sortable-table-wrapper .goog-tablesorter-sorted, .sortable-table-wrapper .goog-tablesorter-sorted-reverse {
        position: absolute;
        top: -60px;
        left: 0;
        right: 0;
        border: 1px solid rgba(0, 0, 0, 0.15);
        display: block;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px
    }

    .sortable-table-wrapper .sortable-table-open .goog-tablesorter-sorted,
    .sortable-table-wrapper .sortable-table-open .goog-tablesorter-sorted-reverse {
        border: 1px solid rgba(0, 0, 0, 0.15);
        background: rgba(0, 0, 0, 0.05)
    }

    .sortable-table-wrapper .goog-tablesorter-sorted:after, .sortable-table-wrapper .goog-tablesorter-sorted-reverse:after {
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #B3B3B1;
        position: absolute;
        right: 12px;
        content: " ";
        top: 19px
    }

    .sortable-table-value:after, .goog-tablesorter-sorted button:before,
    .goog-tablesorter-sorted-reverse button:before {
        content: attr(data-label)
    }

    .sortable-table-value {
        font-size: 11px
    }

    .sortable-table-wrapper tbody .sortable-table-hide {
        display: none
    }
}

.nav-tabs {
    border-top: 1px rgba(0, 0, 0, 0.15) solid;
    padding-bottom: 10px
}

.nav-tabs-hidden {
    display: none
}

.nav-tabs-list {
    list-style: none;
    margin-top: -1px
}

.nav-tabs-item {
    display: inline-block;
    margin-right: 20px
}

.nav-tabs-item:last-child {
    margin-right: 0
}

.nav-tabs-anchor {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    display: inline-block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: rgba(0, 0, 0, 0.3);
    padding: 20px 0
}

.nav-tabs-item.active .nav-tabs-anchor {
    color: rgba(0, 0, 0, 0.8);
    border-top: 1px rgba(0, 0, 0, 0.6) solid
}

.nav-tabs-light {
    border-top-color: rgba(255, 255, 255, 0.35)
}

.nav-tabs-light .nav-tabs-anchor {
    color: rgba(255, 255, 255, 0.65)
}

.nav-tabs-light .nav-tabs-anchor:hover, .nav-tabs-light .active .nav-tabs-anchor {
    color: #fff
}

.nav-tabs-light .active .nav-tabs-anchor {
    border-top-color: #fff
}

@media screen and (max-width:500px) {
    .nav-tabs {
        padding-bottom: 0
    }

    .nav-tabs-anchor {
        padding: 18px 0;
        letter-spacing: .1em
    }

    .nav-tabs-item-social {
        margin-right: 16px
    }

    .nav-tabs-item-social:last-child {
        display: none
    }
}

.site-nav {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    outline: none;
    background-color: #191918
}

.site-nav-logo {
    position: fixed;
    top: 10px;
    left: 10px;
    width: 44px;
    height: 44px;
    z-index: 700;
    background-color: #333332;
    text-align: center;
    border: 0;
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition: top .2s linear, left .2s linear, opacity .2s linear;
    -moz-transition: top .2s linear, left .2s linear, opacity .2s linear;
    -ms-transition: top .2s linear, left .2s linear, opacity .2s linear;
    -o-transition: top .2s linear, left .2s linear, opacity .2s linear;
    transition: top .2s linear, left .2s linear, opacity .2s linear
}

.site-nav-logo .icons {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.site-nav-overlay {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 600
}

.site-nav-scrollable-container {
    display: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    height: 100%
}

.site-nav-scrollable-container::-webkit-scrollbar {
    display: none
}

.site-nav-list-item {
    position: relative
}

.site-nav-list-item.site-nav-list-item-home {
    margin-top: 10px
}

.site-nav-list-item:last-child {
    margin-bottom: 14px
}

.site-nav-list-item-btn {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    display: block;
    padding: 0 16px 0 52px;
    height: 48px;
    line-height: 46px;
    font-size: 16px;
    border: 0;
    background: rgba(0, 0, 0, 0);
    text-align: left
}

.site-nav-list-item-btn, .site-nav-list-item-btn .icons:before {
    color: rgba(255, 255, 255, 0.65)
}

.site-nav-list-item-btn:focus {
    outline: 0
}

.site-nav-list-item-btn .icons {
    font-size: 20px;
    display: block;
    position: absolute;
    left: 18px;
    top: -1px;
    width: 20px;
    text-align: center
}

.site-nav-list-item-btn .icons-logo-m {
    font-size: 18px;
    top: 0
}

.site-nav-list-item-btn .icons-stats {
    top: 0
}

.site-nav-list-item-btn .icons-avatar-user {
    position: absolute;
    left: 16px;
    top: 10px
}

.site-nav-list-item-btn .icons-avatar-user, .site-nav-list-item-btn .icons-avatar-user img {
    width: 24px;
    height: 24px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.site-nav-list-item-btn-secondary {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 0 16px 0 6px
}

.site-nav-list-item-btn-secondary .icons, .site-nav-list-item-btn-secondary .icons-search:before {
    line-height: 48px;
    font-size: 20px
}

.site-nav-list-item-btn-secondary .icons-search:before {
    top: 0;
    margin-right: 0
}

.site-nav-list-item-btn-secondary .icons:before {
    color: rgba(255, 255, 255, 0.35)
}

.site-nav-list .icons-logo-m:before, .site-nav-logo .icons-logo-m:before {
    line-height: 46px
}

.site-nav-list-item-centered-btn {
    display: block;
    margin: 15px 18px 0 18px
}

.site-nav-logo .icons-logo-m:before {
    color: #fff;
    font-size: 18px
}

.notifications-list {
    margin-bottom: 20px
}

.notifications-list-heading {
    display: block;
    margin: 20px 20px 0;
    padding: 8px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    color: rgba(255, 255, 255, 0.2);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .1em
}

.notifications-list-item {
    position: relative
}

.notifications-list-item-btn {
    display: block;
    min-height: 26px;
    padding: 10px 18px 10px 52px;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.2;
    font-size: 14px;
    background-color: rgba(0, 0, 0, 0)
}

.notifications-list-item .icons {
    position: absolute;
    top: 10px;
    left: 16px;
    width: 26px;
    height: 26px
}

.notifications-list-item .icons:before {
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    bottom: 0;
    font-size: 23px;
    color: rgba(255, 255, 255, 0.35);
    text-align: center;
    line-height: .85
}

.notification-user-avatar-icon {
    width: 26px;
    height: 26px;
    position: absolute;
    top: 12px;
    left: 16px;
    overflow: hidden
}

.notification-user-avatar-icon .icons-avatar-user-img {
    width: 26px;
    height: 26px
}

.notification-user-avatar-icon-wrapper .notification-user-avatar-icon {
    position: static;
    float: left;
    margin-right: 8px
}

.extra-notification-avatars .notifications-list-item-btn {
    padding-bottom: 46px;
    position: relative
}

.extra-notification-avatars .notification-user-avatar-icon-wrapper {
    position: absolute;
    bottom: 12px;
    left: 52px
}

.notification-item-more {
    background: rgba(255, 255, 255, 0.1);
    border: none;
    color: rgba(255, 255, 255, 0.65);
    font-size: 14px;
    text-align: center;
    width: 26px;
    height: 26px;
    display: block;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.notifications-more {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    padding: 12px 18px;
    color: rgba(255, 255, 255, 0.65)
}

.notifications-more:hover {
    color: #fff
}

.notifications-list-item-new:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #57ad68
}

.notification-actors-list {
    margin: 20px 0
}

.notification-actors-list-item {
    position: relative;
    display: inline-block;
    width: 50%;
    margin-bottom: 8px;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left
}

.notification-actors-list-link {
    padding-left: 37px
}

.notification-actors-list-icon {
    position: absolute;
    top: 0;
    left: 0
}

.notification-actors-list-name {
    line-height: 32px;
    vertical-align: middle;
    white-space: nowrap
}

.site-nav-activity-flag {
    position: absolute;
    left: 0;
    width: 0;
    bottom: -2px;
    height: 4px;
    background: #57ad68;
    -webkit-transition: width .3s ease-out;
    -moz-transition: width .3s ease-out;
    -ms-transition: width .3s ease-out;
    -o-transition: width .3s ease-out;
    transition: width .3s ease-out
}

.site-nav-new-activity .site-nav-activity-flag {
    width: 44px
}

.site-nav-transition .site-nav {
    position: fixed
}

.site-nav-transition .canvas-renderer {
    position: absolute
}

.site-nav-transition .site-nav-scrollable-container {
    display: block;
    width: 280px
}

.site-nav-transition .site-nav-logo {
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    top: 0
}

.site-nav-drawer-open .site-nav-overlay, .site-nav:focus~.site-nav-overlay {
    left: 280px;
    z-index: 900
}

.site-nav-transition {
    overflow: hidden;
    height: 100%
}

.site-nav-transition #container {
    z-index: 800
}

.site-nav-drawer-open #container {
    -webkit-transform: translate3d(280px, 0, 0);
    -moz-transform: translate3d(280px, 0, 0);
    -ms-transform: translate3d(280px, 0, 0);
    -o-transform: translate3d(280px, 0, 0);
    transform: translate3d(280px, 0, 0)
}

.site-nav-drawer-open .site-nav-logo {
    display: none
}

.site-nav-drawer-open .site-nav-overlay {
    display: block
}

.site-nav-transition .site-nav {
    z-index: auto
}

@media screen and (min-device-width:1000px) {
    .site-nav-list-item-active .site-nav-list-item-btn, .site-nav-list-item-active .notifications-list-item-btn,
    .site-nav-list-item-active .site-nav-list-item-btn .icons:before,
    .site-nav-list-item-btn:hover, .site-nav-list-item-btn:hover .icons:before,
    .site-nav-list-item-btn-secondary:hover .icons:before, .notifications-list-item-btn:hover {
        color: #fff;
        outline: 0
    }

    .load-older-notifications:hover {
        color: rgba(255, 255, 255, 0.2)
    }
}

@media screen and (max-width:1000px) {
    .site-nav-logo, .site-nav {
        position: absolute
    }

    .site-nav-drawer-open .chart-title {
        padding-left: 10px
    }

    .browser-android.site-nav-transition #container {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none
    }

    .browser-android.site-nav-drawer-open #container {
        left: 280px;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none
    }
}

@media print {
    .site-nav, .site-nav-logo {
        position: absolute
    }
}

.footer {
    padding: 10px 0 25px;
    border-top: 1px solid rgba(0, 0, 0, 0.05)
}

.footer .btn-link {
    color: rgba(0, 0, 0, 1);
    font-size: 12px;
    margin-right: 16px
}

.footer .btn-link:hover, .footer .btn-link:focus {
    color: rgba(0, 0, 0, 0.8)
}

.footer-promotional {
    border-top: none;
    padding: 10px 0 5px;
    text-align: center
}

.footer-fixed {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

@media all and (max-width:500px) {
    .footer-promotional .btn-link {
        font-size: 11px;
        margin-right: 10px;
        height: 10px
    }

    .footer-promotional {
        padding-bottom: 30px
    }

    .logged-out-post-footer .layout-single-column {
        margin-right: 20px
    }
}

.footer-light {
    border-color: rgba(0, 0, 0, 0)
}

.footer-light .btn-link {
    color: rgba(0, 0, 0, 1);
    font-family: Courier;
}

@media print {
    .post-footer-actions, .post-footer-cards .btn-follow {
        display: none
    }
}

.input-text {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    border: 1px solid rgba(0, 0, 0, 0.15);
    padding: 0 15px;
    height: 35px;
    width: 55%;
    font-size: 14px;
    outline: none;
    background: #fff;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.input-textarea {
    padding: 15px;
    margin: 15px 0 30px;
    resize: none;
    width: 100%;
    height: 50px;
    overflow: hidden
}

.input-textarea:focus {
    outline: none
}

.input-text-smallest {
    font-size: 12px
}

.input-text-small {
    height: 30px;
    padding: 0 8px
}

.input-text-jumbo {
    font-size: 50px;
    font-weight: 300;
    height: 70px;
    padding: 0;
    width: 100%
}

@media all and (max-width:680px) {
    .input-text-jumbo {
        font-size: 32px;
        height: 50px
    }
}

.input-text-borderless {
    border: 0
}

.input-text-rounded {
    -webkit-border-radius: 999em;
    -moz-border-radius: 999em;
    border-radius: 999em
}

.input-text-light {
    color: #fff
}

.input-text-chromeless {
    border: 0;
    padding: 0;
    outline: 0;
    height: auto;
    background: transparent
}

.textarea-seamless {
    border: 0;
    font-size: 16px;
    outline: none;
    resize: none;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.text-input-border {
    padding: 4px;
    border: solid 1px rgba(0, 0, 0, 0.15);
    outline: none;
    resize: none;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.input-group {
    position: relative
}

.input-group .input-text {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.input-group .icons:first-child {
    position: absolute;
    color: rgba(0, 0, 0, 0.3);
    top: 6px;
    margin-left: 12px
}

.input-group .icons+.input-text {
    padding-left: 30px
}

.input-group-text {
    text-align: left
}

.input-group-text {
    width: 100%;
    margin-bottom: 10px
}

.input-group-text>.input-group-title {
    color: #b3b3b1;
    font-size: 14px
}

.input-group-text>.input-text {
    margin: 0
}

.input-text-display-author {
    margin-right: 8px;
    width: 61%;
    font-size: 12px
}

.input-group-error>.input-text {
    border-color: #cc5454
}

.input-group-error>.input-group-title {
    color: #cc5454
}

[data-action="zoom"] {
    cursor: pointer;
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in
}

.zoom-img, .zoom-img-wrap {
    position: relative;
    z-index: 900;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -ms-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms
}

.zoom-img-wrap-absolute {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.zoom-img {
    margin: 0;
    padding: 0
}

.zoom-overlay {
    z-index: 800;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    -webkit-transition: opacity 300ms;
    -moz-transition: opacity 300ms;
    -ms-transition: opacity 300ms;
    -o-transition: opacity 300ms;
    transition: opacity 300ms;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.zoom-overlay-open .zoom-overlay {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.zoom-img, .zoom-overlay-open {
    cursor: pointer;
    cursor: -webkit-zoom-out;
    cursor: -moz-zoom-out
}

.hero-avatar .zoom-img {
    border-radius: 100%
}

.zoom-overlay-transitioning .image-blur, .zoom-overlay-transitioning .layout-foreground,
.zoom-overlay-transitioning .hero-avatar, .zoom-overlay-open .image-blur,
.zoom-overlay-open .layout-foreground, .zoom-overlay-open .hero-avatar {
    z-index: auto
}

.zoom-overlay-open .hero-avatar, .zoom-overlay-transitioning .hero-avatar {
    overflow: visible
}

.zoom-overlay-open .post-page-wrapper {
    overflow-x: visible
}

.zoom-overlay-open .metabar {
    visibility: hidden
}

.reading-list-status .icons-reading-list {
    color: rgba(0, 0, 0, 0.15)
}

.reading-list-status:hover .icons-reading-list {
    color: rgba(0, 0, 0, 0.6)
}

.reading-list-status.on-reading-list .icons-reading-list {
    color: #57ad68
}

.reading-list-status {
    cursor: pointer;
    position: relative
}

.reading-list-status .icons-reading-list {
    width: 10px;
    padding-left: 3px;
    padding-right: 4px;
    display: inline-block
}

.reading-list-status .icons-reading-list:before {
    position: relative;
    top: 2px;
    font-size: 16px
}

.reading-list-status-message {
    display: none
}

.reading-list-status:hover .reading-list-status-message {
    display: inline;
    color: rgba(0, 0, 0, 0.6)
}

.reading-list-status-display {
    display: inline
}

.reading-list-status-display:hover {
    color: rgba(0, 0, 0, 0.6)
}

.reading-list-status:hover .reading-time {
    display: none
}

@media screen and (max-width:1000px) {
    .reading-list-status:hover .icons-reading-list {
        color: rgba(0, 0, 0, 0.15)
    }

    .on-reading-list:hover .icons-reading-list {
        color: #57ad68
    }

    .reading-list-status:hover .reading-list-status-message {
        display: none
    }

    .reading-list-status-display:hover {
        color: rgba(0, 0, 0, 0.3)
    }

    .reading-list-status:hover .reading-time {
        display: inline
    }
}

.typeahead {
    -webkit-animation: pop-downwards 200ms forwards linear;
    -moz-animation: pop-downwards 200ms forwards linear;
    -ms-animation: pop-downwards 200ms forwards linear;
    -o-animation: pop-downwards 200ms forwards linear;
    animation: pop-downwards 200ms forwards linear
}

.typeahead .popover-inner {
    padding: 0;
    overflow: hidden;
    min-width: 100px
}

.typeahead .typeahead-item {
    cursor: pointer;
    padding: 5px 10px;
    line-height: 2;
    font-size: 12px;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.typeahead .typeahead-item:first-child {
    padding-top: 7px
}

.typeahead .typeahead-item:last-child {
    padding-bottom: 7px
}

.typeahead .avatar-micro {
    float: left;
    margin: 0 6px 0 -2px
}

.typeahead .typeahead-username {
    color: rgba(0, 0, 0, 0.3)
}

.typeahead .typeahead-tag {
    margin-left: 5px
}

.typeahead .active {
    background: #57ad68;
    color: #fff
}

.cover-picker-full-bleed {
    height: 100%;
    background: #000
}

.cover-picker-header-bleed .cover-picker-controls {
    position: absolute;
    display: none;
    left: 0;
    right: 0;
    top: 180px;
    z-index: 40
}

.editing .cover-picker-header-bleed .cover-picker-controls {
    display: block
}

.cover-picker-header-bleed .cover-picker-controls .icons {
    color: #fff
}

.cover-picker-header-bleed.no-image {
    display: none
}

.editing .cover-picker-header-bleed.no-image {
    display: block
}

.cover-picker-controls {
    height: 100px;
    position: relative;
    text-align: center
}

.cover-picker-controls .btn-replace-image {
    margin-right: -10px;
    margin-top: 15px
}

.cover-picker .upload-feedback {
    display: none;
    position: relative;
    z-index: 200;
    width: 100%;
    height: 95px;
    background: rgba(0, 0, 0, 0.3);
    max-width: 650px;
    margin: 0 auto;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px
}

.cover-picker.uploading-image .upload-feedback {
    display: block
}

.cover-picker.uploading-image .image-controls {
    display: none
}

.cover-picker .progress-bar-wrap {
    position: absolute;
    left: 95px;
    top: 41px;
    right: 40px;
    height: 13px;
    background: #468c54;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden
}

.cover-picker .progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #fff;
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    border-top-left-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    border-bottom-left-radius: 4px
}

.cover-picker .upload-feedback-preview {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 75px;
    height: 75px;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.3);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.cover-picker .image-washes {
    left: 15px;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -ms-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s
}

.cover-picker.has-image .image-washes {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

@media all and (max-width:500px) {
    .cover-picker-header-bleed .cover-picker-controls {
        top: 40px
    }
}

.cards {
    *zoom: 1
}

.cards:before, .cards:after {
    display: table;
    content: " "
}

.cards:after {
    clear: both
}

.cards-heading {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    padding: 12px 0 28px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .1em;
    color: rgba(0, 0, 0, 0.3);
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    margin-top: 60px
}

.cards-heading:first-child {
    margin-top: 0
}

.layout-multi-column-half:first-child .cards, .layout-multi-column-half:first-child .cards-heading {
    margin-right: 20px
}

.layout-multi-column-half:last-child .cards, .layout-multi-column-half:last-child .cards-heading {
    margin-left: 20px
}

.card {
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding: 0;
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 35px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    width: 100%
}

.card:last-child {
    margin-bottom: 0
}

.cards-heading+.bucket .bucket-item:first-child .post-item {
    padding-top: 0
}

.card-collection-image {
    width: 80px;
    height: 80px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px
}

.card-content {
    word-wrap: break-word;
    padding-left: 100px;
    min-height: 80px
}

.card-image {
    position: absolute;
    left: 0
}

.card-avatar {
    width: 80px;
    height: 80px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.card-name {
    font-size: 18px;
    color: rgba(0, 0, 0, 0.8);
    line-height: 1.1;
    margin-bottom: 4px
}

.card-description {
    font-size: 14px;
    line-height: 1.3;
    margin-bottom: 4px
}

.card-description>a {
    color: rgba(0, 0, 0, 0.8)
}

.card-description>a:hover, .card-description>a:focus, .card-description>a:active {
    text-decoration: underline
}

.card-additional {
    font-size: 12px;
    margin-top: 12px
}

.card-additional:before {
    display: block;
    content: '';
    width: 40px;
    height: 1px;
    background: rgba(0, 0, 0, 0.15);
    margin-bottom: 8px
}

.card .btn-set {
    margin-top: 10px
}

.card-text .btn-chromeless {
    line-height: 32px
}

@media (max-width:800px){.layout-multi-column .card {
        width: 100%;
        padding-right: 0
    }

    .layout-multi-column-half:first-child .cards, .layout-multi-column-half:first-child .cards-heading {
        margin-right: 0
    }

    .layout-multi-column-half:last-child .cards, .layout-multi-column-half:last-child .cards-heading {
        margin-left: 0
    }

    .layout-multi-column-half:last-child .cards-heading {
        margin-top: 50px
    }
}

.export-success {
    display: none;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.44)
}

.setting-item {
    overflow: hidden;
    position: relative;
    padding-top: 30px;
    padding-bottom: 36px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05)
}

.setting-item:last-of-type {
    border-bottom-width: 0
}

.setting-item-info {
    float: left;
    width: 60%
}

.setting-item-actions {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -19px
}

.setting-item-title {
    color: rgba(0, 0, 0, 0.8);
    font-size: 18px
}

.setting-item-desc {
    font-size: 14px;
    margin-right: 20px;
    margin-bottom: 0;
    color: rgba(0, 0, 0, 0.3)
}

.setting-item-link {
    color: rgba(0, 0, 0, 0.3);
    text-decoration: underline
}

.setting-item-link:hover {
    color: #57ad68
}

.setting-item-authorship-desc {
    margin-top: 6px
}

.setting-item-input {
    display: block;
    background: #fff;
    font-size: 16px;
    width: 340px;
    border: none;
    padding: 0;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.setting-item-input:focus {
    outline: none
}

.setting-item-input-prefix {
    color: rgba(0, 0, 0, 0.3);
    cursor: default
}

.setting-item-input-prefix, .setting-item-username-input {
    display: inline-block;
    font-size: 16px
}

.setting-item-username-input {
    width: 120px
}

.setting-item-status {
    font-size: 14px;
    display: block;
    color: #57ad68
}

.setting-item-error {
    color: #cc5454
}

.setting-item-error-email {
    margin-top: 14px;
    font-size: 14px
}

.setting-item-error .send-verify-email {
    color: inherit;
    text-decoration: underline
}

.setting-item-username {
    height: 60px
}

.setting-item-username-error .setting-item-username-input, .setting-item-username-error .setting-item-status {
    color: #cc5454
}

.setting-item-delete .btn {
    background: transparent;
    color: rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    line-height: 16px;
    margin-top: 10px
}

.setting-item-delete .btn:hover {
    color: #cc5454;
    border-bottom: 1px solid #cc5454
}

.setting-item-facebook-name {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.6);
    text-align: right;
    display: block;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.setting-item-facebook-delete {
    font-size: 12px;
    text-align: right;
    display: block;
    width: 100%
}

.setting-item-facebook-delete:hover {
    color: #cc5454
}

.setting-item-facebook-image {
    width: 33px;
    height: 33px;
    float: right;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.setting-item-action-group {
    float: right;
    margin-right: 10px
}

@media screen and (max-width:500px) {
    .setting-item {
        padding: 20px 0 24px
    }

    .setting-item-title {
        font-size: 18px
    }

    .setting-item-info, .setting-item-actions {
        float: none;
        width: 100%
    }

    .setting-item-actions.btn-switch {
        width: auto
    }

    .setting-item-info {
        margin-bottom: 14px
    }

    .setting-item-actions {
        position: relative;
        top: 0;
        margin-top: 0
    }

    .setting-item-facebook-image {
        float: left
    }

    .setting-item-facebook-delete, .setting-item-facebook-name {
        text-align: left
    }

    .setting-item-action-group {
        float: left;
        margin: 0 0 0 10px
    }

    .setting-item-username {
        height: 120px
    }
}

.chart-wrapper {
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    padding: 15px 50px
}

.stats-title {
    margin: 0 30px;
    padding-bottom: 17px
}

.stats-title-page {
    line-height: 1
}

.stats-title-user, .stats-title-chart {
    border-bottom: 1px solid rgba(0, 0, 0, 0.15)
}

.stats-title h2 {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    float: left;
    color: rgba(0, 0, 0, 0.6)
}

.stats-title-chart .chart-all {
    display: inline-block
}

.stats-title-chart .chart-post {
    display: none
}

.stats-title-chart.single-post .chart-post {
    display: inline-block
}

.stats-title-chart.single-post .chart-all {
    display: none
}

.chart-helper {
    color: rgba(0, 0, 0, 0.3);
    font-size: 18px;
    text-align: left;
    padding: 0;
    margin: 9px 0 0 30px;
    font-style: normal
}

.chart-helper-back {
    font-style: normal
}

.stats-title-chart button {
    border: none;
    background: none
}

.chart-tabs {
    margin: 30px 30px 0
}

.total-number {
    font-size: 50px;
    display: block;
    line-height: 34px;
    height: 40px;
    margin-bottom: 5px;
    letter-spacing: -0.04em
}

.chart-tabs .date-range {
    font-weight: 400
}

.chart-tabs button {
    font-size: 18px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.graph-title-post {
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 420px;
    white-space: nowrap
}

.creator-dashboard-no-posts {
    color: rgba(0, 0, 0, 0.3);
    font-size: 18px;
    text-align: center
}

.follow-counts {
    margin: 30px 30px 60px
}

.follow-counts-item {
    float: left;
    width: 20%;
    display: inline-block
}

.follow-counts-description>a {
    text-decoration: underline
}

.follow-counts-item:last-child {
    float: left;
    width: 60%;
    display: inline-block;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.follow-counts-item {
    font-size: 18px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.chart-tabs li {
    float: left;
    width: 33%;
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15)
}

.chart-tabs li:last-child {
    width: 34%
}

.chart-tabs button {
    border: 0;
    color: rgba(0, 0, 0, 0.15);
    display: block;
    padding: 0 15px 10px;
    background: none;
    width: 100%;
    text-align: left;
    border-right: 1px solid rgba(0, 0, 0, 0);
    border-left: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -ms-transition: color .2s;
    -o-transition: color .2s;
    transition: color .2s
}

.chart-tabs li:first-child button {
    padding-left: 0
}

.chart-tabs button:hover {
    color: rgba(0, 0, 0, 0.3)
}

.chart-tabs .active, .chart-tabs .active:hover {
    border-bottom: 1px solid rgba(0, 0, 0, 0)
}

.chart-tabs .active button {
    color: #000
}

.chart-tabs li:first-child button {
    border-left: rgba(0, 0, 0, 0)
}

.chart-page {
    margin-top: 10px;
    text-align: center
}

.chart-page-vertical-divider {
    border-right: 1px solid rgba(0, 0, 0, 0.3);
    margin: 2px 10px 0;
    display: inline-block;
    height: 25px;
    vertical-align: top
}

.chart-page .show-next .icons:before {
    margin-left: 8px;
    margin-right: 0
}

@media screen and (max-width:1000px) {
    .chart-wrapper {
        padding: 10px 0 0
    }

    .chart-page-vertical-divider {
        margin-top: -10px;
        height: 35px
    }

    .stats-title {
        margin: 15px 0 0;
        padding-bottom: 0;
        border-bottom-color: rgba(0, 0, 0, 0.15);
        padding: 0 0 0 10px;
        height: 35px
    }

    .stats-title-page {
        margin: 5px 0 0;
        padding: 0 0 0 70px;
        font-size: 18px;
        line-height: 2
    }

    .stats-title h2 {
        font-size: 16px;
        line-height: 2
    }

    .stats-title-chart .chart-helper {
        display: none
    }

    .chart-tabs {
        margin: 10px 0 0;
        border-top: 1px solid #fff
    }

    .follow-counts {
        margin: 5px 10px 30px
    }

    .follow-counts-item {
        font-size: 14px;
        width: 34%
    }

    .follow-counts-description {
        font-size: 14px;
        line-height: 1.4
    }

    .follow-counts-item:last-child {
        display: block;
        width: 100%;
        margin-top: 10px
    }

    .chart-tabs li:first-child button, .chart-tabs button {
        padding: 5px 10px;
        font-size: 14px
    }

    .bargraph {
        overflow: hidden
    }

    .total-number {
        font-size: 24px;
        height: 34px;
        margin-bottom: 0
    }
}

.hero-referrers {
    height: auto;
    padding: 100px 0 60px
}

.hero-referrers-title {
    font-size: 32px;
    line-height: 1.2
}

.hero-referrers-title>small {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    color: rgba(0, 0, 0, 0.3);
    display: block;
    font-size: 24px;
    margin-bottom: 20px
}

.referrers-table {
    margin-bottom: 50px;
    width: 100%
}

.referrers-table-thead {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    color: rgba(0, 0, 0, 0.3);
    font-size: 12px;
    letter-spacing: .1em;
    text-align: left;
    text-transform: uppercase
}

.referrers-table-thead th {
    padding: 5px 0
}

.referrers-table-value-th {
    text-align: right
}

.referrers-table-row {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05)
}

.referrers-table-cell {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    line-height: 1.2;
    padding: 16px 20px 16px 0
}

.referrers-table-label {
    font-size: 18px;
    width: 75%;
    word-break: break-all
}

.referrers-table-value {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    padding: 16px 0;
    text-align: right;
    vertical-align: top
}

@media all and (max-width:500px) {
    .hero-referrers {
        padding: 90px 0 40px
    }

    .hero-referrers-title {
        font-size: 24px
    }

    .hero-referrers-title>small {
        font-size: 18px;
        margin-bottom: 10px
    }

    .referrers-table-thead {
        font-size: 11px
    }
}

.bucket-activities .bucket-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 40px 0
}

.bucket-activities .bucket-item:last-child {
    border-bottom: 0
}

.bucket-activities .post-meta {
    margin-right: 5px
}

.social-items {
    margin-top: 20px
}

.icons-heart-social-item {
    margin-right: 16px;
    color: rgba(0, 0, 0, 0.15)
}

.social-items-recommend-note .notes-recommendations {
    font-size: 32px;
    color: rgba(0, 0, 0, 0.3);
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic
}

.social-items-recommend-note .notes-recommendation-cite {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic
}

.social-items-recommend-note .notes-recommendation>.icons-heart {
    color: #a9d8b2;
    margin: 0 16px 0 0
}

.social-activity-text {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 18px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 4px
}

.activity-item-avatar {
    width: 44px;
    height: 44px;
    overflow: hidden;
    margin: 0 16px 16px 0;
    vertical-align: middle;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.activity-item-avatar.recommend-avatar {
    width: 32px;
    height: 32px;
    margin: 0 8px 8px 0
}

.loggedout-home {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.loggedout-home .background {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000 no-repeat center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.loggedout-home .wrapper {
    background: rgba(0, 0, 0, 0.44);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%
}

.loggedout-home .content {
    position: relative;
    top: 20%;
    margin: 0 auto;
    width: 800px
}

.loggedout-home .headline {
    text-align: center;
    color: #fff
}

.loggedout-home h1 {
    font-size: 58px;
    line-height: 1.2
}

.loggedout-home h2 {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    font-size: 24px;
    color: rgba(255, 255, 255, 0.65)
}

.loggedout-home .divider {
    width: 50px;
    height: 1px;
    background: white;
    margin: 30px auto 60px;
    filter: alpha(opacity=20);
    -khtml-opacity: .2;
    -moz-opacity: .2;
    opacity: .2
}

.loggedout-home .icon-container {
    width: 100%;
    color: #fff;
    *zoom: 1
}

.loggedout-home .icon-container:before, .loggedout-home .icon-container:after {
    display: table;
    content: " "
}

.loggedout-home .icon-container:after {
    clear: both
}

.loggedout-home .icon-container .icons, .loggedout-home .icon-container .icons:before {
    font-size: 66px;
    color: #fff
}

.loggedout-home .icon-box {
    float: left;
    width: 215px;
    margin: 0 25px;
    text-align: center;
    line-height: 1.2
}

.loggedout-home .icon-caption {
    font-size: 16px;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.65)
}

.loggedout-home .actions {
    margin-top: 90px;
    text-align: center
}

.loggedout-home .actions-caption {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic;
    font-size: 18px;
    color: rgba(255, 255, 255, 0.65);
    margin-bottom: 20px
}

.loggedout-home .actions .icons, .loggedout-home .actions .icons:before {
    top: 4px
}

.bestof-page {
    padding-top: 50px
}

.bestof-actions {
    padding: 12px 0;
    text-align: center;
    color: rgba(0, 0, 0, 0.3);
    font-weight: 300;
    font-size: 18px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.bestof-actions .icons {
    display: inline-block;
    padding: 10px 0;
    top: -12px;
    position: relative
}

.bestof-actions .icons:hover {
    color: rgba(0, 0, 0, 0.6)
}

@media all and (min-width:500px) {
    .loggedout-home .icon-box.icon-box-mobile {
        display: none
    }
}

@media all and (max-width:800px) and (min-width:500px) {
    .loggedout-home .content {
        width: 500px
    }

    .loggedout-home .icon-box {
        width: 146px;
        margin: 0 10px
    }
}

@media all and (max-width:500px) {
    .loggedout-home .content {
        top: 60px;
        width: 100%;
        overflow: hidden
    }

    .loggedout-home h1 {
        font-size: 38px
    }

    .loggedout-home h2 {
        font-size: 18px;
        font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
        letter-spacing: 0.01rem;
        font-weight: 400;
        font-style: italic
    }

    .loggedout-home .icon-caption {
        font-size: 14px;
        margin-top: -5px
    }

    .loggedout-home .icon-container {
        width: 180px;
        height: 140px;
        margin: 0 auto;
        position: relative
    }

    .loggedout-home .icon-container .icons, .loggedout-home .icon-container .icons:before {
        font-size: 46px
    }

    .loggedout-home .divider {
        margin-bottom: 30px;
        width: 40px
    }

    .loggedout-home .icon-box-collections, .loggedout-home .icon-box-stories,
    .loggedout-home .icon-box-editor {
        display: none
    }

    .loggedout-home .icon-container .icon-box.icon-box-mobile {
        display: box;
        margin: 0
    }

    .loggedout-home .actions {
        margin-top: 20px
    }

    .loggedout-home .actions-caption {
        font-size: 14px;
        margin-bottom: 15px
    }

    .loggedout-home .icon-box {
        width: 180px
    }

    .bestof-actions {
        padding: 8px 0;
        font-size: 14px
    }

    .bestof-page {
        padding-top: 30px
    }
}

.collection-sort-selector {
    margin: 20px 0 60px 0;
    *zoom: 1;
    position: relative
}

.collection-sort-selector:before, .collection-sort-selector:after {
    display: table;
    content: " "
}

.collection-sort-selector:after {
    clear: both
}

.collection-sort-option {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    float: left;
    width: 49%;
    padding: 40px 20px 45px;
    border: 0;
    cursor: pointer;
    outline: 0;
    text-align: left;
    background: rgba(0, 0, 0, 0.05);
    overflow: hidden;
    display: block;
    -webkit-box-align: stretch
}

.collection-sort-option-oldest {
    right: 0;
    position: absolute;
    height: 100%
}

.collection-sort-option-default .collection-sort-option-title,
.collection-sort-option-default .collection-sort-option-description {
    padding-left: 80px
}

.collection-sort-option-oldest .collection-sort-option-title,
.collection-sort-option-oldest .collection-sort-option-description {
    padding-left: 80px
}

.collection-sort-selector-oldest .collection-sort-option-oldest,
.collection-sort-selector-default .collection-sort-option-default,
.collection-sort-option:focus, .collection-sort-option:hover {
    background-color: rgba(0, 0, 0, 0.15)
}

.collection-sort-option .collection-sort-option-title {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    display: block;
    font-size: 18px;
    color: rgba(0, 0, 0, 0.8);
    margin-bottom: 5px
}

.collection-sort-option-description {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 0
}

.collection-sort-option:first-child {
    margin-right: 10px
}

.collection-sort-add-form {
    margin-top: 40px;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    padding: 20px 0
}

.collection-sort-add-form .btn {
    float: right
}

.new-collection .collection-sort-add-form {
    display: none
}

.tags {
    text-transform: uppercase;
    font-size: 12px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.tags>a {
    color: #fff;
    background: rgba(255, 255, 255, 0.35);
    border-radius: 10px;
    padding: 0 9px;
    margin-right: 5px;
    line-height: 22px;
    display: inline-block;
    margin-bottom: 5px
}

.tags>a:focus {
    background: #57ad68;
    outline: none
}

.tags-input {
    display: inline-block;
    white-space: nowrap;
    min-width: 5px;
    outline: none;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    padding: 3px 9px;
    margin-bottom: 5px
}

.tags-input.editable, .tags-input.editable a, .tags-input.editable .default-value {
    color: #fff
}

.tags-collection .tags>a:nth-child(3)+.tags-input {
    display: none
}

.tags-editors .tags>a:nth-child(10)+.tags-input {
    display: none
}

.story-rejection-caption {
    margin-bottom: 20px
}

.story-rejection-note {
    height: 100px
}

.post-article {
    position: relative;
    height: 100%
}

.post-page-wrapper, .post-page-wrapper-inner {
    position: relative;
    *zoom: 1
}

.post-page-wrapper:before, .post-page-wrapper-inner:before, .post-page-wrapper:after,
.post-page-wrapper-inner:after {
    display: table;
    content: " "
}

.post-page-wrapper:after, .post-page-wrapper-inner:after {
    clear: both
}

.post-mark-read {
    visibility: hidden
}

.post-field, .post-field:focus, .post-title, .post-title:focus {
    outline: 0;
    word-wrap: break-word
}

.post-edit-mode .post-page-wrapper {
    display: none
}

.post-edit-mode-initialized .post-page-wrapper {
    display: block
}

.post-content {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    font-size: 22px;
    line-height: 1.5
}

.post-article .body {
    margin-top: 25px;
    margin-bottom: 30px;
    *zoom: 1
}

.post-article .body:before, .post-article .body:after {
    display: table;
    content: " "
}

.post-article .body:after {
    clear: both
}

.post-article .body a {
    text-decoration: underline
}

.tier-1 .body a {
    text-decoration: none;
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
    background-repeat: repeat-x;
    background-size: 2px 2px;
    background-position: 0 24px
}

.tier-1 .body h2>a {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8)));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#cc000000', endColorstr='#cc000000', GradientType=0);
    background-size: 2px 3px;
    background-position: 0 35px
}

.tier-1 .body h3>a {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8)));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8));
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#cc000000', endColorstr='#cc000000', GradientType=0);
    background-size: 2px 2px;
    background-position: 0 26px
}

.tier-1 .is-postCoverless h2>a {
    background-position: 0 65px
}

.tier-1 .is-postCoverless h3>a {
    background-position: 0 37px
}

.tier-1 .is-postCoverless h4>a {
    background-position: 0 31px
}

@media only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (-webkit-min-device-pixel-ratio:2) {
    .tier-1 .body a {
        background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.8) 75%);
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.8) 75%);
        background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.8) 75%);
        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.8) 75%);
        background-repeat: repeat-x
    }

    .tier-1 .body h2>a, .tier-1 .body h3>a {
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333332), to(#333332));
        background-image: -moz-linear-gradient(top, #333332, #333332);
        background-image: -webkit-linear-gradient(top, #333332, #333332);
        background-image: -o-linear-gradient(top, #333332, #333332);
        background-image: linear-gradient(to bottom, #333332, #333332);
        background-repeat: repeat-x;
        filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ff333332', endColorstr='#ff333332', GradientType=0)
    }
}

.post-article .body p, .post-article .body blockquote {
    margin-bottom: 30px
}

.post-article .body blockquote+blockquote {
    padding-top: 30px;
    margin-top: -30px
}

.post-title {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    letter-spacing: -0.04em;
    font-size: 50px;
    line-height: 1.1;
    margin-bottom: 8px
}

.post-field.subtitle {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 30px;
    line-height: 1.1;
    color: rgba(0, 0, 0, 0.6);
    margin: 0
}

.post-header .post-item-meta {
    margin-top: 12px
}

.post-article .body h2 {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 32px;
    line-height: 1.2;
    padding-top: 31px;
    margin-bottom: 2px
}

.post-article .body h3 {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 24px;
    line-height: 1.2;
    margin-bottom: 2px
}

.post-article .body h2+h3 {
    margin-top: 5px
}

.is-postCoverless .body h2 {
    font-size: 60px;
    line-height: 1;
    letter-spacing: -0.04em;
    padding-top: 40px;
    margin-bottom: 8px
}

.is-postCoverless .body h3 {
    font-size: 34px;
    line-height: 1.2;
    margin-top: 20px;
    margin-bottom: 4px
}

.is-postCoverless .body h4 {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic;
    font-size: 30px;
    line-height: 1.2;
    color: #666665;
    margin-top: 20px;
    margin-bottom: 2px
}

.is-postCoverless .body h2+h3, .is-postCoverless .body h2+h4, .is-postCoverless .body h3+h4 {
    margin-top: -6px
}

.is-postCoverless .body h4+h3 {
    margin-top: -2px
}

.is-postCoverless .body h3+h2, .is-postCoverless .body h4+h2 {
    margin-top: -38px
}

.post-article .body blockquote {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic;
    border-left: 3px solid #57ad68;
    padding-left: 20px;
    margin-left: -23px;
    padding-bottom: 3px
}

.post-article .body blockquote em, .post-article .body .image-caption em {
    font-style: normal
}

.grid-breaking .body .grid-breaking-slide.pullquote {
    margin-left: -200px;
    margin-right: 0
}

.post-article .body .pullquote, .post-article .body .grid-breaking-override.pullquote {
    line-height: 1.4;
    text-align: center;
    font-size: 32px;
    margin: 48px 0px;
    border: none;
    padding: 0
}

.grid-breaking .body .pullquote {
    margin: 48px -100px;
    -webkit-transition: margin .1s;
    -moz-transition: margin .1s;
    -ms-transition: margin .1s;
    -o-transition: margin .1s;
    transition: margin .1s
}

.tier-1 .pullquote>a {
    background-image: -moz-linear-gradient(top, #fff 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: -webkit-linear-gradient(top, #fff 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: -o-linear-gradient(top, #fff 50%, rgba(0, 0, 0, 0.6) 50%);
    background-image: linear-gradient(to bottom, #fff 50%, rgba(0, 0, 0, 0.6) 50%);
    background-repeat: repeat-x;
    background-position: 0 33px
}

.drop-cap {
    float: left;
    padding-right: 6px;
    font-size: 2.925em;
    line-height: 0.875em;
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 700;
    font-style: normal
}

.drop-cap-editable {
    width: 1px;
    padding-right: 0;
    overflow: hidden
}

.drop-cap-editable+.drop-cap {
    margin-left: -1px
}

.section-break {
    display: block;
    width: 14%;
    margin: 50px auto 40px auto;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.post-article .body hr {
    display: block;
    width: 14%;
    margin: 50px auto 40px auto;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.post-article .body pre {
    font-family: Monaco, 'Courier New', 'Courier', monospace;
    font-size: 16px;
    background: rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
    padding: 20px;
    white-space: pre-wrap
}

.post-article .body pre+pre {
    margin-top: -20px
}

.post-article .body p[data-align="center"], .post-article .body h2[data-align="center"],
.post-article .body h3[data-align="center"], .post-article .body h4[data-align="center"],
.post-article .body blockquote[data-align="center"] {
    text-align: center
}

.body>section {
    position: relative
}

section:first-child>.section-divider, .section-image-full+section>.section-divider {
    display: none
}

.is-postCoverless section:first-child {
    padding-top: 120px
}

section.section-image-full:first-child, .is-postCoverless .body {
    margin-top: 0
}

.section-inner {
    position: relative
}

.section-background {
    display: none
}

.section-image-left, .section-image-right {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: table;
    width: 100%;
    margin: 0 -100px
}

.section-image-left>.section-inner, .section-image-left>.section-background,
.section-image-right>.section-inner, .section-image-right>.section-background {
    width: 50%;
    display: table-cell;
    padding: 0 5px
}

.section-image-left>.section-background, .section-image-right>.section-background,
.section-middle-center>.section-inner {
    vertical-align: middle
}

.section-bottom-center>.section-inner {
    vertical-align: bottom
}

.section-image-full {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 80px 0;
    padding-top: 110vh;
    padding-bottom: 80px;
    background: #fff;
    clear: both
}

.section-image-full+.section-image-full {
    margin-top: -81px
}

.section-image-full>.section-inner {
    z-index: 50
}

.section-image-full>.section-background {
    display: block;
    width: 100%;
    height: 110vh;
    position: absolute;
    top: 0;
    cursor: default
}

.body .section-image-full .section-background-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100vh;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center
}

.section-using-canvas.section-image-full {
    background: rgba(255, 255, 255, 0)
}

.section-using-canvas.section-image-full>.section-inner {
    color: #fff
}

.tier-1 .section-using-canvas.section-image-full>.section-inner a,
.tier-1 section[data-background-color]:not([data-background-color$="Light"])>.section-inner a {
    background-image: -moz-linear-gradient(top, transparent 50%, #fff 50%);
    background-image: -webkit-linear-gradient(top, transparent 50%, #fff 50%);
    background-image: -o-linear-gradient(top, transparent 50%, #fff 50%);
    background-image: linear-gradient(to bottom, transparent 50%, #fff 50%);
    background-repeat: repeat-x
}

.tier-1 .section-using-canvas.section-image-full>.section-inner h2>a,
.tier-1 .section-using-canvas.section-image-full>.section-inner h3>a,
.tier-1 section[data-background-color]:not([data-background-color$="Light"])>.section-inner h2>a,
.tier-1 section[data-background-color]:not([data-background-color$="Light"])>.section-inner h3>a {
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#fff));
    background-image: -moz-linear-gradient(top, #fff, #fff);
    background-image: -webkit-linear-gradient(top, #fff, #fff);
    background-image: -o-linear-gradient(top, #fff, #fff);
    background-image: linear-gradient(to bottom, #fff, #fff);
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffffffff', GradientType=0)
}

@media only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (-webkit-min-device-pixel-ratio:2) {
    .tier-1 .section-using-canvas.section-image-full>.section-inner a,
    .tier-1 section[data-background-color]:not([data-background-color$="Light"])>.section-inner a {
        background-image: -moz-linear-gradient(top, transparent 75%, #fff 75%);
        background-image: -webkit-linear-gradient(top, transparent 75%, #fff 75%);
        background-image: -o-linear-gradient(top, transparent 75%, #fff 75%);
        background-image: linear-gradient(to bottom, transparent 75%, #fff 75%);
        background-repeat: repeat-x
    }
}

.body .section-using-canvas.section-image-full .section-background-image {
    display: none
}

.section-image-full .default-value {
    color: rgba(255, 255, 255, 0.65)
}

.sectionLayout--outsetColumn {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    padding-top: 35px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    *zoom: 1
}

.sectionLayout--outsetColumn:before, .sectionLayout--outsetColumn:after {
    display: table;
    content: " "
}

.sectionLayout--outsetColumn:after {
    clear: both
}

.sectionLayout--outsetColumn+.sectionLayout--outsetColumn {
    padding-top: 0
}

.sectionLayout--outsetColumn+.layout-single-column, .sectionLayout--outsetColumn+.layout-fill-width {
    padding-top: 65px
}

.post-supplemental {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -ms-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s
}

.post-supplemental-loaded .post-supplemental {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.resume-reading {
    cursor: pointer;
    padding-left: 10px
}

.resume-reading:hover {
    color: rgba(0, 0, 0, 0.6)
}

.image-picker-wrap.no-image, .image-picker-wrap.uploading-image,
.image-picker-wrap.has-image.background-size-contain {
    margin-top: 100px
}

body:not(.post-edit-mode) .post-page-wrapper-contain {
    padding-top: 120px;
    margin-top: 0
}

.post-article .body figure {
    position: relative;
    margin-bottom: 30px;
    clear: both;
    outline: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.post-article .body figure.is-partialWidth {
    clear: none;
    float: left;
    padding: 5px;
    margin-bottom: 0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.sectionLayout--outsetColumn figure.is-partialWidth:first-child {
    padding-left: 0
}

.sectionLayout--outsetColumn figure.is-partialWidth:last-child {
    padding-right: 0
}

.sectionLayout--outsetColumn[data-paragraph-count="2"] {
    padding-left: 10px
}

.sectionLayout--outsetColumn[data-paragraph-count="2"] .is-partialWidth:first-child {
    margin-left: -10px
}

.sectionLayout--outsetColumn[data-paragraph-count="3"] {
    padding-left: 20px
}

.sectionLayout--outsetColumn[data-paragraph-count="3"] .is-partialWidth:first-child {
    margin-left: -20px
}

.post-article .body figure.blockLayout--outsetRow {
    clear: both
}

.post-content .body img, .iframe-container>iframe, .iframe-container {
    display: block;
    margin: auto;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.post-content .body .image-outset-center img {
    margin: 0
}

.post-article .body h4+figure, .post-article .body h3+figure, .post-article .body h2+figure {
    margin-top: 15px
}

.post-article .body .image-inset-left, .post-article .body .image-outset-left {
    float: left;
    margin-top: 10px;
    margin-right: 30px;
    margin-bottom: 10px
}

.post-article .body .image-inset-left {
    width: 50%
}

.post-article .body .image-outset-left {
    width: 75%
}

.post-article .body .image-fill-width {
    margin-top: 100px;
    margin-bottom: 100px
}

.post-article .body .image-fill-width+.image-fill-width {
    margin-top: -100px
}

.post-article .body .image-fill-width .image-caption {
    padding-bottom: 10px
}

.body section:first-child .image-fill-width:first-child {
    margin-top: 80px
}

.is-postCoverless .body .section-first .paragraph-first.image-fill-width {
    margin-top: -120px
}

.is-postCoverless .body section[data-background-color] .paragraph-first.image-fill-width,
.is-postCoverless .body section[data-background-color]+section .paragraph-first.image-fill-width {
    margin-top: -80px
}

.is-postCoverless .body section[data-background-color] .paragraph-last.image-fill-width {
    margin-bottom: 0
}

.image-outset-center {
    -webkit-transition: margin .1s;
    -moz-transition: margin .1s;
    -ms-transition: margin .1s;
    -o-transition: margin .1s;
    transition: margin .1s
}

.aspect-ratio-placeholder {
    position: relative;
    width: 100%;
    margin: 0 auto
}

.aspect-ratio-locked>img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.post-article .body .image-outset-center, .post-article .body .grid-breaking-override.image-outset-center {
    margin-left: 0px;
    margin-right: -200px
}

.grid-breaking .body .image-outset-center {
    margin-right: -100px;
    margin-left: -100px
}

.grid-breaking .body .grid-breaking-slide.image-outset-center {
    margin-right: 0px;
    margin-left: -200px
}

.post-article .body .image-outset-left, .post-article .body .grid-breaking-override.image-outset-left {
    margin-left: 0
}

.grid-breaking .body .image-outset-left {
    margin-left: -100px
}

.image-caption {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic;
    font-size: 14px;
    line-height: 1.4;
    color: rgba(0, 0, 0, 0.6);
    outline: 0;
    z-index: 300
}

.tier-1 .body .image-caption a {
    background-image: -moz-linear-gradient(top, #fff 50%, #b3b3b1 50%);
    background-image: -webkit-linear-gradient(top, #fff 50%, #b3b3b1 50%);
    background-image: -o-linear-gradient(top, #fff 50%, #b3b3b1 50%);
    background-image: linear-gradient(to bottom, #fff 50%, #b3b3b1 50%);
    background-repeat: repeat-x;
    background-position: 0 15px
}

@media only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (-webkit-min-device-pixel-ratio:2) {
    .tier-1 .body .image-caption a {
        background-image: -moz-linear-gradient(top, #fff 75%, #b3b3b1 75%);
        background-image: -webkit-linear-gradient(top, #fff 75%, #b3b3b1 75%);
        background-image: -o-linear-gradient(top, #fff 75%, #b3b3b1 75%);
        background-image: linear-gradient(to bottom, #fff 75%, #b3b3b1 75%);
        background-repeat: repeat-x
    }
}

.image-caption-below, .post-article .image-caption, .post-article .grid-breaking-override>.image-caption,
.post-article .image-outset-center>.image-caption, .post-article .image-fill-width>.image-caption {
    position: relative;
    width: 100%;
    text-align: center;
    left: 0;
    margin-top: 10px
}

.post-article .image-caption:before, .post-article .grid-breaking-override>.image-caption:before,
.post-article .image-outset-center>.image-caption:before, .post-article .image-fill-width>.image-caption:before {
    content: none
}

.grid-breaking .image-caption {
    position: absolute;
    left: -172px;
    width: 150px;
    top: 0;
    text-align: right;
    margin-top: 0
}

.grid-breaking .image-caption:before {
    width: 25%;
    margin-left: 75%;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    display: block;
    content: "";
    margin-bottom: 10px
}

.grid-breaking .image-outset-center>.image-caption, .grid-breaking .image-fill-width>.image-caption {
    text-align: center;
    margin: 10px auto 0
}

.image-caption.default-value {
    display: none
}

.media-has-focus .image-caption.default-value, .image-caption.default-value:focus {
    display: block
}

.post-list {
    counter-reset: post;
    margin-bottom: 30px
}

.post-list>li:before {
    position: absolute;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 58px;
    margin-left: -58px;
    text-align: right
}

ol.post-list>li:before {
    padding-right: 12px;
    counter-increment: post;
    content: counter(post) "."
}

ul.post-list>li:before {
    padding-top: 6px;
    padding-right: 15px;
    font-size: 14.3px;
    content: '•'
}

.post-list>li {
    margin-left: 30px;
    margin-bottom: 12px;
    padding-top: 2px
}

.post-list>li:last-child {
    margin-bottom: 0
}

.post-article .body h2+.post-list, .post-article .body h3+.post-list,
.post-article .body h4+.post-list {
    margin-top: 10px
}

.post-article .post-header-image-wrap {
    max-height: 537px;
    line-height: 0
}

.post-article .post-header-image-wrap.img-loaded {
    background: #000
}

.post-article .post-header-image-contain {
    display: block
}

.post-article .post-header-image-wrap .post-header-image-aspect-ratio {
    display: block;
    width: 100%;
    height: auto
}

.post-article .image-picker-wrap {
    position: relative
}

.post-article .background-size-cover.image-picker-wrap, .post-article .background-size-contain.image-picker-wrap {
    overflow: hidden
}

.post-article .add-image-message, .post-article .replace-image-message .post-article .upload-feedback .post-article .image-controls {
    display: none
}

.post-article .caption {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 700;
    font-style: normal;
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    border-top-left-radius: 4px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    padding: 10px 15px;
    color: #fff;
    z-index: 300;
    background: rgba(0, 0, 0, 0.44);
    font-size: 10px;
    text-transform: uppercase;
    text-align: right;
    max-width: 80%
}

.post-article .caption.has-focus {
    min-width: 1px
}

.post-article .add-image-message {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    display: none;
    position: absolute;
    bottom: 15px;
    width: 100%;
    left: 0;
    text-align: center;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3)
}

.post-article .image-picker-wrap:hover .add-image-message, .post-article .image-picker-wrap.image-picker-dragover .add-image-message {
    color: #fff
}

.post-article .replace-image-message {
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -ms-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s;
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 200;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.3);
    background-repeat: no-repeat;
    cursor: pointer
}

.post-article .replace-image-message .message {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    color: #fff;
    text-align: center;
    width: 140px;
    position: absolute;
    left: 50%;
    top: 45%;
    margin-top: 50px;
    margin-left: -70px
}

.post-article .upload-feedback {
    width: 640px;
    top: 13px;
    left: 13px;
    margin-top: 0;
    margin-left: 0
}

.post-article .upload-feedback-preview {
    float: left;
    margin-right: -30px
}

.post-article .upload-feedback-inner {
    width: 485px;
    margin: 32px 0 0 62px;
    float: left
}

.post-article .progress-bar-wrap {
    height: 10px;
    width: 455px
}

.post-article .image-picker-wrap.no-image, .post-article .image-picker-wrap.uploading-image {
    min-height: 60px;
    margin-bottom: 0
}

.post-article .image-picker-wrap.no-image .image {
    position: absolute;
    width: 100%;
    height: 100%
}

.post-article .image-picker-wrap.no-image .add-image-message, .post-article .image-picker-wrap.uploading-image .upload-feedback {
    display: block
}

.post-article .image-picker-wrap.uploading-image .post-header-image-wrap {
    display: none
}

.post-article .image-picker-wrap.uploading-image {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background: #57ad68;
    min-height: 100px;
    margin-bottom: 0
}

.btn-replace-image {
    width: 80px;
    height: 60px;
    overflow: hidden
}

.post-article .image-picker-wrap.has-image .caption, .post-article .image-picker-wrap.has-image .image-controls,
.post-article .image-picker-wrap.has-image .replace-image-message {
    display: block
}

.post-article .image-picker-wrap.has-image:hover .replace-image-message,
.post-article .image-picker-wrap.has-image:hover .image-controls {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.post-article .background-size-contain {
    margin-bottom: 30px
}

.post-article .background-size-cover {
    margin-bottom: 40px
}

.post-article .background-size-cover, .post-article .background-size-full {
    max-width: 100%;
    width: 100%;
    margin-top: 0;
    position: relative
}

.post-article .background-size-cover .post-header-image-cover,
.post-article .background-size-full .post-header-image-cover {
    position: absolute;
    width: 100%;
    top: 0
}

.lang-tier-3 .post-content, .lang-tier-3 .body blockquote, .lang-tier-3 .image-caption,
.lang-tier-3 .body h4, .lang-tier-3 .post-article .caption {
    font-family: Georgia, Cambria, "Times New Roman", Times, serif
}

.lang-tier-3 .post-title, .lang-tier-3 .post-field.subtitle, .lang-tier-3 .body h2,
.lang-tier-3 .body h3 {
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif
}

.tier-1 .lang-tier-3 .body a, .tier-1 .lang-tier-3 .section-using-canvas.section-image-full>.section-inner a {
    text-decoration: underline;
    background: none
}

.post-article .background-size-contain .contain-edit, .post-article .background-size-cover .cover-edit {
    display: block
}

.post-article .background-size-contain .cover-edit, .post-article .background-size-cover .contain-edit {
    display: none
}

.post-footer-actions {
    position: relative;
    margin-bottom: 60px
}

.post-footer-cards {
    position: relative;
    margin-bottom: 100px
}

.post-footer-actions, .post-footer-cards, .post-footer-cards>.btn-set {
    *zoom: 1
}

.post-footer-actions:before, .post-footer-cards:before, .post-footer-cards>.btn-set:before,
.post-footer-actions:after, .post-footer-cards:after, .post-footer-cards>.btn-set:after {
    display: table;
    content: " "
}

.post-footer-actions:after, .post-footer-cards:after, .post-footer-cards>.btn-set:after {
    clear: both
}

.post-footer-secondary-actions {
    float: right;
    margin-top: 5px
}

.post-footer-secondary-actions .btn {
    margin-right: 0;
    padding: 0 4px
}

.post-footer-secondary-actions .btn .icons:before {
    font-size: 24px;
    color: rgba(0, 0, 0, 0.3)
}

.post-footer-secondary-actions .btn:hover .icons:before {
    color: rgba(0, 0, 0, 0.6)
}

.post-footer-secondary-actions .btn .icons-twitter:before {
    top: 1px
}

.post-author-image>img {
    width: 80px;
    height: 80px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.post-collaborators .btn:hover, .post-collaborator-link:hover {
    color: #57ad68
}

.post-collaborators {
    margin-top: 6px
}

.post-collaborators .post-collaborators-heading {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.post-collaborator-item {
    font-size: 12px;
    line-height: 1.4;
    color: rgba(0, 0, 0, 0.3);
    word-wrap: break-word
}

.post-collaborator-visible .post-collaborator-link {
    color: rgba(0, 0, 0, 0.6)
}

.post-collaborators .btn, .post-collaborator-decline {
    margin-left: 3px
}

@-webkit-keyframes throb {
    0% {
        color: #57ad68;
        text-shadow: 0 0 5px rgba(150, 50, 32, 0.2)
    }

    50% {
        color: rgba(87, 173, 104, 0.5);
        text-shadow: 0 0 20px #cc5454
    }

    100% {
        color: #57ad68;
        text-shadow: 0 0 5px rgba(150, 50, 32, 0.2)
    }
}

.post-collaborator-throb:hover {
    -webkit-animation-name: throb;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite
}

.post-collaborator-item:after {
    content: ', '
}

.post-collaborator-item:last-child:after {
    content: ''
}

.post-footer-cover-caption {
    margin-top: 6px
}

.post-footer-cover-caption-heading {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.post-more-actions-popover {
    text-align: left
}

.post-more-actions-popover .icons:before {
    color: rgba(0, 0, 0, 0.3)
}

.post-more-actions-popover li {
    padding-bottom: 5px
}

.post-more-actions-popover li:last-child {
    padding-bottom: 0
}

.post-more-actions-popover li>a, .post-more-actions-popover li:hover>a,
.post-more-actions-popover li:hover .icons:before {
    color: rgba(0, 0, 0, 0.6)
}

.post-article .btn .icons-more:before {
    top: -1px;
    margin-right: 0
}

.post-more-actions-popover .btn .icons-flag {
    width: 25px;
    display: inline-block;
    text-align: left;
    top: 3px;
    position: relative
}

.post-more-actions-popover .btn .icons-flag:before {
    top: -1px;
    left: 4px;
    font-size: 19px
}

.email-share-form {
    margin-top: 16px;
    text-align: left;
    width: 480px
}

.email-share-form .input-text {
    width: 100%;
    height: auto;
    padding: 16px 14px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.email-share-form .share-comment {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-top: 5px;
    padding: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.email-share-form .email-address-error-message {
    color: #cc5454;
    font-size: 12px;
    margin-top: 5px;
    display: none
}

.email-share-form .email-address-error-message.visible {
    display: block
}

.email-share-form .share-comment .textarea-seamless {
    width: 100%;
    height: 60px
}

.email-share-form .share-post-data {
    position: relative;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    color: #000;
    margin: 5px;
    padding-top: 15px;
    text-align: left;
    *zoom: 1
}

.email-share-form .share-post-data:before, .email-share-form .share-post-data:after {
    display: table;
    content: " "
}

.email-share-form .share-post-data:after {
    clear: both
}

.email-share-form .share-post-text-container {
    overflow: hidden
}

.email-share-form .share-post-text {
    width: 100%;
    float: left
}

.email-share-form .share-post-title {
    padding: 0 10px 3px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.email-share-form .share-post-subtitle {
    padding: 0 10px 3px 0;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal
}

.email-share-form .post-author-image-container {
    float: right;
    margin-left: 5px;
    width: 40px;
    height: 40px
}

.email-share-form .post-author-image>img {
    width: 40px;
    height: 40px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.post-css-editor-popover {
    text-align: left
}

.post-css-editor-popover .btn-chromeless {
    margin-right: 10px
}

.input-textarea-css-editor {
    margin: 0 0 10px;
    width: 100%;
    height: 200px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.3);
    padding: 10px
}

.share-draft-copy {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    margin-bottom: 10px;
    line-height: 1.2
}

.input-text-post-url {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 12px
}

.share-draft-request-copyedit {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    margin-top: 25px;
    margin-bottom: 6px;
    padding-top: 17px;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    line-height: 1.2
}

.vote-widget, .btn-set .recommend-button {
    float: left
}

.recommend-button {
    margin-right: 6px
}

.popover-upvotes {
    color: rgba(0, 0, 0, 0.3);
    font-weight: 700;
    letter-spacing: -0.1em
}

.popover-upvotes .popover-inner {
    padding-right: 11px
}

.popover-upvotes .popover-inner, .popover-upvotes .popover-arrow:after {
    border-color: rgba(0, 0, 0, 0.15)
}

.upvoters {
    display: none
}

.upvoters .upvoters-item {
    display: block;
    float: left;
    margin-right: 6px;
    position: relative
}

.upvoters.fade {
    float: left;
    display: block;
    margin-top: 6px
}

@media (max-width:1200px){.post-footer-written-by {
        display: inline
    }

    .post-article .image-caption, .post-article .image-outset-center>.image-caption {
        position: relative;
        width: 100%;
        text-align: center;
        left: 0;
        margin-top: 10px
    }

    .post-article .image-caption:before {
        content: none
    }
}

@media (max-width:1200px + 100px){.post-article .image-outset-left>.image-caption {
        position: relative;
        width: 100%;
        text-align: center;
        left: 0;
        margin-top: 10px
    }

    .post-article .image-outset-left>.image-caption:before {
        content: none
    }
}

@media (max-width:1000px){.post-content {
        font-size: 22px
    }

    .post-page-wrapper-contain .post-page-wrapper-inner {
        max-width: none
    }

    .post-header {
        width: auto
    }

    .post-article .body .pullquote {
        line-height: 1.4;
        font-size: 24px;
        margin: 43px -10px
    }

    .tier-1 .pullquote>a {
        background-position: 0 25px
    }

    .post-article .body .image-inset-left, .post-article .body .image-outset-left {
        margin-bottom: 20px
    }

    .post-article .body .image-inset-left, .post-article .body .image-outset-left,
    .post-article .body .image-outset-center {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        float: none
    }

    .post-article .has-image.background-size-contain {
        max-width: 75%
    }

    .post-footer-cards {
        margin-bottom: 60px
    }

    .post-article .post-header-image-contain, .post-content .body img {
        width: 100%;
        height: auto
    }
}

@media (max-width:680px){.post-article .body blockquote {
        padding-left: 17px;
        margin-left: -20px
    }
}

@media (max-width:500px){.post-title {
        font-size: 34px;
        line-height: 1.1
    }

    .post-field.subtitle {
        font-size: 24px
    }

    .post-header .post-item-meta {
        margin-top: 8px
    }

    .post-header .post-item-meta-avatar {
        display: none
    }

    .picker-layout-inline .story-cover-content {
        padding-top: 90px;
        padding-bottom: 0
    }

    .post-article .body {
        margin-top: 0;
        margin-bottom: 10px
    }

    .post-article .body h2 {
        padding-top: 12px;
        font-size: 24px
    }

    .post-article .body h3 {
        margin-top: -8px;
        font-size: 20px
    }

    .post-article .body h3:first-child {
        margin-top: -3px
    }

    .post-article .body .pullquote {
        line-height: 1.4;
        font-size: 24px;
        margin: 43px 0
    }

    .is-postCoverless .body h2 {
        font-size: 36px;
        line-height: 1.1;
        padding-top: 36px;
        margin-bottom: 6px
    }

    .is-postCoverless .body h3 {
        font-size: 24px;
        line-height: 1.2;
        margin-top: 18px;
        margin-bottom: 4px
    }

    .is-postCoverless .body h4 {
        font-size: 24px;
        line-height: 1.2
    }

    .is-postCoverless .body h2+h3, .is-postCoverless .body h2+h4, .is-postCoverless .body h3+h4 {
        margin-top: -4px
    }

    .is-postCoverless .body h4+h3 {
        margin-top: -2px
    }

    .is-postCoverless .body h3+h2, .is-postCoverless .body h4+h2 {
        margin-top: -36px
    }

    .sectionLayout--outsetColumn {
        padding-left: 0;
        padding-right: 0
    }

    .post-article .body figure.is-partialWidth {
        width: auto !important;
        float: none;
        padding-left: 0;
        padding-right: 0
    }

    .sectionLayout--outsetColumn[data-paragraph-count="2"], .sectionLayout--outsetColumn[data-paragraph-count="3"] {
        padding-left: 0
    }

    .sectionLayout--outsetColumn[data-paragraph-count="2"] .is-partialWidth:first-child,
    .sectionLayout--outsetColumn[data-paragraph-count="3"] .is-partialWidth:first-child {
        margin-left: 0
    }

    .tier-1 .body a {
        background-position: 0 22px
    }

    .tier-1 .body h2>a {
        background-size: 2px 2px;
        background-position: 0 26px
    }

    .tier-1 .body h3>a {
        background-size: 2px 2px;
        background-position: 0 22px
    }

    .tier-1 .is-postCoverless .body h2>a {
        background-position: 0 39px
    }

    .tier-1 .is-postCoverless .body h3>a {
        background-position: 0 26px
    }

    .tier-1 .is-postCoverless .body h4>a {
        background-position: 0 28px
    }

    .post-content {
        font-size: 20px;
        line-height: 1.4
    }

    .post-article .post-header-image-wrap {
        max-height: 300px
    }

    .post-article .body hr {
        margin: 40px auto 33px auto
    }

    ol.post-list>li:before {
        margin-top: -4px
    }

    ul.post-list>li:before {
        font-size: 13px
    }

    .post-article .body pre {
        font-size: 14px;
        font-weight: 600
    }

    .post-header {
        margin-bottom: 20px
    }

    .post-article .background-size-cover {
        margin-bottom: 20px
    }

    .template-flex-article:not(.post-edit-mode) .post-page-wrapper-contain {
        margin-top: 0;
        padding-top: 0
    }

    .post-article .image-picker-wrap.background-size-contain {
        max-width: none
    }

    .post-author-image, .post-footer-actions .btn-set {
        float: none
    }

    .post-author-image {
        margin-bottom: 10px
    }

    .post-footer {
        padding-top: 0
    }

    .upvoters.fade, .popover-upvotes[data-count="0"] {
        display: none
    }

    .popover-upvotes {
        display: block
    }

    .popover-small .popover-inner {
        padding: 7px 10px
    }

    .post-footer-secondary-actions .btn {
        margin: 0
    }

    .post-footer-secondary-actions .btn-label {
        display: none
    }

    .email-share-form, .email-share-form .email-address-container,
    .email-share-form .share-comment {
        width: 100%
    }

    .email-share-form .share-comment {
        padding: 12px 14px;
        margin-top: 2px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .post-footer-actions {
        margin-bottom: 40px
    }

    .post-article .background-size-contain.layout-single-column {
        margin-left: 0;
        margin-right: 0
    }

    .btn-share-draft {
        display: none
    }

    .post-article .body .image-fill-width {
        margin-top: 80px;
        margin-bottom: 80px
    }

    .post-article .body .image-fill-width+.image-fill-width {
        margin-top: -80px
    }

    .body section:first-child .image-fill-width:first-child {
        margin-top: 60px
    }
}

@media print {
    .post-header .post-item-meta, .section-using-canvas.section-image-full .section-background {
        display: none
    }

    .section-using-canvas.section-image-full>.section-inner {
        color: rgba(0, 0, 0, 0.8)
    }
}

.background-size-full {
    display: table;
    height: 100%;
    max-height: 900px;
    background-color: rgba(0, 0, 0, 0.9);
    background-position: center
}

.browser-chrome.os-android .background-size-full.picker-layout-fill {
    height: 99%
}

.background-size-full.picker-layout-fill {
    margin-bottom: 60px
}

.background-size-full.picker-layout-inline {
    background-color: transparent;
    height: auto
}

.post-article .background-size-full.uploading-image {
    background-color: rgba(0, 0, 0, 0.9)
}

.story-cover {
    display: table;
    height: 100%;
    width: 100%
}

.story-cover-image, .story-cover .picker-target-clone {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center
}

.picker-layout-inline .story-cover-image {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.story-cover-content {
    position: relative;
    display: table-cell;
    width: 100%;
    vertical-align: bottom;
    padding-top: 100px;
    padding-bottom: 160px;
    color: #fff
}

.picker-layout-inline .story-cover-content {
    padding-bottom: 0;
    color: rgba(0, 0, 0, 0.8)
}

.picker-layout-inline.transition-picker-layout .story-cover-content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

.story-cover-arrow {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    position: relative;
    bottom: -100px;
    left: 50%;
    margin-left: -8px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    background: rgba(0, 0, 0, 0);
    border-left: 0;
    border-top: 0;
    outline: none;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    cursor: pointer
}

.story-cover-arrow:hover {
    border-color: rgba(255, 255, 255, 0.65)
}

@media (min-height:1010px){.background-size-full .story-cover .arrow {
        display: none
    }
}

.post-edit-mode .story-cover-arrow {
    display: none
}

.story-cover-content .btn-replace-image {
    display: block;
    position: relative;
    margin-bottom: 10px
}

.story-cover-content .icons-replace-image:before {
    display: block;
    color: rgba(255, 255, 255, 0.65);
    -webkit-transition: color .2s;
    -moz-transition: color .2s;
    -ms-transition: color .2s;
    -o-transition: color .2s;
    transition: color .2s
}

.has-image .story-cover-content .btn-replace-image:hover .icons-replace-image:before,
.has-image .story-cover-content .btn-replace-image:focus .icons-replace-image:before {
    color: #fff
}

.uploading-image .story-cover-content .icons-replace-image:before {
    display: none
}

.story-cover-content .post-item-meta {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.story-cover-content .post-item-meta-item {
    display: inline;
    overflow: visible
}

.story-cover-content .post-item-meta-item:before {
    display: inline
}

.background-size-full .image-washes {
    left: 13px
}

.background-size-full .remove-header-image {
    left: 176px;
    bottom: 6px;
    font-size: 28px;
    color: rgba(255, 255, 255, 0.65)
}

.background-size-full .remove-header-image:hover {
    color: #fff
}

.background-size-full .remove-header-image:after {
    content: '';
    display: block;
    top: 10px;
    left: -15px;
    width: 1px;
    height: 24px;
    background: rgba(255, 255, 255, 0.2);
    position: absolute
}

.background-size-full .upload-feedback {
    position: relative;
    left: auto;
    right: auto;
    margin-bottom: 20px;
    *zoom: 1
}

.background-size-full .upload-feedback:before, .background-size-full .upload-feedback:after {
    display: table;
    content: " "
}

.background-size-full .upload-feedback:after {
    clear: both
}

.background-size-full .progress-bar-wrap {
    background-color: rgba(255, 255, 255, 0.5)
}

.background-size-full .btn-cancel {
    color: rgba(255, 255, 255, 0.85);
    right: 0;
    top: -15px
}

.background-size-full .btn-cancel:hover {
    color: #fff
}

.background-size-full .caption {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    padding: 20px 25px;
    color: rgba(255, 255, 255, 0.5);
    background: rgba(0, 0, 0, 0);
    font-size: 14px;
    text-transform: none
}

.background-size-full .caption-truncated {
    max-width: 40%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-indent: -25px
}

@media all and (max-width:1000px) {
    .background-size-full {
        max-height: none;
        min-height: 100%
    }

    .picker-layout-inline.background-size-full {
        min-height: 0
    }
}

@media (max-height:750px){.story-cover-content {
        padding-bottom: 80px
    }

    .story-cover-arrow {
        bottom: -40px
    }
}

@media (max-width:500px){.background-size-full .caption {
        display: none
    }
}

@media (max-height:500px){.story-cover-content {
        padding-bottom: 20px
    }

    .story-cover-arrow {
        bottom: 10px
    }
}

@media print {
    .background-size-full.picker-layout-fill {
        height: auto;
        min-height: none;
        margin-bottom: 0;
        background: transparent
    }

    .story-cover-content {
        padding-top: 100px;
        padding-bottom: 0
    }

    .picker-layout-fill .story-cover-content {
        padding-top: 40px
    }

    .story-cover-content, .picker-layout-fill .post-field.subtitle {
        color: rgba(0, 0, 0, 0.8)
    }

    .story-cover-content [data-scroll] {
        -webkit-transform: none !important;
        opacity: 1 !important
    }

    .picker-layout-fill .story-cover-image {
        position: relative;
        height: 400px
    }

    .story-cover-arrow {
        display: none
    }
}

.footer-post-preview {
    display: block
}

.footer-post-preview .picker-content {
    display: none
}

.footer-post-preview .background-size-cover, .footer-post-preview .background-size-full {
    overflow: hidden;
    margin-bottom: 0
}

.post-preview-enabled .post-preview {
    display: block
}

.footer-post-preview .caption {
    display: none
}

.diagnostics-visible .transition-from-post-footer, .transition-from-post-footer {
    -webkit-transition: -webkit-transform .4s;
    -moz-transition: -moz-transform .4s;
    -o-transition: -o-transform .4s;
    transition: transform .4s
}

.transition-from-post-footer .metabar, .transition-from-post-footer .post-author-side,
.transition-from-post-footer .post-preview {
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    transition: .4s
}

.transition-from-post-footer .post-preview {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transform: translate3d(0, -40px, 0);
    -moz-transform: translate3d(0, -40px, 0);
    -ms-transform: translate3d(0, -40px, 0);
    -o-transform: translate3d(0, -40px, 0);
    transform: translate3d(0, -40px, 0)
}

.pre-transition-from-post-footer .metabar, .pre-transition-from-post-footer .picker-content,
.pre-transition-from-post-footer .post-author-side {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.post-preview {
    display: none;
    background: rgba(0, 0, 0, 0.05)
}

.post-preview-content {
    line-height: 1.4;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.post-preview .post-preview-content {
    padding: 60px 0 100px
}

.post-preview-description {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    padding: 15px 0 35px;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .1em;
    color: rgba(0, 0, 0, 0.3);
    border-top: 1px solid rgba(0, 0, 0, 0.15)
}

.post-preview-title {
    font-size: 44px;
    line-height: 1.1;
    letter-spacing: -0.04em;
    color: rgba(0, 0, 0, 0.8);
    margin-bottom: 8px
}

.post-preview-subtitle {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 24px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.6)
}

.post-preview-content .post-item-meta {
    padding-top: 10px
}

.post-preview-content .post-item-meta, .post-preview-content .post-item-author {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.post-preview-with-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 0;
    background: none
}

.post-preview-with-image.post-preview-filtered {
    background: rgba(0, 0, 0, 0.05)
}

.post-preview-with-image.post-preview-unfiltered {
    background: rgba(0, 0, 0, 0.3)
}

.post-preview-with-image .post-preview-content {
    color: #fff
}

.post-preview-with-image .post-preview-description {
    color: rgba(255, 255, 255, 0.65);
    border-color: rgba(255, 255, 255, 0.35)
}

.post-preview-with-image .post-preview-title {
    color: #fff
}

.post-preview-with-image .post-preview-subtitle {
    color: rgba(255, 255, 255, 0.85)
}

.post-preview-with-image .post-item-meta, .post-preview-with-image .post-item-author {
    color: rgba(255, 255, 255, 0.65)
}

.post-preview-with-image .icons-reading-list {
    color: rgba(255, 255, 255, 0.85)
}

.post-preview-with-image .reading-list-status:hover .reading-list-status-message,
.post-preview-with-image .reading-list-status:hover .icons-reading-list {
    color: rgba(255, 255, 255, 0.97)
}

.post-preview-with-image .on-reading-list:hover .icons-reading-list {
    color: #57ad68
}

.post-footer .story-cover, .post-preview-enabled .story-cover .post-preview-content {
    position: relative;
    height: 500px;
    overflow: hidden
}

@media (max-width:800px){.post-preview-title {
        font-size: 44px
    }
}

@media (max-width:500px){.post-preview-title {
        font-size: 24px;
        margin-bottom: 4px
    }

    .post-preview-subtitle {
        font-size: 18px
    }

    .post-preview-description {
        padding-top: 10px;
        padding-bottom: 20px
    }

    .post-preview-content .post-item-meta {
        font-size: 14px;
        padding-top: 5px
    }

    .post-preview-content .post-item-meta-item, .post-preview-content .post-item-meta-item:before {
        display: inline
    }

    .post-preview .post-preview-content {
        padding: 25px 0 40px
    }

    .post-preview-enabled .background-size-cover .post-header-image-cover,
    .post-preview-enabled .post-header-image-wrap .post-header-image-aspect-ratio {
        width: 230%;
        margin-left: -50%
    }

    .transition-from-post-footer .background-size-cover .post-header-image-cover,
    .transition-from-post-footer .post-header-image-wrap .post-header-image-aspect-ratio {
        -webkit-transition: .4s;
        -moz-transition: .4s;
        -ms-transition: .4s;
        -o-transition: .4s;
        transition: .4s;
        width: 100%;
        margin-left: 0
    }

    .post-footer .story-cover, .post-preview-enabled .story-cover .post-preview-content {
        height: 300px
    }
}

@media print {
    .footer-post-preview {
        display: none
    }
}

.logged-out-post-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    background: rgba(0, 0, 0, 0.05);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.onboarding-toolbar {
    background-color: rgba(0, 0, 0, 0.8)
}

.onboarding-toolbar .footer, .onboarding-toolbar-branding.btn-set {
    margin: 0
}

.onboarding-toolbar .footer {
    width: auto;
    line-height: auto;
    padding: 0;
    margin-right: 5px
}

.logged-out-branding {
    text-align: center;
    padding: 120px 0 90px 0;
    color: #fff;
    position: relative
}

.logged-out-branding-name {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    display: block;
    font-size: 50px;
    line-height: 1.1
}

.logged-out-tagline {
    margin: 10px 0 20px 0
}

.logged-out-post-footer-cover .logged-out-branding {
    padding: 70px 0 20px 0
}

.logged-out-post-footer-cover .promo-actions {
    margin: 20px 0 50px 0
}

.onboarding-toolbar .metabar-block.align-left {
    padding-left: 0
}

.logged-out-toolbar-icon {
    display: inline-block;
    color: #fff;
    vertical-align: -2px;
    margin-left: 15px;
    margin-right: 15px
}

.logged-out-toolbar-about {
    display: none
}

.logged-out-toolbar-about, .logged-out-toolbar-title {
    display: inline-block;
    color: rgba(0, 0, 0, 0.3);
    font-size: 12px
}

.logged-out-toolbar-about {
    display: none
}

.onboarding-toolbar .footer .btn-link {
    line-height: 38px
}

@media screen and (max-width:1000px) {
    .onboarding-toolbar .footer .btn-link {
        display: none
    }
}

@media screen and (max-width:500px) {
    .logged-out-branding-name {
        font-size: 44px
    }

    .logged-out-branding-name:after {
        content: '';
        display: block;
        height: 1px;
        width: 36px;
        margin: 26px auto 0;
        background: rgba(255, 255, 255, 0.35)
    }

    .logged-out-post-footer-cover .promo-actions {
        margin: 20px 0 0 0
    }

    .logged-out-post-footer-cover .logged-out-branding {
        padding: 50px 0 20px 0
    }

    .onboarding-toolbar {
        padding: 8px 0
    }

    .logged-out-toolbar-title, .logged-out-toolbar-icon {
        display: none
    }

    .logged-out-toolbar-about {
        display: inline-block;
        font-size: 14px;
        margin-left: 10px;
        line-height: 34px
    }
}

.follow-ups-container {
    margin-top: 32px;
    padding-top: 5px;
    padding-bottom: 20px;
    clear: both
}

.follow-ups-empty {
    padding: 0;
    margin: 0
}

.follow-ups-list {
    padding-top: 10px
}

.follow-ups-title {
    position: relative;
    padding: 12px 0 10px 0
}

.follow-ups-empty .follow-ups-title, .follow-ups-empty .follow-ups-list {
    display: none
}

.post-edit-mode .follow-ups-container {
    margin-top: 50px;
    filter: alpha(opacity=30);
    -khtml-opacity: .3;
    -moz-opacity: .3;
    opacity: .3;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -ms-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out
}

.post-edit-mode .follow-ups-container:hover, .post-edit-mode .follow-ups-container-active {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.post-edit-mode .follow-ups-empty {
    display: none
}

.follow-up {
    position: relative;
    margin: 0 -10px 0;
    padding: 0 10px 24px;
    line-height: 1.1;
    *zoom: 1
}

.follow-up:before, .follow-up:after {
    display: table;
    content: " "
}

.follow-up:after {
    clear: both
}

.follow-up-content {
    width: 100%;
    float: left
}

.follow-up-link, .follow-up-title, .follow-up-description {
    font-size: 18px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.6)
}

.follow-up-title, .follow-up-description {
    display: inline
}

.follow-up-title {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 700;
    font-style: normal;
    color: rgba(0, 0, 0, 0.8)
}

.follow-up-footer {
    padding-top: 6px;
    font-size: 14px
}

.follow-up-footer-item {
    display: inline;
    color: rgba(0, 0, 0, 0.3);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.follow-up-footer-item:before {
    display: inline-block;
    content: '·';
    padding: 0 5px
}

.follow-up-footer-item:first-child:before {
    display: none
}

.follow-up-footer-link {
    color: rgba(0, 0, 0, 0.3)
}

.follow-up-footer-link:hover {
    color: rgba(0, 0, 0, 0.6)
}

.follow-up-visibility {
    float: left;
    position: relative;
    height: 28px;
    z-index: 100;
    cursor: pointer;
    margin-left: -9px;
    margin-bottom: -4px
}

.follow-up-visibility-item {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    position: relative;
    height: 26px;
    margin-top: -28px;
    border: 1px solid rgba(0, 0, 0, 0);
    color: rgba(0, 0, 0, 0.3);
    background: #fff;
    padding: 0 10px 0 6px;
    line-height: 26px;
    margin-bottom: -1px;
    -webkit-transition: margin .1s;
    -moz-transition: margin .1s;
    -ms-transition: margin .1s;
    -o-transition: margin .1s;
    transition: margin .1s
}

.follow-up-visibility-item:first-child {
    margin-top: 0;
    z-index: 100
}

.follow-up-visibility-dropdown:hover .follow-up-visibility-item {
    margin-top: 0;
    border-color: rgba(0, 0, 0, 0.05)
}

.follow-up-visibility-dropdown .follow-up-visibility-item:hover {
    border-color: #468c54;
    color: #fff;
    background: #57ad68;
    z-index: 20
}

.follow-up-visibility .icons {
    width: 20px;
    padding-right: 4px;
    display: inline-block;
    text-align: center
}

.follow-up-visibility .icons-remove {
    font-size: 16px
}

.follow-up-visibility .follow-up-visibility-down-icon {
    width: 11px
}

.follow-up-visibility-down-icon:before {
    position: absolute;
    content: "▼";
    display: block;
    font-size: 5px;
    top: 1px;
    margin-left: 8px;
    -webkit-transform: scaleX(2);
    -moz-transform: scaleX(2);
    -ms-transform: scaleX(2);
    -o-transform: scaleX(2);
    transform: scaleX(2)
}

.follow-up-editor-footer {
    line-height: 1.1
}

.follow-up-link-editor {
    position: absolute;
    top: 0
}

.follow-up-link-editor, .follow-up-editor .follow-up-title, .follow-up-editor .follow-up-description {
    outline: 0;
    display: inline
}

.follow-up-link-editor>p, .follow-up-editor .follow-up-title>p,
.follow-up-editor .follow-up-description>p {
    display: inline;
    line-height: 1.4
}

.follow-up-editor .follow-up-delete {
    display: none
}

.follow-up-editor .icons-add-further-reading {
    color: #57ad68;
    display: inline-block;
    font-size: 24px;
    padding-right: 12px
}

.follow-up-side-icon {
    position: absolute;
    top: -1px;
    left: -22px
}

.follow-up-start {
    cursor: pointer;
    margin-bottom: 25px
}

.follow-ups-empty .follow-up-start {
    margin-bottom: 40px
}

.follow-ups-prompt, .follow-ups-empty .follow-ups-empty-prompt {
    display: inline
}

.follow-ups-empty-prompt, .follow-ups-empty .follow-ups-prompt {
    display: none
}

.follow-up-start:hover, .follow-up-start:hover .icons-add-further-reading:before {
    color: #57ad68
}

.follow-up-start .icons-add-further-reading {
    display: inline-block
}

.follow-up-start .icons-add-further-reading:before {
    color: rgba(0, 0, 0, 0.15);
    top: 6px;
    font-size: 24px
}

.follow-up-link-prompt {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    display: block;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.3);
    line-height: 20px
}

.follow-up-new .follow-up-new-editor, .follow-up-new.follow-up-editor-active .follow-up-start {
    display: none
}

.follow-up-new.follow-up-editor-active .follow-up-new-editor {
    display: block
}

@media (max-width:500px){.follow-up-link, .follow-up-title, .follow-up-description {
        font-size: 14px
    }

    .follow-up-new {
        display: none
    }
}

@media print {
    .follow-up-new {
        display: none
    }
}

.notes-position-container {
    position: relative;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.notes-container {
    position: absolute;
    left: 100%;
    font-size: 14px;
    line-height: 1.3;
    margin-left: 40px;
    width: 294px;
    padding-left: 20px
}

.notes-container-scroller {
    overflow: auto;
    width: 100%;
    height: 100%;
    padding-right: 20px;
    position: relative
}

.notes-markers {
    position: absolute;
    top: 0;
    right: 0
}

.notes-position-container>.notes-container, .notes-position-container>.notes-markers {
    z-index: 60
}

.notes-position-container>.notes-markers {
    overflow: visible
}

.post-article[data-allow-notes="false"] .notes-markers, .post-article[data-allow-notes="false"] .notes-container {
    display: none
}

.notes-list-fade, .notes-list-fade-bottom {
    pointer-events: none;
    position: absolute;
    left: 0;
    right: 0;
    height: 40px;
    z-index: 100
}

.notes-list-fade {
    top: 0;
    background-image: -webkit-radial-gradient(ellipse 100% 100% at 50% 100%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -moz-radial-gradient(ellipse 100% 100% at 50% 100%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -ms-radial-radial-gradient(ellipse 100% 100% at 50% 100%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -o-radial-gradient(ellipse 100% 100% at 50% 100%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: radial-gradient(ellipse 100% 100% at 50% 100%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-repeat: no-repeat
}

.notes-list-fade-bottom {
    bottom: 0;
    background-image: -webkit-radial-gradient(ellipse 100% 100% at 50% 0, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -moz-radial-gradient(ellipse 100% 100% at 50% 0, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -ms-radial-radial-gradient(ellipse 100% 100% at 50% 0, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: -o-radial-gradient(ellipse 100% 100% at 50% 0, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-image: radial-gradient(ellipse 100% 100% at 50% 0, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.35), #fff);
    background-repeat: no-repeat
}

.notes-marker {
    position: absolute;
    left: 0;
    width: 20px;
    height: 24px;
    padding: 10px;
    margin: -2px 0 0;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    display: none;
    overflow: hidden
}

.notes-marker-icon {
    color: rgba(0, 0, 0, 0.15);
    -webkit-transition: color .1s;
    -moz-transition: color .1s;
    -ms-transition: color .1s;
    -o-transition: color .1s;
    transition: color .1s;
    top: 2px
}

.notes-marker-count, .notes-marker-nocount {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    line-height: 36px
}

.notes-marker-nocount {
    font-size: 13px;
    line-height: 34px
}

.notes-list-visible .notes-marker-highlighted .notes-marker-icon {
    color: #a9d8b2
}

.notes-active .notes-marker-icon, .notes-marker:hover .notes-marker-icon,
.notes-list-visible .notes-active .notes-marker-icon {
    color: #57ad68
}

.resizing .notes-marker {
    display: none
}

.notes-active, .notes-hasnotes, .notes-marker-highlighted {
    display: block
}

.notes-source-floated {
    margin-top: -40px
}

.notes-list {
    position: absolute;
    width: 280px;
    -webkit-transition: top .1s;
    -moz-transition: top .1s;
    -ms-transition: top .1s;
    -o-transition: top .1s;
    transition: top .1s
}

.notes-container {
    display: none
}

.notes-list-visible .notes-container {
    display: block
}

.notes-source {
    position: relative
}

.notes-author {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal
}

.notes-author .icons-invisible {
    margin-left: 6px;
    color: rgba(0, 0, 0, 0.3)
}

.notes-author-icon {
    background: rgba(0, 0, 0, 0.05);
    position: absolute;
    left: 0;
    width: 32px;
    height: 32px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.icons.notes-author-icon:before {
    font-size: 25px;
    line-height: 32px;
    position: relative;
    left: 6px
}

.notes-reply .notes-author-icon, .notes-replies .notes-author-icon {
    top: 3px;
    width: 24px;
    height: 24px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.notes-note, .notes-edit {
    position: relative;
    padding-left: 42px
}

.notes-new-note {
    padding-top: 20px
}

.notes-note {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer
}

.notes-note.notes-is-hidden {
    display: none
}

.notes-content, .notes-editor {
    outline: 0;
    word-wrap: break-word
}

.notes-content>a {
    text-decoration: underline
}

.notes-foot, .notes-foot .btn-chromeless, .notes-container .btn-chromeless {
    font-size: 13px
}

.notes-foot {
    margin-top: 3px;
    color: rgba(0, 0, 0, 0.3)
}

.notes-foot .btn-chromeless:before {
    content: "·";
    margin: 0 3px;
    color: rgba(0, 0, 0, 0.3)
}

.notes-no-separator:before, .notes-foot .btn-chromeless:first-child:before {
    display: none
}

.notes-container .btn-chromeless {
    color: rgba(0, 0, 0, 0.3);
    cursor: pointer
}

.notes-container .btn-chromeless:hover, .notes-container .btn-primary {
    color: #57ad68
}

.notes-container .btn-primary:hover {
    color: #468c54
}

.notes-edit-action, .notes-edit-mode .notes-text-action, .notes-edit-mode .notes-replies .notes-edit-action {
    display: none
}

.notes-edit-mode .notes-replies .notes-text-action, .notes-edit-mode .notes-edit-action {
    display: inline
}

.notes-container .btn-chromeless.notes-add {
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 32px;
    cursor: pointer;
    font-size: 14px
}

.btn .notes-add-icon {
    display: block;
    position: relative;
    float: left;
    width: 32px;
    height: 32px;
    line-height: 32px;
    margin-right: 10px
}

.btn .notes-add-icon:before {
    display: block;
    position: absolute;
    top: 2px;
    width: 32px;
    font-size: 26px;
    text-align: center;
    line-height: 32px;
    color: rgba(0, 0, 0, 0.15)
}

.notes-add:hover .notes-add-icon:before {
    color: #57ad68
}

.notes-add, .notes-hide-editor .notes-edit, .notes-add-creator-text,
.notes-is-creator .notes-add-text {
    display: none
}

.notes-hide-editor .notes-add {
    display: block
}

.notes-is-creator .notes-add-creator-text {
    display: inline
}

.notes-disclaimer {
    color: rgba(0, 0, 0, 0.3);
    font-size: 12px
}

.notes-is-creator .notes-disclaimer {
    display: none
}

.notes-disclaimer:before {
    content: '';
    display: block;
    margin: 16px 0 10px;
    width: 40px;
    height: 1px;
    background: rgba(0, 0, 0, 0.05)
}

.notes-controls {
    position: absolute;
    top: -1px;
    right: 0
}

.notes-link {
    position: relative;
    top: 5px;
    right: 5px;
    color: rgba(0, 0, 0, 0.15);
    font-size: 16px;
    border: none;
    background: rgba(0, 0, 0, 0)
}

.notes-state {
    float: right;
    height: 28px;
    font-size: 13px;
    cursor: pointer
}

.notes-state li {
    position: relative;
    height: 26px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, 0.3);
    background: #fff;
    padding: 0 8px 0 6px;
    line-height: 24px;
    margin-bottom: -1px
}

.notes-state-dropdown li {
    display: none;
    z-index: 10
}

.notes-state-dropdown li:first-child {
    display: block
}

.notes-state-dropdown li:hover {
    border-color: #468c54;
    color: #fff;
    background: #57ad68;
    z-index: 20
}

.notes-state-border {
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(0, 0, 0, 0.05)
}

.notes-state .icons {
    width: 20px;
    padding-right: 3px;
    display: inline-block;
    text-align: center
}

.notes-state .icons:before {
    font-size: 15px;
    position: relative
}

.notes-state .icons-group:before {
    top: 1px
}

.notes-state .icons-invisible:before {
    top: 2px
}

.notes-state .icons-remove {
    font-size: 16px
}

.notes-state .notes-state-down-icon {
    width: 11px;
    padding-right: 2px
}

.notes-state .notes-state-down-icon:before {
    position: absolute;
    content: "▼";
    display: block;
    font-size: 5px;
    top: 1px;
    margin-left: 6px;
    -webkit-transform: scaleX(2);
    -moz-transform: scaleX(2);
    -ms-transform: scaleX(2);
    -o-transform: scaleX(2);
    transform: scaleX(2)
}

.notes-reply-edit {
    display: none
}

.notes-link-reply {
    display: block
}

.notes-show-reply-editor .notes-reply-edit {
    display: block
}

.notes-show-reply-editor .notes-link-reply {
    display: none
}

.notes-editor {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.notes-editor.default-value {
    color: rgba(0, 0, 0, 0.3)
}

.notes-replies .notes-author {
    font-size: 13px
}

.notes-replies-hidden .notes-replies-hidden-btn {
    display: inline
}

.notes-replies-hidden-btn, .notes-replies-hidden .notes-replies-hidden-container {
    display: none
}

.notes-reply {
    position: relative;
    padding-left: 34px;
    margin-top: 14px;
    margin-bottom: 6px
}

.notes-reply-editor, .notes-reply .notes-content {
    font-size: 13px
}

.notes-reply:hover .notes-hide-reply {
    display: block
}

.notes-hide-reply {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    height: 8px;
    width: 8px
}

.notes-hide-reply:hover {
    background-color: rgba(0, 0, 0, 0.05)
}

.notes-hide-reply>.icons-remove {
    position: relative;
    left: 0px;
    top: -8px;
    color: rgba(0, 0, 0, 0.15);
    font-size: 16px
}

.close-to-max-length:after {
    display: block;
    color: rgba(0, 0, 0, 0.3);
    font-size: x-small;
    content: "" attr(data-length) "/" attr(data-max-length)
}

.max-length:after {
    color: #cc5454
}

.notes-highlight {
    background: rgba(133, 246, 150, 0.5)
}

.post-page-wrapper {
    overflow: hidden
}

.zoom-overlay-transitioning .post-page-wrapper, .zoom-overlay-open .post-page-wrapper {
    overflow-y: visible
}

.post-page-wrapper-inner, .notes-position-container {
    position: relative;
    right: 0%;
    -webkit-transition: right .2s;
    -moz-transition: right .2s;
    -ms-transition: right .2s;
    -o-transition: right .2s;
    transition: right .2s
}

.notes-list-visible .notes-position-container {
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none
}

.background-size-cover, .section-inner.layout-fill-width {
    left: 0;
    -webkit-transition: left .2s;
    -moz-transition: left .2s;
    -ms-transition: left .2s;
    -o-transition: left .2s;
    transition: left .2s
}

.notes-dismiss {
    display: none
}

.notes-vote-editor {
    font-size: 14px;
    display: block;
    margin-bottom: 5px;
    min-height: 42px
}

.notes-vote-container {
    clear: both;
    padding: 15px 0 30px
}

.notes-vote-container .notes-vote-editor {
    min-height: 0
}

.notes-vote-open .post-footer-cards, .notes-vote-open .post-footer {
    display: none
}

.slide-indicator-fraction, .slide-indicators {
    text-align: center;
    background: #fff;
    margin-top: -10px
}

.slide-indicator-fraction {
    font-size: 11px;
    margin-bottom: 8px;
    padding-top: 5px;
    color: rgba(0, 0, 0, 0.3)
}

.slide-indicators {
    list-style: none
}

.slide-indicator {
    display: inline-block;
    background: rgba(0, 0, 0, 0.3);
    margin: 10px 3px 5px;
    width: 6px;
    height: 6px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.slide-indicator-active {
    background: rgba(0, 0, 0, 0.6)
}

.section-image-full-notes, .section-image-full-notes .default-value,
.section-image-full-notes .notes-add-icon:before, .section-image-full-notes .notes-state li,
.section-image-full-notes .notes-link {
    color: rgba(255, 255, 255, 0.65)
}

.section-image-full-notes .btn-chromeless, .section-image-full-notes .btn-primary {
    color: rgba(255, 255, 255, 0.85)
}

.section-image-full-notes .notes-marker-icon {
    color: rgba(255, 255, 255, 0.2)
}

.section-image-full-notes .notes-marker-count, .section-image-full-notes .notes-marker-nocount,
.section-image-full-notes .notes-author, .section-image-full-notes .btn-chromeless:hover,
.section-image-full-notes .btn-chromeless:hover .notes-add-icon:before,
.section-image-full-notes .btn-primary:hover {
    color: #fff
}

.section-image-full-notes .notes-state-border {
    background: rgba(255, 255, 255, 0.2)
}

.section-image-full-notes .notes-note {
    border-bottom-color: rgba(255, 255, 255, 0.2)
}

.section-image-full-notes .notes-state li {
    background: rgba(0, 0, 0, 0);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-top-color: rgba(0, 0, 0, 0)
}

.section-image-full-notes .notes-state-dropdown:hover li {
    background: rgba(255, 255, 255, 0.97);
    color: #b3b3b1
}

.section-image-full-notes .notes-state-dropdown li:hover {
    color: #fff;
    border-color: #57ad68;
    background: #57ad68
}

.section-image-full-notes .notes-disclaimer {
    color: rgba(255, 255, 255, 0.35)
}

.section-image-full-notes .notes-disclaimer:before {
    background: rgba(255, 255, 255, 0.2)
}

.section-image-full-notes .close-to-max-length:after {
    color: rgba(255, 255, 255, 0.35)
}

.section-image-full-notes .max-length:after {
    color: #fff
}

.notes-recommendations {
    position: relative;
    margin-top: 17px;
    margin-bottom: -2px;
    font-size: 14px;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    z-index: 500
}

.notes-post-meta.notes-recommendations {
    color: rgba(0, 0, 0, 0.3);
    margin-top: 0
}

.notes-recommendations>.icons-heart {
    margin: 4px 10px 0 -23px;
    color: rgba(0, 0, 0, 0.15)
}

.notes-post-meta.notes-recommendations>.icons-heart {
    margin: -4px 6px 0 0
}

.metabar-light .notes-recommendations {
    color: #fff
}

.notes-recommendation {
    position: relative;
    top: -3px;
    line-height: 1.3;
    margin-left: 38px
}

.notes-post-meta .notes-recommendation {
    margin-left: 0
}

.notes-recommendation-cite {
    display: block;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.notes-post-meta .notes-recommendation-cite {
    display: inline-block
}

.notes-post-meta>.notes-recommendation {
    margin-top: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.post-footer .notes-recommendations {
    display: none
}

.background-size-contain .notes-recommendation {
    margin-bottom: 30px
}

.background-size-cover .notes-recommendation {
    color: #fff
}

.background-size-cover .notes-recommendations-wrapper {
    position: absolute;
    width: 100%
}

@media (min-width:500px){.notes-state-dropdown:hover li {
        display: block
    }
}

@media (max-width:1500px){.notes-list-visible .notes-container, .notes-list-visible .notes-markers {
        -webkit-animation: slide-notes 200ms 100ms both;
        -moz-animation: slide-notes 200ms 100ms both;
        -ms-animation: slide-notes 200ms 100ms both;
        -o-animation: slide-notes 200ms 100ms both;
        animation: slide-notes 200ms 100ms both
    }

    .notes-list-visible .post-page-wrapper-inner, .notes-list-visible .notes-position-container {
        right: 17.5%
    }

    .notes-list-visible .post-page-wrapper .background-size-cover,
    .notes-list-visible .post-page-wrapper .section-inner.layout-fill-width {
        left: 17.5%
    }
}

@media (max-width:1070px){.notes-list-visible .post-page-wrapper-inner, .notes-list-visible .notes-position-container {
        right: 45%
    }

    .notes-list-visible .post-page-wrapper .background-size-cover,
    .notes-list-visible .post-page-wrapper .section-inner.layout-fill-width {
        left: 45%
    }

    .notes-list-visible .notes-list {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none
    }

    .notes-recommendations {
        margin-top: 75px
    }

    .picker-layout-inline .layout-table-row+.layout-table-row .story-cover-content {
        padding-top: 35px
    }
}

@media (max-width:800px){.notes-recommendations .icons-heart {
        display: none
    }
}

@media (max-width:680px){.layout-single-column.notes-position-container {
        margin: 0;
        width: auto
    }

    .notes-marker {
        padding: 10px 5px;
        margin-left: -30px;
        margin-top: -6px
    }
}

@media screen and (max-width:500px) {
    .background-size-contain .notes-recommendation {
        margin-bottom: 20px
    }

    .notes-container, .notes-list, .notes-note {
        width: 240px
    }

    .notes-list-visible .notes-new-note, .notes-show-replies .post-footer,
    .notes-show-replies .post-header, .notes-show-replies .post-author-bottom,
    .notes-show-replies .post-footer-actions, .notes-show-replies .notes-note,
    .notes-show-replies .body, .notes-show-replies .notes-controls, .notes-list-visible .notes-markers,
    .notes-new-note .notes-foot, .notes-replies-hidden~.notes-replies-footer,
    .notes-state-border, .notes-list-fade, .notes-link {
        display: none
    }

    .notes-list-visible .post-page-wrapper .background-size-cover,
    .notes-list-visible .post-page-wrapper .section-inner.layout-fill-width {
        left: 0
    }

    .notes-list-visible .post-page-wrapper-inner, .notes-list-visible .notes-position-container {
        right: 0
    }

    .resizing .notes-hasnotes {
        display: block
    }

    .notes-marker:hover .notes-marker-icon {
        color: rgba(0, 0, 0, 0.15)
    }

    .notes-position-container {
        margin: 0;
        z-index: 700
    }

    .notes-container-scroller {
        padding: 0
    }

    .notes-list-visible .notes-container, .notes-list-visible .notes-markers {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        -o-animation: none;
        animation: none
    }

    .notes-new-note-visible.notes-container {
        overflow: visible;
        display: block;
        position: absolute
    }

    .notes-list-visible .notes-position-container {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }

    .notes-list-visible .notes-container {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: auto;
        margin: 0;
        padding: 0
    }

    .notes-list-visible .post-article:after {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(255, 255, 255, 0.65);
        z-index: 500;
        content: ''
    }

    .notes-list-visible .notes-list {
        margin: 0;
        padding: 0;
        background: rgba(0, 0, 0, 0)
    }

    .notes-list-visible .post-page-wrapper-inner, .notes-list-visible .post-content-inner {
        position: static
    }

    .notes-list {
        width: 100%;
        position: absolute;
        bottom: 0;
        white-space: nowrap
    }

    .notes-items {
        padding: 0
    }

    .notes-state-dropdown.open li {
        display: block
    }

    @keyframes myfirst {
        0% {
            -webkit-transform: translate3d(100%, 0, 0);
            -moz-transform: translate3d(100%, 0, 0);
            -ms-transform: translate3d(100%, 0, 0);
            -o-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 0, 0);
            -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
            -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
        }
}

    @-webkit-keyframes myfirst {
        0% {
            -webkit-transform: translate3d(100%, 0, 0);
            -moz-transform: translate3d(100%, 0, 0);
            -ms-transform: translate3d(100%, 0, 0);
            -o-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0)
        }

        100% {
            -webkit-transform: translate3d(0, 0, 0);
            -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
            -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
        }
}

    .notes-list-visible .notes-items {
        animation: myfirst .3s;
        -webkit-animation: myfirst .3s
    }

    .notes-note {
        padding: 0;
        width: 100%;
        display: inline-block;
        vertical-align: bottom;
        white-space: normal;
        border-bottom: 0
    }

    .notes-edit, .notes-note-inner {
        white-space: normal;
        position: relative;
        width: auto;
        overflow: hidden;
        padding: 12px;
        margin: 0 10px 10px;
        background: #fff;
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
        -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35);
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px
    }

    .notes-new-note {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        -webkit-transition: -webkit-transform .2s cubic-bezier(.2, .3, .25, .9);
        -moz-transition: -moz-transform .2s cubic-bezier(.2, .3, .25, .9);
        -o-transition: -o-transform .2s cubic-bezier(.2, .3, .25, .9);
        transition: transform .2s cubic-bezier(.2, .3, .25, .9);
        -webkit-transform: translate3d(-100%, 0, 0);
        -moz-transform: translate3d(-100%, 0, 0);
        -ms-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }

    .notes-new-note:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }

    .notes-new-note-visible .notes-new-note {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        display: block
    }

    .notes-new-note-active .notes-new-note:before {
        display: none
    }

    .notes-note-editor {
        clear: both
    }

    .notes-new-note-active .notes-foot, .notes-list {
        display: block
    }

    .notes-foot, .notes-container .btn-chromeless {
        font-size: 14px
    }

    .notes-foot {
        margin-top: 5px
    }

    .notes-reply-editor, .notes-note-editor {
        font-size: 14px
    }

    .notes-author-icon {
        position: relative;
        width: 30px;
        height: 30px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .notes-author, .notes-avatar {
        float: left
    }

    .notes-avatar {
        margin-bottom: 2px
    }

    .notes-author {
        line-height: 28px;
        margin-left: 8px;
        font-size: 16px
    }

    .notes-state li {
        border-right: 0;
        border-top: 0
    }

    .notes-content {
        clear: both
    }

    .notes-reply-editor, .notes-content {
        clear: both
    }

    .notes-reply {
        margin-bottom: 10px;
        margin-top: 10px;
        padding-left: 40px
    }

    .notes-reply .notes-author-icon {
        position: absolute;
        width: 30px;
        height: 30px;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%
    }

    .notes-reply .notes-author {
        margin: 1px 0 -1px;
        line-height: 1.2;
        font-size: 14px
    }

    .notes-reply .notes-content {
        font-size: 14px
    }

    .notes-replies-hidden .notes-replies-hidden-container {
        border-bottom: 0;
        margin-bottom: 0
    }

    .notes-replies .notes-add {
        display: block
    }

    .notes-replies-footer, .notes-replies {
        margin-top: 12px;
        padding-top: 10px;
        border-top: 1px solid rgba(0, 0, 0, 0.15)
    }

    .notes-replies .btn-chromeless.notes-add {
        font-size: 13px;
        line-height: 1.2;
        padding-top: 0
    }

    .notes-replies .notes-add-icon {
        margin-right: 7px
    }

    .notes-replies .notes-add-icon {
        width: 20px;
        height: 20px;
        margin-left: 3px;
        margin-right: 15px
    }

    .notes-replies .notes-add-icon:before {
        width: 26px;
        font-size: 20px;
        text-align: center;
        line-height: 14px
    }

    .notes-replies .btn {
        vertical-align: top
    }

    .notes-reply:hover .notes-hide-reply {
        display: none
    }

    .notes-list-visible .notes-marker {
        display: none
    }

    .notes-highlight {
        position: relative;
        z-index: 600
    }

    .notes-list-visible .notes-dismiss {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        padding: 10px 12px 10px 10px;
        z-index: 800;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
    }

    .notes-dismiss .notes-marker-icon {
        font-size: 25px
    }

    .notes-dismiss .notes-marker-icon:before {
        color: #57ad68
    }

    .notes-dismiss .icons-remove:before {
        font-size: 16px;
        color: #fff;
        top: -2px;
        left: 5px
    }

    .notes-show-replies {
        overflow: hidden
    }

    .notes-show-replies .notes-container {
        background: #fff
    }

    .notes-show-replies .notes-list {
        top: 10px;
        margin-top: 0
    }

    .notes-show-replies .notes-active-note {
        display: block
    }

    .notes-show-replies .notes-replies-inner, .notes-show-replies .notes-active-note .notes-note-inner,
    .notes-show-replies .notes-active-note, .notes-show-replies .notes-items {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0
    }

    .notes-show-replies .notes-replies-footer {
        margin-top: 0
    }

    .notes-show-replies .notes-replies-inner {
        -webkit-overflow-scrolling: touch;
        overflow: auto
    }

    .notes-show-replies .post-content-inner {
        position: relative
    }

    .notes-show-replies .notes-dismiss .notes-marker-icon {
        display: none
    }

    .notes-show-replies .notes-dismiss .icons-remove:before {
        top: 16px;
        left: -4px;
        color: rgba(0, 0, 0, 0.3);
        font-size: 24px
    }

    .notes-show-replies .notes-note-inner {
        display: -webkit-box;
        display: -moz-box;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        display: -ms-flexbox;
        -ms-box-orient: vertical;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex;
        -webkit-flex-flow: column;
        -moz-flex-flow: column;
        -ms-flex-flow: column;
        flex-flow: column
    }

    .notes-show-replies .notes-note-main {
        -webkit-flex: none;
        -moz-flex: none;
        -ms-flex: none;
        flex: none
    }

    .notes-show-replies .notes-replies {
        -webkit-box-flex: 1;
        -moz-box-flex: 1;
        -webkit-flex: 1 100%;
        -moz-flex: 1 100%;
        -ms-flex: 1 100%;
        flex: 1 100%;
        position: relative
    }

    .notes-reply-editor-focused .notes-reply-edit-mode .notes-edit-mode .notes-foot,
    .notes-reply-editor-focused .notes-show-reply-editor .notes-replies-footer .notes-foot,
    .notes-note-editor-focused .notes-foot, .notes-reply-edit-mode .notes-foot,
    .notes-reply-edit-mode .notes-replies-footer, .notes-show-reply-editor .notes-foot,
    .notes-edit-mode .notes-replies-footer, .notes-edit-mode .notes-reply .notes-foot {
        display: none
    }

    .notes-reply-edit-mode .notes-edit-mode .notes-foot, .notes-show-reply-editor .notes-replies-footer .notes-foot {
        display: block
    }
}

@media screen and (max-height:320px) {
    .notes-edit-mode .notes-replies, .notes-show-reply-editor .notes-note-main,
    .notes-show-reply-editor .notes-replies, .notes-reply-edit-mode .notes-reply,
    .notes-reply-edit-mode .notes-note-main {
        display: none
    }

    .notes-reply-edit-mode .notes-edit-mode {
        display: block
    }

    .notes-show-reply-editor .notes-replies-footer, .notes-reply-edit-mode .notes-replies {
        padding-top: 0;
        margin-top: 0;
        border-top: 0
    }
}

@media print {
    .notes-container, .notes-markers {
        display: none
    }
}

.m-screen-reader-text {
    position: absolute;
    top: -9999px;
    left: -9999px
}

.m-image-cover {
    background-color: #000;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.m-hide {
    display: none !important
}

.m-error-message {
    padding: 20px 10px 20px 60px;
    margin: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.m-logo {
    position: absolute;
    left: 10px;
    width: 40px;
    height: 40px;
    line-height: 41px;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    text-decoration: none;
    top: 10px;
    outline: none;
    text-align: center
}

.m-btn {
    cursor: pointer;
    outline: none;
    text-decoration: none;
    font-size: 12px;
    display: inline-block
}

.m-btn-chromeless {
    background: rgba(0, 0, 0, 0);
    height: auto;
    line-height: inherit;
    border-width: 0;
    padding: 0;
    vertical-align: baseline;
    color: rgba(0, 0, 0, 0.3);
    white-space: normal
}

.m-btn-rounded {
    border: 1px solid;
    background: transparent;
    padding: 8px 15px;
    -webkit-border-radius: 999em;
    -moz-border-radius: 999em;
    border-radius: 999em
}

.m-btn-light {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.5)
}

.m-btn-count {
    border-left: 1px solid rgba(255, 255, 255, 0.5);
    padding-left: 6px;
    margin-left: 7px
}

.m-hero {
    text-align: center;
    padding: 0 0 80px
}

.m-hero-profile {
    padding-top: 30px;
    padding-bottom: 40px
}

.m-hero-with-image {
    padding-top: 0
}

.m-hero-image {
    height: 150px
}

.m-hero-title {
    letter-spacing: -0.04em;
    margin: 0 0 8px 0;
    padding: 0 40px;
    line-height: 1
}

.m-hero-title>a {
    color: rgba(0, 0, 0, 0.8);
    font-size: 24px;
    text-decoration: none
}

.m-hero-title-large>a {
    font-size: 32px
}

.m-hero-meta-info, .m-hero-subtitle, .m-hero-description {
    display: block;
    color: rgba(0, 0, 0, 0.6);
    word-break: break-word;
    letter-spacing: -0.02em;
    font-size: 16px;
    margin: 0;
    padding: 0 40px;
    line-height: 1.4;
    max-width: 640px;
    margin: 0 auto
}

.m-hero-description+.m-btn {
    margin-top: 15px
}

.m-hero-description a {
    color: #000
}

.m-hero-collection>.m-hero-title {
    padding-top: 100px
}

.m-hero-story {
    padding: 0 0 40px;
    text-align: left
}

.m-hero-story .m-hero-title {
    padding-top: 150px
}

.m-hero-meta-info {
    font-size: 14px;
    margin-top: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-bottom: 6px
}

.m-hero-title+.m-hero-meta-info {
    margin-top: 5px
}

.m-hero-meta-info>a {
    color: rgba(0, 0, 0, 0.6);
    text-decoration: none
}

.m-hero-meta-info>a:hover {
    text-decoration: underline
}

.m-hero-light>.m-hero-description, .m-hero-light>.m-hero-subtitle,
.m-hero-light>.m-hero-meta-info, .m-hero-light>.m-hero-meta-info>a,
.m-hero-light>.m-hero-title>a {
    color: #fff
}

.m-avatar {
    margin-top: 20px;
    display: inline-block;
    overflow: hidden;
    border: 3px solid #fff;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.m-avatar-borderless {
    border: 0;
    margin: 0
}

.m-hero-with-image .m-avatar {
    margin-top: -40px
}

.m-avatar>img {
    display: block;
    width: 80px;
    height: 80px
}

.m-hero-meta-info>.m-avatar {
    line-height: 30px;
    margin-bottom: -10px;
    margin-right: 5px
}

.m-avatar-micro>img {
    width: 30px;
    height: 30px
}

.m-bucket {
    max-width: 640px;
    margin: 0 auto;
    padding: 0 40px 40px;
    overflow: auto;
    text-align: left
}

.m-bucket-label {
    color: rgba(0, 0, 0, 0.3);
    font-size: 9px;
    text-transform: uppercase;
    margin: 30px 0 15px;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    padding-top: 15px;
    font-weight: 700;
    letter-spacing: .2em
}

.m-bucket-label:first-child {
    margin-top: 0
}

.m-bucket-list {
    margin: 0;
    padding: 0
}

.m-bucket-list-item {
    list-style: none;
    margin: 0;
    padding: 0
}

.m-bucket-list-item:last-child .m-bucket-list-item-post-snippet {
    margin-bottom: 0
}

.m-bucket-list-item a {
    text-decoration: none;
    outline: none
}

.m-bucket-list-item-post-title {
    font-size: 18px;
    line-height: 1.2;
    margin: 5px 0 2px;
    color: rgba(0, 0, 0, 0.8)
}

.m-bucket-list-item-post-snippet {
    display: block;
    color: rgba(0, 0, 0, 0.3);
    margin: 0 0 22px;
    color: rgba(0, 0, 0, 0.6);
    font-size: 14px;
    letter-spacing: -0.02em
}

.m-bucket-list-light .m-bucket-list-item-post-title, .m-bucket-list-light .m-bucket-list-item-post-snippet {
    color: #fff
}

.m-bucket-nav {
    margin-top: 0;
    padding: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.35);
    list-style: none
}

.m-bucket-nav-item {
    display: inline-block
}

.m-bucket-nav-item>.m-btn {
    display: block;
    font-style: normal;
    font-weight: 700;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .3em;
    padding: 10px 0;
    color: rgba(255, 255, 255, 0.5);
    border-top: 1px solid rgba(0, 0, 0, 0);
    margin-top: -1px;
    margin-right: 15px
}

.m-bucket-nav-item>.m-btn:hover, .m-bucket-nav-item>.m-btn:active,
.m-bucket-nav-item>.m-btn:focus, .m-bucket-nav-item>.m-btn-active {
    color: #fff
}

.m-bucket-nav-item>.m-btn-active {
    border-top-color: #fff
}

@media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi){.m-bucket-list-item-post-snippet {
        font-weight: 300
    }
}

.default-value {
    color: rgba(0, 0, 0, 0.3)
}

.hero-collection .default-value {
    color: rgba(255, 255, 255, 0.5)
}

.editable>p {
    margin-bottom: 0
}

.body.editable>p {
    margin-bottom: 30px
}

.template-flex-article.post-edit-mode .caption {
    display: none
}

.post-edit-mode .post-article {
    min-height: 100%
}

.post-edit-mode .post-footer-editor {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-top: 0;
    text-align: center;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
    -webkit-transition: -webkit-transform .3s, opacity .3s;
    -moz-transition: -moz-transform .3s, opacity .3s;
    -o-transition: -o-transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s
}

.new-section-show .post-footer-editor {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
}

.post-edit-mode .post-footer-editor .icons-add-circled:before {
    -webkit-transition: color .1s linear;
    -moz-transition: color .1s linear;
    -ms-transition: color .1s linear;
    -o-transition: color .1s linear;
    transition: color .1s linear;
    font-size: 32px
}

.post-edit-mode .post-footer-editor .btn:hover .icons-add-circled:before {
    color: rgba(0, 0, 0, 0.6)
}

.post-edit-mode .post-footer-editor .btn {
    outline: 0
}

.post-edit-mode .post-footer-editor .icons-add-circled {
    width: 27px;
    height: 30px;
    display: block;
    line-height: 38px
}

.post-edit-mode figure img:before, .post-edit-mode .iframe-container:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 500;
    content: ''
}

.media-has-focus img, .media-has-focus iframe {
    -webkit-box-shadow: 0 0 0 3px #57ad68;
    -moz-box-shadow: 0 0 0 3px #57ad68;
    box-shadow: 0 0 0 3px #57ad68
}

.section-background.media-has-focus {
    border-top: 3px solid #57ad68
}

.warning {
    background-color: rgba(150, 50, 32, 0.2)
}

.btn-chromeless-section-info {
    margin-left: 5px
}

.section-footer {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .5s linear;
    -moz-transition: opacity .5s linear;
    -ms-transition: opacity .5s linear;
    -o-transition: opacity .5s linear;
    transition: opacity .5s linear;
    font-size: 14px;
    position: absolute;
    color: rgba(0, 0, 0, 0.3);
    bottom: -30px;
    width: 100%
}

.active-section>.section-footer {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.word-count {
    color: rgba(0, 0, 0, 0.3);
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal
}

.word-count-exceeded {
    color: #cc5454
}

.btn-chromless-new-section {
    color: #57ad68
}

.section-footer-popover {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    text-align: left;
    font-size: 14px;
    padding: 25px;
    max-width: 220px
}

.section-footer-popover>p, .section-footer-popover>h3 {
    margin-bottom: 5px
}

.section-footer-popover>.btn {
    width: 100%;
    margin-top: 10px
}

.section-footer-emphasized {
    -webkit-animation: big-shimmy-shake .5s ease-in-out 0 3;
    -moz-animation: big-shimmy-shake .5s ease-in-out 0 3;
    -ms-animation: big-shimmy-shake .5s ease-in-out 0 3;
    -o-animation: big-shimmy-shake .5s ease-in-out 0 3;
    animation: big-shimmy-shake .5s ease-in-out 0 3
}

.site-nav-logo.distraction-free-component {
    -webkit-transition: opacity .3s linear .3s;
    -moz-transition: opacity .3s linear .3s;
    -ms-transition: opacity .3s linear .3s;
    -o-transition: opacity .3s linear .3s;
    transition: opacity .3s linear .3s
}

.distraction-free .site-nav-logo.distraction-free-component, .distraction-free-component {
    -webkit-transition: opacity .3s linear;
    -moz-transition: opacity .3s linear;
    -ms-transition: opacity .3s linear;
    -o-transition: opacity .3s linear;
    transition: opacity .3s linear
}

.distraction-free .distraction-free-component {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.distraction-free .metabar-message {
    -webkit-transition: margin .3s linear .3s;
    -moz-transition: margin .3s linear .3s;
    -ms-transition: margin .3s linear .3s;
    -o-transition: margin .3s linear .3s;
    transition: margin .3s linear .3s
}

.distraction-free .metabar-message {
    margin-left: 5px
}

.highlight-menu {
    position: absolute;
    visibility: hidden;
    display: none;
    z-index: 500;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
    top: 0;
    left: 0
}

.highlight-menu-inner {
    position: relative;
    height: 43px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid;
    border-color: #262625 #1c1c1b #121211;
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.8), inset 0 0 1px rgba(255, 255, 255, 0.07), inset 0 0 2px rgba(255, 255, 255, 0.15);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(49, 49, 47, 0.97)), to(#262625));
    background-image: -moz-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: -webkit-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: -o-linear-gradient(top, rgba(49, 49, 47, 0.97), #262625);
    background-image: linear-gradient(to bottom, rgba(49, 49, 47, 0.97), #262625);
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f731312f', endColorstr='#ff262625', GradientType=0)
}

.highlight-menu-stacked {
    margin: 3px 0
}

.highlight-menu-stacked-item:first-child {
    margin-top: 0
}

.highlight-menu-stacked-item {
    margin: 20px 0
}

.highlight-menu-stacked-item:last-child {
    margin-bottom: 0
}

.highlight-menu-buttons {
    padding: 0;
    white-space: nowrap;
    font-size: 0
}

.highlight-menu-buttons .highlight-menu-button {
    display: inline-block;
    text-align: center;
    vertical-align: middle
}

.btn-highlight-menu {
    display: block;
    background: rgba(0, 0, 0, 0);
    border: 0;
    color: white;
    padding: 0 10px;
    box-sizing: content-box
}

.highlight-menu-button:first-child .btn-highlight-menu {
    padding-left: 18px
}

.highlight-menu-button:last-child .btn-highlight-menu {
    padding-right: 18px
}

.highlight-menu-button .icons:before {
    color: #fff;
    font-size: 22px;
    line-height: 42px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15)
}

.highlight-menu-button.active .icons:before {
    color: #60d778
}

.highlight-menu-buttons .icons-link:before {
    position: relative;
    top: 1px
}

.highlight-menu-notes .icons-notes {
    position: relative
}

.highlight-menu-notes .icons-notes:before {
    font-size: 20px;
    line-height: 42px
}

.highlight-menu-notes .icons-notes:after {
    color: #262625;
    position: absolute;
    left: 0;
    right: 0;
    line-height: 37px;
    text-align: center;
    font-size: 14px
}

.browser-firefox .highlight-menu-notes .icons-notes:after {
    top: -29px
}

.highlight-menu .highlight-menu-arrow-clip {
    position: absolute;
    bottom: -11px;
    left: 50%;
    clip: rect(12px 24px 24px 0);
    margin-left: -12px
}

.highlight-menu .highlight-menu-arrow-clip .highlight-menu-arrow {
    display: block;
    width: 20px;
    height: 20px;
    -webkit-transform: rotate(45deg) scale(.5);
    -moz-transform: rotate(45deg) scale(.5);
    -ms-transform: rotate(45deg) scale(.5);
    -o-transform: rotate(45deg) scale(.5);
    transform: rotate(45deg) scale(.5);
    background-color: #454543;
    border: 2px solid #121211
}

.highlight-menu:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -3px;
    left: 50%;
    margin-left: -4px;
    width: 8px;
    height: 8px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #262625;
    box-shadow: 0 0 2px #262625
}

.highlight-menu-blockquote {
    position: relative
}

.highlight-menu-blockquote .icons-blockquote:before {
    width: 7px;
    display: block;
    overflow: hidden;
    margin-right: 8px
}

.highlight-menu-blockquote .icons-blockquote:after {
    position: absolute;
    left: 19px;
    top: 6px;
    width: 7px;
    overflow: hidden;
    font-size: 22px
}

.browser-firefox .icons-blockquote:before, .browser-firefox .icons-blockquote:after {
    text-indent: 1px
}

.bq-mode .icons-blockquote:before {
    color: #60d778
}

.pq-mode .icons-blockquote:before, .pq-mode .icons-blockquote:after {
    color: #60d778
}

.highlight-menu-linkinput {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.highlight-menu-linkinput-field {
    background: rgba(0, 0, 0, 0);
    position: absolute;
    top: 0;
    right: 40px;
    left: 10px;
    padding: 11px 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: none;
    outline: none;
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

.highlight-menu-linkinput .btn-highlight-menu {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 4px
}

.highlight-menu-linkmode .highlight-menu-buttons {
    visibility: hidden
}

.highlight-menu-linkmode .highlight-menu-linkinput {
    display: block;
    -webkit-animation: pop-upwards 180ms forwards linear;
    -moz-animation: pop-upwards 180ms forwards linear;
    -ms-animation: pop-upwards 180ms forwards linear;
    -o-animation: pop-upwards 180ms forwards linear;
    animation: pop-upwards 180ms forwards linear
}

[contenteditable] a {
    cursor: text
}

.highlight-menu-measure {
    display: inline-block;
    visibility: hidden
}

.highlight-menu-active {
    display: inline-block;
    visibility: visible;
    -webkit-transition: top .075s ease-out, left .075s ease-out;
    -moz-transition: top .075s ease-out, left .075s ease-out;
    -ms-transition: top .075s ease-out, left .075s ease-out;
    -o-transition: top .075s ease-out, left .075s ease-out;
    transition: top .075s ease-out, left .075s ease-out;
    -webkit-animation: pop-upwards 180ms forwards linear;
    -moz-animation: pop-upwards 180ms forwards linear;
    -ms-animation: pop-upwards 180ms forwards linear;
    -o-animation: pop-upwards 180ms forwards linear;
    animation: pop-upwards 180ms forwards linear
}

.highlight-menu-media .highlight-menu-button .icons:before {
    font-size: 28px;
    line-height: 38px
}

.inline-tooltip {
    position: absolute;
    left: 0;
    margin-top: -14px;
    top: -1000px;
    color: #57ad68;
    height: 30px;
    font-size: 12px;
    line-height: 18px;
    display: block;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: -webkit-transform .08s cubic-bezier(.2, .3, .25, .9);
    -moz-transition: -moz-transform .08s cubic-bezier(.2, .3, .25, .9);
    -o-transition: -o-transform .08s cubic-bezier(.2, .3, .25, .9);
    transition: transform .08s cubic-bezier(.2, .3, .25, .9)
}

.inline-tooltip-active {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
}

.inline-tooltip-control {
    cursor: pointer
}

.inline-media-overlay {
    position: absolute;
    top: 0;
    left: 0;
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .3s;
    -moz-transition: opacity .3s;
    -ms-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 900;
    display: none;
    cursor: move
}

.inline-media-overlay:hover {
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.inline-media-overlay>.icons-remove {
    position: absolute;
    right: 0;
    font-size: 30px;
    color: #fff;
    width: 42px;
    text-shadow: 0 0 30px rgba(0, 0, 0, 0.8)
}

.inline-media-overlay>.resize-inline-image {
    position: absolute;
    left: 15px;
    bottom: 5px;
    font-size: 30px;
    text-shadow: 0 0 30px rgba(0, 0, 0, 0.8)
}

.inline-media-overlay .btn {
    color: #fff;
    background: rgba(0, 0, 0, 0.3)
}

.inline-media-overlay .icons:before {
    color: #fff
}

.inline-media-overlay .icons-remove:before {
    margin: 0
}

.enlarge-btn, .shrink-btn {
    display: none
}

.enable-enlarge .enlarge-btn, .enable-shrink .shrink-btn {
    display: block
}

.inline-media-overlay .drag-messaging {
    position: absolute;
    width: 100%;
    top: 50%;
    margin-top: -8px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.8)
}

.welcome-wrapper {
    position: absolute;
    z-index: 100;
    height: 100%;
    width: 100%;
    background: #fff;
    text-align: center;
    display: block;
    padding: 100px 0 30px 0;
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.welcome-wrapper.hiding {
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition: opacity .5s linear;
    -moz-transition: opacity .5s linear;
    -ms-transition: opacity .5s linear;
    -o-transition: opacity .5s linear;
    transition: opacity .5s linear
}

.welcome-wrapper.hidden {
    display: none
}

.loader-label {
    line-height: 1.4;
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 400;
    font-style: normal;
    width: 320px;
    margin: 25px auto;
    color: rgba(0, 0, 0, 0.3)
}

.loading-indicator-wrapper {
    width: 50px;
    height: 50px;
    margin: 0 auto;
    -webkit-animation: spin 1s infinite linear;
    -moz-animation: spin 1s infinite linear;
    -ms-animation: spin 1s infinite linear;
    -o-animation: spin 1s infinite linear;
    animation: spin 1s infinite linear;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.loader {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 2px solid #57ad68;
    border-top-color: transparent;
    -webkit-border-radius: 29px;
    -moz-border-radius: 29px;
    border-radius: 29px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.promo-fill {
    background-color: #000
}

.promo-logo {
    display: block;
    font-size: 80px;
    line-height: 1.3
}

.promo-logo, .promo-title, .promo-description {
    color: #fff;
    text-align: center
}

.promo-title {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 32px;
    line-height: 1.3;
    max-width: 500px;
    margin: 0 auto
}

.promo-actions {
    margin: 30px 0 60px 0;
    text-align: center
}

.promo-image {
    width: 90%;
    max-width: 900px
}

.promo-title-jumbo {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    font-size: 67px;
    line-height: 1
}

.promo-part {
    padding: 100px 0
}

.promo-part-image {
    position: relative;
    max-height: 700px;
    background: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.promo-part-image>.align-block:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.8)));
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
    background-repeat: repeat-x;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#cc000000', GradientType=0)
}

.promo-part-image .promo-part-title {
    position: relative;
    color: #fff
}

.promo-part-image .promo-part-body {
    position: relative;
    color: rgba(0, 0, 0, 0.05)
}

.promo-part-title {
    font-size: 44px;
    line-height: 1.1
}

.promo-part-body {
    margin-top: 10px;
    font-size: 24px;
    color: rgba(0, 0, 0, 0.6)
}

.promo-part-body-large {
    font-size: 32px
}

.promo-part-image .promo-part-body {
    color: rgba(255, 255, 255, 0.65)
}

.promo-username {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: italic;
    display: block;
    margin-top: 15px
}

.promo-quote {
    position: relative;
    border-left: 5px solid #57ad68;
    padding-left: 20px;
    font-size: 24px;
    max-width: 350px;
    color: rgba(255, 255, 255, 0.85);
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal;
    margin-left: 100px
}

.promo-quote>cite {
    display: block;
    margin-top: 10px;
    font-size: 18px
}

.promo-job-list {
    display: inline-block;
    width: 80%;
    text-align: left
}

.promo-job-list>li {
    display: inline-block;
    margin-bottom: 10px;
    width: 50%
}

.promo-serif {
    font-family: "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
    letter-spacing: 0.01rem;
    font-weight: 400;
    font-style: normal
}

@media (max-height:700px){.promo-image {
        display: none
    }
}

@media (max-height:900px){.promo-image {
        max-width: 600px
    }
}

@media all and (max-width:680px) {
    .promo-quote {
        margin-left: 0
    }

    .promo-title-jumbo {
        font-size: 44px
    }

    .promo-part-title {
        font-size: 24px
    }

    .promo-quote, .promo-part-body {
        font-size: 16px
    }

    .promo-quote>cite {
        font-size: 14px
    }

    .promo-job-list>li {
        display: block;
        text-align: center;
        width: 100%
    }
}

@media all and (max-width:500px) {
    .promo-title-jumbo {
        margin-top: 40px
    }

    .promo-part-body-large, .promo-title {
        font-size: 18px
    }

    .welcome-wrapper {
        padding: 35px 5px 5px
    }

    .loader-label {
        width: 100%;
        font-size: 16px
    }

    .promo-part-image-pull-left {
        background-position: bottom left
    }

    .promo-part-image-pull-right {
        background-position: bottom right
    }

    .promo-part {
        padding: 50px 0
    }
}

.hero-espn {
    min-height: 80%;
    height: 800px
}

.hero-espn .hero-logo {
    margin-bottom: 50px;
    max-width: 140px;
    height: auto
}

.hero-espn .hero-title {
    font-size: 40px;
    margin-bottom: 25px;
    color: rgba(255, 255, 255, 0.85)
}

.hero-espn .hero-description {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    font-size: 24px;
    color: rgba(255, 255, 255, 0.65)
}

.hero-espn .hero-prompt {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 700;
    font-style: normal;
    margin: 15% 0 20px 0;
    font-size: 24px;
    color: rgba(255, 255, 255, 0.65);
    letter-spacing: -0.04em
}

.espn-previous-topics-title {
    font-size: 11px;
    text-transform: uppercase;
    margin: 160px 0 15px 0;
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: .2em
}

.espn-previous-topic {
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 15px 0
}

.espn-bucket {
    padding-bottom: 60px
}

.espn-bucket .bucket-label {
    color: rgba(255, 255, 255, 0.5);
    border-color: rgba(255, 255, 255, 0.2)
}

.espn-about {
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.6
}

.espn-about-link {
    text-decoration: underline
}

.espn-how-to-item {
    display: inline-block;
    vertical-align: top;
    width: 33%;
    margin-bottom: 30px;
    color: rgba(255, 255, 255, 0.65);
    text-align: center
}

.espn-how-to-two-col>.espn-how-to-item {
    width: 50%
}

.espn-how-to-number {
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    color: rgba(133, 246, 150, 0.5);
    width: 30px;
    height: 30px;
    line-height: 30px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%
}

.espn-how-to-icon {
    display: inline-block;
    width: 100%
}

.espn-how-to-icon:before {
    color: rgba(255, 255, 255, 0.2);
    font-size: 84px;
    line-height: inherit
}

.espn-how-to-action {
    color: rgba(87, 173, 104, 0.8);
    text-decoration: underline
}

.espn-how-to-link:hover .espn-how-to-number {
    color: #57ad68;
    border-color: #fff
}

.espn-how-to-link:hover .espn-how-to-icon:before {
    color: rgba(255, 255, 255, 0.85)
}

.espn-how-to-link:hover .espn-how-to-action {
    color: #57ad68
}

.espn-footer {
    border-color: rgba(255, 255, 255, 0.2)
}

.espn-footer .btn-link {
    color: rgba(255, 255, 255, 0.65)
}

.espn-footer .btn-link:hover {
    color: #fff
}

@media screen and (max-width:680px) {
    .espn-how-to-item {
        width: 50%
    }
}

@media screen and (max-width:400px) {
    .espn-how-to-item, .espn-how-to-two-col>.espn-how-to-item {
        width: 100%
    }
}

.hero-mobile-app {
    height: 100%
}

.hero-mobile-app .layout-single-column {
    width: 36%;
    max-width: 700px;
    right: 20%;
    position: relative
}

.hero-mobile-app .hero-title, .hero-mobile-app .hero-description {
    font-family: "jaf-bernino-sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    letter-spacing: -0.02em;
    font-weight: 300;
    font-style: normal;
    text-align: left
}

.hero-mobile-app .hero-title {
    font-size: 44px;
    margin: 0 0 10px;
    line-height: 1.2
}

.hero-mobile-app .hero-description {
    color: rgba(0, 0, 0, 0.3);
    font-size: 24px;
    line-height: 1.3;
    margin: 0 0 40px 0;
    padding: 0
}

.hero-mobile-app .hero-actions {
    text-align: left
}

.mobile-app {
    background-color: #fff
}

.mobile-app-phone {
    width: 320px;
    height: 568px;
    text-align: center;
    position: absolute;
    top: 50%;
    margin-top: -342px;
    left: 56%;
    padding: 118px 100px;
    background-size: 384px 797px;
    background-repeat: no-repeat;
    background-position: top center
}

.mobile-app-screens {
    background-color: rgba(0, 0, 0, 0.9);
    height: 568px;
    width: 320px;
    position: relative;
    overflow: hidden
}

.mobile-app-screens .mobile-app-screen {
    position: absolute;
    top: 0;
    left: 0;
    height: 568px;
    width: 320px
}

.mobile-app-screens .mobile-app-screen:nth-child(1) {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    filter: alpha(opacity=100);
    -khtml-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-animation: mobile-app-screen-one-cycle 30s ease-in-out infinite;
    -moz-animation: mobile-app-screen-one-cycle 30s ease-in-out infinite;
    -ms-animation: mobile-app-screen-one-cycle 30s ease-in-out infinite;
    -o-animation: mobile-app-screen-one-cycle 30s ease-in-out infinite;
    animation: mobile-app-screen-one-cycle 30s ease-in-out infinite
}

.mobile-app-screens .mobile-app-screen:nth-child(2) {
    -webkit-transform: translate3d(320px, 0, 0);
    -moz-transform: translate3d(320px, 0, 0);
    -ms-transform: translate3d(320px, 0, 0);
    -o-transform: translate3d(320px, 0, 0);
    transform: translate3d(320px, 0, 0);
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-animation: mobile-app-screen-two-cycle 30s ease-in-out infinite;
    -moz-animation: mobile-app-screen-two-cycle 30s ease-in-out infinite;
    -ms-animation: mobile-app-screen-two-cycle 30s ease-in-out infinite;
    -o-animation: mobile-app-screen-two-cycle 30s ease-in-out infinite;
    animation: mobile-app-screen-two-cycle 30s ease-in-out infinite
}

.mobile-app-screens .mobile-app-screen:nth-child(3) {
    -webkit-transform: translate3d(320px, 0, 0);
    -moz-transform: translate3d(320px, 0, 0);
    -ms-transform: translate3d(320px, 0, 0);
    -o-transform: translate3d(320px, 0, 0);
    transform: translate3d(320px, 0, 0);
    filter: alpha(opacity=0);
    -khtml-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-animation: mobile-app-screen-three-cycle 30s ease-in-out infinite;
    -moz-animation: mobile-app-screen-three-cycle 30s ease-in-out infinite;
    -ms-animation: mobile-app-screen-three-cycle 30s ease-in-out infinite;
    -o-animation: mobile-app-screen-three-cycle 30s ease-in-out infinite;
    animation: mobile-app-screen-three-cycle 30s ease-in-out infinite
}

.mobile-app-screens .mobile-app-screen .mobile-app-screen-image {
    width: 100%;
    height: 100%
}

@-webkit-keyframes mobile-app-screen-one-cycle {
    2% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    32% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    35% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    97% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    98% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes mobile-app-screen-one-cycle {
    2% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    32% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    35% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    97% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    98% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes mobile-app-screen-one-cycle {
    2% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    32% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    35% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    97% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    98% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes mobile-app-screen-one-cycle {
    2% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    32% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    35% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    97% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    98% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-webkit-keyframes mobile-app-screen-two-cycle {
    31% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    32% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    65% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    68% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    99% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-moz-keyframes mobile-app-screen-two-cycle {
    31% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    32% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    65% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    68% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    99% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-o-keyframes mobile-app-screen-two-cycle {
    31% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    32% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    65% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    68% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    99% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@keyframes mobile-app-screen-two-cycle {
    31% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    32% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    34% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    65% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    68% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    99% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    100% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }
}

@-webkit-keyframes mobile-app-screen-three-cycle {
    1% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    64% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    65% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    98% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-moz-keyframes mobile-app-screen-three-cycle {
    1% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    64% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    65% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    98% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@-o-keyframes mobile-app-screen-three-cycle {
    1% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    64% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    65% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    98% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@keyframes mobile-app-screen-three-cycle {
    1% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    64% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=0);
        -khtml-opacity: 0;
        -moz-opacity: 0;
        opacity: 0
    }

    65% {
        -webkit-transform: translate3d(320px, 0, 0);
        -moz-transform: translate3d(320px, 0, 0);
        -ms-transform: translate3d(320px, 0, 0);
        -o-transform: translate3d(320px, 0, 0);
        transform: translate3d(320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    67% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    98% {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }

    100% {
        -webkit-transform: translate3d(-320px, 0, 0);
        -moz-transform: translate3d(-320px, 0, 0);
        -ms-transform: translate3d(-320px, 0, 0);
        -o-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        filter: alpha(opacity=100);
        -khtml-opacity: 1;
        -moz-opacity: 1;
        opacity: 1
    }
}

@media screen and (min-height:820px) {
    .mobile-app-phone {
        margin-top: -402px
    }
}

@media screen and (max-width:1200px) {
    .mobile-app-phone {
        left: 50%
    }
}

@media screen and (max-width:1000px) {
    .hero-mobile-app .layout-single-column {
        width: 50%;
        right: 20%
    }
}

@media screen and (max-width:800px) {
    .hero-mobile-app {
        padding: 120px 0 60px;
        height: auto
    }

    .hero-mobile-app .layout-single-column {
        width: auto;
        right: 0;
        margin-left: 80px;
        margin-right: 80px
    }

    .hero-mobile-app .hero-title, .hero-mobile-app .hero-description,
    .hero-mobile-app .hero-actions {
        text-align: center
    }

    .mobile-app-phone {
        position: relative;
        top: 0;
        left: 0;
        margin: 0 auto;
        padding-bottom: 0;
        overflow: hidden
    }

    .hero-mobile-app .hero-title {
        font-size: 24px
    }

    .hero-mobile-app .hero-description {
        font-size: 16px;
        margin: 0 0 30px 0
    }
}

@media screen and (max-width:800px) {
    .hero-mobile-app {
        padding: 100px 0 60px
    }

    .hero-mobile-app .layout-single-column {
        margin-left: 20px;
        margin-right: 20px
    }

    .hero-mobile-app .hero-title {
        font-size: 30px;
        margin-bottom: 6px
    }

    .hero-mobile-app .hero-description {
        font-size: 16px
    }

    .mobile-app-phone {
        -webkit-transform: scale(.75);
        -moz-transform: scale(.75);
        -ms-transform: scale(.75);
        -o-transform: scale(.75);
        transform: scale(.75);
        padding: 118px 0 0;
        width: auto;
        margin: -90px -40px
    }

    .mobile-app-screens {
        margin: 0 auto
    }
}