.filter-group .btn {
    position: relative
}

.filter-group .btn.active:after,
.filter-group .btn.active:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
    opacity: 0;
    transition: .2s
}

.filter-group .btn:before {
    background-color: #2c3e50;
    border-radius: 50%
}

.filter-group .btn:after {
    background-size: 60%;
    background-position: 50%;
    background-repeat: no-repeat;
    background-image: url(../img/check.svg)
}

.filter-group .btn.active:after,
.filter-group .btn.active:before {
    opacity: 1
}

.filter-label {
    display: block;
    padding: 0;
    margin-top: 0;
    margin-bottom: 4px;
    color: #95a5a6
}

.filters-group {
    padding: 0;
    margin: 0 0 4px;
    border: 0
}

.textfield {
    -webkit-appearance: none;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    border: 2px solid #95a5a6;
    border-radius: 8px;
    padding: .5em;
    /*    font-size: 1rem;*/
    color: #34495e;
    transition: .15s;
}

.textfield::-webkit-input-placeholder {
    color: #95a5a6;
    -webkit-transition: .15s;
    transition: .15s
}

.textfield::-moz-placeholder {
    color: #95a5a6;
    -moz-transition: .15s;
    transition: .15s
}

.textfield:-ms-input-placeholder {
    color: #95a5a6;
    -ms-transition: .15s;
    transition: .15s
}

.textfield::-ms-input-placeholder {
    color: #95a5a6;
    -ms-transition: .15s;
    transition: .15s
}

.textfield::placeholder {
    color: #95a5a6;
    transition: .15s
}

.textfield:hover {
    outline-width: 0;
    color: #5d6d77;
    border-color: #5d6d77
}

.textfield:hover::-webkit-input-placeholder {
    color: #5d6d77
}

.textfield:hover::-moz-placeholder {
    color: #5d6d77
}

.textfield:hover:-ms-input-placeholder {
    color: #5d6d77
}

.textfield:hover::-ms-input-placeholder {
    color: #5d6d77
}

.textfield:hover::placeholder {
    color: #5d6d77
}

.textfield:focus {
    outline-width: 0;
    border-color: #34495e
}

.textfield:focus::-webkit-input-placeholder {
    color: #34495e;
}

.textfield:focus::-moz-placeholder {
    color: #34495e;
}

.textfield:focus:-ms-input-placeholder {
    color: #34495e
}

.textfield:focus::-ms-input-placeholder {
    color: #34495e
}

.textfield:focus::placeholder {
    color: #34495e
}

.textfield--large {
    font-size: 1.125em
}

@media screen and (min-width:768px) {
    .filters-group-wrap {
        display: flex;
        justify-content: space-between
    }
}


@media (-moz-touch-enabled:0),
(pointer:fine) {
    .btn:hover {
        color: #fff;
        text-decoration: none;
        background-color: #34495e
    }
}

.btn:focus {
    outline-width: 0;
    box-shadow: 0 0 0 2px rgba(52, 73, 94, .4)
}

.btn.active,
.btn:active {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .3);
    color: #fff;
    background-color: #34495e
}

.btn:focus.active {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .3), 0 0 0 2px rgba(52, 73, 94, .4)
}

.btn:disabled {
    cursor: not-allowed;
    opacity: .7;
    color: #34495e;
    background-color: rgba(52, 73, 94, 0)
}

.btn--primary {
    color: #3498db;
    border-color: #3498db;
    background-color: rgba(52, 152, 219, 0)
}

@media (-moz-touch-enabled:0),
(pointer:fine) {
    .btn--primary:hover {
        background-color: #3498db
    }
}

.btn--primary:focus {
    box-shadow: 0 0 0 2px rgba(52, 152, 219, .4)
}

.btn--primary.active,
.btn--primary:active {
    background-color: #3498db
}

.btn--primary:focus.active {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .3), 0 0 0 2px rgba(52, 152, 219, .4)
}

.btn--primary:disabled {
    color: #3498db;
    background-color: rgba(52, 152, 219, 0)
}



.btn-group:after,
.btn-group:before {
    content: " ";
    display: table
}

.btn-group:after {
    clear: both
}

.btn-group .btn {
    float: left;
    border-radius: 0
}

.btn-group .btn:first-child {
    border-radius: 3px 0 0 3px
}

.btn-group .btn:not(:first-child) {
    margin-left: -1px
}

.btn-group .btn:last-child {
    border-radius: 0 3px 3px 0
}

.btn-group label.btn input[type=radio] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none
}

/*.btn {
    display: inline-block;
    padding: .75em .8em;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #34495e;
    color: #34495e;
    font-size: 1rem;
    background-color: rgba(52,73,94,0);
    transition: .2s ease-out;
    cursor: pointer;
    -webkit-appearance: none
}*/

/* Fix for Edit/Delete buttons size requested by user (Legacy Parity) */
.title-project-box .btn-group {
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    vertical-align: middle;
}

.title-project-box .btn-group i {
    text-align: center;
    margin: 0;
}