.cf:after {
    content: '';
    clear: both;
    display: table
}
.indicator {
    display: block;
    width: 10px;
    height: 10px;
    background: currentColor;
    border-radius: 50%
}
.android .indicator,
.android a {
    color: var(--api)
}
.api .indicator,
.api a {
    color: var(--api)
}
.swarm .indicator,
.swarm a {
    color: var(--swarm)
}
.twitter .indicator,
.twitter a {
    color: var(--twitter)
}
.github .indicator,
.github a {
    color: var(--github)
}
.instagram .indicator,
.instagram a {
    color: var(--instagram)
}
.dribbble .indicator,
.dribbble a {
    color: var(--dribbble)
}
.loader {
    display: flex;
    height: 34px;
    align-items: center
}
.loader-dot {
    margin-right: 12px;
    animation: bounce 1.4s infinite ease-in-out both
}
.loader-dot:nth-child(1) {
    animation-delay: -.96s
}
.loader-dot:nth-child(2) {
    animation-delay: -.8s
}
.loader-dot:nth-child(3) {
    animation-delay: -.64s
}
.loader-dot:nth-child(4) {
    animation-delay: -.48s
}
.loader-dot:nth-child(5) {
    animation-delay: -.32s
}
.loader-dot:nth-child(6) {
    animation-delay: -.16s
}
@keyframes bounce {
    0%, 80%, to {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}
.filters {
    display: flex;
    float: left;
    flex-wrap: wrap;
    margin-bottom: 24px
}
.filters>.filter {
    margin-right: 24px;
    margin-bottom: 16px;
    margin-top: 16px
}
.filters>.filter:last-child {
    margin-right: 0
}
.filter-checkbox {
    display: none
}
.filter-span {
    display: block;
    position: relative;
    cursor: pointer;
    user-select: none;
    line-height: 11px;
    color: currentColor;
    text-indent: 19px;
    transition: opacity .3s ease-in-out;
    outline: 0
}
.filter-span:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background: currentColor;
    height: 10px;
    width: 10px;
    border-radius: 50%
}
.filter-checkbox[type=checkbox]:not(:checked)+.filter-span {
    opacity: .35
}
.filter-checkbox[type=checkbox]:not(:checked)+.filter-span:hover {
    opacity: .5
}
.filter-label.android {
    color: var(--android)
}
.filter-label.api {
    color: var(--api)
}
.filter-label.swarm {
    color: var(--swarm)
}
.filter-label.twitter {
    color: var(--twitter)
}
.filter-label.github {
    color: var(--github)
}
.filter-label.instagram {
    color: var(--instagram)
}
.filter-label.dribbble {
    color: var(--dribbble)
}
html {
    font-size: 13px
}
* {
    box-sizing: border-box
}
*,
body {
    margin: 0;
    padding: 0
}
body {
    background: #15161d;
    color: hsla(0, 0%, 100%, .8);
    line-height: 1.65;
    font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-size: 1rem;
    margin-bottom: 24px
}
button {
    cursor: pointer;
    display: block;
    color: var(--purple);
    border: 1px solid currentColor;
    background: transparent;
    font-size: 1rem;
    font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
    outline: none;
    padding: 8px 16px;
    border-radius: 3px;
    -webkit-transition: color .3s ease;
    transition: color .3s ease
}
button:hover {
    color: #fff
}
button[disabled],
button[disabled]:hover {
    color: #6b46ae;
    opacity: .4
}
a {
    position: relative;
    color: var(--purple);
    text-decoration: none
}
a:hover {
    text-decoration: underline
}
.measure {
    max-width: 34em
}
.section {
    margin: 64px
}
@media (max-width: 600px) {
    .time {
        display: none
    }
    .section {
        margin: 48px 24px
    }
}
.section>:last-child {
    margin-bottom: 0
}
.time {
    opacity: .5
}
ul {
    display: table;
    border-collapse: collapse;
    list-style: none;
    clear: left
}
li {
    display: table-row
}
em {
    opacity: .5;
    font-style: italic
}
li>div {
    display: table-cell;
    padding-bottom: 24px
}
li>div:first-child {
    padding-right: 24px;
    min-width: 11px
}
li>div>.indicator {
    position: relative;
    top: 1px
}
li>div.time {
    padding-right: 24px;
    min-width: 120px
}
li>div:last-child {
    margin-bottom: 0
}
dt {
    font-weight: 600
}
dt:before {
    content: '- '
}
dd {
    margin-bottom: 24px
}
:root {
    --android: #4CC46A;
    --purple: #8d60f5;
    --api: #8d60f5;
    --swarm: #f06d1f;
    --twitter: #1da1f2;
    --github: #2dcf5e;
    --instagram: #405de6;
    --dribbble: #ea4c89
}
/*# sourceMappingURL=main.0c8ed202.css.map*/