.child {
    margin-bottom: 15px;

    text-align: center;
}

.child > span {
    float: left;

    width: 33.3%;

    line-height: 1;
}

.child > span span {
    position: relative;

    display: inline-block;

    padding: 50px 0 0;

    cursor: pointer;

    color: #bec2c4;

    font-size: 14px;
}

.child > span span:before {
    position: absolute;
    left: 50%;

    display: block;

    content: '';

    background-size: cover !important;
}

.child > span span.active {
    color: #35b6de;
}

.product-filter-item {
    width: 100%;
    margin-bottom: 15px;
}

.all:before {
    top: 0;

    width: 70px;
    height: 50px;
    margin-left: -35px;

    background: url('/assets/website/svg/ico_child_all.svg') center no-repeat;
}

.all.active:before {
    background: url('/assets/website/svg/ico_child_all_activ.svg') center no-repeat;
}

.boy:before {
    top: -4px;

    width: 50px;
    height: 50px;
    margin-left: -25px;

    background: url('/assets/website/svg/ico_child_boy.svg') center no-repeat;
}

.boy.active:before {
    background: url('/assets/website/svg/ico_child_boy_activ.svg') center no-repeat;
}

.girl:before {
    top: -4px;

    width: 50px;
    height: 50px;
    margin-left: -25px;

    background: url('/assets/website/svg/ico_child_girl.svg') center no-repeat;
    background-size: cover !important;
}

.girl.active:before {
    background: url('/assets/website/svg/ico_child_girl_activ.svg') center no-repeat;
    background-size: cover !important;
}

.characteristics {
    padding: 30px 30px 20px;

    background: #35b6de url('/assets/website/images/pattern.png') center center repeat;
}

.reset {
    margin-bottom: 30px;

    text-align: center;
    text-transform: uppercase;

    border-bottom: 1px solid #b7c2cd;

    font-size: 14px;
    line-height: 50px;
}

.reset a {
    cursor: pointer;
    text-decoration: none;

    color: #bec2c4;

    font-weight: 700;
}

.reset a:hover {
    color: #d14c47;
}

.product-search-from__available {
    display: flex;

    align-items: center;
}

.product-search-from__available__title {
    text-transform: uppercase;

    color: #fff;
}

.product-search-from__available__icon {
    display: block;

    width: 1.5em;
    height: 1.5em;
    margin-top: -.2em;
    margin-left: .2em;

    background-image: url('/assets/website/svg/shopping-cart_white.svg');
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
}

@media (min-width: 480px) {
    .left_coll {
        float: left;

        width: 50%;
        padding-right: 15px;
    }

    .right_coll {
        float: right;

        width: 50%;
        padding-left: 15px;
    }
}

@media (min-width: 720px) {
    .child {
        margin-bottom: 30px;
    }

    .child > span span {
        padding: 90px 0 0;

        font-size: 20px;
    }

    .all:before {
        top: 0;

        width: 100px;
        height: 100px;
        margin-left: -48px;
    }

    .boy:before {
        top: -10px;

        width: 80px;
        height: 100px;
        margin-left: -40px;
    }

    .girl:before {
        top: -10px;

        width: 80px;
        height: 100px;
        margin-left: -40px;
    }

    .characteristics {
        padding: 60px 47px 40px;
    }

    .left_coll {
        padding-right:25px;
    }

    .right_coll {
        padding-left:25px;
    }

    .reset {
        margin-bottom: 30px;

        font-size: 22px;
        line-height: 80px;
    }
}

@media (min-width: 1020px) {
    .child {
        margin-bottom: 30px;
    }

    .child > span span {
        padding: 30px 0 0;

        font-size: 14px;
    }

    .all {
        margin-left: 87px;
    }

    .all:before {
        top: 3px;
        left: -70px !important;

        width: 68px;
        height: 61px;
        margin-left: 0;
    }

    .boy {
        margin-left: 70px;
    }

    .boy:before {
        top: 0;
        left: -50px !important;

        width: 43px;
        height:59px;
        margin-left: 0;
    }

    .girl {
        margin-left: 80px;
    }

    .girl:before {
        top: 0;
        left: -50px !important;

        width: 43px;
        height:59px;
        margin-left: 0;
    }

    .characteristics {
        padding: 30px 31px 20px;
    }

    .left_coll {
        padding-right:21px;
    }

    .right_coll {
        padding-left:21px;
    }

    .reset {
        margin-bottom: 40px;

        border-width: 1px;

        font-size: 14px;
        line-height: 62px;
    }
}
