

$baseSelector:dw-;
$appBgColor-1:#ebaf72;
$appBgColor-2:#eb831b;
$color:#fff;
$classCupBgColor-1:#f2f3f5;
$classCupBgColor-2:#e7e7e7;
$classCupBgActiveColor-1:#fcc79c;
$classCupBgActiveColor-2:#e98808;
$classCupColor:#e6a71f;

$font-family: Avenir, Helvetica, Arial, sans-serif;
$column:column;

// margin
@for $i from 0 through 100 {
    .mt-#{$i} {
        margin-top: $i + px;
    }

    .m-#{$i} {
        margin: $i + px;
    }

    .mb-#{$i} {
        margin-bottom: $i + px;
    }

    .ml-#{$i} {
        margin-left: $i + px;
    }

    .mr-#{$i} {
        margin-right: $i + px;
    }
}
// padding
@for $i from 0 through 100 {
    .pt-#{$i} {
        padding-top: $i + px;
    }

    .p-#{$i} {
        padding: $i + px;
    }

    .pb-#{$i} {
        padding-bottom: $i + px;
    }

    .pl-#{$i} {
        padding-left: $i + px;
    }

    .pr-#{$i} {
        padding-right: $i + px;
    }
}
@mixin margin-reset {
    margin: 0;
}

@mixin padding-reset {
    padding: 0;
}
@mixin flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex-column {
    flex-direction: $column;
}
.overflow-hidden {
    overflow: hidden;
}
.base-cup-style {
    border:4px solid #663e02;
    border-bottom-left-radius: 28px;
    border-bottom-right-radius: 28px;
}
.bgColor {
    background: linear-gradient(135deg,$appBgColor-1 10%,$appBgColor-2 90%);
}
.cupBgColor {
    background: linear-gradient(135deg,$classCupBgColor-1 10%,$classCupBgColor-2 90%);
}
.cupBgActiveColor {
    background: linear-gradient(135deg,$classCupBgActiveColor-1 10%,$classCupBgActiveColor-2 90%);
}
.base-transition {
    transition: all .3s linear;
}