/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 24 Mar. 2021, 11:12:22 pm
    Author     : thomaschuntic
*/

.pricing-block{}
.pricing-block .prices{
        padding: 15px 0;
}
.pricing-block .prices .price.price-header {
        font-weight: 90%;
        font-weight: 500;
        color: #000;
        background-color: #fff;
        display: none;
}

@media only screen and (min-width: 992px){
        .pricing-block .prices .price.price-header{
                display: flex;
        }
}

.pricing-block .prices .price {
        background-color: var(--contrast3);
        /*        padding: 15px 20px;*/
        border-radius: 15px;
        margin-bottom: 10px;
        color: #fff;
}

.pricing-block .prices .price span > em{
        font-size: 80%;
        font-style: normal;
        display: inline-block;
        margin-left: 10px;
        position: absolute;
        right: 30px;
        opacity: 0.75;
}
@media only screen and (min-width: 992px){
        .pricing-block .prices .price span > em{
                display: none;
        }
}

.pricing-block .prices .price-title,
.pricing-block .prices .price-amount,
.pricing-block .prices .price-amount-2{
        display: block;
}

.pricing-block .prices .price.price-header > span{
        padding: 5px 10px;
        text-align: center;
}
.pricing-block .prices .price > span{
        padding: 15px 20px;
}
.pricing-block .prices .price > span:not(:last-of-type) {
        border-bottom: 1px solid  rgb(255 255 255 / 50%);
}

@media only screen and (min-width: 992px){

        .pricing-block .prices .price {
                display: flex;
        }

        .pricing-block .prices .price-title{
                width: 50%;
                display: inline-block;
        }
        .pricing-block .prices .price-amount{
                width: 25%;
                display: inline-block;
        }

        .pricing-block .prices .price-amount-2{
                width: 25%;
                display: inline-block;
        }

        .pricing-block .prices .price > span{
                display: flex;
                align-items: center;
        }
        .pricing-block .prices .price > span:not(:last-of-type) {
                border-bottom: 0;
                border-right: 1px solid rgb(255 255 255 / 50%);
        }
}