.services-item:after,
.title-with-sort:after {
    content: '';
    display: block;
    clear: both;
}

.title-with-sort {
    text-align: left;
}

.title-item {
    display: inline-block;
    float: left;
}

.title-item h2 {
    text-align: left;
    font-weight: 900;
    display: block;
    margin-bottom: 0;
    text-transform: uppercase;
    font-size: 18px;
}

.title-item p {
    text-align: left;
    color: #7c7c7c;
    font-size: 13px;
}

.title-with-sort a {
    color: #090909;
}

.sort-block-prefix {
    display: inline-block;
    float: right;
    position: relative;
}

.sort-block-prefix span {
    line-height: 40px;
    background: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    display: inline-block;
    padding: 0 30px 0 20px;
    font-size: 12px;
    position: relative;
    cursor: pointer;
    -webkit-box-shadow: 0 10px 22px -4px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 10px 22px -4px rgba(0, 0, 0, 0.15);
    box-shadow: 0 10px 22px -4px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, .1);
}

.services-block .item-sem .service_details:after,
.sort-block-prefix span:after {
    content: '';
    display: inline-block;
    position: absolute;
    right: 12px;
    height: 45px;
    top: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23090909' viewBox='0 0 24 24'%3E%3Cpath d='M0 7.33l2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z'/%3E%3C/svg%3E") center/6px no-repeat;
    width: 10px;
    transition: all 300ms ease-in-out 0s;
}

