/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

/**
 * Remove default margin.
 */
body {
    margin: 0;
}

/* HTML5 display definitions
     ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
    display: none;
}

/* Links
     ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
    background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
    outline: 0;
}

/* Text-level semantics
     ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
    font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
    font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
    background: #ff0;
    color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* Embedded content
     ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
    border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
    overflow: hidden;
}

/* Grouping content
     ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
    margin: 1em 2.5rem;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
    box-sizing: content-box;
    height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
    overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

svg {
    pointer-events: none;
}

/* Forms
     ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
    color: inherit;
    /* 1 */
    font: inherit;
    /* 2 */
    margin: 0;
    /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
    overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
    line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    box-sizing: content-box;
    /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 0.125rem;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
    overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
    font-weight: bold;
}

/* Tables
     ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

td,
th {
    padding: 0;
}

.icon-l .fa {margin-right:10px;}
.icon-r .fa {margin-left:10px;}
.scroller {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.scroller:hover .scroller__pane {
    opacity: 0.99;
}

.scroller__content {
    position: absolute;
    overflow: scroll;
    overflow-x: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.scroller__content:focus {
    outline: thin dotted;
}

.scroller__content::-webkit-scrollbar {
    display: none;
}

.has-scrollbar .scroller__content::-webkit-scrollbar {
    display: block;
}

.scroller__pane {
    position: absolute;
    width: 10px;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: .01;
    -webkit-transition: .2s;
    transition: .2s;
    border-radius: 0.3125rem;
}

.scroller__pane.active, .scroller__pane.flashed {
    opacity: 0.99;
}

.scroller__slider {
    background: #444;
    background: rgba(138, 150, 160, 0.4);
    position: relative;
    margin: 0 0.0625rem;
    border-radius: 0.1875rem;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0) scale(1);
                transform: rotate(0) scale(1);
    }
    50% {
        -webkit-transform: rotate(180deg) scale(0.6);
                transform: rotate(180deg) scale(0.6);
    }
    100% {
        -webkit-transform: rotate(360deg) scale(1);
                transform: rotate(360deg) scale(1);
    }
}

@keyframes rotate {
    0% {
        -webkit-transform: rotate(0) scale(1);
                transform: rotate(0) scale(1);
    }
    50% {
        -webkit-transform: rotate(180deg) scale(0.6);
                transform: rotate(180deg) scale(0.6);
    }
    100% {
        -webkit-transform: rotate(360deg) scale(1);
                transform: rotate(360deg) scale(1);
    }
}

@-webkit-keyframes scale {
    30% {
        -webkit-transform: scale(0.3);
                transform: scale(0.3);
    }
    100% {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

@keyframes scale {
    30% {
        -webkit-transform: scale(0.3);
                transform: scale(0.3);
    }
    100% {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

/* reset browsers */
* {
    box-sizing: border-box;
}

*::before, *::after {
    box-sizing: border-box;
}

* ::-moz-selection {
    background: #37bf91;
    color: #fff;
}

* ::selection {
    background: #37bf91;
    color: #fff;
}

form, fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

img {
    border: 0;
    max-width: 100%;
    height: auto;
}

input, select, textarea, button {
    border: 0;
    padding: 0;
    margin: 0;
    outline: 0;
    border-radius: 0;
}

button {
    cursor: pointer;
    background: transparent;
    outline: 0;
}

h1, h2, h3, h4, h5, p, strong {
    margin: 0;
    padding: 0;
}

ul, ol, li {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    color: #4a545a;
    text-decoration: none;
}

a:hover {
    color: #37bf91;
    text-decoration: none;
}

/* placeholder cross-browser */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #8a96a0;
}

input:-moz-placeholder, textarea:-moz-placeholder {
    color: #8a96a0;
    opacity: 1;
}

input::-moz-placeholder, textarea::-moz-placeholder {
    color: #8a96a0;
    opacity: 1;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
    color: #8a96a0;
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
    color: transparent;
}

input:focus:-moz-placeholder, textarea:focus:-moz-placeholder {
    color: transparent;
}

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
    color: transparent;
}

input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {
    color: transparent;
}

input.placeholder, textarea.placeholder {
    color: #8a96a0 !important;
}

/* general styles */
html, body {
    height: 100%;
}

body {
    color: #4a545a;
    background-color: #eef2f5;
    min-width: 320px;
    /* text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased; */
}

html {
    font-size: 1rem;
}

body {
    font-size: 0.875rem;
    line-height: 1.375em;
    font-family: "Montserrat", Arial, sans-serif;
}

