getlackey/lackey-cms

$color-pink: #fc1aa3;
$color-red: #df4b3f;
$color-sun: #f89f38;
$color-yellow: #f6d96d;
$color-green: #2abb9b;
$color-blue: #3183c6;
$color-purple: #9167b6;
$color-dark-gray: #575757;
$color-light-gray: lighten($color-dark-gray, 30%);
$color-lightest-gray: lighten($color-dark-gray, 60%);
$color-lighter-yet-gray: #f7f7f7;
$color-white: #FAFBFC;
$color-black: #333;
$color-background: #385573;
$color-background-accent: #1E3B5D;
$color-background-highlight: #00CBFE;
$color-washed: #5F799C;
$speed: 0.5s;
$header-height: 75px;
$sidebar-width: 260px;
$item-height: 60px;
$settings-pick-width: 285px;
$settings-edit-width: 340px;
$settings-breadcrumb-height: 63px;
$switch-width: 25px;
$switch-height: 24px;

$color-lackey-blue: #00ABFC;
$color-lackey-light-blue: #00CBFF;
$color-lackey-lighter-blue: #ACEEFF;
$color-lackey-gray: #3A5675;
$color-lackey-light-gray: #6F8BAC;
$color-lackey-dark-gray: #1E3B5E;
$color-lackey-darker-gray: #0B223E;

$default-font-family: 'Roboto', sans-serif;
$default-font-size: 14px;
$table-font-size: 12px;
$default-header-font-family: 'Roboto', sans-serif;
$header-1-font-size: 4rem;
$header-2-font-size: 2rem;
$header-3-font-size: 1.125rem;

$timing-material-standard: cubic-bezier(0.4, 0.0, 0.2, 1);
$timing-material-decelerate: cubic-bezier(0.0, 0.0, 0.2, 1);
$timing-material-accelerate: cubic-bezier(0.4, 0.0, 1, 1);
$timing-material-sharp: cubic-bezier(0.4, 0.0, 0.6, 1);


@mixin width-proportional-height($percentage: 100%) {
    &:before {
        content: "";
        display: block;
        padding-top: $percentage;
    }
}