.services-block .item-sem .service_details:hover:after,
.sort-block-prefix:hover span:after {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.services-block .item-sem .service_details:after {
    top: 0;
    height: 20px;
}

.sort-block-prefix span a {
    text-decoration: none;
    color: #090909;
    font-weight: bold;
}

.sort-block-prefix span a:hover {
    color: #ac3df3;
}

.sort-block-prefix ul {
    display: none;
    background: #fff;
    -webkit-box-shadow: 0px 10px 22px -4px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 10px 22px -4px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 10px 22px -4px rgba(0, 0, 0, 0.25);
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 22;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-top: -3px;
    border: 1px solid rgba(0, 0, 0, .1);
    border-top: 0;
}

.sort-block-prefix:hover ul {
    display: block;
}

.sort-block-prefix ul li {
}

.sort-block-prefix ul li a {
    text-decoration: none;
    display: block;
    font-size: 12px;
    font-weight: bold;
    color: #090909;
    padding: 15px;
}

.sort-block-prefix ul li:hover,
.sort-block-prefix ul li.select {
    background: #2546f6;
}

.sort-block-prefix ul li a.asc,
.sort-block-prefix ul li a.desc {
    background: #2546f6;
    color: #fff;
}
.sort-block-prefix ul li a.asc:before{
    filter: invert(0);
}
.sort-block-prefix ul li a.desc:before{
    filter: invert(1);
    margin: 0 5px;
    background-size: 8px 8px;
    background-position: center;
}

.sort-block-prefix ul li:hover a.asc,
.sort-block-prefix ul li:hover a.desc,
.sort-block-prefix ul li:hover a {
    color: #fff;
}

.services-item {
    margin: 15px -5px;
}

.services-block {
    display: inline-block;
    float: left;
    width: 25%;
}

.services-block .item-sem {
    margin: 5px;
    border: 1px solid rgba(0, 0, 0, .1);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background: #fff;
}

.services-block .item-sem .name small{
    color: #888888;
    font-size: 10px;
    text-transform: none;
    display: block;
    margin: 10px auto;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
}

.services-block .item-sem .name {
    display: block;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 5px;
    text-align: center;
    margin-top: 15px;
}

.services-block .item-sem .service_details {
    font-size: 12px;
    text-align: center;
    position: relative;
    min-height: 20px;
}

.services-block .item-sem .service_details ul {
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
}

.services-block .item-sem .service_details ul li {
    line-height: 20px;
    display: none;
    text-align: left;
    padding: 0 10px 5px 10px;
}
.services-block .item-sem .service_details ul li img{
    max-width: 25px;
    vertical-align: middle;
    border-radius: 20px;
}

.services-block .item-sem .service_details ul li:first-child {
    display: block;
}

.services-block .item-sem .service_details:hover ul li {
    display: block;
}

.services-block .item-sem a.picture {
    margin: 10px 0;
    display: block;
}

.services-block .item-sem a.picture img {
    width: 100%;
    vertical-align: bottom;
    display: block;
    max-height: 290px;
    object-fit: cover;
}

.services-block .item-sem a.button {
    margin: 15px;
    display: block;
    transition: all 300ms ease-in-out 0s;
    background: #2546f6;
    -webkit-box-shadow: 0 7px 19px 0 rgba(37, 70, 246, 0.42);
    -moz-box-shadow: 0 7px 19px 0 rgba(37, 70, 246, 0.42);
    box-shadow: 0 7px 19px 0 rgba(37, 70, 246, 0.42);
    padding: 10px 0 10px 0;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    font-size: 13px;
    text-align: center;
}


.pagination_prefix {
    text-align: center;
    margin: 20px 0;
}

.pagination_prefix div {
    cursor: pointer;
    display: inline-block;
    line-height: 40px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #202125;
    background: #fff;
    margin: 0 3px;
    border: 1px solid rgba(0, 0, 0, .1);
}

.pagination_prefix div.prev,
.pagination_prefix div.next {
    float: left;
    padding: 0 15px;
    margin: 0;
}

.pagination_prefix div.prev:before,
.pagination_prefix div.next:after {
    content: '';
    display: inline-block;
    height: 40px;
    width: 15px;
    vertical-align: top;
    transition: all 300ms ease-in-out 0s;
    max-width: 0;
    overflow: hidden;
}

.pagination_prefix div.prev:hover:before,
.pagination_prefix div.next:hover:after {
    max-width: 15px;
}

.pagination_prefix div.prev:before {
    margin-right: 4px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M16.67 0l2.83 2.829-9.339 9.175 9.339 9.167-2.83 2.829-12.17-11.996z'/%3E%3C/svg%3E") center/9px no-repeat;
}

.pagination_prefix div.next:after {
    margin-left: 4px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M5 3l3.057-3 11.943 12-11.943 12-3.057-3 9-9z'/%3E%3C/svg%3E") center/9px no-repeat;
}

.pagination_prefix div.next {
    float: right;
}

.pagination_prefix div:hover,
.pagination_prefix div.select {
    border-color: #2546f6;
    background: #2546f6;
}

.pagination_prefix div:hover a,
.pagination_prefix div.select a {
    color: #fff;
}

.pagination_prefix div a {
    text-decoration: none;
    color: #2546f6;
    padding: 20px;
}

@media screen and (min-width: 1200px) {
    .packages-items {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        /*text-align: center;*/
    }
}

@media screen and (max-width: 1200px) {
    .packages-items {
        padding-left: 12px;
        padding-right: 12px;
    }
}

@media screen and (max-width: 860px) {
    .services-block {
        width: 33.3%;
    }
}

@media screen and (max-width: 680px) {
    .services-block {
        width: 50%;
    }

    .pagination_prefix div {
        display: none;
    }

    .pagination_prefix div.select,
    .pagination_prefix div.next,
    .pagination_prefix div.prev {
        display: inline-block;
    }

    .title-item,
    .sort-block-prefix {
        display: block;
        float: none;
        width: 100%;
    }

    .sort-block-prefix {
        margin: 10px 0 0 0;
    }
}

@media screen and (max-width: 480px) {
    .sort-block-prefix {
        width: 100%;
    }

    .sort-block-prefix span {
        display: block;
    }
}

@media screen and (max-width: 460px) {
    .services-block {
        width: 100%;
        display: block;
        float: none;
    }
}