.main-title {
    margin-bottom: 50px;
    text-align: center;
}
.main-title h1 {
    font-size: 35px;
    font-weight: 700;
    margin-bottom: 15px;
}

.pricingcontainer{
    max-width: 80% !important;
}

.pricing-card-area .single-card {
    background: #fcfcfc;
    padding: 70px 25px;
    border-radius: 6px;
    -webkit-transition: all .4s ease-out 0s;
    -moz-transition: all .4s ease-out 0s;
    -ms-transition: all .4s ease-out 0s;
    -o-transition: all .4s ease-out 0s;
    transition: all .4s ease-out 0s;
    transform: scale(1);
    margin-left: 15px;
    margin-right: 15px;
}

.mb-30 {
    margin-bottom: 30px;
}

.pricing-card-area .single-card .card-top {
    border-bottom: 1px solid #f4f4f4;
    margin-bottom: 46px;
}

.pricing-card-area .single-card.active .card-top {
    border-bottom: 1px solid #fff;
}

.pricing-card-area .single-card {
    background: #fcfcfc;
    padding: 70px 25px;
    border-radius: 6px;
    -webkit-transition: all .4s ease-out 0s;
    -moz-transition: all .4s ease-out 0s;
    -ms-transition: all .4s ease-out 0s;
    -o-transition: all .4s ease-out 0s;
    transition: all .4s ease-out 0s;
    transform: scale(1);
    margin-left: 15px;
    margin-right: 15px
}

    .pricing-card-area .single-card .card-top {
        border-bottom: 1px solid #f4f4f4;
        margin-bottom: 46px
    }

        .pricing-card-area .single-card .card-top span {
            color: #222;
            font-size: 16px;
            margin-bottom: 8px;
            display: inline-block
        }

        .pricing-card-area .single-card .card-top h4 {
            color: #222;
            font-size: 30px;
            font-weight: 800;
            margin-bottom: 26px;
            padding-right: 3px
        }

    .pricing-card-area .single-card .card-bottom ul li {
        color: #717081;
        font-weight: 300;
        margin-bottom: 16px;
        font-size: 16px
    }

        .pricing-card-area .single-card .card-bottom ul li:last-child {
            margin-bottom: 45px
        }

    .pricing-card-area .single-card.active {
        background: #31118f;
        transform: scale(1.2)
    }

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .pricing-card-area .single-card.active {
        transform: scale(1)
    }
}

@media (max-width: 575px) {
    .pricing-card-area .single-card.active {
        transform: scale(1)
    }
}

.pricing-card-area .single-card.active .card-top {
    border-bottom: 1px solid #fff
}

    .pricing-card-area .single-card.active .card-top span {
        color: #fff
    }

    .pricing-card-area .single-card.active .card-top h4 {
        color: #fff
    }

.pricing-card-area .single-card.active .card-bottom ul li {
    color: #fff
}

.pricing-card-area .single-card.active .card-bottom .black-btn {
    background: #fff;
    color: #331391 !important
}

    .pricing-card-area .single-card.active .card-bottom .black-btn::before {
        background: #000
    }

.pricing-card-area .single-card:hover {
    background: #31118f
}

    .pricing-card-area .single-card:hover .card-top {
        border-bottom: 1px solid #fff
    }

        .pricing-card-area .single-card:hover .card-top span {
            color: #fff
        }

        .pricing-card-area .single-card:hover .card-top h4 {
            color: #fff
        }

    .pricing-card-area .single-card:hover .card-bottom ul li {
        color: #fff
    }

    .pricing-card-area .single-card:hover .card-bottom .black-btn {
        padding: 14px 35px;
        background: #fff;
        color: #331391 !important
    }
.pricing-card-area .single-card .card-top {
    border-bottom: 1px solid #f4f4f4;
    margin-bottom: 46px;
}

.pricing-card-area .single-card.active .card-bottom .black-btn {
    background: #fff;
    color: #331391 !important;
}

.black-btn {
    padding: 14px 35px;
    background: #000;
}