.fa-th-list {
    position: relative;
    top: 4px;
}

.category-courses .course-item:hover .mybutton {
    background: #fff;
}
.category-courses .course-item::before {
    position: absolute;
    top: 0;
    left: -83%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}

.category-courses .course-item {
    background: #bbd1e5;
    padding: 35px 0;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    vertical-align: middle;
    /* -webkit-transform: perspective(1px) translateZ(0); */
    /* transform: perspective(1px) translateZ(0); */
    box-shadow: 0 0 1px transparent;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-property: transform;
    transition-property: transform;
    margin-bottom: 10px;
}

    .category-courses .course-item:after {
        pointer-events: none;
        position: absolute;
        z-index: -1;
        content: '';
        top: 100%;
        left: 5%;
        height: 10px;
        width: 90%;
        opacity: 0;
        background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
        background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        -webkit-transition-property: transform, opacity;
        transition-property: transform, opacity;
    }

    .category-courses .course-item:hover, .category-courses .course-item:focus {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    .category-courses .course-item:hover {
        cursor: pointer;
        background: #092f51;
    }

    .category-courses .course-item .title-item {
        display: block;
        color: #092f51;
        font: 16px iransansweb,arial;
        text-align: center;
        margin-bottom: 11px;
    }

    .category-courses .course-item:hover .title-item {
        color: #fff;
    }

    .category-courses .course-item .en-title {
        display: block;
        color: #0654c6;
        font: 14px iransansweb,arial;
        font-weight: bold;
        text-align: center;
        text-transform: uppercase;
    }

    .category-courses .course-item:hover .en-title {
        color: #9cc327;
    }

    .category-courses .course-item .picture-item {
        position: relative;
    }

    .category-courses .course-item .icon-item {
        border-radius: 100%;
        background-color: #fff;
        -webkit-box-shadow: 0px 0px 9px rgba(83, 145, 53, 0.31);
        -moz-box-shadow: 0px 0px 9px rgba(83, 145, 53, 0.31);
        box-shadow: 0px 0px 9px rgba(83, 145, 53, 0.31);
        width: 87px;
        height: 87px;
        position: relative;
        margin: 30px auto 15px auto;
        z-index: 20;
    }

        .category-courses .course-item .icon-item:before {
            content: '';
            display: inline-block;
            background: url(../images/sprite-css.png) no-repeat;
            background-position: -70px -43px;
            width: 20px;
            height: 19px;
            position: absolute;
            bottom: 0;
            left: 95px;
            top: 40px;
        }

        .category-courses .course-item .icon-item:after {
            content: '';
            display: inline-block;
            background: url(../images/sprite-css.png) no-repeat;
            background-position: -93px -43px;
            width: 20px;
            height: 19px;
            position: absolute;
            bottom: 0;
            left: -25px;
            top: 40px;
        }

        .category-courses .course-item .icon-item img {
            position: absolute;
            left: 0;
            right: 0;
            margin: auto;
            top: 0;
            border-radius: 50%;
        }

    .category-courses .course-item .picture-item span.bg-icon {
        display: inline-block;
        background: url(../images/sprite-css.png) no-repeat;
        background-position: -120px -167px;
        width: 220px;
        height: 99px;
        opacity: 0;
        filter: alpha(opacity=0);
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
    }

    .category-courses .course-item:hover .picture-item span.bg-icon {
        opacity: 0.1;
        filter: alpha(opacity=10);
    }

    .category-courses .course-item .details-list {
        text-align: center;
        font-weight: bold;
        color: #092f51;
        font-size: 14px;
        padding: 0 20px;
        line-height: 25px;
        margin-bottom: 20px;
    }

    .category-courses .course-item:hover .details-list {
        color: #fff;
    }

    .category-courses .course-item .details-list ul {
        list-style-type: none;
        margin-top: 20px;
    }

        .category-courses .course-item .details-list ul li {
            display: block;
            margin-bottom: 15px;
        }