/* container */
.container:before,
.container:after{
    content: ' ';
    display: table;
}
.container:after{
    clear: both;
}
.container {
    margin: auto;
    padding: 0 10px;
    zoom: 1;
}
.container--small {
    max-width: 1044px;
}

.page__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            -webkit-flex-direction: column;
            flex-direction: column;
    min-height: 100vh;
    -webkit-overflow-scrolling: touch;
    position: relative;
    z-index: 2;
    background-color: #ecf0f3;
    box-shadow: -3px 0 0 #37bf91;
    overflow-x: hidden;
}

.page__wrapper::after {
    position: absolute;
    left: 0;
    top: 27px;
    z-index: 20;
    content: '';
    width: 0;
    height: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent;
    border-left-width: 10px;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
}

.page__wrapper.js-filter-is-visible {
    -webkit-animation: open .5s ease-in-out;
            animation: open .5s ease-in-out;
    left: 240px;
    box-shadow: -3px 0 0 #37bf91, inset 0 0 15px rgba(0, 0, 0, 0.1);
}

.page__wrapper.js-filter-is-visible::after {
    border-left-color: #37bf91;
}

.page__wrapper.js-filter-is-hidden {
    -webkit-transform: none;
            -ms-transform: none;
            transform: none;
    -webkit-animation: close .3s ease-in-out;
            animation: close .3s ease-in-out;
}

.page__main {
    -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
            -webkit-flex: 1 0 auto;
            flex: 1 0 auto;
}

.page__header, .page__footer {
    -ms-flex-negative: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
}

@-webkit-keyframes close {
    0% {
        left: 240px;
    }
    100% {
        left: 0;
    }
}

@keyframes close {
    0% {
        left: 240px;
    }
    100% {
        left: 0;
    }
}

@-webkit-keyframes open {
    0% {
        left: 0;
    }
    70% {
        left: 260px;
    }
    100% {
        left: 240px;
    }
}

@keyframes open {
    0% {
        left: 0;
    }
    70% {
        left: 260px;
    }
    100% {
        left: 240px;
    }
}

.header {
    background-color: #fff;
    padding: 0.625rem 0;
}

.navbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
    margin: 0 0 0 -0.9375rem;
}

.navbar__logo, .navbar__search, .navbar__toggler {
    margin: 0 0 0 0.9375rem;
}

.navbar__search {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            -webkit-flex-grow: 1;
            flex-grow: 1;
}

.navbar__toggler {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
}

.toggler {
    font-size: 1.45rem;
    color: #8a96a0;
    min-width: 40px;
    min-height: 40px;
    text-align: center;
    background: #dde3e7;
    border-radius: 6px;
}

.toggler.js-filter-is-visible {
    color: #37bf91;
}

.toggler__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
}
.breadcrumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
}

.breadcrumb__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
}

.breadcrumb__item::before {
    display: block;
    padding: 0 0.3125rem;
    color: #818a91;
    content: ">";
}

.breadcrumb__item:first-child::before {
    display: none;
}

.breadcrumb__link {
    font-size: 1.125rem;
    color: #8a96a0;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.breadcrumb__link--active {
    color: #4a545a;
}

.btn-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: 0 0 0 -0.125rem;
}

.btn-group__label {
    color: #8a96a0;
    -ms-flex-item-align: center;
        -webkit-align-self: center;
        -ms-grid-row-align: center;
        align-self: center;
    margin: 0.125rem 0.625rem 0 0.125rem;
}

.btn-group--columns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            -webkit-flex-direction: column;
            flex-direction: column;
}

.btn-group__item, .cats a {
    margin: 0 0 0 0.125rem;
}

.btn, .cats a {
    font-weight: 400;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    border-radius: 0.125rem;
    font-size: 0.75rem;
    padding: 0.9375rem 1.25rem;
    display: block;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    overflow: hidden;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.btn::before, .cats a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-transform: scale(0.5, 1);
    -ms-transform: scale(0.5, 1);
    transform: scale(0.5, 1);
}

.btn:hover, .btn:active, .btn:focus, .cats a:focus, .cats a:active, .cats a:hover{
    color: #fff;
}

.btn:hover::before, .btn:active::before, .btn:focus::before, .cats a:hover::before, .cats a:active::before, .cats a:focus::before {
    opacity: 1;
    -webkit-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            transform: scale(1, 1);
}

.btn.is-active {
    color: #fff;
}

.btn.is-active::before {
    opacity: 1;
    -webkit-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            transform: scale(1, 1);
}

.btn.is-fav {
    color: #37bf91;
}

