<style type="text/css">
	.m20_0{ margin:20px 0px;}
</style>

<div class="row center-align">

	<div class="col s6 m3 m20_0">
    	<a class="btn btn-floating btn-large pulse"><i class="material-icons">menu</i></a>
    </div>
    <div class="col s6 m3 m20_0">
		<a class="btn btn-floating btn-large light-blue pulse"><i class="material-icons">account_circle</i></a>
    </div>
    <div class="col s6 m3 m20_0">
		<a class="btn btn-floating btn-large cyan pulse"><i class="material-icons">edit</i></a>
    </div>
    <div class="col s6 m3 m20_0">
    	<a class="btn btn-floating btn-large red pulse"><i class="material-icons">notifications</i></a>
    </div>

</div>

$primary-color: color("materialize-red", "lighten-2") !default;
$primary-color-light: false !default;
$primary-color-dark: false !default;
@if not $primary-color-light {
    $primary-color-light: lighten($primary-color, 15%);
}
@if not $primary-color-dark {
    $primary-color-dark: darken($primary-color, 15%);
}
$secondary-color: color("teal", "lighten-1") !default;
$success-color: color("green", "base") !default;
$error-color: color("red", "base") !default;

$link-color: color("light-blue", "darken-1") !default;

etc,...

.hide-on-small-only
.hide-on-small-and-down
.hide-on-med-and-down
.hide-on-med-and-up
.hide-on-med-only
.hide-on-large-only
.show-on-large
.show-on-medium
.show-on-small
.show-on-medium-and-up
.show-on-medium-and-down

@media #{$small-and-down} {
// styles for small screens and down
}
@media #{$medium-and-up} {
// styles for medium screens and larger
}
@media #{$medium-and-down} {
// styles for medium screens and down
}
@media #{$large-and-up} {
// styles for large screens and up
}
@media #{$extra-large-and-up} {
// styles for extra large screens and up
}