Stack Exchange
.scss file fails to load card class from bootstrap
I am coding in an scss file and I imported bootstrap into it but its giving error to load the card class from bootstrap. 
@import "bootstrap-sass/bootstrap";
@import 'bootstrap/dist/css/bootstrap.min.css';

.wrapper-card-1{
    @extend .card; 
    @extend .card-body;
    @extend .card-complete-transparent;
    .card-heading{
        @extend .card-title; 
        @extend .bold;
    }   
    .card-para{
        @extend .card-text; 
        @extend .para;
    }
    .card-button{
        @extend .btn; 
        @extend .btn-primary; 
        @extend .no-border; 
        @extend .bold; 
        @extend .color-blue;
    }
    .card-image{
        @extend .card-img-top;
    }
}

Anyhow I still reach the below error
Error: ".wrapper-card-1" failed to @extend ".card".