.btn--primary, .cats a {
    background-color: #dde3e7;
    color: #8a96a0;
}

.btn--primary::before, .cats a::before {
    background-color: #37bf91;
}

.btn--success {
    background-color: #37bf91;
    color: #fff;
}

.btn--success::before {
    background-color: #25b383;
}

.btn--link {
    background-color: transparent;
    color: #8a96a0;
}

.btn--link::before {
    background-color: #8a96a0;
}

.btn--icon {
    background-color: #dde3e7;
    color: #8a96a0;
    font-size: 2rem;
    padding: 0.4375rem;
}

.btn--icon::before {
    display: none;
}

.btn--icon:hover, .btn--icon:active, .btn--icon:focus, .btn--icon.voted, .btn--icon.open {
    color: #37bf91;
}

.btn--dislike:hover, .btn--dislike:active, .btn--dislike:focus, .btn--dislike.voted {
    color: #eb0000;
}

.btn--icon.disabled:hover, .btn--icon.disabled:active, .btn--icon.disabled:focus, .btn--dislike.disabled:hover, .btn--dislike.disabled:active, .btn--dislike.disabled:focus {
    color: #8a96a0;
    cursor: default;
}

.btn--sm, .cats a{
    padding: 0.625rem;
    font-size: 0.625rem;
	margin-bottom: 2px;
}

.btn--center {
    text-align: center;
}

.btn .flag-icon {
    font-size: 1rem;
    margin-right: 10px;
}

.cards__list #dle-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: -0.375rem;
}

.cards__item {
    width: 25%;
    padding: 0.375rem;
    position: relative;
}

.cards__item.active::before {
    position: absolute;
    z-index: 10;
    left: 6px;
    right: 6px;
    top: 6px;
    bottom: 6px;
    background-color: rgba(0, 0, 0, 0.4);
    content: '';
}

.cards__delete {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 30px;
    height: 30px;
    z-index: 11;
}

.cards__delete input[type="checkbox"] {
    -webkit-appearance: checkbox;
       -moz-appearance: checkbox;
            appearance: checkbox;
    width: 20px;
    height: 20px;
}

.submit {
    margin: 0.625rem auto;
}

.submit[disabled] {
    opacity: .5;
}

.card {
    display: block;
}

.card__content {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    display: block;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

.card__content:hover .card__image, .card__content:active .card__image, .card__content:focus .card__image {
    opacity: 0.8;
    -webkit-transform: scale3d(1.2, 1.2, 1);
            transform: scale3d(1.2, 1.2, 1);
}

.card__content:hover .card__icon, .card__content:active .card__icon, .card__content:focus .card__icon {
    -webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);
            transform: translate(-50%, -50%) scale3d(1, 1, 1);
    opacity: 1;
    visibility: visible;
}

.card__image {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 1;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

.card__icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) scale3d(0.4, 0.4, 1);
            transform: translate(-50%, -50%) scale3d(0.4, 0.4, 1);
    z-index: 2;
    font-size: 3.1rem;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s;
    transition: all .3s;
}

.card__label {
    display: block;
    position: absolute;
    z-index: 2;
    padding: 0.3125rem;
    font-size: 0.75rem;
    line-height: 1;
    border-radius: 0.125rem;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}

.card__label--primary {
    color: #1d232a;
    background-color: rgba(255, 255, 255, 0.8);
    bottom: 10px;
    left: 10px;
}
.card__label--hd {
    color: #fff;
    background-color: rgba(255, 18, 18, 0.7);
    top: 10px;
    left: 10px;
    font-size: 0.6875rem;
}

.card__label--success {
    right: 10px;
    bottom: 10px;
    color: #fefefe;
    background-color: rgba(55, 191, 145, 0.8);
}

.card__footer {
    background-color: #fff;
    display: block;
    box-shadow: 0 2px 0 #d9e1e7;
}

.card__title {
    padding: 0.625rem;
    -webkit-transition: color .3s;
    transition: color .3s;
    min-height: 58px;
    display: block;
}

.card__info {
    border-top: 1px dashed #dbe0e4;
    padding: 0.3125rem 0.625rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
}

.card__text {
    font-size: 0.625rem;
    color: #8a96a0;
}

.copyright__text {
    font-size: 0.6875rem;
    line-height: 1.5rem;
    color: #545d65;
    text-align: center;
}

.copyright__mark {
    color: #8a96a0;
}

.list__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
    padding: 0.5625rem 0.9375rem;
    -webkit-transition: background .3s, color .3s;
    transition: background .3s, color .3s;
}

