.card-2, .card-3 {
    display: table;
    text-align: center;
    position: relative;
    background-color: #fff
}

.card {
    overflow: hidden;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: #fff
}

.card-2 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    left: 38%;
    border: 1px solid #999
}

    .card-2 .card-heading, .card-3 .card-heading {
        background: url("../images/8.jpg") top center/cover no-repeat;
        width: 40%;
        display: table-cell
    }

    .card-2 .card-body, .card-3 .card-body {
        display: table-cell;
        padding: 8% 2% 4%
    }

.card-3 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #999
}

@media (min-width:1200px) {
    .card-2, .card-3 {
        min-width: 400px;
        max-width: 600px
    }

    .card-2 {
        margin-top: 12%
    }

    .card-3 {
        left: 33%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2.3rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.5rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.5rem
        }
}

@media (min-width:992px) and (max-width:1199px) {
    .card-2, .card-3 {
        min-width: 350px;
        max-width: 550px;
        margin-top: 15%
    }

    .card-2 {
        left: 34%
    }

    .card-3 {
        left: 33%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2.1rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.3rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.3rem
        }
}

@media (min-width:768px) and (max-width:991px) {
    .card-2, .card-3 {
        min-width: 350px;
        max-width: 550px;
        margin-top: 18%
    }

    .card-2 {
        left: 28%
    }

    .card-3 {
        left: 33%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2.1rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.3rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.3rem
        }
}

@media (min-width:600px) and (max-width:767px) {
    .card-2, .card-3 {
        min-width: 320px;
        max-width: 520px;
        margin-top: 22%
    }

    .card-2 {
        left: 28%
    }

    .card-3 {
        left: 31%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.1rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.1rem
        }
}

@media (min-width:480px) and (max-width:599px) {
    .card-2, .card-3 {
        min-width: 300px;
        max-width: 500px;
        margin-top: 30%
    }

    .card-2 {
        left: 20%
    }

    .card-3 {
        left: 25%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.5rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.5rem
        }
}

@media (min-width:360px) and (max-width:479px) {
    .card-2, .card-3 {
        min-width: 288px;
        max-width: 477px;
        margin-top: 38%
    }

    .card-2 {
        left: 9%
    }

    .card-3 {
        left: 14%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.5rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.5rem
        }
}

@media (min-width:321px) and (max-width:359px) {
    .card-2, .card-3 {
        min-width: 280px;
        max-width: 470px;
        margin-top: 42%
    }

    .card-2 {
        left: 2%
    }

    .card-3 {
        left: 12%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.5rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.5rem
        }
}

@media (max-width:320px) {
    .card-2, .card-3 {
        min-width: 220px;
        max-width: 420px;
        margin-top: 45%
    }

    .card-2 {
        left: 1%
    }

    .card-3 {
        left: 20%
    }

    .card-body h2 {
        font-weight: 700;
        font-size: 2rem
    }

    .card-body h4 {
        font-weight: 500;
        font-size: 1.5rem
    }

        .card-body h4 a {
            font-weight: 700;
            cursor: pointer;
            font-size: 1.5rem
        }
}