Card

<div class="card ms-card" style="width:300px">
    <div class="card-body">Basic card</div>
</div>

<div class="card ms-card" style="width:300px">
    <div class="card-header">Header</div>
    <div class="card-body">Content</div>
    <div class="card-footer">Footer</div>
</div>

<div class="card ms-card" style="width:400px">
    <div class="card-body">
        <h4 class="card-title">Unlimited Music</h4>
        <p class="card-text">
            Listen to your favourite artists and albums whenever wherever online and offline
        </p>
    </div>
    <div class="card-actions">
        <div class="card-buttons">
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Listen Now</button>
        </div>
        <div class="card-icons">
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">favorite_border</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">share</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">more_vert</i>
            </button>
        </div>
    </div>
</div>

<div class="card ms-card ms-card-outline-indigo" style="width:400px">
    <div class="card-body">
        <h4 class="card-title text-indigo">Unlimited Music</h4>
        <p class="card-text">
            Listen to your favourite artists and albums whenever wherever online and offline
        </p>
    </div>
    <div class="card-actions">
        <div class="card-buttons">
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Listen Now</button>
        </div>
        <div class="card-icons">
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">favorite_border</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">share</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">more_vert</i>
            </button>
        </div>
    </div>
</div>

<div class="card ms-card" style="width: 330px;">
    <img class="card-img-top lazy" src="/assets/images/suv.jpg" alt="Card image">
    <div class="card-body">
        <h4 class="card-title">SUV</h4>
        <p class="card-text text-grey-700">
            An SUV is a powerful vehicle with four-wheel drive
            that can be driven over rough ground. SUV is an
            abbreviation for 'sport utility vehicle'.
        </p>
    </div>
    <div class="card-actions">
        <div class="card-buttons">
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Read</button>
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Bookmark</button>
        </div>
        <div class="card-icons">
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">favorite_border</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">share</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">more_vert</i>
            </button>
        </div>
    </div>
</div>

<div class="card ms-card" style="width:330px">
    <img class="card-img-top lazy" src="/assets/images/butterfly.jpg" alt="Card image">
    <div class="card-img-overlay">
        <h4 class="card-title text-white">Butterfly</h4>
        <p class="card-text text-white">
            There is nothing in a caterpillar that tells you it's going to be a butterfly.
        </p>
    </div>
    <div class="card-actions">
        <div class="card-buttons">
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Read</button>
            <button type="button" class="btn btn-indigo btn-ms btn-flat ripple">Bookmark</button>
        </div>
        <div class="card-icons">
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">favorite_border</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">share</i>
            </button>
            <button type="button" class="btn btn-ms btn-fab mini-fab btn-flat btn-grey ripple">
                <i class="material-icons">more_vert</i>
            </button>
        </div>
    </div>
</div>