.list__link:hover, .list__link:active, .list__link:focus {
    background-color: #37bf91;
}

.list__link:hover .list__title, .list__link:hover .list__count, .list__link:active .list__title, .list__link:active .list__count, .list__link:focus .list__title, .list__link:focus .list__count {
    color: #fff;
}

.list__title {
    font-size: 0.875rem;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.list__count {
    font-size: 0.75rem;
    color: #abb3b7;
    margin: 0 0 0 0.625rem;
}

.logo__link {
    font-size: 1.5rem;
    font-weight: 700;
    color: #8a96a0;
    display: block;
    white-space: nowrap;
    -webkit-transition: color .3s;
    transition: color .3s;
}

.logo__mark {
    color: #4a545a;
    display: inline-block;
}

.filter {
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    width: 240px;
    height: 100vh;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    opacity: 0;
    -webkit-transform: translate3d(5%, 0, 0) scale(0.97);
            transform: translate3d(5%, 0, 0) scale(0.97);
}

.filter{display:none}.loaded .filter{display:block}.loaded .page__wrapper{opacity:1!important}

.filter.js-filter-is-visible {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0) scale(1);
            transform: translate3d(0, 0, 0) scale(1);
    -webkit-animation: slideIn .35s ease-in-out;
            animation: slideIn .35s ease-in-out;
}

.filter.js-filter-is-hidden {
    opacity: .3;
    -webkit-transform: translate3d(5%, 0, 0) scale(0.97);
            transform: translate3d(5%, 0, 0) scale(0.97);
    -webkit-animation: slideOut .3s ease-in-out;
            animation: slideOut .3s ease-in-out;
}

.form__group {
    margin: 0 0 0.9375rem;
}

.form__group:last-child {
    margin: 0;
}

.form__label {
    margin: 0 0 0.4375rem;
}

.form__hint {
    color: #8a96a0;
    font-size: 0.75rem;
    margin: 0.375rem 0 0;
}

.form__columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: start;
        -ms-flex-align: start;
            -webkit-align-items: flex-start;
            align-items: flex-start;
}

.form__columns .form__action {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            flex: 1 1 auto;
    padding: 0 0.625rem 0 0;
}

.field {
    color: #8a96a0;
    font-size: 0.75rem;
    width: 100%;
    height: 45px;
    display: block;
    padding: 0 1.25rem;
    background-color: #eef2f5;
    border-radius: 0.1875rem;
    -webkit-transition: box-shadow .3s;
    transition: box-shadow .3s;
}

.field:focus {
    box-shadow: 0 0 2px rgba(55, 191, 145, 0.9);
}

.field--search {
    padding-right: 0;
    padding-left: 20px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.field--search:focus {
    box-shadow: none;
    border-color: transparent;
}

.player {
    position: relative;
    background-color: #fff;
}

.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame 
{max-width:100% !important; display:block; width:100%; height:560px;}
.mejs-container {max-width:100% !important;}
@media screen and (max-width: 950px) {
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:420px;}
}
@media screen and (max-width: 760px) {
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:350px;}
}
@media screen and (max-width: 590px) {
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:300px;}
}
@media screen and (max-width: 470px) {
.video-box embed, .video-box object, .video-box video, .video-box iframe, .video-box frame {height:250px;}
}

