﻿/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */


/* website
-------------------------------------------------- */
.bg-header {
    /*min-height: 30rem;*/
    height: 32rem;
    background-image: url("../img/bg-header.jpg");
    background-size: cover;
    background-position: center 95%;
}

.cp-header {
    /*clip-path: inset(0 2.5rem 7.8rem 0);*/
    height: 32rem;
}

.download-wrapper {
    background: rgb(87,131,219);
    background: linear-gradient(0deg, rgba(87,131,219,1) 0%, rgba(255,255,255,1) 65%);
}

/*
.bg {
    min-height: 70vh;
    background-image: url('https://visualhunt.com/vh2/img/vh-bg-1920x1080-min-1.jpg');
    background-size: cover;
    background-position: bottom center;
}
*/


/* card (features)
-------------------------------------------------- */
.feature-swiper .card {
    border-radius: 1rem;
}

    .feature-swiper .card img {
        width: 6rem;
    }

.feature-swiper .card-body {
    text-align: justify;
}

.feature-swiper .card-title {
    height: 3rem;
}

.feature-swiper .card-text {
    height: 7rem;
    padding-bottom: 1rem;
    padding-top: 1rem;
}


/* card (pricing)
-------------------------------------------------- */
.card-pricing .card {
    min-width: 16.3rem;
}

    .card-pricing .card:hover {
        --bs-border-opacity: 1;
        /*
        border-color: rgba(var(--bs-primary-rgb),var(--bs-border-opacity)) !important;
        */
        border-color: #1861ac;
    }

        .card-pricing .card:hover .card-header {
            --bs-text-opacity: 1;
            color: rgba(var(--bs-white-rgb),var(--bs-text-opacity)) !important;
            --bs-bg-opacity: 1;
            /*
            background-color: rgba(var(--bs-primary-rgb),var(--bs-bg-opacity)) !important;
            */

            background-color: #1b6ec2;
        }

            .card-pricing .card:hover .card-header h4 {
                font-weight: bold !important;
            }

        .card-pricing .card:hover .card-body .btn {
            color: #fff;
            background-color: #1b6ec2;
            border-color: #1861ac;
        }


/* card (steps)
-------------------------------------------------- */
.card-step .card div {
    vertical-align: middle;
}

.card-step-head {
    border-radius: 50%;
    font-size: 2rem;
    height: 4rem;
    margin: 0;
    padding: .8rem;
    text-align: center;
    width: 4rem;
}

.card-step .card-body {
    width: 80%;
}

@media (min-width: 576px) {
    .card-step .card-body {
        width: 100%;
    }
}


/* dialog
-------------------------------------------------- */
.modal-dialog img {
    height: 4rem;
}


/* login
-------------------------------------------------- */
.sign-in {
    min-height: calc(100vh - 15.8rem);
}


/* swiper (features)
-------------------------------------------------- */
.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    align-items: center;
    background: #fff;
    display: flex;
    font-size: 18px;
    justify-content: center;
    text-align: center;
    width: 22rem;
}


/* table (compare plan)
-------------------------------------------------- */
.compare-plan-table thead th:nth-child(3),
.compare-plan-table thead th:nth-child(5),
.compare-plan-table tbody td:nth-child(3),
.compare-plan-table tbody td:nth-child(5) {
    background: #e9ecef;
}
