.page-reposts.dropdown {
    display: flex;
    font-size: 14px;
    position: relative
}

.page-reposts.dropdown label {
    display: inline-grid;
    grid-template-columns:20px minmax(0, 1fr);
    grid-gap: 10px;
    align-items: center
}

.page-reposts.dropdown label svg {
    justify-self: center;
    position: relative;
    top: -2px;
    width: 14px
}

.page-reposts.dropdown .toggle.open:checked + .close + .button + .list {
    display: block
}

.page-reposts.dropdown .toggle.close:checked + .button + .list, .page-reposts.dropdown label.close {
    display: none
}

.page-reposts.dropdown label.overlay {
    bottom: 0;
    display: none;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1
}

.page-reposts.dropdown .toggle.open:checked ~ .list {
    display: block;
}

.page-reposts.dropdown .toggle.open:checked ~ label.open {
    display: none
}

.page-reposts.dropdown .toggle.close:checked ~ label.open, .page-reposts.dropdown .toggle.open:checked ~ label.close {
    display: inline-grid
}

.page-reposts.dropdown .toggle.close:checked ~ label.close {
    display: none
}

.page-reposts.dropdown .toggle.open:checked ~ label.overlay {
    display: block
}

.page-reposts.dropdown .toggle.close:checked ~ label.overlay {
    display: none
}

.page-reposts.dropdown .button {
    cursor: pointer;
    display: inline-grid
}

.page-reposts.dropdown .list {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    display: none;
    left: 0;
    margin: 10px 0 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 100%;
    width: 200px;
    z-index: 2
}

.page-reposts.dropdown .list .item {
    list-style-type: none
}

.page-reposts.dropdown .list .item.hide {
    display: none
}

.page-reposts.dropdown .list .item .before {
    display: grid
}

.page-reposts.dropdown .list .item .after, .page-reposts.dropdown .list .item.complete .before {
    display: none
}

.page-reposts.dropdown .list .item.complete .after {
    display: grid
}

.page-reposts.dropdown .list .item.complete > a, .page-reposts.dropdown .list .item.complete > span {
    color: green
}

.page-reposts.dropdown .list .item.complete > a svg path, .page-reposts.dropdown .list .item.complete > span svg path {
    fill: green
}

.page-reposts.dropdown .list .item > a, .page-reposts.dropdown .list .item > span {
    color: #333;
    display: grid;
    grid-template-columns:20px minmax(0, 1fr);
    padding: 10px 15px;
    text-decoration: none;
    grid-gap: 10px;
    align-items: center;
    cursor: pointer;
    font-size: 14px
}

.page-reposts.dropdown .list .item > a.active, .page-reposts.dropdown .list .item > a:hover, .page-reposts.dropdown .list .item > span.active, .page-reposts.dropdown .list .item > span:hover {
    background-color: #f5f5f5
}

.page-reposts.dropdown .list .item > a svg, .page-reposts.dropdown .list .item > span svg {
    justify-self: center
}