/* COMMENTS
----------------------------------------------- */
.addc {margin-bottom:20px;}
.sect-title {font-size: 16px;}
.sect-link {display:inline-block; padding:5px 10px; border-radius:4px; cursor:pointer; 
background-color:#37bf91; color:#fff; margin-left:15px}
.sect-link:hover {background:#46e4af; color:#fff}
.add-comms {padding:15px 0; margin-bottom:30px; display:none}
.ac-inputs input {width:48.5% !important; margin-bottom:15px}
.ac-textarea textarea {height:100px; margin-bottom:15px}
.add-comms input,.add-comms textarea,.ac-submit button {}
.ac-protect,.ac-textarea .bb-editor+br {display:none}
.comments_subscribe input {margin-right:10px}
.comments_subscribe {display:block}
.mass_comments_action {padding:10px; margin:20px 0 0; text-align:right}
.last-comm-link {font-size:16px; margin-bottom:10px; text-decoration:underline}

.comm-item {padding-left:60px; margin-bottom:15px;}
.comm-left {width:40px; height:40px; margin-left:-60px; float:left; border-radius:50%;}
.comm-right {width:100%; float:right; background-color:#eef2f5; padding:10px; position:relative;}
.comm-right:after {right: 100%; top:10px; border: solid transparent; content: " "; height: 0; width: 0;
position: absolute; border-color: rgba(255, 255, 255, 0); border-right-color: #eef2f5; border-width: 10px;}
.comm-one {padding:0 80px 5px 0; position:relative; font-size:12px;}
.comm-one > span:nth-child(4) {float:right; margin-right:0;}
.comm-one > span {float:left; margin-right:20px;}
.comm-author {font-weight:700; color: #008bcc;}
.comm-author a {color: #008bcc;}
.rate3-comm {position:absolute; right:0; top:0; white-space:nowrap; font-size:16px;}
.rate3-comm a {cursor:pointer; height:20px; line-height:20px; display:inline-block; font-size:14px;
color:#0aa80a; margin:0 5px 0 0; vertical-align:top}
.rate3-comm a:last-child {color:#d00e0e; margin:0 0 0 5px;}
.rate3-comm a:hover {opacity:0.5;}
.rate3-comm > span {height:20px; line-height:20px; display:inline-block; font-size:11px; font-weight:700; vertical-align:top;}
.rate3-comm > span > span.ratingtypeplus {color: #06b601;}
.rate3-comm > span > span.ratingplus {color: #95c613;}
.rate3-comm > span > span.ratingminus {color: #ff0e0e;}
.comm-two {}
.signature {font:italic 12px Georgia, "Times New Roman", Times, serif; margin-top:10px; padding-top:10px; 
border-top:1px dashed #000;}
.comm-three {margin-top:10px; font-size:12px; text-align:right;}
.comm-three li {display:inline-block; margin-left:10px; line-height: 20px;}
.comm-three a {display: inline-block; vertical-align: middle; 
	border: 1px solid transparent; line-height: 18px; height: 20px;}
.comm-three li:first-child {margin-left:0px; float:left;}
.comm-three li:first-child a {border: 1px solid #e3e3e3; padding: 0 5px; border-radius: 3px; text-decoration: none;}

@media screen and (max-width:760px) {
.comments-tree-list .comments-tree-list {padding-left:0!important}
.comments-tree-list .comments-tree-list:before {display:none}
.mass_comments_action {display:none}
}

@media screen and (max-width:590px) {
.comm-one > span:not(:first-child) {display: none;}
.ac-inputs input {width:100% !important;}
.ui-dialog {width:100%!important}
.upop-left,.upop-right {float:none!important; width:100%!important; margin:0; padding:0 20px}
.upop-left {margin-bottom:10px; text-align:center}
.ui-dialog-buttonset button {display:block; margin:0 0 5px; width:100%}
#dofullsearch,#searchsuggestions span.seperator {display:none!important}
.attach .download-link {margin:0 -15px 0 0; float:none; display:block; padding:0 10px}
.attach-info {float:none}
}

.search__frame {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.search__field {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0%;
            -webkit-flex: 1 1 0%;
            flex: 1 1 0%;
}

.search__btn {
    width: 50px;
    height: 45px;
    -ms-flex-negative: 0;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    background-color: #eef2f5;
    font-size: 1.375rem;
    color: #8a96a0;
    -webkit-transition: background-color .25s, color .25s;
    transition: background-color .25s, color .25s;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.search__btn:hover, .search__btn:active, .search__btn:focus {
    color: #fff;
    background-color: #37bf91;
}

.search__btn:hover .search__icon, .search__btn:active .search__icon, .search__btn:focus .search__icon {
    -webkit-transform: scale(1.2);
            -ms-transform: scale(1.2);
            transform: scale(1.2);
}

.search__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
    -webkit-transition: -webkit-transform .25s;
    transition: -webkit-transform .25s;
    transition: transform .25s;
    transition: transform .25s, -webkit-transform .25s;
}

.spots {
    box-shadow: 0 2px 0 #d9e1e7;
    background-color: #fff;
    padding: 1.875rem;
    width: 100%;
    margin: 1.875rem 0;
}

.spots--cards {
    margin: 1.5rem 0.375rem;
}

.spots__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: -0.625rem;
}

.spots__item {
    padding: 0.625rem;
    width: 300px;
}

.heading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
    margin: 1.875rem 0 0.9375rem;
}

.heading__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
}

.heading__item:last-child {
    -ms-flex-negative: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
}

.heading--line {
    padding: 0.625rem 0.9375rem;
    border-bottom: 1px dashed #dbe0e4;
    margin-bottom: 0.625rem;
    margin-top: 0.3125rem;
}

.heading__title {
    font-weight: 400;
    color: #4a545a;
    font-size: 1.125rem;
}

.heading__sub {
    color: #8a96a0;
}


.label {
    color: #4a545a;
    font-size: 0.875rem;
    font-weight: 400;
    cursor: pointer;
}
.label::after {
    content: ':';
}
.label--required::after {
    content: ' (*):';
}
.trailer__heading {
    font-size: 1.125rem;
    font-weight: 400;
}

.trailer__info {
    background-color: #fff;
    padding: 0 0.625rem;
}

.trailer__spot {
    text-align: center;
    overflow: hidden;
}

.trailer__row {
    border-top: 1px dashed #dbe0e4;
    padding: 0.9375rem 0;
}

.trailer__row:first-child {
    border-top: 0;
}

.trailer__tools {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin: 0 -0.625rem;
}

.trailer__tool {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-negative: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
    padding: 0 0.625rem;
    -webkit-box-align: start;
        -ms-flex-align: start;
            -webkit-align-items: flex-start;
            align-items: flex-start;
}

.trailer__tool .details {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 0%;
            -webkit-flex: 1 1 0%;
            flex: 1 1 0%;
}

.trailer__tool:last-child {
    position: relative;
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            -webkit-flex: 1 1 auto;
            flex: 1 1 auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
                -ms-grid-row-align: center;
            -webkit-align-items: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
}

.trailer__tool:last-child::before {
    top: -15px;
    bottom: -15px;
    content: '';
    position: absolute;
    left: 0;
    border: 1px dashed #dbe0e4;
}

.trailer__cols {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: -0.625rem 0 0 0;
}

.trailer__col {
    margin: 0.625rem 0 0 0;
    overflow: hidden;
}

.rate-bar {width:100%; min-height:6px; height:6px; border-radius:4px; overflow:hidden; 
position:absolute; background-color:red; left: 0; right: 0; bottom: 0;}
.rate-fill {width:50%; height:100%; position:absolute; left:0; top:0; background-color:#37bf91; transition:width 1s linear;}

.details__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin: -0.625rem;
    -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
}

.details__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            -webkit-flex-direction: column;
            flex-direction: column;
    padding: 0.625rem;
}

.details__label {
    font-weight: 400;
    color: #8a96a0;
    margin: 0 0 0.3125rem;
}

.details__value {
    font-weight: 400;
    color: #4a545a;
    font-size: 1.125rem;
}

.rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.rating__counter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
	position: relative;
	min-width: 90px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            -webkit-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            -webkit-justify-content: space-between;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
    margin: 0 0 0 0.625rem;
}
.rate-data {display:none;}
.th-percent {opacity: 0;}
.wdone {opacity: 1;}
.th-percent.high{background-color: rgba(55, 191, 145, 0.8);}
.th-percent.low{background-color: rgba(255, 56, 56, 0.65);}
.rating__text {
    color: #4a545a;
    font-size: 1.5rem;
    font-weight: 400;
}

.fshare {background-color: #fff; padding-top: 20px; display: none;}
.fshare-capt, .fshare textarea {margin-bottom: 10px;}
.fshare textarea {padding: 10px; height: auto; font-size: 14px; overflow: hidden;}

.footer {
    padding: 1.875rem 0 1rem;
    background-color: #1d232a;
    margin: .9375rem 0 0 0;
}

.count {
    text-align: center;
    padding-top: 10px;
}
.count span {
    margin-right: 5px;
}

@media (max-width: 75.625em){
    .cards__item {
        width: 33.3333%;
    }
}

@media (max-width: 64em){
    .cards__item {
        width: 50%;
    }
}
@media (max-width: 48em){
    .navbar{
        -ms-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
        margin: 0;
        justify-content: space-between;
    }
    .navbar__logo, .navbar__search, .navbar__toggler{
        margin: 0;
    }
    .navbar__logo{
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                -webkit-flex-grow: 1;
                flex-grow: 1;
        text-align: center;
        width: 100%;
        margin-bottom: 1.125rem;
    }
    .navbar__search{
        -ms-flex-preferred-size: 100%;
            -webkit-flex-basis: 100%;
            flex-basis: 100%;
        margin: 0.625rem 0 0 0;
        width: 100%;
        display: none;
        order: 10;
    }
    .navbar__toggler{
        -webkit-box-ordinal-group: 5;
            -ms-flex-order: 4;
                -webkit-order: 4;
                order: 4;
    }
    .field--name{
        width: 100%;
    }
    .heading{
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                -webkit-justify-content: center;
                justify-content: center;
        margin: 1.25rem 0 0.75rem;
        -ms-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
    }
    .heading__item{
        -ms-flex-preferred-size: 100%;
            -webkit-flex-basis: 100%;
            flex-basis: 100%;
    }
    .heading__item:first-child{
        margin: 0 0 0.75rem;
    }
    .trailer__tools{
        -ms-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
    }
    .trailer__tool{
        width: 100%;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                -webkit-justify-content: center;
                justify-content: center;
    }
    .trailer__tool:last-child{
        width: 100%;
        margin: 0.625rem 0 0;
    }
    .rating{
        -ms-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                -webkit-flex-direction: column;
                flex-direction: column;
        width: 100%;
    }
    .rating .btn-group{
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                -webkit-justify-content: space-between;
                justify-content: space-between;
    }
    .rating__counter{
        -ms-flex-wrap: wrap;
            -webkit-flex-wrap: wrap;
            flex-wrap: wrap;
        margin: 0;
    }
    .rating__text{
        margin: 0 0 0.625rem;
    }
}

@media (max-width: 30em){
    .cards__item{
        width: 100%;
    }
    .form__columns{
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                -webkit-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                    -ms-grid-row-align: stretch;
                -webkit-align-items: stretch;
                align-items: stretch;
    }
    .form__columns .form__action{
        padding: 0 0 0.625rem;
    }
}

.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  transition: opacity .15s linear;
}
.fade.in {
  opacity: 1;
}
.btn__text {
    transition: opacity .2s;
}
@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4)
    }
    20% {
        -webkit-transform: scaleY(1.0)
    }
}
@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }
    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}
.hidden {
    display: none;
}
.page__header {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s, -webkit-transform .5s;
}
.page__header.js-filter-is-visible {
    -webkit-animation: open .5s ease-in-out;
            animation: open .5s ease-in-out;
    left: 240px;
    box-shadow: -3px 0 0 #37bf91, inset 0 0 15px rgba(0, 0, 0, 0.1);
}
.page__header.js-filter-is-hidden {
    -webkit-transform: none;
            -ms-transform: none;
            transform: none;
    -webkit-animation: close .3s ease-in-out;
            animation: close .3s ease-in-out;
}
.scroll-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 1040;
    -webkit-transition: opacity 0.2s ease-out;
    transition: opacity 0.2s ease-out;
    opacity: 0;
    font-size: 20px;
    width: 40px;
    height: 40px;
    line-height: 35px;
    text-align: center;
    padding: 0;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-align-items: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.scroll-top.show  {
    opacity: .8;
}

/* BOTTOM NAVIGATION
----------------------------------------------- */
.pagi-load, .pagi-load a {text-align:center; font-size:18px;}
.pagi-load > span {display:none;}
.pagi-load + .pagi-nav {margin-top:10px;}
.bottom-nav {line-height:40px; text-align:center; margin: 0 auto; font-size:16px; padding:40px 0;}
.pagi-nav {white-space:nowrap; overflow-y:hidden; overflow-x:auto; max-width:100%;
background-color:#FFF; border:1px solid #e3e3e3; border-radius:3px; display:inline-block;}
.pagi-nav > span {display:inline-block;}
.pprev, .pnext {}
.pprev {border-right:1px solid #e3e3e3;}
.pnext a, .pprev a, .pprev > span, .pnext > span {display:block; width:40px; text-align:center;}
.navigation {text-align:center;}
.navigation a, .navigation span {font-size: 14px;display:inline-block; padding:0 5px; min-width:38px;
color:#444; border-right:1px solid #e3e3e3; margin-right:-4px;}
.navigation span, .pagi-nav a:hover {background-color:#37bf91; color:#fff;}
.navigation span.nav_ext {background-color:transparent; color:#888;}
.dle-comments-navigation .pagi-nav {margin-bottom:0; padding-bottom:20px;}
.pagination { margin: 0.75rem 0;}

/* SEO DESCRIPTION
----------------------------------------------- */
.site-desc {line-height:1.7; color:#5c5c5c; background: #fff; padding: 10px 15px; box-shadow: 0 2px 0 #d9e1e7; margin: 20px 0;}
.site-desc h1,.site-desc h2 {font-weight:300; margin-bottom:15px; color:#000; border-bottom: 1px dashed #dbe0e4;}
.site-desc li {list-style-type:disc; margin-left:40px}
.site-desc p {margin-bottom:15px;}
.site-desc a {color:#28a6f3; text-decoration:underline}
.site-desc img {float:left; max-width:200px; margin:0 10px 10px 0}

.footer__menu {
    margin-bottom: 10px;
}
.menu__list {
    font-size: 0;
    text-align: center;
    margin: -10px -10px 0;
}
.menu__item {
    font-size: 0.625rem;
    margin: 0.3125rem 0 0;
    padding: 0 0.75rem;
    display: inline-block;
    position: relative;
    line-height: normal;
}
.menu__item::after {
    position: absolute;
    content: '';
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: #8a96a0;
    width: 1px;
    height: 12px;
    left: 0;
}
.menu__item:first-child {
    padding-left: 0;
}
.menu__item:first-child::after {
    display: none;
}
.menu__link {
    color: #8a96a0;
    -webkit-transition: color .3s;
    transition: color .3s;
    display: inline-block;
    vertical-align: baseline;
    text-transform: uppercase;
}
.menu__link:hover, .menu__link.is-active {
    color: #37bf91;
}

@media (max-width: 48em) {
    .page__header.is-hidden {
        -webkit-transform: translateY(-100%);
                transform: translateY(-100%);
    }
}

.btn--count::after {
    content: attr(data-count);
    font-size: 8px;
    color: #dde3e7;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    line-height: 1;
}

.article {
    margin-bottom: 30px;
    padding: 15px 15px 0;
}

.article a {
    color: #8a96a0;
    -webkit-transition: color .3s linear;
    transition: color .3s linear
}
.article p, .article ol li, .article ul li {
    margin-bottom: 20px;
    line-height: 24px;
    font-size: 14px;
}
.article a:hover {
    text-decoration: underline
}

.article h1, .article h2, .article h3, .article h4, .article h5, .article h6{
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    margin-bottom: 20px;
}
.article h2 {
    font-size: 18px;
}
.article h3 {
    font-size: 16px;
}
.article h4 {
    font-size: 14px;
}
.article h5 {
    font-size: 12px;
}
.article h6 {
    font-size: 10px;
}

.article .article-body {
    font-size: 14px;
    line-height: 18px
}
.article ol, .article ul{
    padding-left: 20px
}
.article ol, .article ul, .article ol li, .article ul li {
    list-style: disc inside;
}

.article ol, .article ol li {
    list-style: decimal inside;
}


.navbar__toggler--search {
    display: none;
}
@media (max-width: 48em) {
    .navbar__toggler--search {
        display: block;
    }
}

.page::before {
    pointer-events: none;
    background: #37bf91;
    position: fixed;
    z-index: 1031;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    box-shadow: 0 0 10px #37bf91, 0 0 5px #37bf91;
    transform: translate3d(-100%, 0px, 0px);
    animation: progressBarStart 1s ease 0s 1 normal forwards;
    content: '';
    transition: all .2s;
}

.finished.page::before {
	transform: translate3d(-30%, 0px, 0px);
	animation: progressBarFinish 0.2s ease 0s 1 normal forwards;
	opacity: 0;
}

@keyframes progressBarStart {
    0 {
        transform: translate3d(-100%, 0px, 0px);
    }
    10% {
        transform: translate3d(-90%, 0px, 0px);
    }
    30% {
        transform: translate3d(-70%, 0px, 0px);
    }
    50% {
        transform: translate3d(-60%, 0px, 0px);
    }
    70% {
        transform: translate3d(-55%, 0px, 0px);
    }
    80% {
        transform: translate3d(-50%, 0px, 0px);
    }
    90% {
        transform: translate3d(-40%, 0px, 0px);
    }
    100% {
        transform: translate3d(-30%, 0px, 0px);
    }
}

@keyframes progressBarFinish {
    0% {
        transform: translate3d(-30%, 0px, 0px);
    }
    50% {
        transform: translate3d(-15%, 0px, 0px);
    }
    100% {
        transform: translate3d(0%, 0px, 0px);
    }
}
.card__label--top {
  position: absolute;
  top: 8px;
  left: 8px;
  background: linear-gradient(45deg, #ff5722, #ff9800);
  color: #fff;
  padding: 3px 10px;
  font-size: 12px;
  font-weight: bold;
  border-radius: 4px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
  z-index: 2;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.card__label--liked {
  position: absolute;
  top: 8px;
  right: 8px;
  background: #e91e63;
  color: #fff;
  font-size: 13px;
  padding: 3px 8px;
  font-weight: bold;
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
  z-index: 3;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.fav-btn {
  margin-top: 6px;
  background: #e91e63;
  color: white;
  border: none;
  padding: 6px 10px;
  font-size: 13px;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.3s ease;
}
.fav-btn:hover {
  background: #c2185b;
}