.absolutte-pricing-wrap{
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
}

.absolutte-pricing{
    flex-grow: 1;
    margin: 4% 0;
    width: 100%;
    padding: 10% 4%;
    background-color: #f8f9fa;
    border-radius: 5px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

        .absolutte-pricing-header{
            flex-basis: 100%;
            text-align: center;
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing:  antialiased;
            margin-bottom: 7%;

                .absolutte-pricing-title{
                    color: $gray-800;
                }

                .absolutte-pricing-subtitle{
                    color: #6c757d;
                    font-size: 0.875rem;
                }
        }

        .absolutte-pricing-price{
            display: flex;
            justify-content: center;
            font-size: 3.375rem;
            line-height: 0.8em;
            margin-bottom: 12%;
            flex-basis: 100%;
            color: $gray-800;
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing:  antialiased;

                .sign{
                    font-size: 0.875rem;
                    line-height: 1em;
                    color: #6c757d;
                    
                }
                .period{
                    font-size: 0.875rem;
                    align-self: flex-end;
                    line-height: 1em;
                    color: #6c757d;
                }
        }

        .absolutte-pricing-list{
            flex-basis: 100%;
            list-style: none;
            padding-left: 0;
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing:  antialiased;
            text-align: center;

                li{
                    display: block;
                    margin-bottom: 5%;
                    font-size: 0.9375rem;

                        strong{
                            color: $gray-800;
                        }
                }
        }

        .absolutte-pricing-button{
            @extend .absolutte-button;
            background-color: $primary;
            margin-top: 5%;

            @include hover-focus {
                background-color: darken($primary, 5);
            }
        }

        &.absolutte-pricing-featured{
            background-color: $primary;
            color: #fff;

                .absolutte-pricing-header{

                        .absolutte-pricing-title{
                            color: #fff;
                        }

                        .absolutte-pricing-subtitle{
                            color: #fff;
                            opacity: 0.7;
                        }
                }

                .absolutte-pricing-price{
                    color: #fff;

                        .sign{
                            color: #fff;
                            opacity: 0.7;
                            
                        }
                        .period{
                            color: #fff;
                            opacity: 0.7;
                        }

                }

                .absolutte-pricing-list{

                        li{
                                strong{
                                    color: #fff;
                                }
                        }
                }

                .absolutte-pricing-button{
                    background-color: #fff;
                    color: $primary;

                    @include hover-focus {
                        background-color: darken(#fff, 5);
                    }
                }
        }
}

@for $i from 1 through 4 {
    body .absolutte-pricing:nth-child(#{$i}) {
        animation-delay: #{$i * .1}s;
    }
}

// Small and up
@media (min-width: 576px) {
    .absolutte-pricing-wrap{
        flex-wrap: nowrap;

            .absolutte-pricing{
                margin: 0 2%;
                max-width: 40%;
                padding: 6% 4%;
            }
    }
}

// Large and up
@media (min-width: 992px) {

}