UNPKG

cplayer

Version:

A beautiful and clean WEB Music Player by HTML5.

1,239 lines (1,070 loc) 34.3 kB
body { margin: 0px; font-family: "Roboto", sans-serif; -webkit-font-smoothing: antialiased; } *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } .neko-container { padding-right: 8px; padding-left: 8px; margin-right: auto; margin-left: auto; max-width: 980px; position: relative; } @media (min-width: 576px) { .neko-container { padding-right: 8px; padding-left: 8px; } } @media (min-width: 768px) { .neko-container { padding-right: 8px; padding-left: 8px; } } @media (min-width: 992px) { .neko-container { padding-right: 8px; padding-left: 8px; } } @media (min-width: 1200px) { .neko-container { padding-right: 8px; padding-left: 8px; } } .neko-container-fluid { padding-right: 8px; padding-left: 8px; position: relative; } @media (min-width: 576px) { .neko-container-fluid { padding-right: 8px; padding-left: 8px; } } @media (min-width: 768px) { .neko-container-fluid { padding-right: 8px; padding-left: 8px; } } @media (min-width: 992px) { .neko-container-fluid { padding-right: 8px; padding-left: 8px; } } @media (min-width: 1200px) { .neko-container-fluid { padding-right: 8px; padding-left: 8px; } } .neko-row { margin-right: -8px; margin-left: -8px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; } @media (min-width: 576px) { .neko-row { margin-right: -8px; margin-left: -8px; } } @media (min-width: 768px) { .neko-row { margin-right: -8px; margin-left: -8px; } } @media (min-width: 992px) { .neko-row { margin-right: -8px; margin-left: -8px; } } @media (min-width: 1200px) { .neko-row { margin-right: -8px; margin-left: -8px; } } .neko-no-gutters { margin-right: 0; margin-left: 0; } .neko-no-gutters > .col, .neko-no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; } .neko-no-gutters { margin-right: 0; margin-left: 0; } .neko-no-gutters > .col, .neko-no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; } .neko-col-1, .neko-col-2, .neko-col-3, .neko-col-4, .neko-col-5, .neko-col-6, .neko-col-7, .neko-col-8, .neko-col-9, .neko-col-10, .neko-col-11, .neko-col-12, .neko-col, .neko-col-auto, .neko-col-sm-1, .neko-col-sm-2, .neko-col-sm-3, .neko-col-sm-4, .neko-col-sm-5, .neko-col-sm-6, .neko-col-sm-7, .neko-col-sm-8, .neko-col-sm-9, .neko-col-sm-10, .neko-col-sm-11, .neko-col-sm-12, .neko-col-sm, .neko-col-sm-auto, .neko-col-md-1, .neko-col-md-2, .neko-col-md-3, .neko-col-md-4, .neko-col-md-5, .neko-col-md-6, .neko-col-md-7, .neko-col-md-8, .neko-col-md-9, .neko-col-md-10, .neko-col-md-11, .neko-col-md-12, .neko-col-md, .neko-col-md-auto, .neko-col-lg-1, .neko-col-lg-2, .neko-col-lg-3, .neko-col-lg-4, .neko-col-lg-5, .neko-col-lg-6, .neko-col-lg-7, .neko-col-lg-8, .neko-col-lg-9, .neko-col-lg-10, .neko-col-lg-11, .neko-col-lg-12, .neko-col-lg, .neko-col-lg-auto, .neko-col-xl-1, .neko-col-xl-2, .neko-col-xl-3, .neko-col-xl-4, .neko-col-xl-5, .neko-col-xl-6, .neko-col-xl-7, .neko-col-xl-8, .neko-col-xl-9, .neko-col-xl-10, .neko-col-xl-11, .neko-col-xl-12, .neko-col-xl, .neko-col-xl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 8px; padding-left: 8px; } @media (min-width: 576px) { .neko-col-1, .neko-col-2, .neko-col-3, .neko-col-4, .neko-col-5, .neko-col-6, .neko-col-7, .neko-col-8, .neko-col-9, .neko-col-10, .neko-col-11, .neko-col-12, .neko-col, .neko-col-auto, .neko-col-sm-1, .neko-col-sm-2, .neko-col-sm-3, .neko-col-sm-4, .neko-col-sm-5, .neko-col-sm-6, .neko-col-sm-7, .neko-col-sm-8, .neko-col-sm-9, .neko-col-sm-10, .neko-col-sm-11, .neko-col-sm-12, .neko-col-sm, .neko-col-sm-auto, .neko-col-md-1, .neko-col-md-2, .neko-col-md-3, .neko-col-md-4, .neko-col-md-5, .neko-col-md-6, .neko-col-md-7, .neko-col-md-8, .neko-col-md-9, .neko-col-md-10, .neko-col-md-11, .neko-col-md-12, .neko-col-md, .neko-col-md-auto, .neko-col-lg-1, .neko-col-lg-2, .neko-col-lg-3, .neko-col-lg-4, .neko-col-lg-5, .neko-col-lg-6, .neko-col-lg-7, .neko-col-lg-8, .neko-col-lg-9, .neko-col-lg-10, .neko-col-lg-11, .neko-col-lg-12, .neko-col-lg, .neko-col-lg-auto, .neko-col-xl-1, .neko-col-xl-2, .neko-col-xl-3, .neko-col-xl-4, .neko-col-xl-5, .neko-col-xl-6, .neko-col-xl-7, .neko-col-xl-8, .neko-col-xl-9, .neko-col-xl-10, .neko-col-xl-11, .neko-col-xl-12, .neko-col-xl, .neko-col-xl-auto { padding-right: 8px; padding-left: 8px; } } @media (min-width: 768px) { .neko-col-1, .neko-col-2, .neko-col-3, .neko-col-4, .neko-col-5, .neko-col-6, .neko-col-7, .neko-col-8, .neko-col-9, .neko-col-10, .neko-col-11, .neko-col-12, .neko-col, .neko-col-auto, .neko-col-sm-1, .neko-col-sm-2, .neko-col-sm-3, .neko-col-sm-4, .neko-col-sm-5, .neko-col-sm-6, .neko-col-sm-7, .neko-col-sm-8, .neko-col-sm-9, .neko-col-sm-10, .neko-col-sm-11, .neko-col-sm-12, .neko-col-sm, .neko-col-sm-auto, .neko-col-md-1, .neko-col-md-2, .neko-col-md-3, .neko-col-md-4, .neko-col-md-5, .neko-col-md-6, .neko-col-md-7, .neko-col-md-8, .neko-col-md-9, .neko-col-md-10, .neko-col-md-11, .neko-col-md-12, .neko-col-md, .neko-col-md-auto, .neko-col-lg-1, .neko-col-lg-2, .neko-col-lg-3, .neko-col-lg-4, .neko-col-lg-5, .neko-col-lg-6, .neko-col-lg-7, .neko-col-lg-8, .neko-col-lg-9, .neko-col-lg-10, .neko-col-lg-11, .neko-col-lg-12, .neko-col-lg, .neko-col-lg-auto, .neko-col-xl-1, .neko-col-xl-2, .neko-col-xl-3, .neko-col-xl-4, .neko-col-xl-5, .neko-col-xl-6, .neko-col-xl-7, .neko-col-xl-8, .neko-col-xl-9, .neko-col-xl-10, .neko-col-xl-11, .neko-col-xl-12, .neko-col-xl, .neko-col-xl-auto { padding-right: 8px; padding-left: 8px; } } @media (min-width: 992px) { .neko-col-1, .neko-col-2, .neko-col-3, .neko-col-4, .neko-col-5, .neko-col-6, .neko-col-7, .neko-col-8, .neko-col-9, .neko-col-10, .neko-col-11, .neko-col-12, .neko-col, .neko-col-auto, .neko-col-sm-1, .neko-col-sm-2, .neko-col-sm-3, .neko-col-sm-4, .neko-col-sm-5, .neko-col-sm-6, .neko-col-sm-7, .neko-col-sm-8, .neko-col-sm-9, .neko-col-sm-10, .neko-col-sm-11, .neko-col-sm-12, .neko-col-sm, .neko-col-sm-auto, .neko-col-md-1, .neko-col-md-2, .neko-col-md-3, .neko-col-md-4, .neko-col-md-5, .neko-col-md-6, .neko-col-md-7, .neko-col-md-8, .neko-col-md-9, .neko-col-md-10, .neko-col-md-11, .neko-col-md-12, .neko-col-md, .neko-col-md-auto, .neko-col-lg-1, .neko-col-lg-2, .neko-col-lg-3, .neko-col-lg-4, .neko-col-lg-5, .neko-col-lg-6, .neko-col-lg-7, .neko-col-lg-8, .neko-col-lg-9, .neko-col-lg-10, .neko-col-lg-11, .neko-col-lg-12, .neko-col-lg, .neko-col-lg-auto, .neko-col-xl-1, .neko-col-xl-2, .neko-col-xl-3, .neko-col-xl-4, .neko-col-xl-5, .neko-col-xl-6, .neko-col-xl-7, .neko-col-xl-8, .neko-col-xl-9, .neko-col-xl-10, .neko-col-xl-11, .neko-col-xl-12, .neko-col-xl, .neko-col-xl-auto { padding-right: 8px; padding-left: 8px; } } @media (min-width: 1200px) { .neko-col-1, .neko-col-2, .neko-col-3, .neko-col-4, .neko-col-5, .neko-col-6, .neko-col-7, .neko-col-8, .neko-col-9, .neko-col-10, .neko-col-11, .neko-col-12, .neko-col, .neko-col-auto, .neko-col-sm-1, .neko-col-sm-2, .neko-col-sm-3, .neko-col-sm-4, .neko-col-sm-5, .neko-col-sm-6, .neko-col-sm-7, .neko-col-sm-8, .neko-col-sm-9, .neko-col-sm-10, .neko-col-sm-11, .neko-col-sm-12, .neko-col-sm, .neko-col-sm-auto, .neko-col-md-1, .neko-col-md-2, .neko-col-md-3, .neko-col-md-4, .neko-col-md-5, .neko-col-md-6, .neko-col-md-7, .neko-col-md-8, .neko-col-md-9, .neko-col-md-10, .neko-col-md-11, .neko-col-md-12, .neko-col-md, .neko-col-md-auto, .neko-col-lg-1, .neko-col-lg-2, .neko-col-lg-3, .neko-col-lg-4, .neko-col-lg-5, .neko-col-lg-6, .neko-col-lg-7, .neko-col-lg-8, .neko-col-lg-9, .neko-col-lg-10, .neko-col-lg-11, .neko-col-lg-12, .neko-col-lg, .neko-col-lg-auto, .neko-col-xl-1, .neko-col-xl-2, .neko-col-xl-3, .neko-col-xl-4, .neko-col-xl-5, .neko-col-xl-6, .neko-col-xl-7, .neko-col-xl-8, .neko-col-xl-9, .neko-col-xl-10, .neko-col-xl-11, .neko-col-xl-12, .neko-col-xl, .neko-col-xl-auto { padding-right: 8px; padding-left: 8px; } } @media (max-width: 575px) { .neko-hidden-down { display: none; } } .neko-col { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .neko-col-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; } .neko-hidden-up { display: none; } .neko-col-1 { width: 8.33333%; } .neko-col-2 { width: 16.66667%; } .neko-col-3 { width: 25%; } .neko-col-4 { width: 33.33333%; } .neko-col-5 { width: 41.66667%; } .neko-col-6 { width: 50%; } .neko-col-7 { width: 58.33333%; } .neko-col-8 { width: 66.66667%; } .neko-col-9 { width: 75%; } .neko-col-10 { width: 83.33333%; } .neko-col-11 { width: 91.66667%; } .neko-col-12 { width: 100%; } .neko-offset-1 { margin-left: 8.33333%; } .neko-offset-2 { margin-left: 16.66667%; } .neko-offset-3 { margin-left: 25%; } .neko-offset-4 { margin-left: 33.33333%; } .neko-offset-5 { margin-left: 41.66667%; } .neko-offset-6 { margin-left: 50%; } .neko-offset-7 { margin-left: 58.33333%; } .neko-offset-8 { margin-left: 66.66667%; } .neko-offset-9 { margin-left: 75%; } .neko-offset-10 { margin-left: 83.33333%; } .neko-offset-11 { margin-left: 91.66667%; } @media (max-width: 767px) { .neko-hidden-sm-down { display: none; } } @media (min-width: 576px) { .neko-col-sm { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .neko-col-sm-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; } .neko-hidden-sm-up { display: none; } .neko-col-sm-1 { width: 8.33333%; } .neko-col-sm-2 { width: 16.66667%; } .neko-col-sm-3 { width: 25%; } .neko-col-sm-4 { width: 33.33333%; } .neko-col-sm-5 { width: 41.66667%; } .neko-col-sm-6 { width: 50%; } .neko-col-sm-7 { width: 58.33333%; } .neko-col-sm-8 { width: 66.66667%; } .neko-col-sm-9 { width: 75%; } .neko-col-sm-10 { width: 83.33333%; } .neko-col-sm-11 { width: 91.66667%; } .neko-col-sm-12 { width: 100%; } .neko-offset-sm-1 { margin-left: 8.33333%; } .neko-offset-sm-2 { margin-left: 16.66667%; } .neko-offset-sm-3 { margin-left: 25%; } .neko-offset-sm-4 { margin-left: 33.33333%; } .neko-offset-sm-5 { margin-left: 41.66667%; } .neko-offset-sm-6 { margin-left: 50%; } .neko-offset-sm-7 { margin-left: 58.33333%; } .neko-offset-sm-8 { margin-left: 66.66667%; } .neko-offset-sm-9 { margin-left: 75%; } .neko-offset-sm-10 { margin-left: 83.33333%; } .neko-offset-sm-11 { margin-left: 91.66667%; } } @media (max-width: 991px) { .neko-hidden-md-down { display: none; } } @media (min-width: 768px) { .neko-col-md { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .neko-col-md-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; } .neko-hidden-md-up { display: none; } .neko-col-md-1 { width: 8.33333%; } .neko-col-md-2 { width: 16.66667%; } .neko-col-md-3 { width: 25%; } .neko-col-md-4 { width: 33.33333%; } .neko-col-md-5 { width: 41.66667%; } .neko-col-md-6 { width: 50%; } .neko-col-md-7 { width: 58.33333%; } .neko-col-md-8 { width: 66.66667%; } .neko-col-md-9 { width: 75%; } .neko-col-md-10 { width: 83.33333%; } .neko-col-md-11 { width: 91.66667%; } .neko-col-md-12 { width: 100%; } .neko-offset-md-1 { margin-left: 8.33333%; } .neko-offset-md-2 { margin-left: 16.66667%; } .neko-offset-md-3 { margin-left: 25%; } .neko-offset-md-4 { margin-left: 33.33333%; } .neko-offset-md-5 { margin-left: 41.66667%; } .neko-offset-md-6 { margin-left: 50%; } .neko-offset-md-7 { margin-left: 58.33333%; } .neko-offset-md-8 { margin-left: 66.66667%; } .neko-offset-md-9 { margin-left: 75%; } .neko-offset-md-10 { margin-left: 83.33333%; } .neko-offset-md-11 { margin-left: 91.66667%; } } @media (max-width: 1199px) { .neko-hidden-lg-down { display: none; } } @media (min-width: 992px) { .neko-col-lg { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .neko-col-lg-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; } .neko-hidden-lg-up { display: none; } .neko-col-lg-1 { width: 8.33333%; } .neko-col-lg-2 { width: 16.66667%; } .neko-col-lg-3 { width: 25%; } .neko-col-lg-4 { width: 33.33333%; } .neko-col-lg-5 { width: 41.66667%; } .neko-col-lg-6 { width: 50%; } .neko-col-lg-7 { width: 58.33333%; } .neko-col-lg-8 { width: 66.66667%; } .neko-col-lg-9 { width: 75%; } .neko-col-lg-10 { width: 83.33333%; } .neko-col-lg-11 { width: 91.66667%; } .neko-col-lg-12 { width: 100%; } .neko-offset-lg-1 { margin-left: 8.33333%; } .neko-offset-lg-2 { margin-left: 16.66667%; } .neko-offset-lg-3 { margin-left: 25%; } .neko-offset-lg-4 { margin-left: 33.33333%; } .neko-offset-lg-5 { margin-left: 41.66667%; } .neko-offset-lg-6 { margin-left: 50%; } .neko-offset-lg-7 { margin-left: 58.33333%; } .neko-offset-lg-8 { margin-left: 66.66667%; } .neko-offset-lg-9 { margin-left: 75%; } .neko-offset-lg-10 { margin-left: 83.33333%; } .neko-offset-lg-11 { margin-left: 91.66667%; } } .neko-hidden-xl-down { display: none; } @media (min-width: 1200px) { .neko-col-xl { -webkit-flex-basis: 0; -ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .neko-col-xl-auto { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; } .neko-hidden-xl-up { display: none; } .neko-col-xl-1 { width: 8.33333%; } .neko-col-xl-2 { width: 16.66667%; } .neko-col-xl-3 { width: 25%; } .neko-col-xl-4 { width: 33.33333%; } .neko-col-xl-5 { width: 41.66667%; } .neko-col-xl-6 { width: 50%; } .neko-col-xl-7 { width: 58.33333%; } .neko-col-xl-8 { width: 66.66667%; } .neko-col-xl-9 { width: 75%; } .neko-col-xl-10 { width: 83.33333%; } .neko-col-xl-11 { width: 91.66667%; } .neko-col-xl-12 { width: 100%; } .neko-offset-xl-1 { margin-left: 8.33333%; } .neko-offset-xl-2 { margin-left: 16.66667%; } .neko-offset-xl-3 { margin-left: 25%; } .neko-offset-xl-4 { margin-left: 33.33333%; } .neko-offset-xl-5 { margin-left: 41.66667%; } .neko-offset-xl-6 { margin-left: 50%; } .neko-offset-xl-7 { margin-left: 58.33333%; } .neko-offset-xl-8 { margin-left: 66.66667%; } .neko-offset-xl-9 { margin-left: 75%; } .neko-offset-xl-10 { margin-left: 83.33333%; } .neko-offset-xl-11 { margin-left: 91.66667%; } } .neko-btn { display: inline-block; height: 36px; line-height: 36px; min-width: 88px; margin: 0; padding: 0 5px; font-family: "Roboto", sans-serif; font-size: 12px; font-weight: 500; cursor: pointer; text-decoration: none; outline: none; position: relative; border-radius: 2px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; text-align: center; -webkit-tap-highlight-color: transparent; -webkit-transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, -webkit-transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, -webkit-transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; -o-transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, -o-transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, -webkit-transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, -o-transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } @media (min-width: 576px) { .neko-btn { -webkit-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; -o-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } } .neko-btn { color: #ffffff; border: 1px solid #5a666f; background-color: #5a666f; } .neko-btn:hover { background-color: #313439; } .neko-btn.outline { color: #5a666f; background-color: transparent; } .neko-btn.outline:hover { color: #ffffff; background-color: #5a666f; } .neko-btn.shadow:hover { -webkit-box-shadow: rgba(0, 0, 0, 0.156863) 0px 3px 10px, rgba(0, 0, 0, 0.227451) 0px 3px 10px; box-shadow: rgba(0, 0, 0, 0.156863) 0px 3px 10px, rgba(0, 0, 0, 0.227451) 0px 3px 10px; } .neko-btn.merge { color: #5a666f; border: 0; background-color: transparent; } .neko-btn.merge:hover { color: #ffffff; background-color: #5a666f; } .neko-btn.neko-color-black { color: #ffffff; border: 1px solid #5a666f; background-color: #5a666f; } .neko-btn.neko-color-black:hover { background-color: #313439; } .neko-btn.neko-color-white { color: #ffffff; border: 1px solid #ffffff; background-color: #ffffff; } .neko-btn.neko-color-red { color: #ffffff; border: 1px solid #d32f2f; background-color: #d32f2f; } .neko-btn.neko-color-red:hover { background-color: #c62828; } .neko-btn.neko-color-pink { color: #ffffff; border: 1px solid #c2185b; background-color: #c2185b; } .neko-btn.neko-color-pink:hover { background-color: #880e4f; } .neko-btn.neko-color-purple { color: #ffffff; border: 1px solid #7b1fa2; background-color: #7b1fa2; } .neko-btn.neko-color-purple:hover { background-color: #c62828; } .neko-btn.neko-color-deep-purple { color: #ffffff; border: 1px solid #512da8; background-color: #512da8; } .neko-btn.neko-color-deep-purple:hover { background-color: #4527a0; } .neko-btn.neko-color-indigo { color: #ffffff; border: 1px solid #303f9f; background-color: #303f9f; } .neko-btn.neko-color-indigo:hover { background-color: #283593; } .neko-btn.neko-color-blue { color: #ffffff; border: 1px solid #1976d2; background-color: #1976d2; } .neko-btn.neko-color-blue:hover { background-color: #1565c0; } .neko-btn.neko-color-light-blue { color: #ffffff; border: 1px solid #0288d1; background-color: #0288d1; } .neko-btn.neko-color-light-blue:hover { background-color: #0277bd; } .neko-btn.neko-color-cyan { color: #ffffff; border: 1px solid #0097a7; background-color: #0097a7; } .neko-btn.neko-color-cyan:hover { background-color: #00838f; } .neko-btn.neko-color-teal { color: #ffffff; border: 1px solid #00796b; background-color: #00796b; } .neko-btn.neko-color-teal:hover { background-color: #00695c; } .neko-btn.neko-color-green { color: #ffffff; border: 1px solid #388e3c; background-color: #388e3c; } .neko-btn.neko-color-green:hover { background-color: #2e7d32; } .neko-btn.neko-color-light-green { color: #ffffff; border: 1px solid #689f38; background-color: #689f38; } .neko-btn.neko-color-light-green:hover { background-color: #558b2f; } .neko-btn.neko-color-lime { color: #ffffff; border: 1px solid #afb42b; background-color: #afb42b; } .neko-btn.neko-color-lime:hover { background-color: #9e9d24; } .neko-btn.neko-color-yellow { color: #ffffff; border: 1px solid #fbc02d; background-color: #fbc02d; } .neko-btn.neko-color-yellow:hover { background-color: #f9a825; } .neko-btn.neko-color-amber { color: #ffffff; border: 1px solid #ffa000; background-color: #ffa000; } .neko-btn.neko-color-amber:hover { background-color: #ff8f00; } .neko-btn.neko-color-orange { color: #ffffff; border: 1px solid #f57c00; background-color: #f57c00; } .neko-btn.neko-color-orange:hover { background-color: #ef6c00; } .neko-btn.neko-color-deep-orange { color: #ffffff; border: 1px solid #e64a19; background-color: #e64a19; } .neko-btn.neko-color-deep-orange:hover { background-color: #d84315; } .neko-btn.neko-color-brown { color: #ffffff; border: 1px solid #5d4037; background-color: #5d4037; } .neko-btn.neko-color-brown:hover { background-color: #4e342e; } .neko-btn.neko-color-grey { color: #ffffff; border: 1px solid #616161; background-color: #616161; } .neko-btn.neko-color-grey:hover { background-color: #424242; } .neko-btn.neko-color-blue-grey { color: #ffffff; border: 1px solid #455a64; background-color: #455a64; } .neko-btn.neko-color-blue-grey:hover { background-color: #37474f; } .neko-btn.outline.neko-color-black { color: #5a666f; background-color: transparent; } .neko-btn.outline.neko-color-black:hover { color: #ffffff; background-color: #5a666f; } .neko-btn.outline.neko-color-white { color: #ffffff; background-color: transparent; } .neko-btn.outline.neko-color-white:hover { color: #ffffff; background-color: #ffffff; } .neko-btn.outline.neko-color-red { color: #d32f2f; background-color: transparent; } .neko-btn.outline.neko-color-red:hover { color: #ffffff; background-color: #d32f2f; } .neko-btn.outline.neko-color-pink { color: #c2185b; background-color: transparent; } .neko-btn.outline.neko-color-pink:hover { color: #ffffff; background-color: #c2185b; } .neko-btn.outline.neko-color-purple { color: #7b1fa2; background-color: transparent; } .neko-btn.outline.neko-color-purple:hover { color: #ffffff; background-color: #7b1fa2; } .neko-btn.outline.neko-color-deep-purple { color: #512da8; background-color: transparent; } .neko-btn.outline.neko-color-deep-purple:hover { color: #ffffff; background-color: #512da8; } .neko-btn.outline.neko-color-indigo { color: #303f9f; background-color: transparent; } .neko-btn.outline.neko-color-indigo:hover { color: #ffffff; background-color: #303f9f; } .neko-btn.outline.neko-color-blue { color: #1976d2; background-color: transparent; } .neko-btn.outline.neko-color-blue:hover { color: #ffffff; background-color: #1976d2; } .neko-btn.outline.neko-color-light-blue { color: #0288d1; background-color: transparent; } .neko-btn.outline.neko-color-light-blue:hover { color: #ffffff; background-color: #0288d1; } .neko-btn.outline.neko-color-cyan { color: #0097a7; background-color: transparent; } .neko-btn.outline.neko-color-cyan:hover { color: #ffffff; background-color: #0097a7; } .neko-btn.outline.neko-color-teal { color: #00796b; background-color: transparent; } .neko-btn.outline.neko-color-teal:hover { color: #ffffff; background-color: #00796b; } .neko-btn.outline.neko-color-green { color: #388e3c; background-color: transparent; } .neko-btn.outline.neko-color-green:hover { color: #ffffff; background-color: #388e3c; } .neko-btn.outline.neko-color-light-green { color: #689f38; background-color: transparent; } .neko-btn.outline.neko-color-light-green:hover { color: #ffffff; background-color: #689f38; } .neko-btn.outline.neko-color-lime { color: #afb42b; background-color: transparent; } .neko-btn.outline.neko-color-lime:hover { color: #ffffff; background-color: #afb42b; } .neko-btn.outline.neko-color-yellow { color: #fbc02d; background-color: transparent; } .neko-btn.outline.neko-color-yellow:hover { color: #ffffff; background-color: #fbc02d; } .neko-btn.outline.neko-color-amber { color: #ffa000; background-color: transparent; } .neko-btn.outline.neko-color-amber:hover { color: #ffffff; background-color: #ffa000; } .neko-btn.outline.neko-color-orange { color: #f57c00; background-color: transparent; } .neko-btn.outline.neko-color-orange:hover { color: #ffffff; background-color: #f57c00; } .neko-btn.outline.neko-color-deep-orange { color: #e64a19; background-color: transparent; } .neko-btn.outline.neko-color-deep-orange:hover { color: #ffffff; background-color: #e64a19; } .neko-btn.outline.neko-color-brown { color: #5d4037; background-color: transparent; } .neko-btn.outline.neko-color-brown:hover { color: #ffffff; background-color: #5d4037; } .neko-btn.outline.neko-color-grey { color: #616161; background-color: transparent; } .neko-btn.outline.neko-color-grey:hover { color: #ffffff; background-color: #616161; } .neko-btn.outline.neko-color-blue-grey { color: #455a64; background-color: transparent; } .neko-btn.outline.neko-color-blue-grey:hover { color: #ffffff; background-color: #455a64; } .neko-btn.merge.neko-color-black { color: #5a666f; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-black:hover { color: #ffffff; background-color: #5a666f; } .neko-btn.merge.neko-color-white { color: #ffffff; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-white:hover { color: #ffffff; background-color: #ffffff; } .neko-btn.merge.neko-color-red { color: #d32f2f; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-red:hover { color: #ffffff; background-color: #d32f2f; } .neko-btn.merge.neko-color-pink { color: #c2185b; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-pink:hover { color: #ffffff; background-color: #c2185b; } .neko-btn.merge.neko-color-purple { color: #7b1fa2; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-purple:hover { color: #ffffff; background-color: #7b1fa2; } .neko-btn.merge.neko-color-deep-purple { color: #512da8; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-deep-purple:hover { color: #ffffff; background-color: #512da8; } .neko-btn.merge.neko-color-indigo { color: #303f9f; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-indigo:hover { color: #ffffff; background-color: #303f9f; } .neko-btn.merge.neko-color-blue { color: #1976d2; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-blue:hover { color: #ffffff; background-color: #1976d2; } .neko-btn.merge.neko-color-light-blue { color: #0288d1; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-light-blue:hover { color: #ffffff; background-color: #0288d1; } .neko-btn.merge.neko-color-cyan { color: #0097a7; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-cyan:hover { color: #ffffff; background-color: #0097a7; } .neko-btn.merge.neko-color-teal { color: #00796b; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-teal:hover { color: #ffffff; background-color: #00796b; } .neko-btn.merge.neko-color-green { color: #388e3c; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-green:hover { color: #ffffff; background-color: #388e3c; } .neko-btn.merge.neko-color-light-green { color: #689f38; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-light-green:hover { color: #ffffff; background-color: #689f38; } .neko-btn.merge.neko-color-lime { color: #afb42b; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-lime:hover { color: #ffffff; background-color: #afb42b; } .neko-btn.merge.neko-color-yellow { color: #fbc02d; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-yellow:hover { color: #ffffff; background-color: #fbc02d; } .neko-btn.merge.neko-color-amber { color: #ffa000; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-amber:hover { color: #ffffff; background-color: #ffa000; } .neko-btn.merge.neko-color-orange { color: #f57c00; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-orange:hover { color: #ffffff; background-color: #f57c00; } .neko-btn.merge.neko-color-deep-orange { color: #e64a19; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-deep-orange:hover { color: #ffffff; background-color: #e64a19; } .neko-btn.merge.neko-color-brown { color: #5d4037; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-brown:hover { color: #ffffff; background-color: #5d4037; } .neko-btn.merge.neko-color-grey { color: #616161; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-grey:hover { color: #ffffff; background-color: #616161; } .neko-btn.merge.neko-color-blue-grey { color: #455a64; border: 0; background-color: transparent; } .neko-btn.merge.neko-color-blue-grey:hover { color: #ffffff; background-color: #455a64; } .neko-helper-center, .neko-container, .neko-container-fluid { display: block; margin-left: auto; margin-right: auto; } .neko-hidden { display: none; } .neko-m-l-1 { margin-left: 8px; } .neko-m-r-1 { margin-right: 8px; } .neko-m-t-1 { margin-top: 8px; } .neko-m-b-1 { margin-bottom: 8px; } .neko-m-h-1 { margin-left: 8px; margin-right: 8px; } .neko-m-v-1 { margin-top: 8px; margin-bottom: 8px; } .neko-m-l-2 { margin-left: 16px; } .neko-m-r-2 { margin-right: 16px; } .neko-m-t-2 { margin-top: 16px; } .neko-m-b-2 { margin-bottom: 16px; } .neko-m-h-2 { margin-left: 16px; margin-right: 16px; } .neko-m-v-2 { margin-top: 16px; margin-bottom: 16px; } .neko-m-l-3 { margin-left: 24px; } .neko-m-r-3 { margin-right: 24px; } .neko-m-t-3 { margin-top: 24px; } .neko-m-b-3 { margin-bottom: 24px; } .neko-m-h-3 { margin-left: 24px; margin-right: 24px; } .neko-m-v-3 { margin-top: 24px; margin-bottom: 24px; } .neko-m-l-4 { margin-left: 32px; } .neko-m-r-4 { margin-right: 32px; } .neko-m-t-4 { margin-top: 32px; } .neko-m-b-4 { margin-bottom: 32px; } .neko-m-h-4 { margin-left: 32px; margin-right: 32px; } .neko-m-v-4 { margin-top: 32px; margin-bottom: 32px; } .neko-m-l-5 { margin-left: 40px; } .neko-m-r-5 { margin-right: 40px; } .neko-m-t-5 { margin-top: 40px; } .neko-m-b-5 { margin-bottom: 40px; } .neko-m-h-5 { margin-left: 40px; margin-right: 40px; } .neko-m-v-5 { margin-top: 40px; margin-bottom: 40px; } .neko-p-l-1 { padding-left: 8px; } .neko-p-r-1 { padding-right: 8px; } .neko-p-t-1 { padding-top: 8px; } .neko-p-b-1 { padding-bottom: 8px; } .neko-p-h-1 { padding-left: 8px; padding-right: 8px; } .neko-p-v-1 { padding-top: 8px; padding-bottom: 8px; } .neko-p-l-2 { padding-left: 16px; } .neko-p-r-2 { padding-right: 16px; } .neko-p-t-2 { padding-top: 16px; } .neko-p-b-2 { padding-bottom: 16px; } .neko-p-h-2 { padding-left: 16px; padding-right: 16px; } .neko-p-v-2 { padding-top: 16px; padding-bottom: 16px; } .neko-p-l-3 { padding-left: 24px; } .neko-p-r-3 { padding-right: 24px; } .neko-p-t-3 { padding-top: 24px; } .neko-p-b-3 { padding-bottom: 24px; } .neko-p-h-3 { padding-left: 24px; padding-right: 24px; } .neko-p-v-3 { padding-top: 24px; padding-bottom: 24px; } .neko-p-l-4 { padding-left: 32px; } .neko-p-r-4 { padding-right: 32px; } .neko-p-t-4 { padding-top: 32px; } .neko-p-b-4 { padding-bottom: 32px; } .neko-p-h-4 { padding-left: 32px; padding-right: 32px; } .neko-p-v-4 { padding-top: 32px; padding-bottom: 32px; } .neko-p-l-5 { padding-left: 40px; } .neko-p-r-5 { padding-right: 40px; } .neko-p-t-5 { padding-top: 40px; } .neko-p-b-5 { padding-bottom: 40px; } .neko-p-h-5 { padding-left: 40px; padding-right: 40px; } .neko-p-v-5 { padding-top: 40px; padding-bottom: 40px; }