/*!
 *   AdminLTE v3.1.0-rc
 *   Author: Colorlib
 *   Website: AdminLTE.io <https://adminlte.io>
 *   License: Open source - MIT <https://opensource.org/licenses/MIT>

/*     !
 * * Bootstrap v4.5.3 (https://getbootstrap.com/)
 * * Copyright 2011-2020 The Bootstrap Authors
 * * Copyright 2011-2020 Twitter, Inc.
 * * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)

\:root
  --blue:#007bff
  --indigo:#6610f2
  --purple:#6f42c1
  --pink:#e83e8c
  --red:#dc3545
  --orange:#fd7e14
  --yellow:#ffc107
  --green:#28a745
  --teal:#20c997
  --cyan:#17a2b8
  --white:#fff
  --gray:#6c757d
  --gray-dark:#343a40
  --primary:#007bff
  --secondary:#6c757d
  --success:#28a745
  --info:#17a2b8
  --warning:#ffc107
  --danger:#dc3545
  --light:#f8f9fa
  --dark:#343a40
  --breakpoint-xs:0
  --breakpoint-sm:576px
  --breakpoint-md:768px
  --breakpoint-lg:992px
  --breakpoint-xl:1200px
  --font-family-sans-serif:"Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
  --font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace

*, ::after, ::before
  box-sizing: border-box

html
  font-family: sans-serif
  line-height: 1.15
  -webkit-text-size-adjust: 100%
  -webkit-tap-highlight-color: transparent

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section
  display: block

body
  margin: 0
  font-family: "Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
  font-size: 1rem
  font-weight: 400
  line-height: 1.5
  color: #212529
  text-align: left
  background-color: #fff

[tabindex="-1"]:focus:not(:focus-visible)
  outline: 0 !important

hr
  box-sizing: content-box
  height: 0
  overflow: visible

h1, h2, h3, h4, h5, h6
  margin-top: 0
  margin-bottom: .5rem

p
  margin-top: 0
  margin-bottom: 1rem

abbr
  &[data-original-title], &[title]
    text-decoration: underline
    -webkit-text-decoration: underline dotted
    text-decoration: underline dotted
    cursor: help
    border-bottom: 0
    -webkit-text-decoration-skip-ink: none
    text-decoration-skip-ink: none

address
  margin-bottom: 1rem
  font-style: normal
  line-height: inherit

dl, ol, ul
  margin-top: 0
  margin-bottom: 1rem

ol
  ol, ul
    margin-bottom: 0

ul
  ol, ul
    margin-bottom: 0

dt
  font-weight: 700

dd
  margin-bottom: .5rem
  margin-left: 0

blockquote
  margin: 0 0 1rem

b, strong
  font-weight: bolder

small
  font-size: 80%

sub, sup
  position: relative
  font-size: 75%
  line-height: 0
  vertical-align: baseline

sub
  bottom: -.25em

sup
  top: -.5em

a
  color: #007bff
  text-decoration: none
  background-color: transparent

  &:hover
    color: #0056b3
    text-decoration: none

  &:not([href]):not([class])
    color: inherit
    text-decoration: none

    &:hover
      color: inherit
      text-decoration: none

code, kbd, pre, samp
  font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace
  font-size: 1em

pre
  margin-top: 0
  margin-bottom: 1rem
  overflow: auto
  -ms-overflow-style: scrollbar

figure
  margin: 0 0 1rem

img
  vertical-align: middle
  border-style: none

svg
  overflow: hidden
  vertical-align: middle

table
  border-collapse: collapse

caption
  padding-top: .75rem
  padding-bottom: .75rem
  color: #6c757d
  text-align: left
  caption-side: bottom

th
  text-align: inherit
  text-align: -webkit-match-parent

label
  display: inline-block
  margin-bottom: .5rem

button
  border-radius: 0

  &:focus
    outline: 1px dotted
    outline: 5px auto -webkit-focus-ring-color

  margin: 0
  font-family: inherit
  font-size: inherit
  line-height: inherit

input, optgroup, select, textarea
  margin: 0
  font-family: inherit
  font-size: inherit
  line-height: inherit

button, input
  overflow: visible

button, select
  text-transform: none

[role=button]
  cursor: pointer

select
  word-wrap: normal

[type=button], [type=reset], [type=submit], button
  -webkit-appearance: button

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled)
  cursor: pointer

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner
  padding: 0
  border-style: none

input
  &[type=checkbox], &[type=radio]
    box-sizing: border-box
    padding: 0

textarea
  overflow: auto
  resize: vertical

fieldset
  min-width: 0
  padding: 0
  margin: 0
  border: 0

legend
  display: block
  width: 100%
  max-width: 100%
  padding: 0
  margin-bottom: .5rem
  font-size: 1.5rem
  line-height: inherit
  color: inherit
  white-space: normal

progress
  vertical-align: baseline

[type=number]
  &::-webkit-inner-spin-button, &::-webkit-outer-spin-button
    height: auto

[type=search]
  outline-offset: -2px
  -webkit-appearance: none

  &::-webkit-search-decoration
    -webkit-appearance: none

\::-webkit-file-upload-button
  font: inherit
  -webkit-appearance: button

output
  display: inline-block

summary
  display: list-item
  cursor: pointer

template
  display: none

[hidden]
  display: none !important

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6
  margin-bottom: .5rem
  font-family: inherit
  font-weight: 500
  line-height: 1.2
  color: inherit

.h1, h1
  font-size: 2.5rem

.h2, h2
  font-size: 2rem

.h3, h3
  font-size: 1.75rem

.h4, h4
  font-size: 1.5rem

.h5, h5
  font-size: 1.25rem

.h6, h6
  font-size: 1rem

.lead
  font-size: 1.25rem
  font-weight: 300

.display-1
  font-size: 6rem
  font-weight: 300
  line-height: 1.2

.display-2
  font-size: 5.5rem
  font-weight: 300
  line-height: 1.2

.display-3
  font-size: 4.5rem
  font-weight: 300
  line-height: 1.2

.display-4
  font-size: 3.5rem
  font-weight: 300
  line-height: 1.2

hr
  margin-top: 1rem
  margin-bottom: 1rem
  border: 0
  border-top: 1px solid rgba(0, 0, 0, 0.1)

.small, small
  font-size: 80%
  font-weight: 400

.mark, mark
  padding: .2em
  background-color: #fcf8e3

.list-unstyled, .list-inline
  padding-left: 0
  list-style: none

.list-inline-item
  display: inline-block

  &:not(:last-child)
    margin-right: .5rem

.initialism
  font-size: 90%
  text-transform: uppercase

.blockquote
  margin-bottom: 1rem
  font-size: 1.25rem

.blockquote-footer
  display: block
  font-size: 80%
  color: #6c757d

  &::before
    content: "\2014\00A0"

.img-fluid
  max-width: 100%
  height: auto

.img-thumbnail
  padding: .25rem
  background-color: #fff
  border: 1px solid #dee2e6
  border-radius: .25rem
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075)
  max-width: 100%
  height: auto

.figure
  display: inline-block

.figure-img
  margin-bottom: .5rem
  line-height: 1

.figure-caption
  font-size: 90%
  color: #6c757d

code
  font-size: 87.5%
  color: #e83e8c
  word-wrap: break-word

a > code
  color: inherit

kbd
  padding: .2rem .4rem
  font-size: 87.5%
  color: #fff
  background-color: #212529
  border-radius: .2rem
  box-shadow: inset 0 -0.1rem 0 rgba(0, 0, 0, 0.25)

  kbd
    padding: 0
    font-size: 100%
    font-weight: 700
    box-shadow: none

pre
  display: block
  font-size: 87.5%
  color: #212529

  code
    font-size: inherit
    color: inherit
    word-break: normal

.pre-scrollable
  max-height: 340px
  overflow-y: scroll

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
  width: 100%
  padding-right: 7.5px
  padding-left: 7.5px
  margin-right: auto
  margin-left: auto

@media (min-width: 576px)
  .container, .container-sm
    max-width: 540px

@media (min-width: 768px)
  .container, .container-md, .container-sm
    max-width: 720px

@media (min-width: 992px)
  .container, .container-lg, .container-md, .container-sm
    max-width: 960px

@media (min-width: 1200px)
  .container, .container-lg, .container-md, .container-sm, .container-xl
    max-width: 1140px

.row
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  margin-right: -7.5px
  margin-left: -7.5px

.no-gutters
  margin-right: 0
  margin-left: 0

  >
    .col, [class*=col-]
      padding-right: 0
      padding-left: 0

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto
  position: relative
  width: 100%
  padding-right: 7.5px
  padding-left: 7.5px

.col
  -ms-flex-preferred-size: 0
  flex-basis: 0
  -ms-flex-positive: 1
  flex-grow: 1
  max-width: 100%

.row-cols-1 > *
  -ms-flex: 0 0 100%
  flex: 0 0 100%
  max-width: 100%

.row-cols-2 > *
  -ms-flex: 0 0 50%
  flex: 0 0 50%
  max-width: 50%

.row-cols-3 > *
  -ms-flex: 0 0 33.333333%
  flex: 0 0 33.333333%
  max-width: 33.333333%

.row-cols-4 > *
  -ms-flex: 0 0 25%
  flex: 0 0 25%
  max-width: 25%

.row-cols-5 > *
  -ms-flex: 0 0 20%
  flex: 0 0 20%
  max-width: 20%

.row-cols-6 > *
  -ms-flex: 0 0 16.666667%
  flex: 0 0 16.666667%
  max-width: 16.666667%

.col-auto
  -ms-flex: 0 0 auto
  flex: 0 0 auto
  width: auto
  max-width: 100%

.col-1
  -ms-flex: 0 0 8.333333%
  flex: 0 0 8.333333%
  max-width: 8.333333%

.col-2
  -ms-flex: 0 0 16.666667%
  flex: 0 0 16.666667%
  max-width: 16.666667%

.col-3
  -ms-flex: 0 0 25%
  flex: 0 0 25%
  max-width: 25%

.col-4
  -ms-flex: 0 0 33.333333%
  flex: 0 0 33.333333%
  max-width: 33.333333%

.col-5
  -ms-flex: 0 0 41.666667%
  flex: 0 0 41.666667%
  max-width: 41.666667%

.col-6
  -ms-flex: 0 0 50%
  flex: 0 0 50%
  max-width: 50%

.col-7
  -ms-flex: 0 0 58.333333%
  flex: 0 0 58.333333%
  max-width: 58.333333%

.col-8
  -ms-flex: 0 0 66.666667%
  flex: 0 0 66.666667%
  max-width: 66.666667%

.col-9
  -ms-flex: 0 0 75%
  flex: 0 0 75%
  max-width: 75%

.col-10
  -ms-flex: 0 0 83.333333%
  flex: 0 0 83.333333%
  max-width: 83.333333%

.col-11
  -ms-flex: 0 0 91.666667%
  flex: 0 0 91.666667%
  max-width: 91.666667%

.col-12
  -ms-flex: 0 0 100%
  flex: 0 0 100%
  max-width: 100%

.order-first
  -ms-flex-order: -1
  order: -1

.order-last
  -ms-flex-order: 13
  order: 13

.order-0
  -ms-flex-order: 0
  order: 0

.order-1
  -ms-flex-order: 1
  order: 1

.order-2
  -ms-flex-order: 2
  order: 2

.order-3
  -ms-flex-order: 3
  order: 3

.order-4
  -ms-flex-order: 4
  order: 4

.order-5
  -ms-flex-order: 5
  order: 5

.order-6
  -ms-flex-order: 6
  order: 6

.order-7
  -ms-flex-order: 7
  order: 7

.order-8
  -ms-flex-order: 8
  order: 8

.order-9
  -ms-flex-order: 9
  order: 9

.order-10
  -ms-flex-order: 10
  order: 10

.order-11
  -ms-flex-order: 11
  order: 11

.order-12
  -ms-flex-order: 12
  order: 12

.offset-1
  margin-left: 8.333333%

.offset-2
  margin-left: 16.666667%

.offset-3
  margin-left: 25%

.offset-4
  margin-left: 33.333333%

.offset-5
  margin-left: 41.666667%

.offset-6
  margin-left: 50%

.offset-7
  margin-left: 58.333333%

.offset-8
  margin-left: 66.666667%

.offset-9
  margin-left: 75%

.offset-10
  margin-left: 83.333333%

.offset-11
  margin-left: 91.666667%

@media (min-width: 576px)
  .col-sm
    -ms-flex-preferred-size: 0
    flex-basis: 0
    -ms-flex-positive: 1
    flex-grow: 1
    max-width: 100%

  .row-cols-sm-1 > *
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .row-cols-sm-2 > *
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .row-cols-sm-3 > *
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .row-cols-sm-4 > *
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .row-cols-sm-5 > *
    -ms-flex: 0 0 20%
    flex: 0 0 20%
    max-width: 20%

  .row-cols-sm-6 > *
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-sm-auto
    -ms-flex: 0 0 auto
    flex: 0 0 auto
    width: auto
    max-width: 100%

  .col-sm-1
    -ms-flex: 0 0 8.333333%
    flex: 0 0 8.333333%
    max-width: 8.333333%

  .col-sm-2
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-sm-3
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .col-sm-4
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .col-sm-5
    -ms-flex: 0 0 41.666667%
    flex: 0 0 41.666667%
    max-width: 41.666667%

  .col-sm-6
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .col-sm-7
    -ms-flex: 0 0 58.333333%
    flex: 0 0 58.333333%
    max-width: 58.333333%

  .col-sm-8
    -ms-flex: 0 0 66.666667%
    flex: 0 0 66.666667%
    max-width: 66.666667%

  .col-sm-9
    -ms-flex: 0 0 75%
    flex: 0 0 75%
    max-width: 75%

  .col-sm-10
    -ms-flex: 0 0 83.333333%
    flex: 0 0 83.333333%
    max-width: 83.333333%

  .col-sm-11
    -ms-flex: 0 0 91.666667%
    flex: 0 0 91.666667%
    max-width: 91.666667%

  .col-sm-12
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .order-sm-first
    -ms-flex-order: -1
    order: -1

  .order-sm-last
    -ms-flex-order: 13
    order: 13

  .order-sm-0
    -ms-flex-order: 0
    order: 0

  .order-sm-1
    -ms-flex-order: 1
    order: 1

  .order-sm-2
    -ms-flex-order: 2
    order: 2

  .order-sm-3
    -ms-flex-order: 3
    order: 3

  .order-sm-4
    -ms-flex-order: 4
    order: 4

  .order-sm-5
    -ms-flex-order: 5
    order: 5

  .order-sm-6
    -ms-flex-order: 6
    order: 6

  .order-sm-7
    -ms-flex-order: 7
    order: 7

  .order-sm-8
    -ms-flex-order: 8
    order: 8

  .order-sm-9
    -ms-flex-order: 9
    order: 9

  .order-sm-10
    -ms-flex-order: 10
    order: 10

  .order-sm-11
    -ms-flex-order: 11
    order: 11

  .order-sm-12
    -ms-flex-order: 12
    order: 12

  .offset-sm-0
    margin-left: 0

  .offset-sm-1
    margin-left: 8.333333%

  .offset-sm-2
    margin-left: 16.666667%

  .offset-sm-3
    margin-left: 25%

  .offset-sm-4
    margin-left: 33.333333%

  .offset-sm-5
    margin-left: 41.666667%

  .offset-sm-6
    margin-left: 50%

  .offset-sm-7
    margin-left: 58.333333%

  .offset-sm-8
    margin-left: 66.666667%

  .offset-sm-9
    margin-left: 75%

  .offset-sm-10
    margin-left: 83.333333%

  .offset-sm-11
    margin-left: 91.666667%

@media (min-width: 768px)
  .col-md
    -ms-flex-preferred-size: 0
    flex-basis: 0
    -ms-flex-positive: 1
    flex-grow: 1
    max-width: 100%

  .row-cols-md-1 > *
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .row-cols-md-2 > *
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .row-cols-md-3 > *
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .row-cols-md-4 > *
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .row-cols-md-5 > *
    -ms-flex: 0 0 20%
    flex: 0 0 20%
    max-width: 20%

  .row-cols-md-6 > *
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-md-auto
    -ms-flex: 0 0 auto
    flex: 0 0 auto
    width: auto
    max-width: 100%

  .col-md-1
    -ms-flex: 0 0 8.333333%
    flex: 0 0 8.333333%
    max-width: 8.333333%

  .col-md-2
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-md-3
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .col-md-4
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .col-md-5
    -ms-flex: 0 0 41.666667%
    flex: 0 0 41.666667%
    max-width: 41.666667%

  .col-md-6
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .col-md-7
    -ms-flex: 0 0 58.333333%
    flex: 0 0 58.333333%
    max-width: 58.333333%

  .col-md-8
    -ms-flex: 0 0 66.666667%
    flex: 0 0 66.666667%
    max-width: 66.666667%

  .col-md-9
    -ms-flex: 0 0 75%
    flex: 0 0 75%
    max-width: 75%

  .col-md-10
    -ms-flex: 0 0 83.333333%
    flex: 0 0 83.333333%
    max-width: 83.333333%

  .col-md-11
    -ms-flex: 0 0 91.666667%
    flex: 0 0 91.666667%
    max-width: 91.666667%

  .col-md-12
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .order-md-first
    -ms-flex-order: -1
    order: -1

  .order-md-last
    -ms-flex-order: 13
    order: 13

  .order-md-0
    -ms-flex-order: 0
    order: 0

  .order-md-1
    -ms-flex-order: 1
    order: 1

  .order-md-2
    -ms-flex-order: 2
    order: 2

  .order-md-3
    -ms-flex-order: 3
    order: 3

  .order-md-4
    -ms-flex-order: 4
    order: 4

  .order-md-5
    -ms-flex-order: 5
    order: 5

  .order-md-6
    -ms-flex-order: 6
    order: 6

  .order-md-7
    -ms-flex-order: 7
    order: 7

  .order-md-8
    -ms-flex-order: 8
    order: 8

  .order-md-9
    -ms-flex-order: 9
    order: 9

  .order-md-10
    -ms-flex-order: 10
    order: 10

  .order-md-11
    -ms-flex-order: 11
    order: 11

  .order-md-12
    -ms-flex-order: 12
    order: 12

  .offset-md-0
    margin-left: 0

  .offset-md-1
    margin-left: 8.333333%

  .offset-md-2
    margin-left: 16.666667%

  .offset-md-3
    margin-left: 25%

  .offset-md-4
    margin-left: 33.333333%

  .offset-md-5
    margin-left: 41.666667%

  .offset-md-6
    margin-left: 50%

  .offset-md-7
    margin-left: 58.333333%

  .offset-md-8
    margin-left: 66.666667%

  .offset-md-9
    margin-left: 75%

  .offset-md-10
    margin-left: 83.333333%

  .offset-md-11
    margin-left: 91.666667%

@media (min-width: 992px)
  .col-lg
    -ms-flex-preferred-size: 0
    flex-basis: 0
    -ms-flex-positive: 1
    flex-grow: 1
    max-width: 100%

  .row-cols-lg-1 > *
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .row-cols-lg-2 > *
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .row-cols-lg-3 > *
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .row-cols-lg-4 > *
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .row-cols-lg-5 > *
    -ms-flex: 0 0 20%
    flex: 0 0 20%
    max-width: 20%

  .row-cols-lg-6 > *
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-lg-auto
    -ms-flex: 0 0 auto
    flex: 0 0 auto
    width: auto
    max-width: 100%

  .col-lg-1
    -ms-flex: 0 0 8.333333%
    flex: 0 0 8.333333%
    max-width: 8.333333%

  .col-lg-2
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-lg-3
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .col-lg-4
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .col-lg-5
    -ms-flex: 0 0 41.666667%
    flex: 0 0 41.666667%
    max-width: 41.666667%

  .col-lg-6
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .col-lg-7
    -ms-flex: 0 0 58.333333%
    flex: 0 0 58.333333%
    max-width: 58.333333%

  .col-lg-8
    -ms-flex: 0 0 66.666667%
    flex: 0 0 66.666667%
    max-width: 66.666667%

  .col-lg-9
    -ms-flex: 0 0 75%
    flex: 0 0 75%
    max-width: 75%

  .col-lg-10
    -ms-flex: 0 0 83.333333%
    flex: 0 0 83.333333%
    max-width: 83.333333%

  .col-lg-11
    -ms-flex: 0 0 91.666667%
    flex: 0 0 91.666667%
    max-width: 91.666667%

  .col-lg-12
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .order-lg-first
    -ms-flex-order: -1
    order: -1

  .order-lg-last
    -ms-flex-order: 13
    order: 13

  .order-lg-0
    -ms-flex-order: 0
    order: 0

  .order-lg-1
    -ms-flex-order: 1
    order: 1

  .order-lg-2
    -ms-flex-order: 2
    order: 2

  .order-lg-3
    -ms-flex-order: 3
    order: 3

  .order-lg-4
    -ms-flex-order: 4
    order: 4

  .order-lg-5
    -ms-flex-order: 5
    order: 5

  .order-lg-6
    -ms-flex-order: 6
    order: 6

  .order-lg-7
    -ms-flex-order: 7
    order: 7

  .order-lg-8
    -ms-flex-order: 8
    order: 8

  .order-lg-9
    -ms-flex-order: 9
    order: 9

  .order-lg-10
    -ms-flex-order: 10
    order: 10

  .order-lg-11
    -ms-flex-order: 11
    order: 11

  .order-lg-12
    -ms-flex-order: 12
    order: 12

  .offset-lg-0
    margin-left: 0

  .offset-lg-1
    margin-left: 8.333333%

  .offset-lg-2
    margin-left: 16.666667%

  .offset-lg-3
    margin-left: 25%

  .offset-lg-4
    margin-left: 33.333333%

  .offset-lg-5
    margin-left: 41.666667%

  .offset-lg-6
    margin-left: 50%

  .offset-lg-7
    margin-left: 58.333333%

  .offset-lg-8
    margin-left: 66.666667%

  .offset-lg-9
    margin-left: 75%

  .offset-lg-10
    margin-left: 83.333333%

  .offset-lg-11
    margin-left: 91.666667%

@media (min-width: 1200px)
  .col-xl
    -ms-flex-preferred-size: 0
    flex-basis: 0
    -ms-flex-positive: 1
    flex-grow: 1
    max-width: 100%

  .row-cols-xl-1 > *
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .row-cols-xl-2 > *
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .row-cols-xl-3 > *
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .row-cols-xl-4 > *
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .row-cols-xl-5 > *
    -ms-flex: 0 0 20%
    flex: 0 0 20%
    max-width: 20%

  .row-cols-xl-6 > *
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-xl-auto
    -ms-flex: 0 0 auto
    flex: 0 0 auto
    width: auto
    max-width: 100%

  .col-xl-1
    -ms-flex: 0 0 8.333333%
    flex: 0 0 8.333333%
    max-width: 8.333333%

  .col-xl-2
    -ms-flex: 0 0 16.666667%
    flex: 0 0 16.666667%
    max-width: 16.666667%

  .col-xl-3
    -ms-flex: 0 0 25%
    flex: 0 0 25%
    max-width: 25%

  .col-xl-4
    -ms-flex: 0 0 33.333333%
    flex: 0 0 33.333333%
    max-width: 33.333333%

  .col-xl-5
    -ms-flex: 0 0 41.666667%
    flex: 0 0 41.666667%
    max-width: 41.666667%

  .col-xl-6
    -ms-flex: 0 0 50%
    flex: 0 0 50%
    max-width: 50%

  .col-xl-7
    -ms-flex: 0 0 58.333333%
    flex: 0 0 58.333333%
    max-width: 58.333333%

  .col-xl-8
    -ms-flex: 0 0 66.666667%
    flex: 0 0 66.666667%
    max-width: 66.666667%

  .col-xl-9
    -ms-flex: 0 0 75%
    flex: 0 0 75%
    max-width: 75%

  .col-xl-10
    -ms-flex: 0 0 83.333333%
    flex: 0 0 83.333333%
    max-width: 83.333333%

  .col-xl-11
    -ms-flex: 0 0 91.666667%
    flex: 0 0 91.666667%
    max-width: 91.666667%

  .col-xl-12
    -ms-flex: 0 0 100%
    flex: 0 0 100%
    max-width: 100%

  .order-xl-first
    -ms-flex-order: -1
    order: -1

  .order-xl-last
    -ms-flex-order: 13
    order: 13

  .order-xl-0
    -ms-flex-order: 0
    order: 0

  .order-xl-1
    -ms-flex-order: 1
    order: 1

  .order-xl-2
    -ms-flex-order: 2
    order: 2

  .order-xl-3
    -ms-flex-order: 3
    order: 3

  .order-xl-4
    -ms-flex-order: 4
    order: 4

  .order-xl-5
    -ms-flex-order: 5
    order: 5

  .order-xl-6
    -ms-flex-order: 6
    order: 6

  .order-xl-7
    -ms-flex-order: 7
    order: 7

  .order-xl-8
    -ms-flex-order: 8
    order: 8

  .order-xl-9
    -ms-flex-order: 9
    order: 9

  .order-xl-10
    -ms-flex-order: 10
    order: 10

  .order-xl-11
    -ms-flex-order: 11
    order: 11

  .order-xl-12
    -ms-flex-order: 12
    order: 12

  .offset-xl-0
    margin-left: 0

  .offset-xl-1
    margin-left: 8.333333%

  .offset-xl-2
    margin-left: 16.666667%

  .offset-xl-3
    margin-left: 25%

  .offset-xl-4
    margin-left: 33.333333%

  .offset-xl-5
    margin-left: 41.666667%

  .offset-xl-6
    margin-left: 50%

  .offset-xl-7
    margin-left: 58.333333%

  .offset-xl-8
    margin-left: 66.666667%

  .offset-xl-9
    margin-left: 75%

  .offset-xl-10
    margin-left: 83.333333%

  .offset-xl-11
    margin-left: 91.666667%

.table
  width: 100%
  margin-bottom: 1rem
  color: #212529
  background-color: transparent

  td, th
    padding: .75rem
    vertical-align: top
    border-top: 1px solid #dee2e6

  thead th
    vertical-align: bottom
    border-bottom: 2px solid #dee2e6

  tbody + tbody
    border-top: 2px solid #dee2e6

.table-sm
  td, th
    padding: .3rem

.table-bordered
  border: 1px solid #dee2e6

  td, th
    border: 1px solid #dee2e6

  thead
    td, th
      border-bottom-width: 2px

.table-borderless
  tbody + tbody, td, th, thead th
    border: 0

.table-striped tbody tr:nth-of-type(odd)
  background-color: rgba(0, 0, 0, 0.05)

.table-hover tbody tr:hover
  color: #212529
  background-color: rgba(0, 0, 0, 0.075)

.table-primary
  background-color: #b8daff

  >
    td, th
      background-color: #b8daff

  tbody + tbody, td, th, thead th
    border-color: #7abaff

.table-hover .table-primary:hover
  background-color: #9fcdff

  >
    td, th
      background-color: #9fcdff

.table-secondary
  background-color: #d6d8db

  >
    td, th
      background-color: #d6d8db

  tbody + tbody, td, th, thead th
    border-color: #b3b7bb

.table-hover .table-secondary:hover
  background-color: #c8cbcf

  >
    td, th
      background-color: #c8cbcf

.table-success
  background-color: #c3e6cb

  >
    td, th
      background-color: #c3e6cb

  tbody + tbody, td, th, thead th
    border-color: #8fd19e

.table-hover .table-success:hover
  background-color: #b1dfbb

  >
    td, th
      background-color: #b1dfbb

.table-info
  background-color: #bee5eb

  >
    td, th
      background-color: #bee5eb

  tbody + tbody, td, th, thead th
    border-color: #86cfda

.table-hover .table-info:hover
  background-color: #abdde5

  >
    td, th
      background-color: #abdde5

.table-warning
  background-color: #ffeeba

  >
    td, th
      background-color: #ffeeba

  tbody + tbody, td, th, thead th
    border-color: #ffdf7e

.table-hover .table-warning:hover
  background-color: #ffe8a1

  >
    td, th
      background-color: #ffe8a1

.table-danger
  background-color: #f5c6cb

  >
    td, th
      background-color: #f5c6cb

  tbody + tbody, td, th, thead th
    border-color: #ed969e

.table-hover .table-danger:hover
  background-color: #f1b0b7

  >
    td, th
      background-color: #f1b0b7

.table-light
  background-color: #fdfdfe

  >
    td, th
      background-color: #fdfdfe

  tbody + tbody, td, th, thead th
    border-color: #fbfcfc

.table-hover .table-light:hover
  background-color: #ececf6

  >
    td, th
      background-color: #ececf6

.table-dark
  background-color: #c6c8ca

  >
    td, th
      background-color: #c6c8ca

  tbody + tbody, td, th, thead th
    border-color: #95999c

.table-hover .table-dark:hover
  background-color: #b9bbbe

  >
    td, th
      background-color: #b9bbbe

.table-active
  background-color: rgba(0, 0, 0, 0.075)

  >
    td, th
      background-color: rgba(0, 0, 0, 0.075)

.table-hover .table-active:hover
  background-color: rgba(0, 0, 0, 0.075)

  >
    td, th
      background-color: rgba(0, 0, 0, 0.075)

.table
  .thead-dark th
    color: #fff
    background-color: #212529
    border-color: #383f45

  .thead-light th
    color: #495057
    background-color: #e9ecef
    border-color: #dee2e6

.table-dark
  color: #fff
  background-color: #212529

  td, th, thead th
    border-color: #383f45

  &.table-bordered
    border: 0

  &.table-striped tbody tr:nth-of-type(odd)
    background-color: rgba(255, 255, 255, 0.05)

  &.table-hover tbody tr:hover
    color: #fff
    background-color: rgba(255, 255, 255, 0.075)

@media (max-width: 575.98px)
  .table-responsive-sm
    display: block
    width: 100%
    overflow-x: auto
    -webkit-overflow-scrolling: touch

    > .table-bordered
      border: 0

@media (max-width: 767.98px)
  .table-responsive-md
    display: block
    width: 100%
    overflow-x: auto
    -webkit-overflow-scrolling: touch

    > .table-bordered
      border: 0

@media (max-width: 991.98px)
  .table-responsive-lg
    display: block
    width: 100%
    overflow-x: auto
    -webkit-overflow-scrolling: touch

    > .table-bordered
      border: 0

@media (max-width: 1199.98px)
  .table-responsive-xl
    display: block
    width: 100%
    overflow-x: auto
    -webkit-overflow-scrolling: touch

    > .table-bordered
      border: 0

.table-responsive
  display: block
  width: 100%
  overflow-x: auto
  -webkit-overflow-scrolling: touch

  > .table-bordered
    border: 0

.form-control
  display: block
  width: 100%
  height: calc(2.25rem + 2px)
  padding: .375rem .75rem
  font-size: 1rem
  font-weight: 400
  line-height: 1.5
  color: #495057
  background-color: #fff
  background-clip: padding-box
  border: 1px solid #ced4da
  border-radius: .25rem
  box-shadow: inset 0 0 0 transparent
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out

  &::-ms-expand
    background-color: transparent
    border: 0

  &:-moz-focusring
    color: transparent
    text-shadow: 0 0 0 #495057

  &:focus
    color: #495057
    background-color: #fff
    border-color: #80bdff
    outline: 0
    box-shadow: inset 0 0 0 transparent

  &::-webkit-input-placeholder, &::-moz-placeholder, &:-ms-input-placeholder, &::-ms-input-placeholder, &::placeholder
    color: #939ba2
    opacity: 1

  &:disabled, &[readonly]
    background-color: #e9ecef
    opacity: 1

@media (prefers-reduced-motion: reduce)
  .form-control
    transition: none

input
  &[type=date].form-control, &[type=datetime-local].form-control, &[type=month].form-control, &[type=time].form-control
    -webkit-appearance: none
    -moz-appearance: none
    appearance: none

select.form-control:focus::-ms-value
  color: #495057
  background-color: #fff

.form-control-file, .form-control-range
  display: block
  width: 100%

.col-form-label
  padding-top: calc(.375rem + 1px)
  padding-bottom: calc(.375rem + 1px)
  margin-bottom: 0
  font-size: inherit
  line-height: 1.5

.col-form-label-lg
  padding-top: calc(.5rem + 1px)
  padding-bottom: calc(.5rem + 1px)
  font-size: 1.25rem
  line-height: 1.5

.col-form-label-sm
  padding-top: calc(.25rem + 1px)
  padding-bottom: calc(.25rem + 1px)
  font-size: .875rem
  line-height: 1.5

.form-control-plaintext
  display: block
  width: 100%
  padding: .375rem 0
  margin-bottom: 0
  font-size: 1rem
  line-height: 1.5
  color: #212529
  background-color: transparent
  border: solid transparent
  border-width: 1px 0

  &.form-control-lg, &.form-control-sm
    padding-right: 0
    padding-left: 0

.form-control-sm
  height: calc(1.8125rem + 2px)
  padding: .25rem .5rem
  font-size: .875rem
  line-height: 1.5
  border-radius: .2rem

.form-control-lg
  height: calc(2.875rem + 2px)
  padding: .5rem 1rem
  font-size: 1.25rem
  line-height: 1.5
  border-radius: .3rem

select.form-control
  &[multiple], &[size]
    height: auto

textarea.form-control
  height: auto

.form-group
  margin-bottom: 1rem

.form-text
  display: block
  margin-top: .25rem

.form-row
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  margin-right: -5px
  margin-left: -5px

  >
    .col, [class*=col-]
      padding-right: 5px
      padding-left: 5px

.form-check
  position: relative
  display: block
  padding-left: 1.25rem

.form-check-input
  position: absolute
  margin-top: .3rem
  margin-left: -1.25rem

  &:disabled ~ .form-check-label, &[disabled] ~ .form-check-label
    color: #6c757d

.form-check-label
  margin-bottom: 0

.form-check-inline
  display: -ms-inline-flexbox
  display: inline-flex
  -ms-flex-align: center
  align-items: center
  padding-left: 0
  margin-right: .75rem

  .form-check-input
    position: static
    margin-top: 0
    margin-right: .3125rem
    margin-left: 0

.valid-feedback
  display: none
  width: 100%
  margin-top: .25rem
  font-size: 80%
  color: #28a745

.valid-tooltip
  position: absolute
  top: 100%
  left: 0
  z-index: 5
  display: none
  max-width: 100%
  padding: .25rem .5rem
  margin-top: .1rem
  font-size: .875rem
  line-height: 1.5
  color: #fff
  background-color: rgba(40, 167, 69, 0.9)
  border-radius: .25rem

.is-valid ~
  .valid-feedback, .valid-tooltip
    display: block

.was-validated :valid ~
  .valid-feedback, .valid-tooltip
    display: block

.form-control.is-valid, .was-validated .form-control:valid
  border-color: #28a745
  padding-right: 2.25rem
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e")
  background-repeat: no-repeat
  background-position: right calc(.375em + .1875rem) center
  background-size: calc(.75em + .375rem) calc(.75em + .375rem)

.form-control.is-valid:focus
  border-color: #28a745
  box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.25)

.was-validated
  .form-control:valid:focus
    border-color: #28a745
    box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.25)

  textarea.form-control:valid
    padding-right: 2.25rem
    background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem)

textarea.form-control.is-valid
  padding-right: 2.25rem
  background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem)

.custom-select.is-valid, .was-validated .custom-select:valid
  border-color: #28a745
  padding-right: calc(.75em + 2.3125rem)
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem (center / 8px) 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") #fff no-repeat center right (1.75rem / calc(.75em + .375rem)) calc(.75em + .375rem)

.custom-select.is-valid:focus, .was-validated .custom-select:valid:focus
  border-color: #28a745
  box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.25)

.form-check-input.is-valid ~ .form-check-label, .was-validated .form-check-input:valid ~ .form-check-label
  color: #28a745

.form-check-input.is-valid ~
  .valid-feedback, .valid-tooltip
    display: block

.was-validated .form-check-input:valid ~
  .valid-feedback, .valid-tooltip
    display: block

.custom-control-input.is-valid ~ .custom-control-label, .was-validated .custom-control-input:valid ~ .custom-control-label
  color: #28a745

.custom-control-input.is-valid ~ .custom-control-label::before, .was-validated .custom-control-input:valid ~ .custom-control-label::before
  border-color: #28a745

.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked ~ .custom-control-label::before
  border-color: #34ce57
  background-color: #34ce57

.custom-control-input.is-valid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus ~ .custom-control-label::before
  box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.25)

.custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before, .was-validated .custom-control-input:valid:focus:not(:checked) ~ .custom-control-label::before, .custom-file-input.is-valid ~ .custom-file-label, .was-validated .custom-file-input:valid ~ .custom-file-label
  border-color: #28a745

.custom-file-input.is-valid:focus ~ .custom-file-label, .was-validated .custom-file-input:valid:focus ~ .custom-file-label
  border-color: #28a745
  box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.25)

.invalid-feedback
  display: none
  width: 100%
  margin-top: .25rem
  font-size: 80%
  color: #dc3545

.invalid-tooltip
  position: absolute
  top: 100%
  left: 0
  z-index: 5
  display: none
  max-width: 100%
  padding: .25rem .5rem
  margin-top: .1rem
  font-size: .875rem
  line-height: 1.5
  color: #fff
  background-color: rgba(220, 53, 69, 0.9)
  border-radius: .25rem

.is-invalid ~
  .invalid-feedback, .invalid-tooltip
    display: block

.was-validated :invalid ~
  .invalid-feedback, .invalid-tooltip
    display: block

.form-control.is-invalid, .was-validated .form-control:invalid
  border-color: #dc3545
  padding-right: 2.25rem
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e")
  background-repeat: no-repeat
  background-position: right calc(.375em + .1875rem) center
  background-size: calc(.75em + .375rem) calc(.75em + .375rem)

.form-control.is-invalid:focus
  border-color: #dc3545
  box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.25)

.was-validated
  .form-control:invalid:focus
    border-color: #dc3545
    box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.25)

  textarea.form-control:invalid
    padding-right: 2.25rem
    background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem)

textarea.form-control.is-invalid
  padding-right: 2.25rem
  background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem)

.custom-select.is-invalid, .was-validated .custom-select:invalid
  border-color: #dc3545
  padding-right: calc(.75em + 2.3125rem)
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem (center / 8px) 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right (1.75rem / calc(.75em + .375rem)) calc(.75em + .375rem)

.custom-select.is-invalid:focus, .was-validated .custom-select:invalid:focus
  border-color: #dc3545
  box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.25)

.form-check-input.is-invalid ~ .form-check-label, .was-validated .form-check-input:invalid ~ .form-check-label
  color: #dc3545

.form-check-input.is-invalid ~
  .invalid-feedback, .invalid-tooltip
    display: block

.was-validated .form-check-input:invalid ~
  .invalid-feedback, .invalid-tooltip
    display: block

.custom-control-input.is-invalid ~ .custom-control-label, .was-validated .custom-control-input:invalid ~ .custom-control-label
  color: #dc3545

.custom-control-input.is-invalid ~ .custom-control-label::before, .was-validated .custom-control-input:invalid ~ .custom-control-label::before
  border-color: #dc3545

.custom-control-input.is-invalid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:checked ~ .custom-control-label::before
  border-color: #e4606d
  background-color: #e4606d

.custom-control-input.is-invalid:focus ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus ~ .custom-control-label::before
  box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.25)

.custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before, .was-validated .custom-control-input:invalid:focus:not(:checked) ~ .custom-control-label::before, .custom-file-input.is-invalid ~ .custom-file-label, .was-validated .custom-file-input:invalid ~ .custom-file-label
  border-color: #dc3545

.custom-file-input.is-invalid:focus ~ .custom-file-label, .was-validated .custom-file-input:invalid:focus ~ .custom-file-label
  border-color: #dc3545
  box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.25)

.form-inline
  display: -ms-flexbox
  display: flex
  -ms-flex-flow: row wrap
  flex-flow: row wrap
  -ms-flex-align: center
  align-items: center

  .form-check
    width: 100%

@media (min-width: 576px)
  .form-inline
    label
      display: -ms-flexbox
      display: flex
      -ms-flex-align: center
      align-items: center
      -ms-flex-pack: center
      justify-content: center
      margin-bottom: 0

    .form-group
      display: -ms-flexbox
      display: flex
      -ms-flex: 0 0 auto
      flex: 0 0 auto
      -ms-flex-flow: row wrap
      flex-flow: row wrap
      -ms-flex-align: center
      align-items: center
      margin-bottom: 0

    .form-control
      display: inline-block
      width: auto
      vertical-align: middle

    .form-control-plaintext
      display: inline-block

    .custom-select, .input-group
      width: auto

    .form-check
      display: -ms-flexbox
      display: flex
      -ms-flex-align: center
      align-items: center
      -ms-flex-pack: center
      justify-content: center
      width: auto
      padding-left: 0

    .form-check-input
      position: relative
      -ms-flex-negative: 0
      flex-shrink: 0
      margin-top: 0
      margin-right: .25rem
      margin-left: 0

    .custom-control
      -ms-flex-align: center
      align-items: center
      -ms-flex-pack: center
      justify-content: center

    .custom-control-label
      margin-bottom: 0

.btn
  display: inline-block
  font-weight: 400
  color: #212529
  text-align: center
  vertical-align: middle
  -webkit-user-select: none
  -moz-user-select: none
  -ms-user-select: none
  user-select: none
  background-color: transparent
  border: 1px solid transparent
  padding: .375rem .75rem
  font-size: 1rem
  line-height: 1.5
  border-radius: .25rem
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out

  &:hover
    color: #212529
    text-decoration: none

  &.focus, &:focus
    outline: 0
    box-shadow: none

  &.disabled, &:disabled
    opacity: .65
    box-shadow: none

  &:not(:disabled):not(.disabled)
    cursor: pointer

    &.active, &:active
      box-shadow: none

@media (prefers-reduced-motion: reduce)
  .btn
    transition: none

a.btn.disabled, fieldset:disabled a.btn
  pointer-events: none

.btn-primary
  color: #fff
  background-color: #007bff
  border-color: #007bff
  box-shadow: none

  &:hover
    color: #fff
    background-color: #0069d9
    border-color: #0062cc

  &.focus, &:focus
    color: #fff
    background-color: #0069d9
    border-color: #0062cc
    box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #007bff
    border-color: #007bff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #0062cc
      border-color: #005cbf

.show > .btn-primary.dropdown-toggle
  color: #fff
  background-color: #0062cc
  border-color: #005cbf

.btn-primary:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5)

.show > .btn-primary.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(38, 143, 255, 0.5)

.btn-secondary
  color: #fff
  background-color: #6c757d
  border-color: #6c757d
  box-shadow: none

  &:hover
    color: #fff
    background-color: #5a6268
    border-color: #545b62

  &.focus, &:focus
    color: #fff
    background-color: #5a6268
    border-color: #545b62
    box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #6c757d
    border-color: #6c757d

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #545b62
      border-color: #4e555b

.show > .btn-secondary.dropdown-toggle
  color: #fff
  background-color: #545b62
  border-color: #4e555b

.btn-secondary:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5)

.show > .btn-secondary.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(130, 138, 145, 0.5)

.btn-success
  color: #fff
  background-color: #28a745
  border-color: #28a745
  box-shadow: none

  &:hover
    color: #fff
    background-color: #218838
    border-color: #1e7e34

  &.focus, &:focus
    color: #fff
    background-color: #218838
    border-color: #1e7e34
    box-shadow: 0 0 0 0 rgba(72, 180, 97, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #28a745
    border-color: #28a745

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #1e7e34
      border-color: #1c7430

.show > .btn-success.dropdown-toggle
  color: #fff
  background-color: #1e7e34
  border-color: #1c7430

.btn-success:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(72, 180, 97, 0.5)

.show > .btn-success.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(72, 180, 97, 0.5)

.btn-info
  color: #fff
  background-color: #17a2b8
  border-color: #17a2b8
  box-shadow: none

  &:hover
    color: #fff
    background-color: #138496
    border-color: #117a8b

  &.focus, &:focus
    color: #fff
    background-color: #138496
    border-color: #117a8b
    box-shadow: 0 0 0 0 rgba(58, 176, 195, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #17a2b8
    border-color: #17a2b8

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #117a8b
      border-color: #10707f

.show > .btn-info.dropdown-toggle
  color: #fff
  background-color: #117a8b
  border-color: #10707f

.btn-info:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(58, 176, 195, 0.5)

.show > .btn-info.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(58, 176, 195, 0.5)

.btn-warning
  color: #1f2d3d
  background-color: #ffc107
  border-color: #ffc107
  box-shadow: none

  &:hover
    color: #1f2d3d
    background-color: #e0a800
    border-color: #d39e00

  &.focus, &:focus
    color: #1f2d3d
    background-color: #e0a800
    border-color: #d39e00
    box-shadow: 0 0 0 0 rgba(221, 171, 15, 0.5)

  &.disabled, &:disabled
    color: #1f2d3d
    background-color: #ffc107
    border-color: #ffc107

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #1f2d3d
      background-color: #d39e00
      border-color: #c69500

.show > .btn-warning.dropdown-toggle
  color: #1f2d3d
  background-color: #d39e00
  border-color: #c69500

.btn-warning:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(221, 171, 15, 0.5)

.show > .btn-warning.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(221, 171, 15, 0.5)

.btn-danger
  color: #fff
  background-color: #dc3545
  border-color: #dc3545
  box-shadow: none

  &:hover
    color: #fff
    background-color: #c82333
    border-color: #bd2130

  &.focus, &:focus
    color: #fff
    background-color: #c82333
    border-color: #bd2130
    box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #dc3545
    border-color: #dc3545

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #bd2130
      border-color: #b21f2d

.show > .btn-danger.dropdown-toggle
  color: #fff
  background-color: #bd2130
  border-color: #b21f2d

.btn-danger:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5)

.show > .btn-danger.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(225, 83, 97, 0.5)

.btn-light
  color: #1f2d3d
  background-color: #f8f9fa
  border-color: #f8f9fa
  box-shadow: none

  &:hover
    color: #1f2d3d
    background-color: #e2e6ea
    border-color: #dae0e5

  &.focus, &:focus
    color: #1f2d3d
    background-color: #e2e6ea
    border-color: #dae0e5
    box-shadow: 0 0 0 0 rgba(215, 218, 222, 0.5)

  &.disabled, &:disabled
    color: #1f2d3d
    background-color: #f8f9fa
    border-color: #f8f9fa

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #1f2d3d
      background-color: #dae0e5
      border-color: #d3d9df

.show > .btn-light.dropdown-toggle
  color: #1f2d3d
  background-color: #dae0e5
  border-color: #d3d9df

.btn-light:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(215, 218, 222, 0.5)

.show > .btn-light.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(215, 218, 222, 0.5)

.btn-dark
  color: #fff
  background-color: #343a40
  border-color: #343a40
  box-shadow: none

  &:hover
    color: #fff
    background-color: #23272b
    border-color: #1d2124

  &.focus, &:focus
    color: #fff
    background-color: #23272b
    border-color: #1d2124
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5)

  &.disabled, &:disabled
    color: #fff
    background-color: #343a40
    border-color: #343a40

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #1d2124
      border-color: #171a1d

.show > .btn-dark.dropdown-toggle
  color: #fff
  background-color: #1d2124
  border-color: #171a1d

.btn-dark:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5)

.show > .btn-dark.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5)

.btn-outline-primary
  color: #007bff
  border-color: #007bff

  &:hover
    color: #fff
    background-color: #007bff
    border-color: #007bff

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.5)

  &.disabled, &:disabled
    color: #007bff
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #007bff
      border-color: #007bff

.show > .btn-outline-primary.dropdown-toggle
  color: #fff
  background-color: #007bff
  border-color: #007bff

.btn-outline-primary:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.5)

.show > .btn-outline-primary.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.5)

.btn-outline-secondary
  color: #6c757d
  border-color: #6c757d

  &:hover
    color: #fff
    background-color: #6c757d
    border-color: #6c757d

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5)

  &.disabled, &:disabled
    color: #6c757d
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #6c757d
      border-color: #6c757d

.show > .btn-outline-secondary.dropdown-toggle
  color: #fff
  background-color: #6c757d
  border-color: #6c757d

.btn-outline-secondary:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5)

.show > .btn-outline-secondary.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(108, 117, 125, 0.5)

.btn-outline-success
  color: #28a745
  border-color: #28a745

  &:hover
    color: #fff
    background-color: #28a745
    border-color: #28a745

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.5)

  &.disabled, &:disabled
    color: #28a745
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #28a745
      border-color: #28a745

.show > .btn-outline-success.dropdown-toggle
  color: #fff
  background-color: #28a745
  border-color: #28a745

.btn-outline-success:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.5)

.show > .btn-outline-success.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(40, 167, 69, 0.5)

.btn-outline-info
  color: #17a2b8
  border-color: #17a2b8

  &:hover
    color: #fff
    background-color: #17a2b8
    border-color: #17a2b8

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(23, 162, 184, 0.5)

  &.disabled, &:disabled
    color: #17a2b8
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #17a2b8
      border-color: #17a2b8

.show > .btn-outline-info.dropdown-toggle
  color: #fff
  background-color: #17a2b8
  border-color: #17a2b8

.btn-outline-info:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(23, 162, 184, 0.5)

.show > .btn-outline-info.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(23, 162, 184, 0.5)

.btn-outline-warning
  color: #ffc107
  border-color: #ffc107

  &:hover
    color: #1f2d3d
    background-color: #ffc107
    border-color: #ffc107

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5)

  &.disabled, &:disabled
    color: #ffc107
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #1f2d3d
      background-color: #ffc107
      border-color: #ffc107

.show > .btn-outline-warning.dropdown-toggle
  color: #1f2d3d
  background-color: #ffc107
  border-color: #ffc107

.btn-outline-warning:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5)

.show > .btn-outline-warning.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.5)

.btn-outline-danger
  color: #dc3545
  border-color: #dc3545

  &:hover
    color: #fff
    background-color: #dc3545
    border-color: #dc3545

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5)

  &.disabled, &:disabled
    color: #dc3545
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #dc3545
      border-color: #dc3545

.show > .btn-outline-danger.dropdown-toggle
  color: #fff
  background-color: #dc3545
  border-color: #dc3545

.btn-outline-danger:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5)

.show > .btn-outline-danger.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.5)

.btn-outline-light
  color: #f8f9fa
  border-color: #f8f9fa

  &:hover
    color: #1f2d3d
    background-color: #f8f9fa
    border-color: #f8f9fa

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5)

  &.disabled, &:disabled
    color: #f8f9fa
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #1f2d3d
      background-color: #f8f9fa
      border-color: #f8f9fa

.show > .btn-outline-light.dropdown-toggle
  color: #1f2d3d
  background-color: #f8f9fa
  border-color: #f8f9fa

.btn-outline-light:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5)

.show > .btn-outline-light.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(248, 249, 250, 0.5)

.btn-outline-dark
  color: #343a40
  border-color: #343a40

  &:hover
    color: #fff
    background-color: #343a40
    border-color: #343a40

  &.focus, &:focus
    box-shadow: 0 0 0 0 rgba(52, 58, 64, 0.5)

  &.disabled, &:disabled
    color: #343a40
    background-color: transparent

  &:not(:disabled):not(.disabled)
    &.active, &:active
      color: #fff
      background-color: #343a40
      border-color: #343a40

.show > .btn-outline-dark.dropdown-toggle
  color: #fff
  background-color: #343a40
  border-color: #343a40

.btn-outline-dark:not(:disabled):not(.disabled)
  &.active:focus, &:active:focus
    box-shadow: 0 0 0 0 rgba(52, 58, 64, 0.5)

.show > .btn-outline-dark.dropdown-toggle:focus
  box-shadow: 0 0 0 0 rgba(52, 58, 64, 0.5)

.btn-link
  font-weight: 400
  color: #007bff
  text-decoration: none

  &:hover
    color: #0056b3
    text-decoration: none

  &.focus, &:focus
    text-decoration: none

  &.disabled, &:disabled
    color: #6c757d
    pointer-events: none

.btn-group-lg > .btn, .btn-lg
  padding: .5rem 1rem
  font-size: 1.25rem
  line-height: 1.5
  border-radius: .3rem

.btn-group-sm > .btn, .btn-sm
  padding: .25rem .5rem
  font-size: .875rem
  line-height: 1.5
  border-radius: .2rem

.btn-block
  display: block
  width: 100%

  + .btn-block
    margin-top: .5rem

input
  &[type=button].btn-block, &[type=reset].btn-block, &[type=submit].btn-block
    width: 100%

.fade
  transition: opacity .15s linear

  &:not(.show)
    opacity: 0

@media (prefers-reduced-motion: reduce)
  .fade
    transition: none

.collapse:not(.show)
  display: none

.collapsing
  position: relative
  height: 0
  overflow: hidden
  transition: height .35s ease

@media (prefers-reduced-motion: reduce)
  .collapsing
    transition: none

.dropdown, .dropleft, .dropright, .dropup
  position: relative

.dropdown-toggle
  white-space: nowrap

  &::after
    display: inline-block
    margin-left: .255em
    vertical-align: .255em
    content: ""
    border-top: .3em solid
    border-right: .3em solid transparent
    border-bottom: 0
    border-left: .3em solid transparent

  &:empty::after
    margin-left: 0

.dropdown-menu
  position: absolute
  top: 100%
  left: 0
  z-index: 1000
  display: none
  float: left
  min-width: 10rem
  padding: .5rem 0
  margin: .125rem 0 0
  font-size: 1rem
  color: #212529
  text-align: left
  list-style: none
  background-color: #fff
  background-clip: padding-box
  border: 1px solid rgba(0, 0, 0, 0.15)
  border-radius: .25rem
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175)

.dropdown-menu-left
  right: auto
  left: 0

.dropdown-menu-right
  right: 0
  left: auto

@media (min-width: 576px)
  .dropdown-menu-sm-left
    right: auto
    left: 0

  .dropdown-menu-sm-right
    right: 0
    left: auto

@media (min-width: 768px)
  .dropdown-menu-md-left
    right: auto
    left: 0

  .dropdown-menu-md-right
    right: 0
    left: auto

@media (min-width: 992px)
  .dropdown-menu-lg-left
    right: auto
    left: 0

  .dropdown-menu-lg-right
    right: 0
    left: auto

@media (min-width: 1200px)
  .dropdown-menu-xl-left
    right: auto
    left: 0

  .dropdown-menu-xl-right
    right: 0
    left: auto

.dropup
  .dropdown-menu
    top: auto
    bottom: 100%
    margin-top: 0
    margin-bottom: .125rem

  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: .255em
      vertical-align: .255em
      content: ""
      border-top: 0
      border-right: .3em solid transparent
      border-bottom: .3em solid
      border-left: .3em solid transparent

    &:empty::after
      margin-left: 0

.dropright
  .dropdown-menu
    top: 0
    right: auto
    left: 100%
    margin-top: 0
    margin-left: .125rem

  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: .255em
      vertical-align: .255em
      content: ""
      border-top: .3em solid transparent
      border-right: 0
      border-bottom: .3em solid transparent
      border-left: .3em solid

    &:empty::after
      margin-left: 0

    &::after
      vertical-align: 0

.dropleft
  .dropdown-menu
    top: 0
    right: 100%
    left: auto
    margin-top: 0
    margin-right: .125rem

  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: .255em
      vertical-align: .255em
      content: ""
      display: none

    &::before
      display: inline-block
      margin-right: .255em
      vertical-align: .255em
      content: ""
      border-top: .3em solid transparent
      border-right: .3em solid
      border-bottom: .3em solid transparent

    &:empty::after
      margin-left: 0

    &::before
      vertical-align: 0

.dropdown-menu
  &[x-placement^=bottom], &[x-placement^=left], &[x-placement^=right], &[x-placement^=top]
    right: auto
    bottom: auto

.dropdown-divider
  height: 0
  margin: .5rem 0
  overflow: hidden
  border-top: 1px solid #e9ecef

.dropdown-item
  display: block
  width: 100%
  padding: .25rem 1rem
  clear: both
  font-weight: 400
  color: #212529
  text-align: inherit
  white-space: nowrap
  background-color: transparent
  border: 0

  &:focus, &:hover
    color: #16181b
    text-decoration: none
    background-color: #f8f9fa

  &.active, &:active
    color: #fff
    text-decoration: none
    background-color: #007bff

  &.disabled, &:disabled
    color: #6c757d
    pointer-events: none
    background-color: transparent

.dropdown-menu.show
  display: block

.dropdown-header
  display: block
  padding: .5rem 1rem
  margin-bottom: 0
  font-size: .875rem
  color: #6c757d
  white-space: nowrap

.dropdown-item-text
  display: block
  padding: .25rem 1rem
  color: #212529

.btn-group
  position: relative
  display: -ms-inline-flexbox
  display: inline-flex
  vertical-align: middle

.btn-group-vertical
  position: relative
  display: -ms-inline-flexbox
  display: inline-flex
  vertical-align: middle

  > .btn
    position: relative
    -ms-flex: 1 1 auto
    flex: 1 1 auto

.btn-group > .btn
  position: relative
  -ms-flex: 1 1 auto
  flex: 1 1 auto

.btn-group-vertical > .btn:hover, .btn-group > .btn:hover
  z-index: 1

.btn-group-vertical > .btn
  &.active, &:active, &:focus
    z-index: 1

.btn-group > .btn
  &.active, &:active, &:focus
    z-index: 1

.btn-toolbar
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  -ms-flex-pack: start
  justify-content: flex-start

  .input-group
    width: auto

.btn-group >
  .btn-group:not(:first-child), .btn:not(:first-child)
    margin-left: -1px

  .btn-group:not(:last-child) > .btn, .btn:not(:last-child):not(.dropdown-toggle)
    border-top-right-radius: 0
    border-bottom-right-radius: 0

  .btn-group:not(:first-child) > .btn, .btn:not(:first-child)
    border-top-left-radius: 0
    border-bottom-left-radius: 0

.dropdown-toggle-split
  padding-right: .5625rem
  padding-left: .5625rem

  &::after
    margin-left: 0

.dropright .dropdown-toggle-split::after, .dropup .dropdown-toggle-split::after
  margin-left: 0

.dropleft .dropdown-toggle-split::before
  margin-right: 0

.btn-group-sm > .btn + .dropdown-toggle-split, .btn-sm + .dropdown-toggle-split
  padding-right: .375rem
  padding-left: .375rem

.btn-group-lg > .btn + .dropdown-toggle-split, .btn-lg + .dropdown-toggle-split
  padding-right: .75rem
  padding-left: .75rem

.btn-group.show .dropdown-toggle
  box-shadow: none

  &.btn-link
    box-shadow: none

.btn-group-vertical
  -ms-flex-direction: column
  flex-direction: column
  -ms-flex-align: start
  align-items: flex-start
  -ms-flex-pack: center
  justify-content: center

  >
    .btn
      width: 100%

    .btn-group
      width: 100%

      &:not(:first-child)
        margin-top: -1px

    .btn:not(:first-child)
      margin-top: -1px

    .btn-group:not(:last-child) > .btn, .btn:not(:last-child):not(.dropdown-toggle)
      border-bottom-right-radius: 0
      border-bottom-left-radius: 0

    .btn-group:not(:first-child) > .btn, .btn:not(:first-child)
      border-top-left-radius: 0
      border-top-right-radius: 0

.btn-group-toggle >
  .btn, .btn-group > .btn
    margin-bottom: 0

  .btn input
    &[type=checkbox], &[type=radio]
      position: absolute
      clip: rect(0, 0, 0, 0)
      pointer-events: none

  .btn-group > .btn input
    &[type=checkbox], &[type=radio]
      position: absolute
      clip: rect(0, 0, 0, 0)
      pointer-events: none

.input-group
  position: relative
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  -ms-flex-align: stretch
  align-items: stretch
  width: 100%

  >
    .custom-file, .custom-select, .form-control, .form-control-plaintext
      position: relative
      -ms-flex: 1 1 auto
      flex: 1 1 auto
      width: 1%
      min-width: 0
      margin-bottom: 0

    .custom-file +
      .custom-file, .custom-select, .form-control
        margin-left: -1px

    .custom-select +
      .custom-file, .custom-select, .form-control
        margin-left: -1px

    .form-control +
      .custom-file, .custom-select, .form-control
        margin-left: -1px

    .form-control-plaintext +
      .custom-file, .custom-select, .form-control
        margin-left: -1px

    .custom-file .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus
      z-index: 3

    .custom-file .custom-file-input:focus
      z-index: 4

    .custom-select:not(:last-child), .form-control:not(:last-child)
      border-top-right-radius: 0
      border-bottom-right-radius: 0

    .custom-select:not(:first-child), .form-control:not(:first-child)
      border-top-left-radius: 0
      border-bottom-left-radius: 0

    .custom-file
      display: -ms-flexbox
      display: flex
      -ms-flex-align: center
      align-items: center

      &:not(:last-child) .custom-file-label
        border-top-right-radius: 0
        border-bottom-right-radius: 0

        &::after
          border-top-right-radius: 0
          border-bottom-right-radius: 0

      &:not(:first-child) .custom-file-label
        border-top-left-radius: 0
        border-bottom-left-radius: 0

.input-group-append, .input-group-prepend
  display: -ms-flexbox
  display: flex

.input-group-append .btn, .input-group-prepend .btn
  position: relative
  z-index: 2

.input-group-append .btn:focus, .input-group-prepend .btn:focus
  z-index: 3

.input-group-append
  .btn +
    .btn, .input-group-text
      margin-left: -1px

  .input-group-text +
    .btn, .input-group-text
      margin-left: -1px

.input-group-prepend
  .btn +
    .btn, .input-group-text
      margin-left: -1px

  .input-group-text +
    .btn, .input-group-text
      margin-left: -1px

  margin-right: -1px

.input-group-append
  margin-left: -1px

.input-group-text
  display: -ms-flexbox
  display: flex
  -ms-flex-align: center
  align-items: center
  padding: .375rem .75rem
  margin-bottom: 0
  font-size: 1rem
  font-weight: 400
  line-height: 1.5
  color: #495057
  text-align: center
  white-space: nowrap
  background-color: #e9ecef
  border: 1px solid #ced4da
  border-radius: .25rem

  input
    &[type=checkbox], &[type=radio]
      margin-top: 0

.input-group-lg >
  .custom-select, .form-control:not(textarea)
    height: calc(2.875rem + 2px)

  .custom-select, .form-control
    padding: .5rem 1rem
    font-size: 1.25rem
    line-height: 1.5
    border-radius: .3rem

  .input-group-append >
    .btn, .input-group-text
      padding: .5rem 1rem
      font-size: 1.25rem
      line-height: 1.5
      border-radius: .3rem

  .input-group-prepend >
    .btn, .input-group-text
      padding: .5rem 1rem
      font-size: 1.25rem
      line-height: 1.5
      border-radius: .3rem

.input-group-sm >
  .custom-select, .form-control:not(textarea)
    height: calc(1.8125rem + 2px)

  .custom-select, .form-control
    padding: .25rem .5rem
    font-size: .875rem
    line-height: 1.5
    border-radius: .2rem

  .input-group-append >
    .btn, .input-group-text
      padding: .25rem .5rem
      font-size: .875rem
      line-height: 1.5
      border-radius: .2rem

  .input-group-prepend >
    .btn, .input-group-text
      padding: .25rem .5rem
      font-size: .875rem
      line-height: 1.5
      border-radius: .2rem

.input-group-lg > .custom-select, .input-group-sm > .custom-select
  padding-right: 1.75rem

.input-group >
  .input-group-append
    &:last-child >
      .btn:not(:last-child):not(.dropdown-toggle), .input-group-text:not(:last-child)
        border-top-right-radius: 0
        border-bottom-right-radius: 0

    &:not(:last-child) >
      .btn, .input-group-text
        border-top-right-radius: 0
        border-bottom-right-radius: 0

  .input-group-prepend >
    .btn, .input-group-text
      border-top-right-radius: 0
      border-bottom-right-radius: 0

  .input-group-append >
    .btn, .input-group-text
      border-top-left-radius: 0
      border-bottom-left-radius: 0

  .input-group-prepend
    &:first-child >
      .btn:not(:first-child), .input-group-text:not(:first-child)
        border-top-left-radius: 0
        border-bottom-left-radius: 0

    &:not(:first-child) >
      .btn, .input-group-text
        border-top-left-radius: 0
        border-bottom-left-radius: 0

.custom-control
  position: relative
  z-index: 1
  display: block
  min-height: 1.5rem
  padding-left: 1.5rem
  -webkit-print-color-adjust: exact
  color-adjust: exact

.custom-control-inline
  display: -ms-inline-flexbox
  display: inline-flex
  margin-right: 1rem

.custom-control-input
  position: absolute
  left: 0
  z-index: -1
  width: 1rem
  height: 1.25rem
  opacity: 0

  &:checked ~ .custom-control-label::before
    color: #fff
    border-color: #007bff
    background-color: #007bff
    box-shadow: none

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #80bdff

  &:not(:disabled):active ~ .custom-control-label::before
    color: #fff
    background-color: #b3d7ff
    border-color: #b3d7ff
    box-shadow: none

  &:disabled ~ .custom-control-label, &[disabled] ~ .custom-control-label
    color: #6c757d

  &:disabled ~ .custom-control-label::before, &[disabled] ~ .custom-control-label::before
    background-color: #e9ecef

.custom-control-label
  position: relative
  margin-bottom: 0
  vertical-align: top

  &::before
    position: absolute
    top: .25rem
    left: -1.5rem
    display: block
    width: 1rem
    height: 1rem
    pointer-events: none
    content: ""
    background-color: #dee2e6
    border: #adb5bd solid 1px
    box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1)

  &::after
    position: absolute
    top: .25rem
    left: -1.5rem
    display: block
    width: 1rem
    height: 1rem
    content: ""
    background: no-repeat 50%/50% 50%

.custom-checkbox
  .custom-control-label::before
    border-radius: .25rem

  .custom-control-input
    &:checked ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:indeterminate ~ .custom-control-label
      &::before
        border-color: #007bff
        background-color: #007bff
        box-shadow: none

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E")

    &:disabled
      &:checked ~ .custom-control-label::before, &:indeterminate ~ .custom-control-label::before
        background-color: rgba(0, 123, 255, 0.5)

.custom-radio
  .custom-control-label::before
    border-radius: 50%

  .custom-control-input
    &:checked ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E")

    &:disabled:checked ~ .custom-control-label::before
      background-color: rgba(0, 123, 255, 0.5)

.custom-switch
  padding-left: 2.25rem

  .custom-control-label
    &::before
      left: -2.25rem
      width: 1.75rem
      pointer-events: all
      border-radius: .5rem

    &::after
      top: calc(.25rem + 2px)
      left: calc(-2.25rem + 2px)
      width: calc(1rem - 4px)
      height: calc(1rem - 4px)
      background-color: #adb5bd
      border-radius: .5rem
      transition: transform .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out

  .custom-control-input
    &:checked ~ .custom-control-label::after
      background-color: #dee2e6
      transform: translateX(0.75rem)

    &:disabled:checked ~ .custom-control-label::before
      background-color: rgba(0, 123, 255, 0.5)

@media (prefers-reduced-motion: reduce)
  .custom-switch .custom-control-label::after
    transition: none

.custom-select
  display: inline-block
  width: 100%
  height: calc(2.25rem + 2px)
  padding: .375rem 1.75rem .375rem .75rem
  font-size: 1rem
  font-weight: 400
  line-height: 1.5
  color: #495057
  vertical-align: middle
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem (center / 8px) 10px
  border: 1px solid #ced4da
  border-radius: .25rem
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075)
  -webkit-appearance: none
  -moz-appearance: none
  appearance: none

  &:focus
    border-color: #80bdff
    outline: 0
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075)

    &::-ms-value
      color: #495057
      background-color: #fff

  &[multiple], &[size]:not([size="1"])
    height: auto
    padding-right: .75rem
    background-image: none

  &:disabled
    color: #6c757d
    background-color: #e9ecef

  &::-ms-expand
    display: none

  &:-moz-focusring
    color: transparent
    text-shadow: 0 0 0 #495057

.custom-select-sm
  height: calc(1.8125rem + 2px)
  padding-top: .25rem
  padding-bottom: .25rem
  padding-left: .5rem
  font-size: 75%

.custom-select-lg
  height: calc(2.875rem + 2px)
  padding-top: .5rem
  padding-bottom: .5rem
  padding-left: 1rem
  font-size: 125%

.custom-file
  position: relative
  display: inline-block
  width: 100%
  height: calc(2.25rem + 2px)
  margin-bottom: 0

.custom-file-input
  position: relative
  z-index: 2
  width: 100%
  height: calc(2.25rem + 2px)
  margin: 0
  opacity: 0

  &:focus ~ .custom-file-label
    border-color: #80bdff
    box-shadow: none

  &:disabled ~ .custom-file-label, &[disabled] ~ .custom-file-label
    background-color: #e9ecef

  &:lang(en) ~ .custom-file-label::after
    content: "Browse"

  ~ .custom-file-label[data-browse]::after
    content: attr(data-browse)

.custom-file-label
  position: absolute
  top: 0
  right: 0
  left: 0
  z-index: 1
  height: calc(2.25rem + 2px)
  padding: .375rem .75rem
  font-weight: 400
  line-height: 1.5
  color: #495057
  background-color: #fff
  border: 1px solid #ced4da
  border-radius: .25rem
  box-shadow: none

  &::after
    position: absolute
    top: 0
    right: 0
    bottom: 0
    z-index: 3
    display: block
    height: 2.25rem
    padding: .375rem .75rem
    line-height: 1.5
    color: #495057
    content: "Browse"
    background-color: #e9ecef
    border-left: inherit
    border-radius: 0 .25rem .25rem 0

.custom-range
  width: 100%
  height: 1rem
  padding: 0
  background-color: transparent
  -webkit-appearance: none
  -moz-appearance: none
  appearance: none

  &:focus
    outline: 0

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

  &::-moz-focus-outer
    border: 0

  &::-webkit-slider-thumb
    width: 1rem
    height: 1rem
    margin-top: -.25rem
    background-color: #007bff
    border: 0
    border-radius: 1rem
    box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1)
    -webkit-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    -webkit-appearance: none
    appearance: none

    &:active
      background-color: #b3d7ff

  &::-webkit-slider-runnable-track
    width: 100%
    height: .5rem
    color: transparent
    cursor: pointer
    background-color: #dee2e6
    border-color: transparent
    border-radius: 1rem
    box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1)

  &::-moz-range-thumb
    width: 1rem
    height: 1rem
    background-color: #007bff
    border: 0
    border-radius: 1rem
    box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1)
    -moz-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    -moz-appearance: none
    appearance: none

    &:active
      background-color: #b3d7ff

  &::-moz-range-track
    width: 100%
    height: .5rem
    color: transparent
    cursor: pointer
    background-color: #dee2e6
    border-color: transparent
    border-radius: 1rem
    box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1)

  &::-ms-thumb
    width: 1rem
    height: 1rem
    margin-top: 0
    margin-right: 0
    margin-left: 0
    background-color: #007bff
    border: 0
    border-radius: 1rem
    box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1)
    -ms-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
    appearance: none

    &:active
      background-color: #b3d7ff

  &::-ms-track
    width: 100%
    height: .5rem
    color: transparent
    cursor: pointer
    background-color: transparent
    border-color: transparent
    border-width: .5rem
    box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1)

  &::-ms-fill-lower
    background-color: #dee2e6
    border-radius: 1rem

  &::-ms-fill-upper
    margin-right: 15px
    background-color: #dee2e6
    border-radius: 1rem

  &:disabled
    &::-webkit-slider-thumb
      background-color: #adb5bd

    &::-webkit-slider-runnable-track
      cursor: default

    &::-moz-range-thumb
      background-color: #adb5bd

    &::-moz-range-track
      cursor: default

    &::-ms-thumb
      background-color: #adb5bd

@media (prefers-reduced-motion: reduce)
  .custom-range::-webkit-slider-thumb
    -webkit-transition: none
    transition: none

@media (prefers-reduced-motion: reduce)
  .custom-range::-moz-range-thumb
    -moz-transition: none
    transition: none

@media (prefers-reduced-motion: reduce)
  .custom-range::-ms-thumb
    -ms-transition: none
    transition: none

.custom-control-label::before, .custom-file-label, .custom-select
  transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out

@media (prefers-reduced-motion: reduce)
  .custom-control-label::before, .custom-file-label, .custom-select
    transition: none

.nav
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  padding-left: 0
  margin-bottom: 0
  list-style: none

.nav-link
  display: block
  padding: .5rem 1rem

  &:focus, &:hover
    text-decoration: none

  &.disabled
    color: #6c757d
    pointer-events: none
    cursor: default

.nav-tabs
  border-bottom: 1px solid #dee2e6

  .nav-item
    margin-bottom: -1px

  .nav-link
    border: 1px solid transparent
    border-top-left-radius: .25rem
    border-top-right-radius: .25rem

    &:focus, &:hover
      border-color: #e9ecef #e9ecef #dee2e6

    &.disabled
      color: #6c757d
      background-color: transparent
      border-color: transparent

  .nav-item.show .nav-link, .nav-link.active
    color: #495057
    background-color: #fff
    border-color: #dee2e6 #dee2e6 #fff

  .dropdown-menu
    margin-top: -1px
    border-top-left-radius: 0
    border-top-right-radius: 0

.nav-pills
  .nav-link
    border-radius: .25rem

    &.active
      color: #fff
      background-color: #007bff

  .show > .nav-link
    color: #fff
    background-color: #007bff

.nav-fill
  .nav-item, > .nav-link
    -ms-flex: 1 1 auto
    flex: 1 1 auto
    text-align: center

.nav-justified
  .nav-item, > .nav-link
    -ms-flex-preferred-size: 0
    flex-basis: 0
    -ms-flex-positive: 1
    flex-grow: 1
    text-align: center

.tab-content >
  .tab-pane
    display: none

  .active
    display: block

.navbar
  position: relative
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  -ms-flex-align: center
  align-items: center
  -ms-flex-pack: justify
  justify-content: space-between
  padding: .5rem .5rem

  .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
    display: -ms-flexbox
    display: flex
    -ms-flex-wrap: wrap
    flex-wrap: wrap
    -ms-flex-align: center
    align-items: center
    -ms-flex-pack: justify
    justify-content: space-between

.navbar-brand
  display: inline-block
  padding-top: .3125rem
  padding-bottom: .3125rem
  margin-right: .5rem
  font-size: 1.25rem
  line-height: inherit
  white-space: nowrap

  &:focus, &:hover
    text-decoration: none

.navbar-nav
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  padding-left: 0
  margin-bottom: 0
  list-style: none

  .nav-link
    padding-right: 0
    padding-left: 0

  .dropdown-menu
    position: static
    float: none

.navbar-text
  display: inline-block
  padding-top: .5rem
  padding-bottom: .5rem

.navbar-collapse
  -ms-flex-preferred-size: 100%
  flex-basis: 100%
  -ms-flex-positive: 1
  flex-grow: 1
  -ms-flex-align: center
  align-items: center

.navbar-toggler
  padding: .25rem .75rem
  font-size: 1.25rem
  line-height: 1
  background-color: transparent
  border: 1px solid transparent
  border-radius: .25rem

  &:focus, &:hover
    text-decoration: none

.navbar-toggler-icon
  display: inline-block
  width: 1.5em
  height: 1.5em
  vertical-align: middle
  content: ""
  background: no-repeat center center
  background-size: 100% 100%

@media (max-width: 575.98px)
  .navbar-expand-sm >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      padding-right: 0
      padding-left: 0

@media (min-width: 576px)
  .navbar-expand-sm
    -ms-flex-flow: row nowrap
    flex-flow: row nowrap
    -ms-flex-pack: start
    justify-content: flex-start

    .navbar-nav
      -ms-flex-direction: row
      flex-direction: row

      .dropdown-menu
        position: absolute

      .nav-link
        padding-right: 1rem
        padding-left: 1rem

    >
      .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
        -ms-flex-wrap: nowrap
        flex-wrap: nowrap

    .navbar-collapse
      display: -ms-flexbox !important
      display: flex !important
      -ms-flex-preferred-size: auto
      flex-basis: auto

    .navbar-toggler
      display: none

@media (max-width: 767.98px)
  .navbar-expand-md >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      padding-right: 0
      padding-left: 0

@media (min-width: 768px)
  .navbar-expand-md
    -ms-flex-flow: row nowrap
    flex-flow: row nowrap
    -ms-flex-pack: start
    justify-content: flex-start

    .navbar-nav
      -ms-flex-direction: row
      flex-direction: row

      .dropdown-menu
        position: absolute

      .nav-link
        padding-right: 1rem
        padding-left: 1rem

    >
      .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
        -ms-flex-wrap: nowrap
        flex-wrap: nowrap

    .navbar-collapse
      display: -ms-flexbox !important
      display: flex !important
      -ms-flex-preferred-size: auto
      flex-basis: auto

    .navbar-toggler
      display: none

@media (max-width: 991.98px)
  .navbar-expand-lg >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      padding-right: 0
      padding-left: 0

@media (min-width: 992px)
  .navbar-expand-lg
    -ms-flex-flow: row nowrap
    flex-flow: row nowrap
    -ms-flex-pack: start
    justify-content: flex-start

    .navbar-nav
      -ms-flex-direction: row
      flex-direction: row

      .dropdown-menu
        position: absolute

      .nav-link
        padding-right: 1rem
        padding-left: 1rem

    >
      .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
        -ms-flex-wrap: nowrap
        flex-wrap: nowrap

    .navbar-collapse
      display: -ms-flexbox !important
      display: flex !important
      -ms-flex-preferred-size: auto
      flex-basis: auto

    .navbar-toggler
      display: none

@media (max-width: 1199.98px)
  .navbar-expand-xl >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      padding-right: 0
      padding-left: 0

@media (min-width: 1200px)
  .navbar-expand-xl
    -ms-flex-flow: row nowrap
    flex-flow: row nowrap
    -ms-flex-pack: start
    justify-content: flex-start

    .navbar-nav
      -ms-flex-direction: row
      flex-direction: row

      .dropdown-menu
        position: absolute

      .nav-link
        padding-right: 1rem
        padding-left: 1rem

    >
      .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
        -ms-flex-wrap: nowrap
        flex-wrap: nowrap

    .navbar-collapse
      display: -ms-flexbox !important
      display: flex !important
      -ms-flex-preferred-size: auto
      flex-basis: auto

    .navbar-toggler
      display: none

.navbar-expand
  -ms-flex-flow: row nowrap
  flex-flow: row nowrap
  -ms-flex-pack: start
  justify-content: flex-start

  >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      padding-right: 0
      padding-left: 0

  .navbar-nav
    -ms-flex-direction: row
    flex-direction: row

    .dropdown-menu
      position: absolute

    .nav-link
      padding-right: 1rem
      padding-left: 1rem

  >
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      -ms-flex-wrap: nowrap
      flex-wrap: nowrap

  .navbar-collapse
    display: -ms-flexbox !important
    display: flex !important
    -ms-flex-preferred-size: auto
    flex-basis: auto

  .navbar-toggler
    display: none

.navbar-light
  .navbar-brand
    color: rgba(0, 0, 0, 0.9)

    &:focus, &:hover
      color: rgba(0, 0, 0, 0.9)

  .navbar-nav
    .nav-link
      color: rgba(0, 0, 0, 0.5)

      &:focus, &:hover
        color: rgba(0, 0, 0, 0.7)

      &.disabled
        color: rgba(0, 0, 0, 0.3)

    .active > .nav-link
      color: rgba(0, 0, 0, 0.9)

    .nav-link
      &.active, &.show
        color: rgba(0, 0, 0, 0.9)

    .show > .nav-link
      color: rgba(0, 0, 0, 0.9)

  .navbar-toggler
    color: rgba(0, 0, 0, 0.5)
    border-color: rgba(0, 0, 0, 0.1)

  .navbar-toggler-icon
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%280, 0, 0, 0.5%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")

  .navbar-text
    color: rgba(0, 0, 0, 0.5)

    a
      color: rgba(0, 0, 0, 0.9)

      &:focus, &:hover
        color: rgba(0, 0, 0, 0.9)

.navbar-dark
  .navbar-brand
    color: #fff

    &:focus, &:hover
      color: #fff

  .navbar-nav
    .nav-link
      color: rgba(255, 255, 255, 0.75)

      &:focus, &:hover
        color: #fff

      &.disabled
        color: rgba(255, 255, 255, 0.25)

    .active > .nav-link
      color: #fff

    .nav-link
      &.active, &.show
        color: #fff

    .show > .nav-link
      color: #fff

  .navbar-toggler
    color: rgba(255, 255, 255, 0.75)
    border-color: rgba(255, 255, 255, 0.1)

  .navbar-toggler-icon
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")

  .navbar-text
    color: rgba(255, 255, 255, 0.75)

    a
      color: #fff

      &:focus, &:hover
        color: #fff

.card
  position: relative
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  min-width: 0
  word-wrap: break-word
  background-color: #fff
  background-clip: border-box
  border: 0 solid rgba(0, 0, 0, 0.125)
  border-radius: .25rem

  >
    hr
      margin-right: 0
      margin-left: 0

    .list-group
      border-top: inherit
      border-bottom: inherit

      &:first-child
        border-top-width: 0
        border-top-left-radius: calc(.25rem - 0)
        border-top-right-radius: calc(.25rem - 0)

      &:last-child
        border-bottom-width: 0
        border-bottom-right-radius: calc(.25rem - 0)
        border-bottom-left-radius: calc(.25rem - 0)

    .card-header + .list-group, .list-group + .card-footer
      border-top: 0

.card-body
  -ms-flex: 1 1 auto
  flex: 1 1 auto
  min-height: 1px
  padding: 1.25rem

.card-title
  margin-bottom: .75rem

.card-subtitle
  margin-top: -.375rem
  margin-bottom: 0

.card-text:last-child
  margin-bottom: 0

.card-link
  &:hover
    text-decoration: none

  + .card-link
    margin-left: 1.25rem

.card-header
  padding: .75rem 1.25rem
  margin-bottom: 0
  background-color: rgba(0, 0, 0, 0.03)
  border-bottom: 0 solid rgba(0, 0, 0, 0.125)

  &:first-child
    border-radius: calc(.25rem - 0) calc(.25rem - 0) 0 0

.card-footer
  padding: .75rem 1.25rem
  background-color: rgba(0, 0, 0, 0.03)
  border-top: 0 solid rgba(0, 0, 0, 0.125)

  &:last-child
    border-radius: 0 0 calc(.25rem - 0) calc(.25rem - 0)

.card-header-tabs
  margin-right: -.625rem
  margin-bottom: -.75rem
  margin-left: -.625rem
  border-bottom: 0

.card-header-pills
  margin-right: -.625rem
  margin-left: -.625rem

.card-img-overlay
  position: absolute
  top: 0
  right: 0
  bottom: 0
  left: 0
  padding: 1.25rem
  border-radius: calc(.25rem - 0)

.card-img, .card-img-bottom, .card-img-top
  -ms-flex-negative: 0
  flex-shrink: 0
  width: 100%

.card-img, .card-img-top
  border-top-left-radius: calc(.25rem - 0)
  border-top-right-radius: calc(.25rem - 0)

.card-img, .card-img-bottom
  border-bottom-right-radius: calc(.25rem - 0)
  border-bottom-left-radius: calc(.25rem - 0)

.card-deck .card, .card-group > .card
  margin-bottom: 7.5px

@media (min-width: 576px)
  .card-deck
    display: -ms-flexbox
    display: flex
    -ms-flex-flow: row wrap
    flex-flow: row wrap
    margin-right: -7.5px
    margin-left: -7.5px

    .card
      -ms-flex: 1 0 0%
      flex: 1 0 0%
      margin-right: 7.5px
      margin-bottom: 0
      margin-left: 7.5px

@media (min-width: 576px)
  .card-group
    display: -ms-flexbox
    display: flex
    -ms-flex-flow: row wrap
    flex-flow: row wrap

    > .card
      -ms-flex: 1 0 0%
      flex: 1 0 0%
      margin-bottom: 0

      + .card
        margin-left: 0
        border-left: 0

      &:not(:last-child)
        border-top-right-radius: 0
        border-bottom-right-radius: 0

        .card-header, .card-img-top
          border-top-right-radius: 0

        .card-footer, .card-img-bottom
          border-bottom-right-radius: 0

      &:not(:first-child)
        border-top-left-radius: 0
        border-bottom-left-radius: 0

        .card-header, .card-img-top
          border-top-left-radius: 0

        .card-footer, .card-img-bottom
          border-bottom-left-radius: 0

.card-columns .card
  margin-bottom: .75rem

@media (min-width: 576px)
  .card-columns
    -webkit-column-count: 3
    -moz-column-count: 3
    column-count: 3
    -webkit-column-gap: 1.25rem
    -moz-column-gap: 1.25rem
    column-gap: 1.25rem
    orphans: 1
    widows: 1

    .card
      display: inline-block
      width: 100%

.accordion
  overflow-anchor: none

  > .card
    overflow: hidden

    &:not(:last-of-type)
      border-bottom: 0
      border-bottom-right-radius: 0
      border-bottom-left-radius: 0

    &:not(:first-of-type)
      border-top-left-radius: 0
      border-top-right-radius: 0

    > .card-header
      border-radius: 0
      margin-bottom: 0

.breadcrumb
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  padding: .75rem 1rem
  margin-bottom: 1rem
  list-style: none
  background-color: #e9ecef
  border-radius: .25rem

.breadcrumb-item
  display: -ms-flexbox
  display: flex

  + .breadcrumb-item
    padding-left: .5rem

    &::before
      display: inline-block
      padding-right: .5rem
      color: #6c757d
      content: "/"

    &:hover::before
      text-decoration: underline
      text-decoration: none

  &.active
    color: #6c757d

.pagination
  display: -ms-flexbox
  display: flex
  padding-left: 0
  list-style: none
  border-radius: .25rem

.page-link
  position: relative
  display: block
  padding: .5rem .75rem
  margin-left: -1px
  line-height: 1.25
  color: #007bff
  background-color: #fff
  border: 1px solid #dee2e6

  &:hover
    z-index: 2
    color: #0056b3
    text-decoration: none
    background-color: #e9ecef
    border-color: #dee2e6

  &:focus
    z-index: 3
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

.page-item
  &:first-child .page-link
    margin-left: 0
    border-top-left-radius: .25rem
    border-bottom-left-radius: .25rem

  &:last-child .page-link
    border-top-right-radius: .25rem
    border-bottom-right-radius: .25rem

  &.active .page-link
    z-index: 3
    color: #fff
    background-color: #007bff
    border-color: #007bff

  &.disabled .page-link
    color: #6c757d
    pointer-events: none
    cursor: auto
    background-color: #fff
    border-color: #dee2e6

.pagination-lg
  .page-link
    padding: .75rem 1.5rem
    font-size: 1.25rem
    line-height: 1.5

  .page-item
    &:first-child .page-link
      border-top-left-radius: .3rem
      border-bottom-left-radius: .3rem

    &:last-child .page-link
      border-top-right-radius: .3rem
      border-bottom-right-radius: .3rem

.pagination-sm
  .page-link
    padding: .25rem .5rem
    font-size: .875rem
    line-height: 1.5

  .page-item
    &:first-child .page-link
      border-top-left-radius: .2rem
      border-bottom-left-radius: .2rem

    &:last-child .page-link
      border-top-right-radius: .2rem
      border-bottom-right-radius: .2rem

.badge
  display: inline-block
  padding: .25em .4em
  font-size: 75%
  font-weight: 700
  line-height: 1
  text-align: center
  white-space: nowrap
  vertical-align: baseline
  border-radius: .25rem
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out

@media (prefers-reduced-motion: reduce)
  .badge
    transition: none

a.badge
  &:focus, &:hover
    text-decoration: none

.badge:empty
  display: none

.btn .badge
  position: relative
  top: -1px

.badge-pill
  padding-right: .6em
  padding-left: .6em
  border-radius: 10rem

.badge-primary
  color: #fff
  background-color: #007bff

a.badge-primary
  &:focus, &:hover
    color: #fff
    background-color: #0062cc

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5)

.badge-secondary
  color: #fff
  background-color: #6c757d

a.badge-secondary
  &:focus, &:hover
    color: #fff
    background-color: #545b62

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5)

.badge-success
  color: #fff
  background-color: #28a745

a.badge-success
  &:focus, &:hover
    color: #fff
    background-color: #1e7e34

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5)

.badge-info
  color: #fff
  background-color: #17a2b8

a.badge-info
  &:focus, &:hover
    color: #fff
    background-color: #117a8b

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5)

.badge-warning
  color: #1f2d3d
  background-color: #ffc107

a.badge-warning
  &:focus, &:hover
    color: #1f2d3d
    background-color: #d39e00

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5)

.badge-danger
  color: #fff
  background-color: #dc3545

a.badge-danger
  &:focus, &:hover
    color: #fff
    background-color: #bd2130

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5)

.badge-light
  color: #1f2d3d
  background-color: #f8f9fa

a.badge-light
  &:focus, &:hover
    color: #1f2d3d
    background-color: #dae0e5

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5)

.badge-dark
  color: #fff
  background-color: #343a40

a.badge-dark
  &:focus, &:hover
    color: #fff
    background-color: #1d2124

  &.focus, &:focus
    outline: 0
    box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5)

.jumbotron
  padding: 2rem 1rem
  margin-bottom: 2rem
  background-color: #e9ecef
  border-radius: .3rem

@media (min-width: 576px)
  .jumbotron
    padding: 4rem 2rem

.jumbotron-fluid
  padding-right: 0
  padding-left: 0
  border-radius: 0

.alert
  position: relative
  padding: .75rem 1.25rem
  margin-bottom: 1rem
  border: 1px solid transparent
  border-radius: .25rem

.alert-heading
  color: inherit

.alert-link
  font-weight: 700

.alert-dismissible
  padding-right: 4rem

  .close, .mailbox-attachment-close
    position: absolute
    top: 0
    right: 0
    z-index: 2
    padding: .75rem 1.25rem
    color: inherit

.alert-primary
  color: #004085
  background-color: #cce5ff
  border-color: #b8daff

  hr
    border-top-color: #9fcdff

  .alert-link
    color: #002752

.alert-secondary
  color: #383d41
  background-color: #e2e3e5
  border-color: #d6d8db

  hr
    border-top-color: #c8cbcf

  .alert-link
    color: #202326

.alert-success
  color: #155724
  background-color: #d4edda
  border-color: #c3e6cb

  hr
    border-top-color: #b1dfbb

  .alert-link
    color: #0b2e13

.alert-info
  color: #0c5460
  background-color: #d1ecf1
  border-color: #bee5eb

  hr
    border-top-color: #abdde5

  .alert-link
    color: #062c33

.alert-warning
  color: #856404
  background-color: #fff3cd
  border-color: #ffeeba

  hr
    border-top-color: #ffe8a1

  .alert-link
    color: #533f03

.alert-danger
  color: #721c24
  background-color: #f8d7da
  border-color: #f5c6cb

  hr
    border-top-color: #f1b0b7

  .alert-link
    color: #491217

.alert-light
  color: #818182
  background-color: #fefefe
  border-color: #fdfdfe

  hr
    border-top-color: #ececf6

  .alert-link
    color: #686868

.alert-dark
  color: #1b1e21
  background-color: #d6d8d9
  border-color: #c6c8ca

  hr
    border-top-color: #b9bbbe

  .alert-link
    color: #040505

@-webkit-keyframes progress-bar-stripes
  from
    background-position: 1rem 0

  to
    background-position: 0 0

@keyframes progress-bar-stripes
  from
    background-position: 1rem 0

  to
    background-position: 0 0

.progress
  display: -ms-flexbox
  display: flex
  height: 1rem
  overflow: hidden
  line-height: 0
  font-size: .75rem
  background-color: #e9ecef
  border-radius: .25rem
  box-shadow: inset 0 0.1rem 0.1rem rgba(0, 0, 0, 0.1)

.progress-bar
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  -ms-flex-pack: center
  justify-content: center
  overflow: hidden
  color: #fff
  text-align: center
  white-space: nowrap
  background-color: #007bff
  transition: width .6s ease

@media (prefers-reduced-motion: reduce)
  .progress-bar
    transition: none

.progress-bar-striped
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
  background-size: 1rem 1rem

.progress-bar-animated
  -webkit-animation: progress-bar-stripes 1s linear infinite
  animation: progress-bar-stripes 1s linear infinite

@media (prefers-reduced-motion: reduce)
  .progress-bar-animated
    -webkit-animation: none
    animation: none

.media
  display: -ms-flexbox
  display: flex
  -ms-flex-align: start
  align-items: flex-start

.media-body
  -ms-flex: 1
  flex: 1

.list-group
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  padding-left: 0
  margin-bottom: 0
  border-radius: .25rem

.list-group-item-action
  width: 100%
  color: #495057
  text-align: inherit

  &:focus, &:hover
    z-index: 1
    color: #495057
    text-decoration: none
    background-color: #f8f9fa

  &:active
    color: #212529
    background-color: #e9ecef

.list-group-item
  position: relative
  display: block
  padding: .75rem 1.25rem
  background-color: #fff
  border: 1px solid rgba(0, 0, 0, 0.125)

  &:first-child
    border-top-left-radius: inherit
    border-top-right-radius: inherit

  &:last-child
    border-bottom-right-radius: inherit
    border-bottom-left-radius: inherit

  &.disabled, &:disabled
    color: #6c757d
    pointer-events: none
    background-color: #fff

  &.active
    z-index: 2
    color: #fff
    background-color: #007bff
    border-color: #007bff

  + .list-group-item
    border-top-width: 0

    &.active
      margin-top: -1px
      border-top-width: 1px

.list-group-horizontal
  -ms-flex-direction: row
  flex-direction: row

  > .list-group-item
    &:first-child
      border-bottom-left-radius: .25rem
      border-top-right-radius: 0

    &:last-child
      border-top-right-radius: .25rem
      border-bottom-left-radius: 0

    &.active
      margin-top: 0

    + .list-group-item
      border-top-width: 1px
      border-left-width: 0

      &.active
        margin-left: -1px
        border-left-width: 1px

@media (min-width: 576px)
  .list-group-horizontal-sm
    -ms-flex-direction: row
    flex-direction: row

    > .list-group-item
      &:first-child
        border-bottom-left-radius: .25rem
        border-top-right-radius: 0

      &:last-child
        border-top-right-radius: .25rem
        border-bottom-left-radius: 0

      &.active
        margin-top: 0

      + .list-group-item
        border-top-width: 1px
        border-left-width: 0

        &.active
          margin-left: -1px
          border-left-width: 1px

@media (min-width: 768px)
  .list-group-horizontal-md
    -ms-flex-direction: row
    flex-direction: row

    > .list-group-item
      &:first-child
        border-bottom-left-radius: .25rem
        border-top-right-radius: 0

      &:last-child
        border-top-right-radius: .25rem
        border-bottom-left-radius: 0

      &.active
        margin-top: 0

      + .list-group-item
        border-top-width: 1px
        border-left-width: 0

        &.active
          margin-left: -1px
          border-left-width: 1px

@media (min-width: 992px)
  .list-group-horizontal-lg
    -ms-flex-direction: row
    flex-direction: row

    > .list-group-item
      &:first-child
        border-bottom-left-radius: .25rem
        border-top-right-radius: 0

      &:last-child
        border-top-right-radius: .25rem
        border-bottom-left-radius: 0

      &.active
        margin-top: 0

      + .list-group-item
        border-top-width: 1px
        border-left-width: 0

        &.active
          margin-left: -1px
          border-left-width: 1px

@media (min-width: 1200px)
  .list-group-horizontal-xl
    -ms-flex-direction: row
    flex-direction: row

    > .list-group-item
      &:first-child
        border-bottom-left-radius: .25rem
        border-top-right-radius: 0

      &:last-child
        border-top-right-radius: .25rem
        border-bottom-left-radius: 0

      &.active
        margin-top: 0

      + .list-group-item
        border-top-width: 1px
        border-left-width: 0

        &.active
          margin-left: -1px
          border-left-width: 1px

.list-group-flush
  border-radius: 0

  > .list-group-item
    border-width: 0 0 1px

    &:last-child
      border-bottom-width: 0

.list-group-item-primary
  color: #004085
  background-color: #b8daff

  &.list-group-item-action
    &:focus, &:hover
      color: #004085
      background-color: #9fcdff

    &.active
      color: #fff
      background-color: #004085
      border-color: #004085

.list-group-item-secondary
  color: #383d41
  background-color: #d6d8db

  &.list-group-item-action
    &:focus, &:hover
      color: #383d41
      background-color: #c8cbcf

    &.active
      color: #fff
      background-color: #383d41
      border-color: #383d41

.list-group-item-success
  color: #155724
  background-color: #c3e6cb

  &.list-group-item-action
    &:focus, &:hover
      color: #155724
      background-color: #b1dfbb

    &.active
      color: #fff
      background-color: #155724
      border-color: #155724

.list-group-item-info
  color: #0c5460
  background-color: #bee5eb

  &.list-group-item-action
    &:focus, &:hover
      color: #0c5460
      background-color: #abdde5

    &.active
      color: #fff
      background-color: #0c5460
      border-color: #0c5460

.list-group-item-warning
  color: #856404
  background-color: #ffeeba

  &.list-group-item-action
    &:focus, &:hover
      color: #856404
      background-color: #ffe8a1

    &.active
      color: #fff
      background-color: #856404
      border-color: #856404

.list-group-item-danger
  color: #721c24
  background-color: #f5c6cb

  &.list-group-item-action
    &:focus, &:hover
      color: #721c24
      background-color: #f1b0b7

    &.active
      color: #fff
      background-color: #721c24
      border-color: #721c24

.list-group-item-light
  color: #818182
  background-color: #fdfdfe

  &.list-group-item-action
    &:focus, &:hover
      color: #818182
      background-color: #ececf6

    &.active
      color: #fff
      background-color: #818182
      border-color: #818182

.list-group-item-dark
  color: #1b1e21
  background-color: #c6c8ca

  &.list-group-item-action
    &:focus, &:hover
      color: #1b1e21
      background-color: #b9bbbe

    &.active
      color: #fff
      background-color: #1b1e21
      border-color: #1b1e21

.close, .mailbox-attachment-close
  float: right
  font-size: 1.5rem
  font-weight: 700
  line-height: 1
  color: #000
  text-shadow: 0 1px 0 #fff
  opacity: .5

.close:hover, .mailbox-attachment-close:hover
  color: #000
  text-decoration: none

.close:not(:disabled):not(.disabled)
  &:focus, &:hover
    opacity: .75

.mailbox-attachment-close:not(:disabled):not(.disabled)
  &:focus, &:hover
    opacity: .75

button
  &.close, &.mailbox-attachment-close
    padding: 0
    background-color: transparent
    border: 0

a
  &.close.disabled, &.disabled.mailbox-attachment-close
    pointer-events: none

.toast
  -ms-flex-preferred-size: 350px
  flex-basis: 350px
  max-width: 350px
  font-size: .875rem
  background-color: rgba(255, 255, 255, 0.85)
  background-clip: padding-box
  border: 1px solid rgba(0, 0, 0, 0.1)
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1)
  opacity: 0
  border-radius: .25rem

  &:not(:last-child)
    margin-bottom: .75rem

  &.showing
    opacity: 1

  &.show
    display: block
    opacity: 1

  &.hide
    display: none

.toast-header
  display: -ms-flexbox
  display: flex
  -ms-flex-align: center
  align-items: center
  padding: .25rem .75rem
  color: #6c757d
  background-color: rgba(255, 255, 255, 0.85)
  background-clip: padding-box
  border-bottom: 1px solid rgba(0, 0, 0, 0.05)
  border-top-left-radius: calc(.25rem - 1px)
  border-top-right-radius: calc(.25rem - 1px)

.toast-body
  padding: .75rem

.modal-open
  overflow: hidden

  .modal
    overflow-x: hidden
    overflow-y: auto

.modal
  position: fixed
  top: 0
  left: 0
  z-index: 1050
  display: none
  width: 100%
  height: 100%
  overflow: hidden
  outline: 0

.modal-dialog
  position: relative
  width: auto
  margin: .5rem
  pointer-events: none

.modal
  &.fade .modal-dialog
    transition: transform .3s ease-out
    transform: translate(0, -50px)

  &.show .modal-dialog
    transform: none

  &.modal-static .modal-dialog
    transform: scale(1.02)

@media (prefers-reduced-motion: reduce)
  .modal.fade .modal-dialog
    transition: none

.modal-dialog-scrollable
  display: -ms-flexbox
  display: flex
  max-height: calc(100% - 1rem)

  .modal-content
    max-height: calc(100vh - 1rem)
    overflow: hidden

  .modal-footer, .modal-header
    -ms-flex-negative: 0
    flex-shrink: 0

  .modal-body
    overflow-y: auto

.modal-dialog-centered
  display: -ms-flexbox
  display: flex
  -ms-flex-align: center
  align-items: center
  min-height: calc(100% - 1rem)

  &::before
    display: block
    height: calc(100vh - 1rem)
    height: -webkit-min-content
    height: -moz-min-content
    height: min-content
    content: ""

  &.modal-dialog-scrollable
    -ms-flex-direction: column
    flex-direction: column
    -ms-flex-pack: center
    justify-content: center
    height: 100%

    .modal-content
      max-height: none

    &::before
      content: none

.modal-content
  position: relative
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  width: 100%
  pointer-events: auto
  background-color: #fff
  background-clip: padding-box
  border: 1px solid rgba(0, 0, 0, 0.2)
  border-radius: .3rem
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5)
  outline: 0

.modal-backdrop
  position: fixed
  top: 0
  left: 0
  z-index: 1040
  width: 100vw
  height: 100vh
  background-color: #000

  &.fade
    opacity: 0

  &.show
    opacity: .5

.modal-header
  display: -ms-flexbox
  display: flex
  -ms-flex-align: start
  align-items: flex-start
  -ms-flex-pack: justify
  justify-content: space-between
  padding: 1rem
  border-bottom: 1px solid #e9ecef
  border-top-left-radius: calc(.3rem - 1px)
  border-top-right-radius: calc(.3rem - 1px)

  .close, .mailbox-attachment-close
    padding: 1rem
    margin: -1rem -1rem -1rem auto

.modal-title
  margin-bottom: 0
  line-height: 1.5

.modal-body
  position: relative
  -ms-flex: 1 1 auto
  flex: 1 1 auto
  padding: 1rem

.modal-footer
  display: -ms-flexbox
  display: flex
  -ms-flex-wrap: wrap
  flex-wrap: wrap
  -ms-flex-align: center
  align-items: center
  -ms-flex-pack: end
  justify-content: flex-end
  padding: .75rem
  border-top: 1px solid #e9ecef
  border-bottom-right-radius: calc(.3rem - 1px)
  border-bottom-left-radius: calc(.3rem - 1px)

  > *
    margin: .25rem

.modal-scrollbar-measure
  position: absolute
  top: -9999px
  width: 50px
  height: 50px
  overflow: scroll

@media (min-width: 576px)
  .modal-dialog
    max-width: 500px
    margin: 1.75rem auto

  .modal-dialog-scrollable
    max-height: calc(100% - 3.5rem)

    .modal-content
      max-height: calc(100vh - 3.5rem)

  .modal-dialog-centered
    min-height: calc(100% - 3.5rem)

    &::before
      height: calc(100vh - 3.5rem)
      height: -webkit-min-content
      height: -moz-min-content
      height: min-content

  .modal-content
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5)

  .modal-sm
    max-width: 300px

@media (min-width: 992px)
  .modal-lg, .modal-xl
    max-width: 800px

@media (min-width: 1200px)
  .modal-xl
    max-width: 1140px

.tooltip
  position: absolute
  z-index: 1070
  display: block
  margin: 0
  font-family: "Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
  font-style: normal
  font-weight: 400
  line-height: 1.5
  text-align: left
  text-align: start
  text-decoration: none
  text-shadow: none
  text-transform: none
  letter-spacing: normal
  word-break: normal
  word-spacing: normal
  white-space: normal
  line-break: auto
  font-size: .875rem
  word-wrap: break-word
  opacity: 0

  &.show
    opacity: .9

  .arrow
    position: absolute
    display: block
    width: .8rem
    height: .4rem

    &::before
      position: absolute
      content: ""
      border-color: transparent
      border-style: solid

.bs-tooltip-auto[x-placement^=top], .bs-tooltip-top
  padding: .4rem 0

.bs-tooltip-auto[x-placement^=top] .arrow, .bs-tooltip-top .arrow
  bottom: 0

.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before
  top: 0
  border-width: .4rem .4rem 0
  border-top-color: #000

.bs-tooltip-auto[x-placement^=right], .bs-tooltip-right
  padding: 0 .4rem

.bs-tooltip-auto[x-placement^=right] .arrow, .bs-tooltip-right .arrow
  left: 0
  width: .4rem
  height: .8rem

.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before
  right: 0
  border-width: .4rem .4rem .4rem 0
  border-right-color: #000

.bs-tooltip-auto[x-placement^=bottom], .bs-tooltip-bottom
  padding: .4rem 0

.bs-tooltip-auto[x-placement^=bottom] .arrow, .bs-tooltip-bottom .arrow
  top: 0

.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before
  bottom: 0
  border-width: 0 .4rem .4rem
  border-bottom-color: #000

.bs-tooltip-auto[x-placement^=left], .bs-tooltip-left
  padding: 0 .4rem

.bs-tooltip-auto[x-placement^=left] .arrow, .bs-tooltip-left .arrow
  right: 0
  width: .4rem
  height: .8rem

.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before
  left: 0
  border-width: .4rem 0 .4rem .4rem
  border-left-color: #000

.tooltip-inner
  max-width: 200px
  padding: .25rem .5rem
  color: #fff
  text-align: center
  background-color: #000
  border-radius: .25rem

.popover
  position: absolute
  top: 0
  left: 0
  z-index: 1060
  display: block
  max-width: 276px
  font-family: "Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
  font-style: normal
  font-weight: 400
  line-height: 1.5
  text-align: left
  text-align: start
  text-decoration: none
  text-shadow: none
  text-transform: none
  letter-spacing: normal
  word-break: normal
  word-spacing: normal
  white-space: normal
  line-break: auto
  font-size: .875rem
  word-wrap: break-word
  background-color: #fff
  background-clip: padding-box
  border: 1px solid rgba(0, 0, 0, 0.2)
  border-radius: .3rem
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2)

  .arrow
    position: absolute
    display: block
    width: 1rem
    height: .5rem
    margin: 0 .3rem

    &::after, &::before
      position: absolute
      display: block
      content: ""
      border-color: transparent
      border-style: solid

.bs-popover-auto[x-placement^=top], .bs-popover-top
  margin-bottom: .5rem

.bs-popover-auto[x-placement^=top] > .arrow, .bs-popover-top > .arrow
  bottom: calc(-.5rem - 1px)

.bs-popover-auto[x-placement^=top] > .arrow::before, .bs-popover-top > .arrow::before
  bottom: 0
  border-width: .5rem .5rem 0
  border-top-color: rgba(0, 0, 0, 0.25)

.bs-popover-auto[x-placement^=top] > .arrow::after, .bs-popover-top > .arrow::after
  bottom: 1px
  border-width: .5rem .5rem 0
  border-top-color: #fff

.bs-popover-auto[x-placement^=right], .bs-popover-right
  margin-left: .5rem

.bs-popover-auto[x-placement^=right] > .arrow, .bs-popover-right > .arrow
  left: calc(-.5rem - 1px)
  width: .5rem
  height: 1rem
  margin: .3rem 0

.bs-popover-auto[x-placement^=right] > .arrow::before, .bs-popover-right > .arrow::before
  left: 0
  border-width: .5rem .5rem .5rem 0
  border-right-color: rgba(0, 0, 0, 0.25)

.bs-popover-auto[x-placement^=right] > .arrow::after, .bs-popover-right > .arrow::after
  left: 1px
  border-width: .5rem .5rem .5rem 0
  border-right-color: #fff

.bs-popover-auto[x-placement^=bottom], .bs-popover-bottom
  margin-top: .5rem

.bs-popover-auto[x-placement^=bottom] > .arrow, .bs-popover-bottom > .arrow
  top: calc(-.5rem - 1px)

.bs-popover-auto[x-placement^=bottom] > .arrow::before, .bs-popover-bottom > .arrow::before
  top: 0
  border-width: 0 .5rem .5rem .5rem
  border-bottom-color: rgba(0, 0, 0, 0.25)

.bs-popover-auto[x-placement^=bottom] > .arrow::after, .bs-popover-bottom > .arrow::after
  top: 1px
  border-width: 0 .5rem .5rem .5rem
  border-bottom-color: #fff

.bs-popover-auto[x-placement^=bottom] .popover-header::before, .bs-popover-bottom .popover-header::before
  position: absolute
  top: 0
  left: 50%
  display: block
  width: 1rem
  margin-left: -.5rem
  content: ""
  border-bottom: 1px solid #f7f7f7

.bs-popover-auto[x-placement^=left], .bs-popover-left
  margin-right: .5rem

.bs-popover-auto[x-placement^=left] > .arrow, .bs-popover-left > .arrow
  right: calc(-.5rem - 1px)
  width: .5rem
  height: 1rem
  margin: .3rem 0

.bs-popover-auto[x-placement^=left] > .arrow::before, .bs-popover-left > .arrow::before
  right: 0
  border-width: .5rem 0 .5rem .5rem
  border-left-color: rgba(0, 0, 0, 0.25)

.bs-popover-auto[x-placement^=left] > .arrow::after, .bs-popover-left > .arrow::after
  right: 1px
  border-width: .5rem 0 .5rem .5rem
  border-left-color: #fff

.popover-header
  padding: .5rem .75rem
  margin-bottom: 0
  font-size: 1rem
  color: inherit
  background-color: #f7f7f7
  border-bottom: 1px solid #ebebeb
  border-top-left-radius: calc(.3rem - 1px)
  border-top-right-radius: calc(.3rem - 1px)

  &:empty
    display: none

.popover-body
  padding: .5rem .75rem
  color: #212529

.carousel
  position: relative

  &.pointer-event
    -ms-touch-action: pan-y
    touch-action: pan-y

.carousel-inner
  position: relative
  width: 100%
  overflow: hidden

  &::after
    display: block
    clear: both
    content: ""

.carousel-item
  position: relative
  display: none
  float: left
  width: 100%
  margin-right: -100%
  -webkit-backface-visibility: hidden
  backface-visibility: hidden
  transition: transform .6s ease

@media (prefers-reduced-motion: reduce)
  .carousel-item
    transition: none

.carousel-item-next, .carousel-item-prev, .carousel-item.active
  display: block

.active.carousel-item-right, .carousel-item-next:not(.carousel-item-left)
  transform: translateX(100%)

.active.carousel-item-left, .carousel-item-prev:not(.carousel-item-right)
  transform: translateX(-100%)

.carousel-fade
  .carousel-item
    opacity: 0
    transition-property: opacity
    transform: none

  .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right, .carousel-item.active
    z-index: 1
    opacity: 1

  .active
    &.carousel-item-left, &.carousel-item-right
      z-index: 0
      opacity: 0
      transition: opacity 0s .6s

@media (prefers-reduced-motion: reduce)
  .carousel-fade .active
    &.carousel-item-left, &.carousel-item-right
      transition: none

.carousel-control-next, .carousel-control-prev
  position: absolute
  top: 0
  bottom: 0
  z-index: 1
  display: -ms-flexbox
  display: flex
  -ms-flex-align: center
  align-items: center
  -ms-flex-pack: center
  justify-content: center
  width: 15%
  color: #fff
  text-align: center
  opacity: .5
  transition: opacity .15s ease

@media (prefers-reduced-motion: reduce)
  .carousel-control-next, .carousel-control-prev
    transition: none

.carousel-control-next
  &:focus, &:hover
    color: #fff
    text-decoration: none
    outline: 0
    opacity: .9

.carousel-control-prev
  &:focus, &:hover
    color: #fff
    text-decoration: none
    outline: 0
    opacity: .9

  left: 0

.carousel-control-next
  right: 0

.carousel-control-next-icon
  display: inline-block
  width: 20px
  height: 20px
  background: no-repeat 50%/100% 100%

.carousel-control-prev-icon
  display: inline-block
  width: 20px
  height: 20px
  background: no-repeat 50%/100% 100%
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E")

.carousel-control-next-icon
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")

.carousel-indicators
  position: absolute
  right: 0
  bottom: 0
  left: 0
  z-index: 15
  display: -ms-flexbox
  display: flex
  -ms-flex-pack: center
  justify-content: center
  padding-left: 0
  margin-right: 15%
  margin-left: 15%
  list-style: none

  li
    box-sizing: content-box
    -ms-flex: 0 1 auto
    flex: 0 1 auto
    width: 30px
    height: 3px
    margin-right: 3px
    margin-left: 3px
    text-indent: -999px
    cursor: pointer
    background-color: #fff
    background-clip: padding-box
    border-top: 10px solid transparent
    border-bottom: 10px solid transparent
    opacity: .5
    transition: opacity .6s ease

  .active
    opacity: 1

@media (prefers-reduced-motion: reduce)
  .carousel-indicators li
    transition: none

.carousel-caption
  position: absolute
  right: 15%
  bottom: 20px
  left: 15%
  z-index: 10
  padding-top: 20px
  padding-bottom: 20px
  color: #fff
  text-align: center

@-webkit-keyframes spinner-border
  to
    transform: rotate(360deg)

@keyframes spinner-border
  to
    transform: rotate(360deg)

.spinner-border
  display: inline-block
  width: 2rem
  height: 2rem
  vertical-align: text-bottom
  border: .25em solid currentColor
  border-right-color: transparent
  border-radius: 50%
  -webkit-animation: spinner-border .75s linear infinite
  animation: spinner-border .75s linear infinite

.spinner-border-sm
  width: 1rem
  height: 1rem
  border-width: .2em

@-webkit-keyframes spinner-grow
  0%
    transform: scale(0)

  50%
    opacity: 1
    transform: none

@keyframes spinner-grow
  0%
    transform: scale(0)

  50%
    opacity: 1
    transform: none

.spinner-grow
  display: inline-block
  width: 2rem
  height: 2rem
  vertical-align: text-bottom
  background-color: currentColor
  border-radius: 50%
  opacity: 0
  -webkit-animation: spinner-grow .75s linear infinite
  animation: spinner-grow .75s linear infinite

.spinner-grow-sm
  width: 1rem
  height: 1rem

.align-baseline
  vertical-align: baseline !important

.align-top
  vertical-align: top !important

.align-middle
  vertical-align: middle !important

.align-bottom
  vertical-align: bottom !important

.align-text-bottom
  vertical-align: text-bottom !important

.align-text-top
  vertical-align: text-top !important

.bg-primary
  background-color: #007bff !important

a.bg-primary
  &:focus, &:hover
    background-color: #0062cc !important

button.bg-primary
  &:focus, &:hover
    background-color: #0062cc !important

.bg-secondary
  background-color: #6c757d !important

a.bg-secondary
  &:focus, &:hover
    background-color: #545b62 !important

button.bg-secondary
  &:focus, &:hover
    background-color: #545b62 !important

.bg-success
  background-color: #28a745 !important

a.bg-success
  &:focus, &:hover
    background-color: #1e7e34 !important

button.bg-success
  &:focus, &:hover
    background-color: #1e7e34 !important

.bg-info
  background-color: #17a2b8 !important

a.bg-info
  &:focus, &:hover
    background-color: #117a8b !important

button.bg-info
  &:focus, &:hover
    background-color: #117a8b !important

.bg-warning
  background-color: #ffc107 !important

a.bg-warning
  &:focus, &:hover
    background-color: #d39e00 !important

button.bg-warning
  &:focus, &:hover
    background-color: #d39e00 !important

.bg-danger
  background-color: #dc3545 !important

a.bg-danger
  &:focus, &:hover
    background-color: #bd2130 !important

button.bg-danger
  &:focus, &:hover
    background-color: #bd2130 !important

.bg-light
  background-color: #f8f9fa !important

a.bg-light
  &:focus, &:hover
    background-color: #dae0e5 !important

button.bg-light
  &:focus, &:hover
    background-color: #dae0e5 !important

.bg-dark
  background-color: #343a40 !important

a.bg-dark
  &:focus, &:hover
    background-color: #1d2124 !important

button.bg-dark
  &:focus, &:hover
    background-color: #1d2124 !important

.bg-white
  background-color: #fff !important

.bg-transparent
  background-color: transparent !important

.border
  border: 1px solid #dee2e6 !important

.border-top
  border-top: 1px solid #dee2e6 !important

.border-right
  border-right: 1px solid #dee2e6 !important

.border-bottom
  border-bottom: 1px solid #dee2e6 !important

.border-left
  border-left: 1px solid #dee2e6 !important

.border-0
  border: 0 !important

.border-top-0
  border-top: 0 !important

.border-right-0
  border-right: 0 !important

.border-bottom-0
  border-bottom: 0 !important

.border-left-0
  border-left: 0 !important

.border-primary
  border-color: #007bff !important

.border-secondary
  border-color: #6c757d !important

.border-success
  border-color: #28a745 !important

.border-info
  border-color: #17a2b8 !important

.border-warning
  border-color: #ffc107 !important

.border-danger
  border-color: #dc3545 !important

.border-light
  border-color: #f8f9fa !important

.border-dark
  border-color: #343a40 !important

.border-white
  border-color: #fff !important

.rounded-sm
  border-radius: 0.2rem !important

.rounded
  border-radius: 0.25rem !important

.rounded-top
  border-top-left-radius: 0.25rem !important
  border-top-right-radius: 0.25rem !important

.rounded-right
  border-top-right-radius: 0.25rem !important
  border-bottom-right-radius: 0.25rem !important

.rounded-bottom
  border-bottom-right-radius: 0.25rem !important
  border-bottom-left-radius: 0.25rem !important

.rounded-left
  border-top-left-radius: 0.25rem !important
  border-bottom-left-radius: 0.25rem !important

.rounded-lg
  border-radius: 0.3rem !important

.rounded-circle
  border-radius: 50% !important

.rounded-pill
  border-radius: 50rem !important

.rounded-0
  border-radius: 0 !important

.clearfix::after
  display: block
  clear: both
  content: ""

.d-none
  display: none !important

.d-inline
  display: inline !important

.d-inline-block
  display: inline-block !important

.d-block
  display: block !important

.d-table
  display: table !important

.d-table-row
  display: table-row !important

.d-table-cell
  display: table-cell !important

.d-flex
  display: -ms-flexbox !important
  display: flex !important

.d-inline-flex
  display: -ms-inline-flexbox !important
  display: inline-flex !important

@media (min-width: 576px)
  .d-sm-none
    display: none !important

  .d-sm-inline
    display: inline !important

  .d-sm-inline-block
    display: inline-block !important

  .d-sm-block
    display: block !important

  .d-sm-table
    display: table !important

  .d-sm-table-row
    display: table-row !important

  .d-sm-table-cell
    display: table-cell !important

  .d-sm-flex
    display: -ms-flexbox !important
    display: flex !important

  .d-sm-inline-flex
    display: -ms-inline-flexbox !important
    display: inline-flex !important

@media (min-width: 768px)
  .d-md-none
    display: none !important

  .d-md-inline
    display: inline !important

  .d-md-inline-block
    display: inline-block !important

  .d-md-block
    display: block !important

  .d-md-table
    display: table !important

  .d-md-table-row
    display: table-row !important

  .d-md-table-cell
    display: table-cell !important

  .d-md-flex
    display: -ms-flexbox !important
    display: flex !important

  .d-md-inline-flex
    display: -ms-inline-flexbox !important
    display: inline-flex !important

@media (min-width: 992px)
  .d-lg-none
    display: none !important

  .d-lg-inline
    display: inline !important

  .d-lg-inline-block
    display: inline-block !important

  .d-lg-block
    display: block !important

  .d-lg-table
    display: table !important

  .d-lg-table-row
    display: table-row !important

  .d-lg-table-cell
    display: table-cell !important

  .d-lg-flex
    display: -ms-flexbox !important
    display: flex !important

  .d-lg-inline-flex
    display: -ms-inline-flexbox !important
    display: inline-flex !important

@media (min-width: 1200px)
  .d-xl-none
    display: none !important

  .d-xl-inline
    display: inline !important

  .d-xl-inline-block
    display: inline-block !important

  .d-xl-block
    display: block !important

  .d-xl-table
    display: table !important

  .d-xl-table-row
    display: table-row !important

  .d-xl-table-cell
    display: table-cell !important

  .d-xl-flex
    display: -ms-flexbox !important
    display: flex !important

  .d-xl-inline-flex
    display: -ms-inline-flexbox !important
    display: inline-flex !important

@media print
  .d-print-none
    display: none !important

  .d-print-inline
    display: inline !important

  .d-print-inline-block
    display: inline-block !important

  .d-print-block
    display: block !important

  .d-print-table
    display: table !important

  .d-print-table-row
    display: table-row !important

  .d-print-table-cell
    display: table-cell !important

  .d-print-flex
    display: -ms-flexbox !important
    display: flex !important

  .d-print-inline-flex
    display: -ms-inline-flexbox !important
    display: inline-flex !important

.embed-responsive
  position: relative
  display: block
  width: 100%
  padding: 0
  overflow: hidden

  &::before
    display: block
    content: ""

  .embed-responsive-item, embed, iframe, object, video
    position: absolute
    top: 0
    bottom: 0
    left: 0
    width: 100%
    height: 100%
    border: 0

.embed-responsive-21by9::before
  padding-top: 42.857143%

.embed-responsive-16by9::before
  padding-top: 56.25%

.embed-responsive-4by3::before
  padding-top: 75%

.embed-responsive-1by1::before
  padding-top: 100%

.flex-row
  -ms-flex-direction: row !important
  flex-direction: row !important

.flex-column
  -ms-flex-direction: column !important
  flex-direction: column !important

.flex-row-reverse
  -ms-flex-direction: row-reverse !important
  flex-direction: row-reverse !important

.flex-column-reverse
  -ms-flex-direction: column-reverse !important
  flex-direction: column-reverse !important

.flex-wrap
  -ms-flex-wrap: wrap !important
  flex-wrap: wrap !important

.flex-nowrap
  -ms-flex-wrap: nowrap !important
  flex-wrap: nowrap !important

.flex-wrap-reverse
  -ms-flex-wrap: wrap-reverse !important
  flex-wrap: wrap-reverse !important

.flex-fill
  -ms-flex: 1 1 auto !important
  flex: 1 1 auto !important

.flex-grow-0
  -ms-flex-positive: 0 !important
  flex-grow: 0 !important

.flex-grow-1
  -ms-flex-positive: 1 !important
  flex-grow: 1 !important

.flex-shrink-0
  -ms-flex-negative: 0 !important
  flex-shrink: 0 !important

.flex-shrink-1
  -ms-flex-negative: 1 !important
  flex-shrink: 1 !important

.justify-content-start
  -ms-flex-pack: start !important
  justify-content: flex-start !important

.justify-content-end
  -ms-flex-pack: end !important
  justify-content: flex-end !important

.justify-content-center
  -ms-flex-pack: center !important
  justify-content: center !important

.justify-content-between
  -ms-flex-pack: justify !important
  justify-content: space-between !important

.justify-content-around
  -ms-flex-pack: distribute !important
  justify-content: space-around !important

.align-items-start
  -ms-flex-align: start !important
  align-items: flex-start !important

.align-items-end
  -ms-flex-align: end !important
  align-items: flex-end !important

.align-items-center
  -ms-flex-align: center !important
  align-items: center !important

.align-items-baseline
  -ms-flex-align: baseline !important
  align-items: baseline !important

.align-items-stretch
  -ms-flex-align: stretch !important
  align-items: stretch !important

.align-content-start
  -ms-flex-line-pack: start !important
  align-content: flex-start !important

.align-content-end
  -ms-flex-line-pack: end !important
  align-content: flex-end !important

.align-content-center
  -ms-flex-line-pack: center !important
  align-content: center !important

.align-content-between
  -ms-flex-line-pack: justify !important
  align-content: space-between !important

.align-content-around
  -ms-flex-line-pack: distribute !important
  align-content: space-around !important

.align-content-stretch
  -ms-flex-line-pack: stretch !important
  align-content: stretch !important

.align-self-auto
  -ms-flex-item-align: auto !important
  align-self: auto !important

.align-self-start
  -ms-flex-item-align: start !important
  align-self: flex-start !important

.align-self-end
  -ms-flex-item-align: end !important
  align-self: flex-end !important

.align-self-center
  -ms-flex-item-align: center !important
  align-self: center !important

.align-self-baseline
  -ms-flex-item-align: baseline !important
  align-self: baseline !important

.align-self-stretch
  -ms-flex-item-align: stretch !important
  align-self: stretch !important

@media (min-width: 576px)
  .flex-sm-row
    -ms-flex-direction: row !important
    flex-direction: row !important

  .flex-sm-column
    -ms-flex-direction: column !important
    flex-direction: column !important

  .flex-sm-row-reverse
    -ms-flex-direction: row-reverse !important
    flex-direction: row-reverse !important

  .flex-sm-column-reverse
    -ms-flex-direction: column-reverse !important
    flex-direction: column-reverse !important

  .flex-sm-wrap
    -ms-flex-wrap: wrap !important
    flex-wrap: wrap !important

  .flex-sm-nowrap
    -ms-flex-wrap: nowrap !important
    flex-wrap: nowrap !important

  .flex-sm-wrap-reverse
    -ms-flex-wrap: wrap-reverse !important
    flex-wrap: wrap-reverse !important

  .flex-sm-fill
    -ms-flex: 1 1 auto !important
    flex: 1 1 auto !important

  .flex-sm-grow-0
    -ms-flex-positive: 0 !important
    flex-grow: 0 !important

  .flex-sm-grow-1
    -ms-flex-positive: 1 !important
    flex-grow: 1 !important

  .flex-sm-shrink-0
    -ms-flex-negative: 0 !important
    flex-shrink: 0 !important

  .flex-sm-shrink-1
    -ms-flex-negative: 1 !important
    flex-shrink: 1 !important

  .justify-content-sm-start
    -ms-flex-pack: start !important
    justify-content: flex-start !important

  .justify-content-sm-end
    -ms-flex-pack: end !important
    justify-content: flex-end !important

  .justify-content-sm-center
    -ms-flex-pack: center !important
    justify-content: center !important

  .justify-content-sm-between
    -ms-flex-pack: justify !important
    justify-content: space-between !important

  .justify-content-sm-around
    -ms-flex-pack: distribute !important
    justify-content: space-around !important

  .align-items-sm-start
    -ms-flex-align: start !important
    align-items: flex-start !important

  .align-items-sm-end
    -ms-flex-align: end !important
    align-items: flex-end !important

  .align-items-sm-center
    -ms-flex-align: center !important
    align-items: center !important

  .align-items-sm-baseline
    -ms-flex-align: baseline !important
    align-items: baseline !important

  .align-items-sm-stretch
    -ms-flex-align: stretch !important
    align-items: stretch !important

  .align-content-sm-start
    -ms-flex-line-pack: start !important
    align-content: flex-start !important

  .align-content-sm-end
    -ms-flex-line-pack: end !important
    align-content: flex-end !important

  .align-content-sm-center
    -ms-flex-line-pack: center !important
    align-content: center !important

  .align-content-sm-between
    -ms-flex-line-pack: justify !important
    align-content: space-between !important

  .align-content-sm-around
    -ms-flex-line-pack: distribute !important
    align-content: space-around !important

  .align-content-sm-stretch
    -ms-flex-line-pack: stretch !important
    align-content: stretch !important

  .align-self-sm-auto
    -ms-flex-item-align: auto !important
    align-self: auto !important

  .align-self-sm-start
    -ms-flex-item-align: start !important
    align-self: flex-start !important

  .align-self-sm-end
    -ms-flex-item-align: end !important
    align-self: flex-end !important

  .align-self-sm-center
    -ms-flex-item-align: center !important
    align-self: center !important

  .align-self-sm-baseline
    -ms-flex-item-align: baseline !important
    align-self: baseline !important

  .align-self-sm-stretch
    -ms-flex-item-align: stretch !important
    align-self: stretch !important

@media (min-width: 768px)
  .flex-md-row
    -ms-flex-direction: row !important
    flex-direction: row !important

  .flex-md-column
    -ms-flex-direction: column !important
    flex-direction: column !important

  .flex-md-row-reverse
    -ms-flex-direction: row-reverse !important
    flex-direction: row-reverse !important

  .flex-md-column-reverse
    -ms-flex-direction: column-reverse !important
    flex-direction: column-reverse !important

  .flex-md-wrap
    -ms-flex-wrap: wrap !important
    flex-wrap: wrap !important

  .flex-md-nowrap
    -ms-flex-wrap: nowrap !important
    flex-wrap: nowrap !important

  .flex-md-wrap-reverse
    -ms-flex-wrap: wrap-reverse !important
    flex-wrap: wrap-reverse !important

  .flex-md-fill
    -ms-flex: 1 1 auto !important
    flex: 1 1 auto !important

  .flex-md-grow-0
    -ms-flex-positive: 0 !important
    flex-grow: 0 !important

  .flex-md-grow-1
    -ms-flex-positive: 1 !important
    flex-grow: 1 !important

  .flex-md-shrink-0
    -ms-flex-negative: 0 !important
    flex-shrink: 0 !important

  .flex-md-shrink-1
    -ms-flex-negative: 1 !important
    flex-shrink: 1 !important

  .justify-content-md-start
    -ms-flex-pack: start !important
    justify-content: flex-start !important

  .justify-content-md-end
    -ms-flex-pack: end !important
    justify-content: flex-end !important

  .justify-content-md-center
    -ms-flex-pack: center !important
    justify-content: center !important

  .justify-content-md-between
    -ms-flex-pack: justify !important
    justify-content: space-between !important

  .justify-content-md-around
    -ms-flex-pack: distribute !important
    justify-content: space-around !important

  .align-items-md-start
    -ms-flex-align: start !important
    align-items: flex-start !important

  .align-items-md-end
    -ms-flex-align: end !important
    align-items: flex-end !important

  .align-items-md-center
    -ms-flex-align: center !important
    align-items: center !important

  .align-items-md-baseline
    -ms-flex-align: baseline !important
    align-items: baseline !important

  .align-items-md-stretch
    -ms-flex-align: stretch !important
    align-items: stretch !important

  .align-content-md-start
    -ms-flex-line-pack: start !important
    align-content: flex-start !important

  .align-content-md-end
    -ms-flex-line-pack: end !important
    align-content: flex-end !important

  .align-content-md-center
    -ms-flex-line-pack: center !important
    align-content: center !important

  .align-content-md-between
    -ms-flex-line-pack: justify !important
    align-content: space-between !important

  .align-content-md-around
    -ms-flex-line-pack: distribute !important
    align-content: space-around !important

  .align-content-md-stretch
    -ms-flex-line-pack: stretch !important
    align-content: stretch !important

  .align-self-md-auto
    -ms-flex-item-align: auto !important
    align-self: auto !important

  .align-self-md-start
    -ms-flex-item-align: start !important
    align-self: flex-start !important

  .align-self-md-end
    -ms-flex-item-align: end !important
    align-self: flex-end !important

  .align-self-md-center
    -ms-flex-item-align: center !important
    align-self: center !important

  .align-self-md-baseline
    -ms-flex-item-align: baseline !important
    align-self: baseline !important

  .align-self-md-stretch
    -ms-flex-item-align: stretch !important
    align-self: stretch !important

@media (min-width: 992px)
  .flex-lg-row
    -ms-flex-direction: row !important
    flex-direction: row !important

  .flex-lg-column
    -ms-flex-direction: column !important
    flex-direction: column !important

  .flex-lg-row-reverse
    -ms-flex-direction: row-reverse !important
    flex-direction: row-reverse !important

  .flex-lg-column-reverse
    -ms-flex-direction: column-reverse !important
    flex-direction: column-reverse !important

  .flex-lg-wrap
    -ms-flex-wrap: wrap !important
    flex-wrap: wrap !important

  .flex-lg-nowrap
    -ms-flex-wrap: nowrap !important
    flex-wrap: nowrap !important

  .flex-lg-wrap-reverse
    -ms-flex-wrap: wrap-reverse !important
    flex-wrap: wrap-reverse !important

  .flex-lg-fill
    -ms-flex: 1 1 auto !important
    flex: 1 1 auto !important

  .flex-lg-grow-0
    -ms-flex-positive: 0 !important
    flex-grow: 0 !important

  .flex-lg-grow-1
    -ms-flex-positive: 1 !important
    flex-grow: 1 !important

  .flex-lg-shrink-0
    -ms-flex-negative: 0 !important
    flex-shrink: 0 !important

  .flex-lg-shrink-1
    -ms-flex-negative: 1 !important
    flex-shrink: 1 !important

  .justify-content-lg-start
    -ms-flex-pack: start !important
    justify-content: flex-start !important

  .justify-content-lg-end
    -ms-flex-pack: end !important
    justify-content: flex-end !important

  .justify-content-lg-center
    -ms-flex-pack: center !important
    justify-content: center !important

  .justify-content-lg-between
    -ms-flex-pack: justify !important
    justify-content: space-between !important

  .justify-content-lg-around
    -ms-flex-pack: distribute !important
    justify-content: space-around !important

  .align-items-lg-start
    -ms-flex-align: start !important
    align-items: flex-start !important

  .align-items-lg-end
    -ms-flex-align: end !important
    align-items: flex-end !important

  .align-items-lg-center
    -ms-flex-align: center !important
    align-items: center !important

  .align-items-lg-baseline
    -ms-flex-align: baseline !important
    align-items: baseline !important

  .align-items-lg-stretch
    -ms-flex-align: stretch !important
    align-items: stretch !important

  .align-content-lg-start
    -ms-flex-line-pack: start !important
    align-content: flex-start !important

  .align-content-lg-end
    -ms-flex-line-pack: end !important
    align-content: flex-end !important

  .align-content-lg-center
    -ms-flex-line-pack: center !important
    align-content: center !important

  .align-content-lg-between
    -ms-flex-line-pack: justify !important
    align-content: space-between !important

  .align-content-lg-around
    -ms-flex-line-pack: distribute !important
    align-content: space-around !important

  .align-content-lg-stretch
    -ms-flex-line-pack: stretch !important
    align-content: stretch !important

  .align-self-lg-auto
    -ms-flex-item-align: auto !important
    align-self: auto !important

  .align-self-lg-start
    -ms-flex-item-align: start !important
    align-self: flex-start !important

  .align-self-lg-end
    -ms-flex-item-align: end !important
    align-self: flex-end !important

  .align-self-lg-center
    -ms-flex-item-align: center !important
    align-self: center !important

  .align-self-lg-baseline
    -ms-flex-item-align: baseline !important
    align-self: baseline !important

  .align-self-lg-stretch
    -ms-flex-item-align: stretch !important
    align-self: stretch !important

@media (min-width: 1200px)
  .flex-xl-row
    -ms-flex-direction: row !important
    flex-direction: row !important

  .flex-xl-column
    -ms-flex-direction: column !important
    flex-direction: column !important

  .flex-xl-row-reverse
    -ms-flex-direction: row-reverse !important
    flex-direction: row-reverse !important

  .flex-xl-column-reverse
    -ms-flex-direction: column-reverse !important
    flex-direction: column-reverse !important

  .flex-xl-wrap
    -ms-flex-wrap: wrap !important
    flex-wrap: wrap !important

  .flex-xl-nowrap
    -ms-flex-wrap: nowrap !important
    flex-wrap: nowrap !important

  .flex-xl-wrap-reverse
    -ms-flex-wrap: wrap-reverse !important
    flex-wrap: wrap-reverse !important

  .flex-xl-fill
    -ms-flex: 1 1 auto !important
    flex: 1 1 auto !important

  .flex-xl-grow-0
    -ms-flex-positive: 0 !important
    flex-grow: 0 !important

  .flex-xl-grow-1
    -ms-flex-positive: 1 !important
    flex-grow: 1 !important

  .flex-xl-shrink-0
    -ms-flex-negative: 0 !important
    flex-shrink: 0 !important

  .flex-xl-shrink-1
    -ms-flex-negative: 1 !important
    flex-shrink: 1 !important

  .justify-content-xl-start
    -ms-flex-pack: start !important
    justify-content: flex-start !important

  .justify-content-xl-end
    -ms-flex-pack: end !important
    justify-content: flex-end !important

  .justify-content-xl-center
    -ms-flex-pack: center !important
    justify-content: center !important

  .justify-content-xl-between
    -ms-flex-pack: justify !important
    justify-content: space-between !important

  .justify-content-xl-around
    -ms-flex-pack: distribute !important
    justify-content: space-around !important

  .align-items-xl-start
    -ms-flex-align: start !important
    align-items: flex-start !important

  .align-items-xl-end
    -ms-flex-align: end !important
    align-items: flex-end !important

  .align-items-xl-center
    -ms-flex-align: center !important
    align-items: center !important

  .align-items-xl-baseline
    -ms-flex-align: baseline !important
    align-items: baseline !important

  .align-items-xl-stretch
    -ms-flex-align: stretch !important
    align-items: stretch !important

  .align-content-xl-start
    -ms-flex-line-pack: start !important
    align-content: flex-start !important

  .align-content-xl-end
    -ms-flex-line-pack: end !important
    align-content: flex-end !important

  .align-content-xl-center
    -ms-flex-line-pack: center !important
    align-content: center !important

  .align-content-xl-between
    -ms-flex-line-pack: justify !important
    align-content: space-between !important

  .align-content-xl-around
    -ms-flex-line-pack: distribute !important
    align-content: space-around !important

  .align-content-xl-stretch
    -ms-flex-line-pack: stretch !important
    align-content: stretch !important

  .align-self-xl-auto
    -ms-flex-item-align: auto !important
    align-self: auto !important

  .align-self-xl-start
    -ms-flex-item-align: start !important
    align-self: flex-start !important

  .align-self-xl-end
    -ms-flex-item-align: end !important
    align-self: flex-end !important

  .align-self-xl-center
    -ms-flex-item-align: center !important
    align-self: center !important

  .align-self-xl-baseline
    -ms-flex-item-align: baseline !important
    align-self: baseline !important

  .align-self-xl-stretch
    -ms-flex-item-align: stretch !important
    align-self: stretch !important

.float-left
  float: left !important

.float-right
  float: right !important

.float-none
  float: none !important

@media (min-width: 576px)
  .float-sm-left
    float: left !important

  .float-sm-right
    float: right !important

  .float-sm-none
    float: none !important

@media (min-width: 768px)
  .float-md-left
    float: left !important

  .float-md-right
    float: right !important

  .float-md-none
    float: none !important

@media (min-width: 992px)
  .float-lg-left
    float: left !important

  .float-lg-right
    float: right !important

  .float-lg-none
    float: none !important

@media (min-width: 1200px)
  .float-xl-left
    float: left !important

  .float-xl-right
    float: right !important

  .float-xl-none
    float: none !important

.user-select-all
  -webkit-user-select: all !important
  -moz-user-select: all !important
  -ms-user-select: all !important
  user-select: all !important

.user-select-auto
  -webkit-user-select: auto !important
  -moz-user-select: auto !important
  -ms-user-select: auto !important
  user-select: auto !important

.user-select-none
  -webkit-user-select: none !important
  -moz-user-select: none !important
  -ms-user-select: none !important
  user-select: none !important

.overflow-auto
  overflow: auto !important

.overflow-hidden
  overflow: hidden !important

.position-static
  position: static !important

.position-relative
  position: relative !important

.position-absolute
  position: absolute !important

.position-fixed
  position: fixed !important

.position-sticky
  position: -webkit-sticky !important
  position: sticky !important

.fixed-top
  position: fixed
  top: 0
  right: 0
  left: 0
  z-index: 1030

.fixed-bottom
  position: fixed
  right: 0
  bottom: 0
  left: 0
  z-index: 1030

@supports (position: -webkit-sticky) or (position: sticky)
  .sticky-top
    position: -webkit-sticky
    position: sticky
    top: 0
    z-index: 1020

.sr-only
  position: absolute
  width: 1px
  height: 1px
  padding: 0
  margin: -1px
  overflow: hidden
  clip: rect(0, 0, 0, 0)
  white-space: nowrap
  border: 0

.sr-only-focusable
  &:active, &:focus
    position: static
    width: auto
    height: auto
    overflow: visible
    clip: auto
    white-space: normal

.shadow-sm
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important

.shadow
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important

.shadow-lg
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important

.shadow-none
  box-shadow: none !important

.w-25
  width: 25% !important

.w-50
  width: 50% !important

.w-75
  width: 75% !important

.w-100
  width: 100% !important

.w-auto
  width: auto !important

.h-25
  height: 25% !important

.h-50
  height: 50% !important

.h-75
  height: 75% !important

.h-100
  height: 100% !important

.h-auto
  height: auto !important

.mw-100
  max-width: 100% !important

.mh-100
  max-height: 100% !important

.min-vw-100
  min-width: 100vw !important

.min-vh-100
  min-height: 100vh !important

.vw-100
  width: 100vw !important

.vh-100
  height: 100vh !important

.m-0
  margin: 0 !important

.mt-0, .my-0
  margin-top: 0 !important

.mr-0, .mx-0
  margin-right: 0 !important

.mb-0, .my-0
  margin-bottom: 0 !important

.ml-0, .mx-0
  margin-left: 0 !important

.m-1
  margin: 0.25rem !important

.mt-1, .my-1
  margin-top: 0.25rem !important

.mr-1, .mx-1
  margin-right: 0.25rem !important

.mb-1, .my-1
  margin-bottom: 0.25rem !important

.ml-1, .mx-1
  margin-left: 0.25rem !important

.m-2
  margin: 0.5rem !important

.mt-2, .my-2
  margin-top: 0.5rem !important

.mr-2, .mx-2
  margin-right: 0.5rem !important

.mb-2, .my-2
  margin-bottom: 0.5rem !important

.ml-2, .mx-2
  margin-left: 0.5rem !important

.m-3
  margin: 1rem !important

.mt-3, .my-3
  margin-top: 1rem !important

.mr-3, .mx-3
  margin-right: 1rem !important

.mb-3, .my-3
  margin-bottom: 1rem !important

.ml-3, .mx-3
  margin-left: 1rem !important

.m-4
  margin: 1.5rem !important

.mt-4, .my-4
  margin-top: 1.5rem !important

.mr-4, .mx-4
  margin-right: 1.5rem !important

.mb-4, .my-4
  margin-bottom: 1.5rem !important

.ml-4, .mx-4
  margin-left: 1.5rem !important

.m-5
  margin: 3rem !important

.mt-5, .my-5
  margin-top: 3rem !important

.mr-5, .mx-5
  margin-right: 3rem !important

.mb-5, .my-5
  margin-bottom: 3rem !important

.ml-5, .mx-5
  margin-left: 3rem !important

.p-0
  padding: 0 !important

.pt-0, .py-0
  padding-top: 0 !important

.pr-0, .px-0
  padding-right: 0 !important

.pb-0, .py-0
  padding-bottom: 0 !important

.pl-0, .px-0
  padding-left: 0 !important

.p-1
  padding: 0.25rem !important

.pt-1, .py-1
  padding-top: 0.25rem !important

.pr-1, .px-1
  padding-right: 0.25rem !important

.pb-1, .py-1
  padding-bottom: 0.25rem !important

.pl-1, .px-1
  padding-left: 0.25rem !important

.p-2
  padding: 0.5rem !important

.pt-2, .py-2
  padding-top: 0.5rem !important

.pr-2, .px-2
  padding-right: 0.5rem !important

.pb-2, .py-2
  padding-bottom: 0.5rem !important

.pl-2, .px-2
  padding-left: 0.5rem !important

.p-3
  padding: 1rem !important

.pt-3, .py-3
  padding-top: 1rem !important

.pr-3, .px-3
  padding-right: 1rem !important

.pb-3, .py-3
  padding-bottom: 1rem !important

.pl-3, .px-3
  padding-left: 1rem !important

.p-4
  padding: 1.5rem !important

.pt-4, .py-4
  padding-top: 1.5rem !important

.pr-4, .px-4
  padding-right: 1.5rem !important

.pb-4, .py-4
  padding-bottom: 1.5rem !important

.pl-4, .px-4
  padding-left: 1.5rem !important

.p-5
  padding: 3rem !important

.pt-5, .py-5
  padding-top: 3rem !important

.pr-5, .px-5
  padding-right: 3rem !important

.pb-5, .py-5
  padding-bottom: 3rem !important

.pl-5, .px-5
  padding-left: 3rem !important

.m-n1
  margin: (-0.25rem) !important

.mt-n1, .my-n1
  margin-top: (-0.25rem) !important

.mr-n1, .mx-n1
  margin-right: (-0.25rem) !important

.mb-n1, .my-n1
  margin-bottom: (-0.25rem) !important

.ml-n1, .mx-n1
  margin-left: (-0.25rem) !important

.m-n2
  margin: (-0.5rem) !important

.mt-n2, .my-n2
  margin-top: (-0.5rem) !important

.mr-n2, .mx-n2
  margin-right: (-0.5rem) !important

.mb-n2, .my-n2
  margin-bottom: (-0.5rem) !important

.ml-n2, .mx-n2
  margin-left: (-0.5rem) !important

.m-n3
  margin: (-1rem) !important

.mt-n3, .my-n3
  margin-top: (-1rem) !important

.mr-n3, .mx-n3
  margin-right: (-1rem) !important

.mb-n3, .my-n3
  margin-bottom: (-1rem) !important

.ml-n3, .mx-n3
  margin-left: (-1rem) !important

.m-n4
  margin: (-1.5rem) !important

.mt-n4, .my-n4
  margin-top: (-1.5rem) !important

.mr-n4, .mx-n4
  margin-right: (-1.5rem) !important

.mb-n4, .my-n4
  margin-bottom: (-1.5rem) !important

.ml-n4, .mx-n4
  margin-left: (-1.5rem) !important

.m-n5
  margin: (-3rem) !important

.mt-n5, .my-n5
  margin-top: (-3rem) !important

.mr-n5, .mx-n5
  margin-right: (-3rem) !important

.mb-n5, .my-n5
  margin-bottom: (-3rem) !important

.ml-n5, .mx-n5
  margin-left: (-3rem) !important

.m-auto
  margin: auto !important

.mt-auto, .my-auto
  margin-top: auto !important

.mr-auto, .mx-auto
  margin-right: auto !important

.mb-auto, .my-auto
  margin-bottom: auto !important

.ml-auto, .mx-auto
  margin-left: auto !important

@media (min-width: 576px)
  .m-sm-0
    margin: 0 !important

  .mt-sm-0, .my-sm-0
    margin-top: 0 !important

  .mr-sm-0, .mx-sm-0
    margin-right: 0 !important

  .mb-sm-0, .my-sm-0
    margin-bottom: 0 !important

  .ml-sm-0, .mx-sm-0
    margin-left: 0 !important

  .m-sm-1
    margin: 0.25rem !important

  .mt-sm-1, .my-sm-1
    margin-top: 0.25rem !important

  .mr-sm-1, .mx-sm-1
    margin-right: 0.25rem !important

  .mb-sm-1, .my-sm-1
    margin-bottom: 0.25rem !important

  .ml-sm-1, .mx-sm-1
    margin-left: 0.25rem !important

  .m-sm-2
    margin: 0.5rem !important

  .mt-sm-2, .my-sm-2
    margin-top: 0.5rem !important

  .mr-sm-2, .mx-sm-2
    margin-right: 0.5rem !important

  .mb-sm-2, .my-sm-2
    margin-bottom: 0.5rem !important

  .ml-sm-2, .mx-sm-2
    margin-left: 0.5rem !important

  .m-sm-3
    margin: 1rem !important

  .mt-sm-3, .my-sm-3
    margin-top: 1rem !important

  .mr-sm-3, .mx-sm-3
    margin-right: 1rem !important

  .mb-sm-3, .my-sm-3
    margin-bottom: 1rem !important

  .ml-sm-3, .mx-sm-3
    margin-left: 1rem !important

  .m-sm-4
    margin: 1.5rem !important

  .mt-sm-4, .my-sm-4
    margin-top: 1.5rem !important

  .mr-sm-4, .mx-sm-4
    margin-right: 1.5rem !important

  .mb-sm-4, .my-sm-4
    margin-bottom: 1.5rem !important

  .ml-sm-4, .mx-sm-4
    margin-left: 1.5rem !important

  .m-sm-5
    margin: 3rem !important

  .mt-sm-5, .my-sm-5
    margin-top: 3rem !important

  .mr-sm-5, .mx-sm-5
    margin-right: 3rem !important

  .mb-sm-5, .my-sm-5
    margin-bottom: 3rem !important

  .ml-sm-5, .mx-sm-5
    margin-left: 3rem !important

  .p-sm-0
    padding: 0 !important

  .pt-sm-0, .py-sm-0
    padding-top: 0 !important

  .pr-sm-0, .px-sm-0
    padding-right: 0 !important

  .pb-sm-0, .py-sm-0
    padding-bottom: 0 !important

  .pl-sm-0, .px-sm-0
    padding-left: 0 !important

  .p-sm-1
    padding: 0.25rem !important

  .pt-sm-1, .py-sm-1
    padding-top: 0.25rem !important

  .pr-sm-1, .px-sm-1
    padding-right: 0.25rem !important

  .pb-sm-1, .py-sm-1
    padding-bottom: 0.25rem !important

  .pl-sm-1, .px-sm-1
    padding-left: 0.25rem !important

  .p-sm-2
    padding: 0.5rem !important

  .pt-sm-2, .py-sm-2
    padding-top: 0.5rem !important

  .pr-sm-2, .px-sm-2
    padding-right: 0.5rem !important

  .pb-sm-2, .py-sm-2
    padding-bottom: 0.5rem !important

  .pl-sm-2, .px-sm-2
    padding-left: 0.5rem !important

  .p-sm-3
    padding: 1rem !important

  .pt-sm-3, .py-sm-3
    padding-top: 1rem !important

  .pr-sm-3, .px-sm-3
    padding-right: 1rem !important

  .pb-sm-3, .py-sm-3
    padding-bottom: 1rem !important

  .pl-sm-3, .px-sm-3
    padding-left: 1rem !important

  .p-sm-4
    padding: 1.5rem !important

  .pt-sm-4, .py-sm-4
    padding-top: 1.5rem !important

  .pr-sm-4, .px-sm-4
    padding-right: 1.5rem !important

  .pb-sm-4, .py-sm-4
    padding-bottom: 1.5rem !important

  .pl-sm-4, .px-sm-4
    padding-left: 1.5rem !important

  .p-sm-5
    padding: 3rem !important

  .pt-sm-5, .py-sm-5
    padding-top: 3rem !important

  .pr-sm-5, .px-sm-5
    padding-right: 3rem !important

  .pb-sm-5, .py-sm-5
    padding-bottom: 3rem !important

  .pl-sm-5, .px-sm-5
    padding-left: 3rem !important

  .m-sm-n1
    margin: (-0.25rem) !important

  .mt-sm-n1, .my-sm-n1
    margin-top: (-0.25rem) !important

  .mr-sm-n1, .mx-sm-n1
    margin-right: (-0.25rem) !important

  .mb-sm-n1, .my-sm-n1
    margin-bottom: (-0.25rem) !important

  .ml-sm-n1, .mx-sm-n1
    margin-left: (-0.25rem) !important

  .m-sm-n2
    margin: (-0.5rem) !important

  .mt-sm-n2, .my-sm-n2
    margin-top: (-0.5rem) !important

  .mr-sm-n2, .mx-sm-n2
    margin-right: (-0.5rem) !important

  .mb-sm-n2, .my-sm-n2
    margin-bottom: (-0.5rem) !important

  .ml-sm-n2, .mx-sm-n2
    margin-left: (-0.5rem) !important

  .m-sm-n3
    margin: (-1rem) !important

  .mt-sm-n3, .my-sm-n3
    margin-top: (-1rem) !important

  .mr-sm-n3, .mx-sm-n3
    margin-right: (-1rem) !important

  .mb-sm-n3, .my-sm-n3
    margin-bottom: (-1rem) !important

  .ml-sm-n3, .mx-sm-n3
    margin-left: (-1rem) !important

  .m-sm-n4
    margin: (-1.5rem) !important

  .mt-sm-n4, .my-sm-n4
    margin-top: (-1.5rem) !important

  .mr-sm-n4, .mx-sm-n4
    margin-right: (-1.5rem) !important

  .mb-sm-n4, .my-sm-n4
    margin-bottom: (-1.5rem) !important

  .ml-sm-n4, .mx-sm-n4
    margin-left: (-1.5rem) !important

  .m-sm-n5
    margin: (-3rem) !important

  .mt-sm-n5, .my-sm-n5
    margin-top: (-3rem) !important

  .mr-sm-n5, .mx-sm-n5
    margin-right: (-3rem) !important

  .mb-sm-n5, .my-sm-n5
    margin-bottom: (-3rem) !important

  .ml-sm-n5, .mx-sm-n5
    margin-left: (-3rem) !important

  .m-sm-auto
    margin: auto !important

  .mt-sm-auto, .my-sm-auto
    margin-top: auto !important

  .mr-sm-auto, .mx-sm-auto
    margin-right: auto !important

  .mb-sm-auto, .my-sm-auto
    margin-bottom: auto !important

  .ml-sm-auto, .mx-sm-auto
    margin-left: auto !important

@media (min-width: 768px)
  .m-md-0
    margin: 0 !important

  .mt-md-0, .my-md-0
    margin-top: 0 !important

  .mr-md-0, .mx-md-0
    margin-right: 0 !important

  .mb-md-0, .my-md-0
    margin-bottom: 0 !important

  .ml-md-0, .mx-md-0
    margin-left: 0 !important

  .m-md-1
    margin: 0.25rem !important

  .mt-md-1, .my-md-1
    margin-top: 0.25rem !important

  .mr-md-1, .mx-md-1
    margin-right: 0.25rem !important

  .mb-md-1, .my-md-1
    margin-bottom: 0.25rem !important

  .ml-md-1, .mx-md-1
    margin-left: 0.25rem !important

  .m-md-2
    margin: 0.5rem !important

  .mt-md-2, .my-md-2
    margin-top: 0.5rem !important

  .mr-md-2, .mx-md-2
    margin-right: 0.5rem !important

  .mb-md-2, .my-md-2
    margin-bottom: 0.5rem !important

  .ml-md-2, .mx-md-2
    margin-left: 0.5rem !important

  .m-md-3
    margin: 1rem !important

  .mt-md-3, .my-md-3
    margin-top: 1rem !important

  .mr-md-3, .mx-md-3
    margin-right: 1rem !important

  .mb-md-3, .my-md-3
    margin-bottom: 1rem !important

  .ml-md-3, .mx-md-3
    margin-left: 1rem !important

  .m-md-4
    margin: 1.5rem !important

  .mt-md-4, .my-md-4
    margin-top: 1.5rem !important

  .mr-md-4, .mx-md-4
    margin-right: 1.5rem !important

  .mb-md-4, .my-md-4
    margin-bottom: 1.5rem !important

  .ml-md-4, .mx-md-4
    margin-left: 1.5rem !important

  .m-md-5
    margin: 3rem !important

  .mt-md-5, .my-md-5
    margin-top: 3rem !important

  .mr-md-5, .mx-md-5
    margin-right: 3rem !important

  .mb-md-5, .my-md-5
    margin-bottom: 3rem !important

  .ml-md-5, .mx-md-5
    margin-left: 3rem !important

  .p-md-0
    padding: 0 !important

  .pt-md-0, .py-md-0
    padding-top: 0 !important

  .pr-md-0, .px-md-0
    padding-right: 0 !important

  .pb-md-0, .py-md-0
    padding-bottom: 0 !important

  .pl-md-0, .px-md-0
    padding-left: 0 !important

  .p-md-1
    padding: 0.25rem !important

  .pt-md-1, .py-md-1
    padding-top: 0.25rem !important

  .pr-md-1, .px-md-1
    padding-right: 0.25rem !important

  .pb-md-1, .py-md-1
    padding-bottom: 0.25rem !important

  .pl-md-1, .px-md-1
    padding-left: 0.25rem !important

  .p-md-2
    padding: 0.5rem !important

  .pt-md-2, .py-md-2
    padding-top: 0.5rem !important

  .pr-md-2, .px-md-2
    padding-right: 0.5rem !important

  .pb-md-2, .py-md-2
    padding-bottom: 0.5rem !important

  .pl-md-2, .px-md-2
    padding-left: 0.5rem !important

  .p-md-3
    padding: 1rem !important

  .pt-md-3, .py-md-3
    padding-top: 1rem !important

  .pr-md-3, .px-md-3
    padding-right: 1rem !important

  .pb-md-3, .py-md-3
    padding-bottom: 1rem !important

  .pl-md-3, .px-md-3
    padding-left: 1rem !important

  .p-md-4
    padding: 1.5rem !important

  .pt-md-4, .py-md-4
    padding-top: 1.5rem !important

  .pr-md-4, .px-md-4
    padding-right: 1.5rem !important

  .pb-md-4, .py-md-4
    padding-bottom: 1.5rem !important

  .pl-md-4, .px-md-4
    padding-left: 1.5rem !important

  .p-md-5
    padding: 3rem !important

  .pt-md-5, .py-md-5
    padding-top: 3rem !important

  .pr-md-5, .px-md-5
    padding-right: 3rem !important

  .pb-md-5, .py-md-5
    padding-bottom: 3rem !important

  .pl-md-5, .px-md-5
    padding-left: 3rem !important

  .m-md-n1
    margin: (-0.25rem) !important

  .mt-md-n1, .my-md-n1
    margin-top: (-0.25rem) !important

  .mr-md-n1, .mx-md-n1
    margin-right: (-0.25rem) !important

  .mb-md-n1, .my-md-n1
    margin-bottom: (-0.25rem) !important

  .ml-md-n1, .mx-md-n1
    margin-left: (-0.25rem) !important

  .m-md-n2
    margin: (-0.5rem) !important

  .mt-md-n2, .my-md-n2
    margin-top: (-0.5rem) !important

  .mr-md-n2, .mx-md-n2
    margin-right: (-0.5rem) !important

  .mb-md-n2, .my-md-n2
    margin-bottom: (-0.5rem) !important

  .ml-md-n2, .mx-md-n2
    margin-left: (-0.5rem) !important

  .m-md-n3
    margin: (-1rem) !important

  .mt-md-n3, .my-md-n3
    margin-top: (-1rem) !important

  .mr-md-n3, .mx-md-n3
    margin-right: (-1rem) !important

  .mb-md-n3, .my-md-n3
    margin-bottom: (-1rem) !important

  .ml-md-n3, .mx-md-n3
    margin-left: (-1rem) !important

  .m-md-n4
    margin: (-1.5rem) !important

  .mt-md-n4, .my-md-n4
    margin-top: (-1.5rem) !important

  .mr-md-n4, .mx-md-n4
    margin-right: (-1.5rem) !important

  .mb-md-n4, .my-md-n4
    margin-bottom: (-1.5rem) !important

  .ml-md-n4, .mx-md-n4
    margin-left: (-1.5rem) !important

  .m-md-n5
    margin: (-3rem) !important

  .mt-md-n5, .my-md-n5
    margin-top: (-3rem) !important

  .mr-md-n5, .mx-md-n5
    margin-right: (-3rem) !important

  .mb-md-n5, .my-md-n5
    margin-bottom: (-3rem) !important

  .ml-md-n5, .mx-md-n5
    margin-left: (-3rem) !important

  .m-md-auto
    margin: auto !important

  .mt-md-auto, .my-md-auto
    margin-top: auto !important

  .mr-md-auto, .mx-md-auto
    margin-right: auto !important

  .mb-md-auto, .my-md-auto
    margin-bottom: auto !important

  .ml-md-auto, .mx-md-auto
    margin-left: auto !important

@media (min-width: 992px)
  .m-lg-0
    margin: 0 !important

  .mt-lg-0, .my-lg-0
    margin-top: 0 !important

  .mr-lg-0, .mx-lg-0
    margin-right: 0 !important

  .mb-lg-0, .my-lg-0
    margin-bottom: 0 !important

  .ml-lg-0, .mx-lg-0
    margin-left: 0 !important

  .m-lg-1
    margin: 0.25rem !important

  .mt-lg-1, .my-lg-1
    margin-top: 0.25rem !important

  .mr-lg-1, .mx-lg-1
    margin-right: 0.25rem !important

  .mb-lg-1, .my-lg-1
    margin-bottom: 0.25rem !important

  .ml-lg-1, .mx-lg-1
    margin-left: 0.25rem !important

  .m-lg-2
    margin: 0.5rem !important

  .mt-lg-2, .my-lg-2
    margin-top: 0.5rem !important

  .mr-lg-2, .mx-lg-2
    margin-right: 0.5rem !important

  .mb-lg-2, .my-lg-2
    margin-bottom: 0.5rem !important

  .ml-lg-2, .mx-lg-2
    margin-left: 0.5rem !important

  .m-lg-3
    margin: 1rem !important

  .mt-lg-3, .my-lg-3
    margin-top: 1rem !important

  .mr-lg-3, .mx-lg-3
    margin-right: 1rem !important

  .mb-lg-3, .my-lg-3
    margin-bottom: 1rem !important

  .ml-lg-3, .mx-lg-3
    margin-left: 1rem !important

  .m-lg-4
    margin: 1.5rem !important

  .mt-lg-4, .my-lg-4
    margin-top: 1.5rem !important

  .mr-lg-4, .mx-lg-4
    margin-right: 1.5rem !important

  .mb-lg-4, .my-lg-4
    margin-bottom: 1.5rem !important

  .ml-lg-4, .mx-lg-4
    margin-left: 1.5rem !important

  .m-lg-5
    margin: 3rem !important

  .mt-lg-5, .my-lg-5
    margin-top: 3rem !important

  .mr-lg-5, .mx-lg-5
    margin-right: 3rem !important

  .mb-lg-5, .my-lg-5
    margin-bottom: 3rem !important

  .ml-lg-5, .mx-lg-5
    margin-left: 3rem !important

  .p-lg-0
    padding: 0 !important

  .pt-lg-0, .py-lg-0
    padding-top: 0 !important

  .pr-lg-0, .px-lg-0
    padding-right: 0 !important

  .pb-lg-0, .py-lg-0
    padding-bottom: 0 !important

  .pl-lg-0, .px-lg-0
    padding-left: 0 !important

  .p-lg-1
    padding: 0.25rem !important

  .pt-lg-1, .py-lg-1
    padding-top: 0.25rem !important

  .pr-lg-1, .px-lg-1
    padding-right: 0.25rem !important

  .pb-lg-1, .py-lg-1
    padding-bottom: 0.25rem !important

  .pl-lg-1, .px-lg-1
    padding-left: 0.25rem !important

  .p-lg-2
    padding: 0.5rem !important

  .pt-lg-2, .py-lg-2
    padding-top: 0.5rem !important

  .pr-lg-2, .px-lg-2
    padding-right: 0.5rem !important

  .pb-lg-2, .py-lg-2
    padding-bottom: 0.5rem !important

  .pl-lg-2, .px-lg-2
    padding-left: 0.5rem !important

  .p-lg-3
    padding: 1rem !important

  .pt-lg-3, .py-lg-3
    padding-top: 1rem !important

  .pr-lg-3, .px-lg-3
    padding-right: 1rem !important

  .pb-lg-3, .py-lg-3
    padding-bottom: 1rem !important

  .pl-lg-3, .px-lg-3
    padding-left: 1rem !important

  .p-lg-4
    padding: 1.5rem !important

  .pt-lg-4, .py-lg-4
    padding-top: 1.5rem !important

  .pr-lg-4, .px-lg-4
    padding-right: 1.5rem !important

  .pb-lg-4, .py-lg-4
    padding-bottom: 1.5rem !important

  .pl-lg-4, .px-lg-4
    padding-left: 1.5rem !important

  .p-lg-5
    padding: 3rem !important

  .pt-lg-5, .py-lg-5
    padding-top: 3rem !important

  .pr-lg-5, .px-lg-5
    padding-right: 3rem !important

  .pb-lg-5, .py-lg-5
    padding-bottom: 3rem !important

  .pl-lg-5, .px-lg-5
    padding-left: 3rem !important

  .m-lg-n1
    margin: (-0.25rem) !important

  .mt-lg-n1, .my-lg-n1
    margin-top: (-0.25rem) !important

  .mr-lg-n1, .mx-lg-n1
    margin-right: (-0.25rem) !important

  .mb-lg-n1, .my-lg-n1
    margin-bottom: (-0.25rem) !important

  .ml-lg-n1, .mx-lg-n1
    margin-left: (-0.25rem) !important

  .m-lg-n2
    margin: (-0.5rem) !important

  .mt-lg-n2, .my-lg-n2
    margin-top: (-0.5rem) !important

  .mr-lg-n2, .mx-lg-n2
    margin-right: (-0.5rem) !important

  .mb-lg-n2, .my-lg-n2
    margin-bottom: (-0.5rem) !important

  .ml-lg-n2, .mx-lg-n2
    margin-left: (-0.5rem) !important

  .m-lg-n3
    margin: (-1rem) !important

  .mt-lg-n3, .my-lg-n3
    margin-top: (-1rem) !important

  .mr-lg-n3, .mx-lg-n3
    margin-right: (-1rem) !important

  .mb-lg-n3, .my-lg-n3
    margin-bottom: (-1rem) !important

  .ml-lg-n3, .mx-lg-n3
    margin-left: (-1rem) !important

  .m-lg-n4
    margin: (-1.5rem) !important

  .mt-lg-n4, .my-lg-n4
    margin-top: (-1.5rem) !important

  .mr-lg-n4, .mx-lg-n4
    margin-right: (-1.5rem) !important

  .mb-lg-n4, .my-lg-n4
    margin-bottom: (-1.5rem) !important

  .ml-lg-n4, .mx-lg-n4
    margin-left: (-1.5rem) !important

  .m-lg-n5
    margin: (-3rem) !important

  .mt-lg-n5, .my-lg-n5
    margin-top: (-3rem) !important

  .mr-lg-n5, .mx-lg-n5
    margin-right: (-3rem) !important

  .mb-lg-n5, .my-lg-n5
    margin-bottom: (-3rem) !important

  .ml-lg-n5, .mx-lg-n5
    margin-left: (-3rem) !important

  .m-lg-auto
    margin: auto !important

  .mt-lg-auto, .my-lg-auto
    margin-top: auto !important

  .mr-lg-auto, .mx-lg-auto
    margin-right: auto !important

  .mb-lg-auto, .my-lg-auto
    margin-bottom: auto !important

  .ml-lg-auto, .mx-lg-auto
    margin-left: auto !important

@media (min-width: 1200px)
  .m-xl-0
    margin: 0 !important

  .mt-xl-0, .my-xl-0
    margin-top: 0 !important

  .mr-xl-0, .mx-xl-0
    margin-right: 0 !important

  .mb-xl-0, .my-xl-0
    margin-bottom: 0 !important

  .ml-xl-0, .mx-xl-0
    margin-left: 0 !important

  .m-xl-1
    margin: 0.25rem !important

  .mt-xl-1, .my-xl-1
    margin-top: 0.25rem !important

  .mr-xl-1, .mx-xl-1
    margin-right: 0.25rem !important

  .mb-xl-1, .my-xl-1
    margin-bottom: 0.25rem !important

  .ml-xl-1, .mx-xl-1
    margin-left: 0.25rem !important

  .m-xl-2
    margin: 0.5rem !important

  .mt-xl-2, .my-xl-2
    margin-top: 0.5rem !important

  .mr-xl-2, .mx-xl-2
    margin-right: 0.5rem !important

  .mb-xl-2, .my-xl-2
    margin-bottom: 0.5rem !important

  .ml-xl-2, .mx-xl-2
    margin-left: 0.5rem !important

  .m-xl-3
    margin: 1rem !important

  .mt-xl-3, .my-xl-3
    margin-top: 1rem !important

  .mr-xl-3, .mx-xl-3
    margin-right: 1rem !important

  .mb-xl-3, .my-xl-3
    margin-bottom: 1rem !important

  .ml-xl-3, .mx-xl-3
    margin-left: 1rem !important

  .m-xl-4
    margin: 1.5rem !important

  .mt-xl-4, .my-xl-4
    margin-top: 1.5rem !important

  .mr-xl-4, .mx-xl-4
    margin-right: 1.5rem !important

  .mb-xl-4, .my-xl-4
    margin-bottom: 1.5rem !important

  .ml-xl-4, .mx-xl-4
    margin-left: 1.5rem !important

  .m-xl-5
    margin: 3rem !important

  .mt-xl-5, .my-xl-5
    margin-top: 3rem !important

  .mr-xl-5, .mx-xl-5
    margin-right: 3rem !important

  .mb-xl-5, .my-xl-5
    margin-bottom: 3rem !important

  .ml-xl-5, .mx-xl-5
    margin-left: 3rem !important

  .p-xl-0
    padding: 0 !important

  .pt-xl-0, .py-xl-0
    padding-top: 0 !important

  .pr-xl-0, .px-xl-0
    padding-right: 0 !important

  .pb-xl-0, .py-xl-0
    padding-bottom: 0 !important

  .pl-xl-0, .px-xl-0
    padding-left: 0 !important

  .p-xl-1
    padding: 0.25rem !important

  .pt-xl-1, .py-xl-1
    padding-top: 0.25rem !important

  .pr-xl-1, .px-xl-1
    padding-right: 0.25rem !important

  .pb-xl-1, .py-xl-1
    padding-bottom: 0.25rem !important

  .pl-xl-1, .px-xl-1
    padding-left: 0.25rem !important

  .p-xl-2
    padding: 0.5rem !important

  .pt-xl-2, .py-xl-2
    padding-top: 0.5rem !important

  .pr-xl-2, .px-xl-2
    padding-right: 0.5rem !important

  .pb-xl-2, .py-xl-2
    padding-bottom: 0.5rem !important

  .pl-xl-2, .px-xl-2
    padding-left: 0.5rem !important

  .p-xl-3
    padding: 1rem !important

  .pt-xl-3, .py-xl-3
    padding-top: 1rem !important

  .pr-xl-3, .px-xl-3
    padding-right: 1rem !important

  .pb-xl-3, .py-xl-3
    padding-bottom: 1rem !important

  .pl-xl-3, .px-xl-3
    padding-left: 1rem !important

  .p-xl-4
    padding: 1.5rem !important

  .pt-xl-4, .py-xl-4
    padding-top: 1.5rem !important

  .pr-xl-4, .px-xl-4
    padding-right: 1.5rem !important

  .pb-xl-4, .py-xl-4
    padding-bottom: 1.5rem !important

  .pl-xl-4, .px-xl-4
    padding-left: 1.5rem !important

  .p-xl-5
    padding: 3rem !important

  .pt-xl-5, .py-xl-5
    padding-top: 3rem !important

  .pr-xl-5, .px-xl-5
    padding-right: 3rem !important

  .pb-xl-5, .py-xl-5
    padding-bottom: 3rem !important

  .pl-xl-5, .px-xl-5
    padding-left: 3rem !important

  .m-xl-n1
    margin: (-0.25rem) !important

  .mt-xl-n1, .my-xl-n1
    margin-top: (-0.25rem) !important

  .mr-xl-n1, .mx-xl-n1
    margin-right: (-0.25rem) !important

  .mb-xl-n1, .my-xl-n1
    margin-bottom: (-0.25rem) !important

  .ml-xl-n1, .mx-xl-n1
    margin-left: (-0.25rem) !important

  .m-xl-n2
    margin: (-0.5rem) !important

  .mt-xl-n2, .my-xl-n2
    margin-top: (-0.5rem) !important

  .mr-xl-n2, .mx-xl-n2
    margin-right: (-0.5rem) !important

  .mb-xl-n2, .my-xl-n2
    margin-bottom: (-0.5rem) !important

  .ml-xl-n2, .mx-xl-n2
    margin-left: (-0.5rem) !important

  .m-xl-n3
    margin: (-1rem) !important

  .mt-xl-n3, .my-xl-n3
    margin-top: (-1rem) !important

  .mr-xl-n3, .mx-xl-n3
    margin-right: (-1rem) !important

  .mb-xl-n3, .my-xl-n3
    margin-bottom: (-1rem) !important

  .ml-xl-n3, .mx-xl-n3
    margin-left: (-1rem) !important

  .m-xl-n4
    margin: (-1.5rem) !important

  .mt-xl-n4, .my-xl-n4
    margin-top: (-1.5rem) !important

  .mr-xl-n4, .mx-xl-n4
    margin-right: (-1.5rem) !important

  .mb-xl-n4, .my-xl-n4
    margin-bottom: (-1.5rem) !important

  .ml-xl-n4, .mx-xl-n4
    margin-left: (-1.5rem) !important

  .m-xl-n5
    margin: (-3rem) !important

  .mt-xl-n5, .my-xl-n5
    margin-top: (-3rem) !important

  .mr-xl-n5, .mx-xl-n5
    margin-right: (-3rem) !important

  .mb-xl-n5, .my-xl-n5
    margin-bottom: (-3rem) !important

  .ml-xl-n5, .mx-xl-n5
    margin-left: (-3rem) !important

  .m-xl-auto
    margin: auto !important

  .mt-xl-auto, .my-xl-auto
    margin-top: auto !important

  .mr-xl-auto, .mx-xl-auto
    margin-right: auto !important

  .mb-xl-auto, .my-xl-auto
    margin-bottom: auto !important

  .ml-xl-auto, .mx-xl-auto
    margin-left: auto !important

.stretched-link::after
  position: absolute
  top: 0
  right: 0
  bottom: 0
  left: 0
  z-index: 1
  pointer-events: auto
  content: ""
  background-color: rgba(0, 0, 0, 0)

.text-monospace
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important

.text-justify
  text-align: justify !important

.text-wrap
  white-space: normal !important

.text-nowrap
  white-space: nowrap !important

.text-truncate
  overflow: hidden
  text-overflow: ellipsis
  white-space: nowrap

.text-left
  text-align: left !important

.text-right
  text-align: right !important

.text-center
  text-align: center !important

@media (min-width: 576px)
  .text-sm-left
    text-align: left !important

  .text-sm-right
    text-align: right !important

  .text-sm-center
    text-align: center !important

@media (min-width: 768px)
  .text-md-left
    text-align: left !important

  .text-md-right
    text-align: right !important

  .text-md-center
    text-align: center !important

@media (min-width: 992px)
  .text-lg-left
    text-align: left !important

  .text-lg-right
    text-align: right !important

  .text-lg-center
    text-align: center !important

@media (min-width: 1200px)
  .text-xl-left
    text-align: left !important

  .text-xl-right
    text-align: right !important

  .text-xl-center
    text-align: center !important

.text-lowercase
  text-transform: lowercase !important

.text-uppercase
  text-transform: uppercase !important

.text-capitalize
  text-transform: capitalize !important

.font-weight-light
  font-weight: 300 !important

.font-weight-lighter
  font-weight: lighter !important

.font-weight-normal
  font-weight: 400 !important

.font-weight-bold
  font-weight: 700 !important

.font-weight-bolder
  font-weight: bolder !important

.font-italic
  font-style: italic !important

.text-white
  color: #fff !important

.text-primary
  color: #007bff !important

a.text-primary
  &:focus, &:hover
    color: #0056b3 !important

.text-secondary
  color: #6c757d !important

a.text-secondary
  &:focus, &:hover
    color: #494f54 !important

.text-success
  color: #28a745 !important

a.text-success
  &:focus, &:hover
    color: #19692c !important

.text-info
  color: #17a2b8 !important

a.text-info
  &:focus, &:hover
    color: #0f6674 !important

.text-warning
  color: #ffc107 !important

a.text-warning
  &:focus, &:hover
    color: #ba8b00 !important

.text-danger
  color: #dc3545 !important

a.text-danger
  &:focus, &:hover
    color: #a71d2a !important

.text-light
  color: #f8f9fa !important

a.text-light
  &:focus, &:hover
    color: #cbd3da !important

.text-dark
  color: #343a40 !important

a.text-dark
  &:focus, &:hover
    color: #121416 !important

.text-body
  color: #212529 !important

.text-muted
  color: #6c757d !important

.text-black-50
  color: rgba(0, 0, 0, 0.5) !important

.text-white-50
  color: rgba(255, 255, 255, 0.5) !important

.text-hide
  font: 0/0 a
  color: transparent
  text-shadow: none
  background-color: transparent
  border: 0

.text-decoration-none
  text-decoration: none !important

.text-break
  word-break: break-word !important
  word-wrap: break-word !important

.text-reset
  color: inherit !important

.visible
  visibility: visible !important

.invisible
  visibility: hidden !important

@media print
  *, ::after, ::before
    text-shadow: none !important
    box-shadow: none !important

  a:not(.btn)
    text-decoration: underline

  abbr[title]::after
    content: " (" attr(title) ")"

  pre
    white-space: pre-wrap !important

  blockquote, pre
    border: 1px solid #adb5bd
    page-break-inside: avoid

  thead
    display: table-header-group

  img, tr
    page-break-inside: avoid

  h2, h3, p
    orphans: 3
    widows: 3

  h2, h3
    page-break-after: avoid

  @page
    size: a3

  body, .container
    min-width: 992px !important

  .navbar
    display: none

  .badge
    border: 1px solid #000

  .table
    border-collapse: collapse !important

    td, th
      background-color: #fff !important

  .table-bordered
    td, th
      border: 1px solid #dee2e6 !important

  .table-dark
    color: inherit

    tbody + tbody, td, th, thead th
      border-color: #dee2e6

  .table .thead-dark th
    color: inherit
    border-color: #dee2e6

html.scroll-smooth
  scroll-behavior: smooth

.wrapper, body, html
  min-height: 100%

.wrapper
  position: relative

  .content-wrapper
    min-height: calc(100vh - calc(3.5rem + 1px) - calc(3.5rem + 1px))

.layout-boxed .wrapper
  box-shadow: 0 0 10 rgba(0, 0, 0, 0.3)
  margin: 0 auto
  max-width: 1250px

  &::before
    margin: 0 auto
    max-width: 1250px

  .main-sidebar
    left: inherit

@supports not (-webkit-touch-callout: none)
  .layout-fixed
    .wrapper .sidebar
      height: calc(100vh - (3.5rem + 1px))

    &.text-sm .wrapper .sidebar
      height: calc(100vh - (2.93725rem + 1px))

.layout-navbar-fixed
  &.layout-fixed
    .wrapper
      .control-sidebar
        top: calc(3.5rem + 1px)

      .main-header.text-sm ~ .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(3.5rem + 1px)

      .brand-link.text-sm ~ .sidebar
        margin-top: calc(2.93725rem + 1px)

    &.text-sm .wrapper
      .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(2.93725rem + 1px)

  &.sidebar-mini-md.sidebar-collapse .wrapper .brand-link, &.sidebar-mini.sidebar-collapse .wrapper .brand-link
    height: calc(3.5rem + 1px)
    width: 4.6rem

  &.sidebar-mini-md.sidebar-collapse .wrapper .brand-link.text-sm, &.sidebar-mini.sidebar-collapse .wrapper .brand-link.text-sm, &.sidebar-mini-md.sidebar-collapse.text-sm .wrapper .brand-link, &.sidebar-mini.sidebar-collapse.text-sm .wrapper .brand-link
    height: calc(2.93725rem + 1px)

body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar
  margin-top: calc(calc(2.93725rem + 1px)/ -1)

  .sidebar
    margin-top: calc(2.93725rem + 1px)

.layout-navbar-fixed
  .wrapper
    .control-sidebar
      top: 0

    a.anchor
      display: block
      position: relative
      top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

    .main-sidebar:hover .brand-link
      transition: width .3s ease-in-out
      width: 250px

    .brand-link
      overflow: hidden
      position: fixed
      top: 0
      transition: width .3s ease-in-out
      width: 250px
      z-index: 1035

    .sidebar-dark-primary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-primary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-secondary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-secondary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-success .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-success .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-info .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-info .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-warning .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-warning .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-danger .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-danger .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-light .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-light .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-dark .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-dark .brand-link:not([class*=navbar])
      background-color: #fff

    .content-wrapper
      margin-top: calc(3.5rem + 1px)

    .main-header
      &.text-sm ~ .content-wrapper
        margin-top: calc(2.93725rem + 1px)

      left: 0
      position: fixed
      right: 0
      top: 0
      z-index: 1033

  &.text-sm .wrapper .content-wrapper
    margin-top: calc(2.93725rem + 1px)

.layout-navbar-not-fixed
  .wrapper
    .brand-link
      position: static

    .content-wrapper, .sidebar
      margin-top: 0

    .main-header
      position: static

  &.layout-fixed .wrapper .sidebar
    margin-top: 0

.layout-navbar-fixed.layout-fixed .wrapper
  .control-sidebar
    top: calc(3.5rem + 1px)

  .main-header.text-sm ~ .control-sidebar
    top: calc(2.93725rem + 1px)

.text-sm .layout-navbar-fixed.layout-fixed .wrapper .main-header ~ .control-sidebar
  top: calc(2.93725rem + 1px)

.layout-navbar-fixed.layout-fixed .wrapper
  .sidebar
    margin-top: calc(3.5rem + 1px)

  .brand-link.text-sm ~ .sidebar
    margin-top: calc(2.93725rem + 1px)

.text-sm .layout-navbar-fixed.layout-fixed .wrapper .brand-link ~ .sidebar
  margin-top: calc(2.93725rem + 1px)

.layout-navbar-fixed
  &.layout-fixed.text-sm .wrapper
    .control-sidebar
      top: calc(2.93725rem + 1px)

    .sidebar
      margin-top: calc(2.93725rem + 1px)

  .wrapper
    .control-sidebar
      top: 0

    a.anchor
      display: block
      position: relative
      top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

    &.sidebar-collapse .brand-link
      height: calc(3.5rem + 1px)
      transition: width .3s ease-in-out
      width: 4.6rem

      &.text-sm
        height: calc(2.93725rem + 1px)

.text-sm .layout-navbar-fixed .wrapper.sidebar-collapse .brand-link
  height: calc(2.93725rem + 1px)

.layout-navbar-fixed .wrapper
  &.sidebar-collapse .main-sidebar:hover .brand-link
    transition: width .3s ease-in-out
    width: 250px

  .brand-link
    overflow: hidden
    position: fixed
    top: 0
    transition: width .3s ease-in-out
    width: 250px
    z-index: 1035

  .sidebar-dark-primary .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-primary .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-secondary .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-secondary .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-success .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-success .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-info .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-info .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-warning .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-warning .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-danger .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-danger .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-light .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-light .brand-link:not([class*=navbar])
    background-color: #fff

  .sidebar-dark-dark .brand-link:not([class*=navbar])
    background-color: #343a40

  .sidebar-light-dark .brand-link:not([class*=navbar])
    background-color: #fff

  .content-wrapper
    margin-top: calc(3.5rem + 1px)

  .main-header.text-sm ~ .content-wrapper
    margin-top: calc(2.93725rem + 1px)

.text-sm .layout-navbar-fixed .wrapper .main-header ~ .content-wrapper
  margin-top: calc(2.93725rem + 1px)

.layout-navbar-fixed
  .wrapper .main-header
    left: 0
    position: fixed
    right: 0
    top: 0
    z-index: 1037

  &.text-sm .wrapper .content-wrapper
    margin-top: calc(2.93725rem + 1px)

body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar
  margin-top: calc(calc(2.93725rem + 1px)/ -1)

  .sidebar
    margin-top: calc(2.93725rem + 1px)

.layout-navbar-not-fixed
  .wrapper
    .brand-link
      position: static

    .content-wrapper, .sidebar
      margin-top: 0

    .main-header
      position: static

  &.layout-fixed .wrapper .sidebar
    margin-top: 0

@media (min-width: 576px)
  .layout-sm-navbar-fixed.layout-fixed .wrapper
    .control-sidebar
      top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .control-sidebar
      top: calc(2.93725rem + 1px)

  .text-sm .layout-sm-navbar-fixed.layout-fixed .wrapper .main-header ~ .control-sidebar
    top: calc(2.93725rem + 1px)

  .layout-sm-navbar-fixed.layout-fixed .wrapper
    .sidebar
      margin-top: calc(3.5rem + 1px)

    .brand-link.text-sm ~ .sidebar
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-sm-navbar-fixed.layout-fixed .wrapper .brand-link ~ .sidebar
    margin-top: calc(2.93725rem + 1px)

  .layout-sm-navbar-fixed
    &.layout-fixed.text-sm .wrapper
      .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(2.93725rem + 1px)

    .wrapper
      .control-sidebar
        top: 0

      a.anchor
        display: block
        position: relative
        top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

      &.sidebar-collapse .brand-link
        height: calc(3.5rem + 1px)
        transition: width .3s ease-in-out
        width: 4.6rem

        &.text-sm
          height: calc(2.93725rem + 1px)

  .text-sm .layout-sm-navbar-fixed .wrapper.sidebar-collapse .brand-link
    height: calc(2.93725rem + 1px)

  .layout-sm-navbar-fixed .wrapper
    &.sidebar-collapse .main-sidebar:hover .brand-link
      transition: width .3s ease-in-out
      width: 250px

    .brand-link
      overflow: hidden
      position: fixed
      top: 0
      transition: width .3s ease-in-out
      width: 250px
      z-index: 1035

    .sidebar-dark-primary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-primary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-secondary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-secondary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-success .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-success .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-info .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-info .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-warning .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-warning .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-danger .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-danger .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-light .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-light .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-dark .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-dark .brand-link:not([class*=navbar])
      background-color: #fff

    .content-wrapper
      margin-top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-sm-navbar-fixed .wrapper .main-header ~ .content-wrapper
    margin-top: calc(2.93725rem + 1px)

  .layout-sm-navbar-fixed
    .wrapper .main-header
      left: 0
      position: fixed
      right: 0
      top: 0
      z-index: 1037

    &.text-sm .wrapper .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  body:not(.layout-fixed).layout-sm-navbar-fixed.text-sm .wrapper .main-sidebar
    margin-top: calc(calc(2.93725rem + 1px)/ -1)

    .sidebar
      margin-top: calc(2.93725rem + 1px)

  .layout-sm-navbar-not-fixed
    .wrapper
      .brand-link
        position: static

      .content-wrapper, .sidebar
        margin-top: 0

      .main-header
        position: static

    &.layout-fixed .wrapper .sidebar
      margin-top: 0

@media (min-width: 768px)
  .layout-md-navbar-fixed.layout-fixed .wrapper
    .control-sidebar
      top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .control-sidebar
      top: calc(2.93725rem + 1px)

  .text-sm .layout-md-navbar-fixed.layout-fixed .wrapper .main-header ~ .control-sidebar
    top: calc(2.93725rem + 1px)

  .layout-md-navbar-fixed.layout-fixed .wrapper
    .sidebar
      margin-top: calc(3.5rem + 1px)

    .brand-link.text-sm ~ .sidebar
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-md-navbar-fixed.layout-fixed .wrapper .brand-link ~ .sidebar
    margin-top: calc(2.93725rem + 1px)

  .layout-md-navbar-fixed
    &.layout-fixed.text-sm .wrapper
      .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(2.93725rem + 1px)

    .wrapper
      .control-sidebar
        top: 0

      a.anchor
        display: block
        position: relative
        top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

      &.sidebar-collapse .brand-link
        height: calc(3.5rem + 1px)
        transition: width .3s ease-in-out
        width: 4.6rem

        &.text-sm
          height: calc(2.93725rem + 1px)

  .text-sm .layout-md-navbar-fixed .wrapper.sidebar-collapse .brand-link
    height: calc(2.93725rem + 1px)

  .layout-md-navbar-fixed .wrapper
    &.sidebar-collapse .main-sidebar:hover .brand-link
      transition: width .3s ease-in-out
      width: 250px

    .brand-link
      overflow: hidden
      position: fixed
      top: 0
      transition: width .3s ease-in-out
      width: 250px
      z-index: 1035

    .sidebar-dark-primary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-primary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-secondary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-secondary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-success .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-success .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-info .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-info .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-warning .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-warning .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-danger .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-danger .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-light .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-light .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-dark .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-dark .brand-link:not([class*=navbar])
      background-color: #fff

    .content-wrapper
      margin-top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-md-navbar-fixed .wrapper .main-header ~ .content-wrapper
    margin-top: calc(2.93725rem + 1px)

  .layout-md-navbar-fixed
    .wrapper .main-header
      left: 0
      position: fixed
      right: 0
      top: 0
      z-index: 1037

    &.text-sm .wrapper .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  body:not(.layout-fixed).layout-md-navbar-fixed.text-sm .wrapper .main-sidebar
    margin-top: calc(calc(2.93725rem + 1px)/ -1)

    .sidebar
      margin-top: calc(2.93725rem + 1px)

  .layout-md-navbar-not-fixed
    .wrapper
      .brand-link
        position: static

      .content-wrapper, .sidebar
        margin-top: 0

      .main-header
        position: static

    &.layout-fixed .wrapper .sidebar
      margin-top: 0

@media (min-width: 992px)
  .layout-lg-navbar-fixed.layout-fixed .wrapper
    .control-sidebar
      top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .control-sidebar
      top: calc(2.93725rem + 1px)

  .text-sm .layout-lg-navbar-fixed.layout-fixed .wrapper .main-header ~ .control-sidebar
    top: calc(2.93725rem + 1px)

  .layout-lg-navbar-fixed.layout-fixed .wrapper
    .sidebar
      margin-top: calc(3.5rem + 1px)

    .brand-link.text-sm ~ .sidebar
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-lg-navbar-fixed.layout-fixed .wrapper .brand-link ~ .sidebar
    margin-top: calc(2.93725rem + 1px)

  .layout-lg-navbar-fixed
    &.layout-fixed.text-sm .wrapper
      .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(2.93725rem + 1px)

    .wrapper
      .control-sidebar
        top: 0

      a.anchor
        display: block
        position: relative
        top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

      &.sidebar-collapse .brand-link
        height: calc(3.5rem + 1px)
        transition: width .3s ease-in-out
        width: 4.6rem

        &.text-sm
          height: calc(2.93725rem + 1px)

  .text-sm .layout-lg-navbar-fixed .wrapper.sidebar-collapse .brand-link
    height: calc(2.93725rem + 1px)

  .layout-lg-navbar-fixed .wrapper
    &.sidebar-collapse .main-sidebar:hover .brand-link
      transition: width .3s ease-in-out
      width: 250px

    .brand-link
      overflow: hidden
      position: fixed
      top: 0
      transition: width .3s ease-in-out
      width: 250px
      z-index: 1035

    .sidebar-dark-primary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-primary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-secondary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-secondary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-success .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-success .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-info .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-info .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-warning .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-warning .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-danger .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-danger .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-light .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-light .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-dark .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-dark .brand-link:not([class*=navbar])
      background-color: #fff

    .content-wrapper
      margin-top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-lg-navbar-fixed .wrapper .main-header ~ .content-wrapper
    margin-top: calc(2.93725rem + 1px)

  .layout-lg-navbar-fixed
    .wrapper .main-header
      left: 0
      position: fixed
      right: 0
      top: 0
      z-index: 1037

    &.text-sm .wrapper .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  body:not(.layout-fixed).layout-lg-navbar-fixed.text-sm .wrapper .main-sidebar
    margin-top: calc(calc(2.93725rem + 1px)/ -1)

    .sidebar
      margin-top: calc(2.93725rem + 1px)

  .layout-lg-navbar-not-fixed
    .wrapper
      .brand-link
        position: static

      .content-wrapper, .sidebar
        margin-top: 0

      .main-header
        position: static

    &.layout-fixed .wrapper .sidebar
      margin-top: 0

@media (min-width: 1200px)
  .layout-xl-navbar-fixed.layout-fixed .wrapper
    .control-sidebar
      top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .control-sidebar
      top: calc(2.93725rem + 1px)

  .text-sm .layout-xl-navbar-fixed.layout-fixed .wrapper .main-header ~ .control-sidebar
    top: calc(2.93725rem + 1px)

  .layout-xl-navbar-fixed.layout-fixed .wrapper
    .sidebar
      margin-top: calc(3.5rem + 1px)

    .brand-link.text-sm ~ .sidebar
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-xl-navbar-fixed.layout-fixed .wrapper .brand-link ~ .sidebar
    margin-top: calc(2.93725rem + 1px)

  .layout-xl-navbar-fixed
    &.layout-fixed.text-sm .wrapper
      .control-sidebar
        top: calc(2.93725rem + 1px)

      .sidebar
        margin-top: calc(2.93725rem + 1px)

    .wrapper
      .control-sidebar
        top: 0

      a.anchor
        display: block
        position: relative
        top: calc((3.5rem + 1px + (.5rem * 2))/ -1)

      &.sidebar-collapse .brand-link
        height: calc(3.5rem + 1px)
        transition: width .3s ease-in-out
        width: 4.6rem

        &.text-sm
          height: calc(2.93725rem + 1px)

  .text-sm .layout-xl-navbar-fixed .wrapper.sidebar-collapse .brand-link
    height: calc(2.93725rem + 1px)

  .layout-xl-navbar-fixed .wrapper
    &.sidebar-collapse .main-sidebar:hover .brand-link
      transition: width .3s ease-in-out
      width: 250px

    .brand-link
      overflow: hidden
      position: fixed
      top: 0
      transition: width .3s ease-in-out
      width: 250px
      z-index: 1035

    .sidebar-dark-primary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-primary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-secondary .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-secondary .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-success .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-success .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-info .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-info .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-warning .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-warning .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-danger .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-danger .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-light .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-light .brand-link:not([class*=navbar])
      background-color: #fff

    .sidebar-dark-dark .brand-link:not([class*=navbar])
      background-color: #343a40

    .sidebar-light-dark .brand-link:not([class*=navbar])
      background-color: #fff

    .content-wrapper
      margin-top: calc(3.5rem + 1px)

    .main-header.text-sm ~ .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  .text-sm .layout-xl-navbar-fixed .wrapper .main-header ~ .content-wrapper
    margin-top: calc(2.93725rem + 1px)

  .layout-xl-navbar-fixed
    .wrapper .main-header
      left: 0
      position: fixed
      right: 0
      top: 0
      z-index: 1037

    &.text-sm .wrapper .content-wrapper
      margin-top: calc(2.93725rem + 1px)

  body:not(.layout-fixed).layout-xl-navbar-fixed.text-sm .wrapper .main-sidebar
    margin-top: calc(calc(2.93725rem + 1px)/ -1)

    .sidebar
      margin-top: calc(2.93725rem + 1px)

  .layout-xl-navbar-not-fixed
    .wrapper
      .brand-link
        position: static

      .content-wrapper, .sidebar
        margin-top: 0

      .main-header
        position: static

    &.layout-fixed .wrapper .sidebar
      margin-top: 0

.layout-footer-fixed .wrapper
  .control-sidebar
    bottom: 0

  .main-footer
    bottom: 0
    left: 0
    position: fixed
    right: 0
    z-index: 1032

.layout-footer-not-fixed .wrapper
  .main-footer
    position: static

  .content-wrapper
    margin-bottom: 0

.layout-footer-fixed .wrapper
  .control-sidebar
    bottom: 0

  .main-footer
    bottom: 0
    left: 0
    position: fixed
    right: 0
    z-index: 1032

  .content-wrapper
    padding-bottom: calc(3.5rem + 1px)

.layout-footer-not-fixed .wrapper .main-footer
  position: static

@media (min-width: 576px)
  .layout-sm-footer-fixed .wrapper
    .control-sidebar
      bottom: 0

    .main-footer
      bottom: 0
      left: 0
      position: fixed
      right: 0
      z-index: 1032

    .content-wrapper
      padding-bottom: calc(3.5rem + 1px)

  .layout-sm-footer-not-fixed .wrapper .main-footer
    position: static

@media (min-width: 768px)
  .layout-md-footer-fixed .wrapper
    .control-sidebar
      bottom: 0

    .main-footer
      bottom: 0
      left: 0
      position: fixed
      right: 0
      z-index: 1032

    .content-wrapper
      padding-bottom: calc(3.5rem + 1px)

  .layout-md-footer-not-fixed .wrapper .main-footer
    position: static

@media (min-width: 992px)
  .layout-lg-footer-fixed .wrapper
    .control-sidebar
      bottom: 0

    .main-footer
      bottom: 0
      left: 0
      position: fixed
      right: 0
      z-index: 1032

    .content-wrapper
      padding-bottom: calc(3.5rem + 1px)

  .layout-lg-footer-not-fixed .wrapper .main-footer
    position: static

@media (min-width: 1200px)
  .layout-xl-footer-fixed .wrapper
    .control-sidebar
      bottom: 0

    .main-footer
      bottom: 0
      left: 0
      position: fixed
      right: 0
      z-index: 1032

    .content-wrapper
      padding-bottom: calc(3.5rem + 1px)

  .layout-xl-footer-not-fixed .wrapper .main-footer
    position: static

.layout-top-nav .wrapper
  margin-left: 0

  .main-header .brand-image
    margin-top: -.5rem
    margin-right: .2rem
    height: 33px

  .main-sidebar
    bottom: inherit
    height: inherit

  .content-wrapper, .main-footer, .main-header
    margin-left: 0

body.sidebar-collapse:not(.sidebar-mini-md):not(.sidebar-mini)
  .content-wrapper, .main-footer, .main-header
    margin-left: 0

    &::before
      margin-left: 0

@media (min-width: 768px)
  body:not(.sidebar-mini-md)
    .content-wrapper, .main-footer, .main-header
      transition: margin-left .3s ease-in-out
      margin-left: 250px

@media (min-width: 768px) and (prefers-reduced-motion: reduce)
  body:not(.sidebar-mini-md)
    .content-wrapper, .main-footer, .main-header
      transition: none

@media (min-width: 768px)
  .sidebar-collapse body:not(.sidebar-mini-md)
    .content-wrapper, .main-footer, .main-header
      margin-left: 0

@media (max-width: 991.98px)
  body:not(.sidebar-mini-md)
    .content-wrapper, .main-footer, .main-header
      margin-left: 0

      &::before
        margin-left: 0

@media (min-width: 768px)
  .sidebar-mini-md
    .content-wrapper, .main-footer, .main-header
      transition: margin-left .3s ease-in-out
      margin-left: 250px

@media (min-width: 768px) and (prefers-reduced-motion: reduce)
  .sidebar-mini-md
    .content-wrapper, .main-footer, .main-header
      transition: none

@media (min-width: 768px)
  .sidebar-collapse .sidebar-mini-md
    .content-wrapper, .main-footer, .main-header
      margin-left: 4.6rem

@media (max-width: 991.98px)
  .sidebar-mini-md
    .content-wrapper, .main-footer, .main-header
      margin-left: 4.6rem

      &::before
        margin-left: 4.6rem

.content-wrapper
  background-color: #f4f6f9

  > .content
    padding: 0 .5rem

.main-sidebar
  transition: margin-left .3s ease-in-out,width .3s ease-in-out
  width: 250px

  &::before
    transition: margin-left .3s ease-in-out,width .3s ease-in-out
    width: 250px

@media (prefers-reduced-motion: reduce)
  .main-sidebar
    transition: none

    &::before
      transition: none

.sidebar-collapse
  &:not(.sidebar-mini):not(.sidebar-mini-md) .main-sidebar
    box-shadow: none !important

    &::before
      box-shadow: none !important

  .main-sidebar
    margin-left: -250px

    &::before
      margin-left: -250px

    .nav-sidebar.nav-child-indent .nav-treeview
      padding: 0

@media (max-width: 767.98px)
  .main-sidebar
    box-shadow: none !important
    margin-left: -250px

    &::before
      box-shadow: none !important
      margin-left: -250px

  .sidebar-open .main-sidebar
    margin-left: 0

    &::before
      margin-left: 0

\:not(.layout-fixed) .main-sidebar
  height: inherit
  min-height: 100%
  position: absolute
  top: 0

.layout-fixed
  .brand-link
    width: 250px

  .main-sidebar
    bottom: 0
    float: none
    height: 100vh
    left: 0
    position: fixed
    top: 0

  .control-sidebar
    bottom: 0
    float: none
    height: 100vh
    position: fixed
    top: 0

    .control-sidebar-content
      height: calc(100vh - calc(3.5rem + 1px))

@supports (-webkit-touch-callout: none)
  .layout-fixed .main-sidebar
    height: inherit

.main-footer
  background-color: #fff
  border-top: 1px solid #dee2e6
  color: #869099
  padding: 1rem

  &.text-sm
    padding: .812rem

.text-sm .main-footer
  padding: .812rem

.content-header
  padding: 15px .5rem

.text-sm .content-header
  padding: 10px .5rem

.content-header h1
  font-size: 1.8rem
  margin: 0

.text-sm .content-header h1
  font-size: 1.5rem

.content-header .breadcrumb
  background-color: transparent
  line-height: 1.8rem
  margin-bottom: 0
  padding: 0

.text-sm .content-header .breadcrumb
  line-height: 1.5rem

.hold-transition
  .content-wrapper
    transition: none !important
    -webkit-animation-duration: 0s !important
    animation-duration: 0s !important

  .control-sidebar
    transition: none !important
    -webkit-animation-duration: 0s !important
    animation-duration: 0s !important

    *
      transition: none !important
      -webkit-animation-duration: 0s !important
      animation-duration: 0s !important

  .main-footer, .main-header
    transition: none !important
    -webkit-animation-duration: 0s !important
    animation-duration: 0s !important

  .main-sidebar
    transition: none !important
    -webkit-animation-duration: 0s !important
    animation-duration: 0s !important

    *
      transition: none !important
      -webkit-animation-duration: 0s !important
      animation-duration: 0s !important

.dark-mode
  background-color: #454d55 !important
  color: #fff

  .breadcrumb-item
    + .breadcrumb-item::before, &.active
      color: #adb5bd

  .main-footer
    background-color: #343a40
    border-color: #4b545c

  .content-wrapper
    background-color: #454d55
    color: #fff

    .content-header
      color: #fff

.main-header
  border-bottom: 1px solid #dee2e6
  z-index: 1034

  .nav-link
    height: 2.5rem
    position: relative

  &.text-sm .nav-link
    height: 1.93725rem
    padding: .35rem 1rem

.text-sm .main-header .nav-link
  height: 1.93725rem
  padding: .35rem 1rem

.main-header.text-sm .nav-link >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    font-size: .875rem

.text-sm .main-header .nav-link >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    font-size: .875rem

.main-header
  .navbar-nav
    .nav-item
      margin: 0

    &[class*="-right"] .dropdown-menu
      left: auto
      margin-top: -3px
      right: 0

  &.dropdown-legacy .dropdown-menu
    top: 3rem
    margin-top: 0

@media (max-width: 575.98px)
  .main-header .navbar-nav[class*="-right"] .dropdown-menu
    left: 0
    right: auto

.navbar-img
  height: calc(3.5rem + 1px) / 2
  width: auto

.navbar-badge
  font-size: .6rem
  font-weight: 300
  padding: 2px 4px
  position: absolute
  right: 5px
  top: 9px

.btn-navbar
  background-color: transparent
  border-left-width: 0

.form-control-navbar
  border-right-width: 0

  + .input-group-append
    margin-left: 0

.btn-navbar, .form-control-navbar
  transition: none

.navbar-dark
  .btn-navbar
    background-color: rgba(255, 255, 255, 0.2)
    border: 0

  .form-control-navbar
    background-color: rgba(255, 255, 255, 0.2)
    border: 0

    &::-webkit-input-placeholder, &::-moz-placeholder, &:-ms-input-placeholder, &::-ms-input-placeholder, &::placeholder, + .input-group-append > .btn-navbar
      color: rgba(255, 255, 255, 0.6)

    &:focus
      background-color: rgba(255, 255, 255, 0.6)
      border: 0 !important
      color: #343a40

      + .input-group-append .btn-navbar
        background-color: rgba(255, 255, 255, 0.6)
        border: 0 !important
        color: #343a40

.navbar-light
  .btn-navbar
    background-color: #f2f4f6
    border: 0

  .form-control-navbar
    background-color: #f2f4f6
    border: 0

    &::-webkit-input-placeholder, &::-moz-placeholder, &:-ms-input-placeholder, &::-ms-input-placeholder, &::placeholder, + .input-group-append > .btn-navbar
      color: rgba(0, 0, 0, 0.6)

    &:focus
      background-color: #e9ecef
      border: 0 !important
      color: #343a40

      + .input-group-append .btn-navbar
        background-color: #e9ecef
        border: 0 !important
        color: #343a40

.brand-link
  display: block
  font-size: 1.25rem
  line-height: 1.5
  padding: .8125rem .5rem
  transition: width .3s ease-in-out
  white-space: nowrap

  &:hover
    color: #fff
    text-decoration: none

.text-sm .brand-link
  font-size: inherit

[class*=sidebar-dark] .brand-link
  border-bottom: 1px solid #4b545c
  color: rgba(255, 255, 255, 0.8)

  .pushmenu
    color: rgba(255, 255, 255, 0.8)

    &:hover
      color: #fff

  &:hover
    color: #fff

[class*=sidebar-light] .brand-link
  border-bottom: 1px solid #dee2e6
  color: rgba(0, 0, 0, 0.8)

  .pushmenu
    color: rgba(0, 0, 0, 0.8)

    &:hover
      color: #000

  &:hover
    color: #000

.brand-link
  .pushmenu
    margin-right: .5rem
    font-size: 1rem

  .brand-link
    padding: 0
    border-bottom: none

  .brand-image
    float: left
    line-height: .8
    margin-left: .8rem
    margin-right: .5rem
    margin-top: -3px
    max-height: 33px
    width: auto

  .brand-image-xs
    float: left
    line-height: .8
    margin-top: -.1rem
    max-height: 33px
    width: auto

  .brand-image-xl
    line-height: .8
    max-height: 40px
    width: auto

    &.single
      margin-top: -.3rem

  &.text-sm .brand-image
    height: 29px
    margin-bottom: -.25rem
    margin-left: .95rem
    margin-top: -.25rem

.text-sm .brand-link .brand-image
  height: 29px
  margin-bottom: -.25rem
  margin-left: .95rem
  margin-top: -.25rem

.brand-link.text-sm .brand-image-xs, .text-sm .brand-link .brand-image-xs
  margin-top: -.2rem
  max-height: 29px

.brand-link.text-sm .brand-image-xl, .text-sm .brand-link .brand-image-xl
  margin-top: -.225rem
  max-height: 38px

.main-sidebar
  height: 100vh
  overflow-y: hidden
  z-index: 1038

  a:-moz-focusring
    border: 0
    outline: 0

.sidebar
  height: calc(100% - (3.5rem + 1px))
  overflow-y: initial
  padding-bottom: 0
  padding-left: .5rem
  padding-right: .5rem
  padding-top: 0

.user-panel
  position: relative

[class*=sidebar-dark] .user-panel
  border-bottom: 1px solid #4f5962

[class*=sidebar-light] .user-panel
  border-bottom: 1px solid #dee2e6

.user-panel
  overflow: hidden
  white-space: nowrap

  .info
    overflow: hidden
    white-space: nowrap

  .image
    display: inline-block
    padding-left: .8rem

  img
    height: auto
    width: 2.1rem

  .info
    display: inline-block
    padding: 5px 5px 5px 10px

  .dropdown-menu, .status
    font-size: .875rem

.nav-sidebar
  .nav-item > .nav-link
    margin-bottom: .2rem

    .right
      transition: transform ease-in-out .3s

  .nav-link >
    .right, p > .right
      position: absolute
      right: 1rem
      top: .7rem

    .right
      i, span
        margin-left: .5rem

    p > .right
      i, span
        margin-left: .5rem

    .right:nth-child(2), p > .right:nth-child(2)
      right: 2.2rem

  .menu-open > .nav-treeview
    display: block

  .menu-is-opening > .nav-link i.right, .menu-open > .nav-link i.right
    transform: rotate(-90deg)

  > .nav-item
    margin-bottom: 0

    .nav-icon
      margin-left: .05rem
      font-size: 1.2rem
      margin-right: .2rem
      text-align: center
      width: 1.6rem

      &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
        font-size: 1.1rem

    .float-right
      margin-top: 3px

  .nav-treeview
    display: none
    list-style: none
    padding: 0

    > .nav-item > .nav-link > .nav-icon
      width: 1.6rem

  &.nav-child-indent .nav-treeview
    transition: padding .3s ease-in-out
    padding-left: 1rem

@media (prefers-reduced-motion: reduce)
  .nav-sidebar .nav-item > .nav-link .right
    transition: none

.text-sm .nav-sidebar.nav-child-indent .nav-treeview
  padding-left: .5rem

.nav-sidebar.nav-child-indent.nav-legacy .nav-treeview .nav-treeview
  padding-left: 2rem
  margin-left: -1rem

.text-sm .nav-sidebar.nav-child-indent.nav-legacy .nav-treeview .nav-treeview
  padding-left: 1rem
  margin-left: -.5rem

.nav-sidebar
  .nav-header
    font-size: .9rem
    padding: .5rem

    &:not(:first-of-type)
      padding: 1.7rem 1rem .5rem

  .nav-link p
    display: inline-block
    margin: 0

.sidebar-is-opening .nav-sidebar .nav-link p
  -webkit-animation-name: fadeIn
  animation-name: fadeIn
  -webkit-animation-duration: .3s
  animation-duration: .3s
  -webkit-animation-fill-mode: both
  animation-fill-mode: both

#sidebar-overlay
  background-color: rgba(0, 0, 0, 0.1)
  bottom: 0
  display: none
  left: 0
  position: fixed
  right: 0
  top: 0
  z-index: 1037

@media (max-width: 991.98px)
  .sidebar-open #sidebar-overlay
    display: block

[class*=sidebar-light-]
  background-color: #fff

  .user-panel
    a:hover
      color: #212529

    .status
      background-color: rgba(0, 0, 0, 0.1)
      color: #343a40

      &:active, &:focus, &:hover
        background-color: rgba(0, 0, 0, 0.1)
        color: #212529

    .dropdown-menu
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
      border-color: rgba(0, 0, 0, 0.1)

    .dropdown-item
      color: #212529

  .nav-sidebar > .nav-item
    > .nav-link
      &:active, &:focus
        color: #343a40

    &.menu-open > .nav-link, &:hover > .nav-link
      background-color: rgba(0, 0, 0, 0.1)
      color: #212529

    >
      .nav-link.active
        color: #000
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)

      .nav-treeview
        background-color: transparent

  .nav-header
    background-color: inherit
    color: #292d32

  .sidebar a
    color: #343a40

    &:hover
      text-decoration: none

  .nav-treeview > .nav-item > .nav-link
    color: #777

    &.active
      background-color: rgba(0, 0, 0, 0.1)
      color: #212529

      &:hover
        background-color: rgba(0, 0, 0, 0.1)
        color: #212529

    &:hover
      background-color: rgba(0, 0, 0, 0.1)

  .nav-flat .nav-item .nav-treeview
    .nav-treeview
      border-color: rgba(0, 0, 0, 0.1)

    > .nav-item > .nav-link
      border-color: rgba(0, 0, 0, 0.1)

      &.active
        border-color: rgba(0, 0, 0, 0.1)

[class*=sidebar-dark-]
  background-color: #343a40

  .user-panel
    a:hover
      color: #fff

    .status
      background-color: rgba(255, 255, 255, 0.1)
      color: #c2c7d0

      &:active, &:focus, &:hover
        background-color: rgba(247, 247, 247, 0.1)
        color: #fff

    .dropdown-menu
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4)
      border-color: rgba(242, 242, 242, 0.1)

    .dropdown-item
      color: #212529

  .nav-sidebar > .nav-item
    > .nav-link:active
      color: #c2c7d0

    &.menu-open > .nav-link, &:hover > .nav-link
      background-color: rgba(255, 255, 255, 0.1)
      color: #fff

    >
      .nav-link
        &:focus
          background-color: rgba(255, 255, 255, 0.1)
          color: #fff

        &.active
          color: #fff
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)

      .nav-treeview
        background-color: transparent

  .nav-header
    background-color: inherit
    color: #d0d4db

  .sidebar a
    color: #c2c7d0

    &:focus, &:hover
      text-decoration: none

  .nav-treeview > .nav-item > .nav-link
    color: #c2c7d0

    &:focus, &:hover
      background-color: rgba(255, 255, 255, 0.1)
      color: #fff

    &.active
      background-color: rgba(255, 255, 255, 0.9)
      color: #343a40

      &:focus, &:hover
        background-color: rgba(255, 255, 255, 0.9)
        color: #343a40

  .nav-flat .nav-item .nav-treeview
    .nav-treeview
      border-color: rgba(255, 255, 255, 0.9)

    > .nav-item > .nav-link
      border-color: rgba(255, 255, 255, 0.9)

      &.active
        border-color: rgba(255, 255, 255, 0.9)

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-primary .nav-sidebar > .nav-item > .nav-link.active
  background-color: #007bff
  color: #fff

.sidebar-dark-primary .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-primary .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #007bff

.sidebar-dark-secondary .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-secondary .nav-sidebar > .nav-item > .nav-link.active
  background-color: #6c757d
  color: #fff

.sidebar-dark-secondary .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-secondary .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #6c757d

.sidebar-dark-success .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-success .nav-sidebar > .nav-item > .nav-link.active
  background-color: #28a745
  color: #fff

.sidebar-dark-success .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-success .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #28a745

.sidebar-dark-info .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-info .nav-sidebar > .nav-item > .nav-link.active
  background-color: #17a2b8
  color: #fff

.sidebar-dark-info .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-info .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #17a2b8

.sidebar-dark-warning .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-warning .nav-sidebar > .nav-item > .nav-link.active
  background-color: #ffc107
  color: #1f2d3d

.sidebar-dark-warning .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-warning .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #ffc107

.sidebar-dark-danger .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-danger .nav-sidebar > .nav-item > .nav-link.active
  background-color: #dc3545
  color: #fff

.sidebar-dark-danger .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-danger .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #dc3545

.sidebar-dark-light .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-light .nav-sidebar > .nav-item > .nav-link.active
  background-color: #f8f9fa
  color: #1f2d3d

.sidebar-dark-light .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-light .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #f8f9fa

.sidebar-dark-dark .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-dark .nav-sidebar > .nav-item > .nav-link.active
  background-color: #343a40
  color: #fff

.sidebar-dark-dark .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-dark .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #343a40

.sidebar-dark-lightblue .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-lightblue .nav-sidebar > .nav-item > .nav-link.active
  background-color: #3c8dbc
  color: #fff

.sidebar-dark-lightblue .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-lightblue .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #3c8dbc

.sidebar-dark-navy .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-navy .nav-sidebar > .nav-item > .nav-link.active
  background-color: #001f3f
  color: #fff

.sidebar-dark-navy .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-navy .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #001f3f

.sidebar-dark-olive .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-olive .nav-sidebar > .nav-item > .nav-link.active
  background-color: #3d9970
  color: #fff

.sidebar-dark-olive .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-olive .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #3d9970

.sidebar-dark-lime .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-lime .nav-sidebar > .nav-item > .nav-link.active
  background-color: #01ff70
  color: #1f2d3d

.sidebar-dark-lime .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-lime .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #01ff70

.sidebar-dark-fuchsia .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-fuchsia .nav-sidebar > .nav-item > .nav-link.active
  background-color: #f012be
  color: #fff

.sidebar-dark-fuchsia .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-fuchsia .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #f012be

.sidebar-dark-maroon .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-maroon .nav-sidebar > .nav-item > .nav-link.active
  background-color: #d81b60
  color: #fff

.sidebar-dark-maroon .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-maroon .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #d81b60

.sidebar-dark-blue .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-blue .nav-sidebar > .nav-item > .nav-link.active
  background-color: #007bff
  color: #fff

.sidebar-dark-blue .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-blue .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #007bff

.sidebar-dark-indigo .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-indigo .nav-sidebar > .nav-item > .nav-link.active
  background-color: #6610f2
  color: #fff

.sidebar-dark-indigo .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-indigo .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #6610f2

.sidebar-dark-purple .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-purple .nav-sidebar > .nav-item > .nav-link.active
  background-color: #6f42c1
  color: #fff

.sidebar-dark-purple .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-purple .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #6f42c1

.sidebar-dark-pink .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-pink .nav-sidebar > .nav-item > .nav-link.active
  background-color: #e83e8c
  color: #fff

.sidebar-dark-pink .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-pink .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #e83e8c

.sidebar-dark-red .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-red .nav-sidebar > .nav-item > .nav-link.active
  background-color: #dc3545
  color: #fff

.sidebar-dark-red .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-red .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #dc3545

.sidebar-dark-orange .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-orange .nav-sidebar > .nav-item > .nav-link.active
  background-color: #fd7e14
  color: #1f2d3d

.sidebar-dark-orange .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-orange .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #fd7e14

.sidebar-dark-yellow .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-yellow .nav-sidebar > .nav-item > .nav-link.active
  background-color: #ffc107
  color: #1f2d3d

.sidebar-dark-yellow .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-yellow .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #ffc107

.sidebar-dark-green .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-green .nav-sidebar > .nav-item > .nav-link.active
  background-color: #28a745
  color: #fff

.sidebar-dark-green .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-green .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #28a745

.sidebar-dark-teal .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-teal .nav-sidebar > .nav-item > .nav-link.active
  background-color: #20c997
  color: #fff

.sidebar-dark-teal .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-teal .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #20c997

.sidebar-dark-cyan .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-cyan .nav-sidebar > .nav-item > .nav-link.active
  background-color: #17a2b8
  color: #fff

.sidebar-dark-cyan .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-cyan .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #17a2b8

.sidebar-dark-white .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-white .nav-sidebar > .nav-item > .nav-link.active
  background-color: #fff
  color: #1f2d3d

.sidebar-dark-white .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-white .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #fff

.sidebar-dark-gray .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-gray .nav-sidebar > .nav-item > .nav-link.active
  background-color: #6c757d
  color: #fff

.sidebar-dark-gray .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-gray .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #6c757d

.sidebar-dark-gray-dark .nav-sidebar > .nav-item > .nav-link.active, .sidebar-light-gray-dark .nav-sidebar > .nav-item > .nav-link.active
  background-color: #343a40
  color: #fff

.sidebar-dark-gray-dark .nav-sidebar.nav-legacy > .nav-item > .nav-link.active, .sidebar-light-gray-dark .nav-sidebar.nav-legacy > .nav-item > .nav-link.active
  border-color: #343a40

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview
    padding-left: 1rem
    margin-left: -.5rem

  &:not(.sidebar-no-expand)
    .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview, &:hover .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview
      padding-left: 1rem
      margin-left: -.5rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview
    padding-left: 1rem
    margin-left: -.5rem

  &:not(.sidebar-no-expand)
    .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview, &:hover .nav-compact.nav-sidebar.nav-child-indent:not(.nav-flat) .nav-treeview
      padding-left: 1rem
      margin-left: -.5rem

.nav-flat
  margin: -.25rem -.5rem 0

  .nav-item > .nav-link
    border-radius: 0
    margin-bottom: 0

    > .nav-icon
      margin-left: .55rem

  &:not(.nav-child-indent) .nav-treeview .nav-item > .nav-link > .nav-icon
    margin-left: .4rem

  &.nav-child-indent .nav-treeview
    padding-left: 0

    .nav-icon
      margin-left: .85rem

    .nav-treeview
      border-left: .2rem solid

      .nav-icon
        margin-left: 1.15rem

      .nav-treeview
        .nav-icon
          margin-left: 1.45rem

        .nav-treeview
          .nav-icon
            margin-left: 1.75rem

          .nav-treeview .nav-icon
            margin-left: 2.05rem

.sidebar-collapse .nav-flat.nav-child-indent .nav-treeview
  .nav-icon
    margin-left: .55rem

  .nav-link
    padding-left: calc(1rem - .2rem)

  .nav-treeview
    .nav-icon
      margin-left: .35rem

    .nav-treeview
      .nav-icon
        margin-left: .15rem

      .nav-treeview
        .nav-icon
          margin-left: -.15rem

        .nav-treeview .nav-icon
          margin-left: -.35rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-compact.nav-sidebar .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-compact.nav-sidebar .nav-treeview .nav-icon
    margin-left: .4rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-compact.nav-sidebar .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-compact.nav-sidebar .nav-treeview .nav-icon
    margin-left: .4rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-icon
    margin-left: .85rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-icon
    margin-left: .85rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.15rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.15rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.45rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.45rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.75rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 1.75rem

.sidebar-mini .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 2.05rem

.sidebar-mini-md .main-sidebar
  &.sidebar-focused .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon, &:not(.sidebar-no-expand):hover .nav-flat.nav-sidebar.nav-child-indent .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-treeview .nav-icon
    margin-left: 2.05rem

.nav-flat
  .nav-icon
    transition: margin-left ease-in-out .3s

  .nav-treeview .nav-icon
    margin-left: -.2rem

  &.nav-sidebar > .nav-item
    .nav-treeview
      background-color: rgba(255, 255, 255, 0.05)

      .nav-item > .nav-link
        border-left: .2rem solid

    > .nav-treeview
      background-color: rgba(255, 255, 255, 0.05)

    > .nav-treeview .nav-item > .nav-link
      border-left: .2rem solid

@media (prefers-reduced-motion: reduce)
  .nav-flat .nav-icon
    transition: none

.nav-legacy
  margin: -.25rem -.5rem 0

  &.nav-sidebar .nav-item > .nav-link
    border-radius: 0
    margin-bottom: 0

    > .nav-icon
      margin-left: .55rem

.text-sm .nav-legacy.nav-sidebar .nav-item > .nav-link > .nav-icon
  margin-left: .75rem

.nav-legacy.nav-sidebar > .nav-item > .nav-link.active
  background-color: inherit
  border-left: 3px solid transparent
  box-shadow: none

  > .nav-icon
    margin-left: calc(.55rem - 3px)

.text-sm .nav-legacy.nav-sidebar
  > .nav-item > .nav-link.active > .nav-icon, &.nav-flat .nav-treeview .nav-item > .nav-link > .nav-icon
    margin-left: calc(.75rem - 3px)

.sidebar-mini .nav-legacy > .nav-item .nav-link .nav-icon
  transition: margin-left ease-in-out .3s
  margin-left: .75rem

.sidebar-mini-md
  .nav-legacy > .nav-item .nav-link .nav-icon
    transition: margin-left ease-in-out .3s
    margin-left: .75rem

  &.sidebar-collapse .main-sidebar
    &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview
      padding-left: 1rem

@media (prefers-reduced-motion: reduce)
  .sidebar-mini .nav-legacy > .nav-item .nav-link .nav-icon, .sidebar-mini-md .nav-legacy > .nav-item .nav-link .nav-icon
    transition: none

.sidebar-mini.sidebar-collapse .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview
    padding-left: 1rem

.sidebar-mini-md.sidebar-collapse .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview
    padding-left: 2rem
    margin-left: -1rem

.sidebar-mini.sidebar-collapse .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview
    padding-left: 2rem
    margin-left: -1rem

.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview
    padding-left: .5rem

.sidebar-mini.sidebar-collapse.text-sm .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview
    padding-left: .5rem

.sidebar-mini-md.sidebar-collapse.text-sm .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview
    padding-left: 1rem
    margin-left: -.5rem

.sidebar-mini.sidebar-collapse.text-sm .main-sidebar
  &.sidebar-focused .nav-legacy.nav-child-indent .nav-treeview .nav-treeview, &:hover .nav-legacy.nav-child-indent .nav-treeview .nav-treeview
    padding-left: 1rem
    margin-left: -.5rem

.sidebar-mini-md.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon, .sidebar-mini.sidebar-collapse .nav-legacy > .nav-item > .nav-link .nav-icon
  margin-left: .55rem

.sidebar-mini-md.sidebar-collapse .nav-legacy > .nav-item > .nav-link.active > .nav-icon, .sidebar-mini.sidebar-collapse .nav-legacy > .nav-item > .nav-link.active > .nav-icon
  margin-left: .36rem

.sidebar-mini-md.sidebar-collapse .nav-legacy.nav-child-indent .nav-treeview .nav-treeview, .sidebar-mini.sidebar-collapse .nav-legacy.nav-child-indent .nav-treeview .nav-treeview
  padding-left: 0
  margin-left: 0

.sidebar-mini-md.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link .nav-icon, .sidebar-mini.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link .nav-icon
  margin-left: .75rem

.sidebar-mini-md.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link.active > .nav-icon, .sidebar-mini.sidebar-collapse.text-sm .nav-legacy > .nav-item > .nav-link.active > .nav-icon
  margin-left: calc(.75rem - 3px)

[class*=sidebar-dark] .nav-legacy
  &.nav-sidebar > .nav-item
    .nav-treeview
      background-color: rgba(255, 255, 255, 0.05)

    >
      .nav-treeview
        background-color: rgba(255, 255, 255, 0.05)

      .nav-link.active
        color: #fff

  .nav-treeview > .nav-item > .nav-link
    &.active, &:focus, &:hover
      background-color: transparent
      color: #fff

[class*=sidebar-light] .nav-legacy
  &.nav-sidebar > .nav-item
    .nav-treeview
      background-color: rgba(0, 0, 0, 0.05)

    >
      .nav-treeview
        background-color: rgba(0, 0, 0, 0.05)

      .nav-link.active
        color: #000

  .nav-treeview > .nav-item > .nav-link
    &.active, &:focus, &:hover
      background-color: transparent
      color: #000

.nav-collapse-hide-child .menu-open > .nav-treeview
  max-height: -webkit-min-content
  max-height: -moz-min-content
  max-height: min-content
  -webkit-animation-name: fadeIn
  animation-name: fadeIn
  -webkit-animation-duration: .3s
  animation-duration: .3s
  -webkit-animation-fill-mode: both
  animation-fill-mode: both

.sidebar-collapse .nav-collapse-hide-child .menu-open > .nav-treeview
  max-height: 0
  -webkit-animation-name: fadeOut
  animation-name: fadeOut
  -webkit-animation-duration: .3s
  animation-duration: .3s
  -webkit-animation-fill-mode: both
  animation-fill-mode: both

.sidebar-mini-md.sidebar-collapse .main-sidebar
  &.sidebar-focused .nav-collapse-hide-child .menu-open > .nav-treeview, &:not(.sidebar-no-expand):hover .nav-collapse-hide-child .menu-open > .nav-treeview
    max-height: -webkit-min-content
    max-height: -moz-min-content
    max-height: min-content
    -webkit-animation-name: fadeIn
    animation-name: fadeIn
    -webkit-animation-duration: .3s
    animation-duration: .3s
    -webkit-animation-fill-mode: both
    animation-fill-mode: both

.sidebar-mini.sidebar-collapse .main-sidebar
  &.sidebar-focused .nav-collapse-hide-child .menu-open > .nav-treeview, &:not(.sidebar-no-expand):hover .nav-collapse-hide-child .menu-open > .nav-treeview
    max-height: -webkit-min-content
    max-height: -moz-min-content
    max-height: min-content
    -webkit-animation-name: fadeIn
    animation-name: fadeIn
    -webkit-animation-duration: .3s
    animation-duration: .3s
    -webkit-animation-fill-mode: both
    animation-fill-mode: both

.nav-compact
  .nav-header, .nav-link
    padding-top: .25rem
    padding-bottom: .25rem

  .nav-header:not(:first-of-type)
    padding-top: .75rem
    padding-bottom: .25rem

  .nav-link >
    .right, p > .right
      top: .465rem

.text-sm .nav-compact .nav-link >
  .right, p > .right
    top: .7rem

[class*=sidebar-dark]
  .btn-sidebar, .form-control-sidebar
    background-color: #3f474e
    border: 1px solid #56606a
    color: #fff

  .btn-sidebar:focus, .form-control-sidebar:focus
    border: 1px solid #7a8793

  .btn-sidebar
    &:hover
      background-color: #454d55

    &:focus
      background-color: #4b545c

  .list-group-item
    background-color: #454d55
    border-color: #56606a
    color: #c2c7d0

    &:hover
      background-color: #4b545c

    &:focus
      background-color: #515a63

    .search-path
      color: #adb5bd

[class*=sidebar-light]
  .btn-sidebar, .form-control-sidebar
    background-color: #f2f2f2
    border: 1px solid #d9d9d9
    color: #1f2d3d

  .btn-sidebar:focus, .form-control-sidebar:focus
    border: 1px solid #b3b3b3

  .btn-sidebar
    &:hover
      background-color: #ececec

    &:focus
      background-color: #e6e6e6

  .list-group-item
    border-color: #d9d9d9

    &:hover
      background-color: #ececec

    &:focus
      background-color: #e6e6e6

    .search-path
      color: #6c757d

.sidebar
  .form-inline .input-group
    width: 100%

  nav .form-inline
    margin-bottom: .2rem

.layout-boxed:not(.sidebar-mini):not(.sidebar-mini-md)
  &.sidebar-collapse .main-sidebar
    margin-left: 0

  .content-wrapper, .main-footer, .main-header
    z-index: 9999
    position: relative

.sidebar-collapse
  .form-control-sidebar
    display: none

    ~ .input-group-append
      display: none

  .sidebar-search-results
    display: none

[data-widget=sidebar-search] input[type=search]
  &::-ms-clear, &::-ms-reveal
    display: none
    width: 0
    height: 0

  &::-webkit-search-cancel-button, &::-webkit-search-decoration, &::-webkit-search-results-button, &::-webkit-search-results-decoration
    display: none

.sidebar-search-results
  position: relative
  display: none
  width: 100%

.sidebar-search-open .sidebar-search-results
  display: inline-block

.sidebar-search-results
  .search-title
    margin-bottom: -.1rem

  .list-group
    position: absolute
    width: 100%
    z-index: 1039

    > .list-group-item
      padding: .375rem .75rem

      &:-moz-focusring
        margin-top: 0
        border-left: 1px solid transparent
        border-top: 0
        border-bottom: 1px solid transparent

      &:first-child
        margin-top: 0
        border-top: 0
        border-top-left-radius: 0
        border-top-right-radius: 0

  .search-path
    font-size: 80%

.sidebar-search-open
  .btn, .form-control
    border-bottom-right-radius: 0
    border-bottom-left-radius: 0

[class*=sidebar-dark] .sidebar-custom
  border-top: 1px solid #4f5962

[class*=sidebar-light] .sidebar-custom
  border-top: 1px solid #dee2e6

.layout-fixed
  &.sidebar-collapse
    .hide-on-collapse
      display: none

    &:hover .hide-on-collapse
      display: block

  .main-sidebar-custom
    .sidebar
      height: calc(100% - ((3.5rem + 4rem) + 1px))

    .sidebar-custom
      height: 4rem
      padding: .85rem .5rem

  .main-sidebar-custom-lg
    .sidebar
      height: calc(100% - ((3.5rem + 6rem) + 1px))

    .sidebar-custom
      height: 6rem

  .main-sidebar-custom-xl
    .sidebar
      height: calc(100% - ((3.5rem + 8rem) + 1px))

    .sidebar-custom
      height: 8rem

  .main-sidebar-custom .pos-right, .main-sidebar-custom-lg .pos-right, .main-sidebar-custom-xl .pos-right
    position: absolute
    right: .5rem

.logo-xl, .logo-xs
  opacity: 1
  position: absolute
  visibility: visible

.logo-xl.brand-image-xs, .logo-xs.brand-image-xs
  left: 18px
  top: 12px

.logo-xl.brand-image-xl
  left: 12px
  top: 6px

.logo-xs
  &.brand-image-xl
    left: 12px
    top: 6px
    left: 16px
    top: 8px

  opacity: 0
  visibility: hidden

.brand-link.logo-switch::before
  content: "\00a0"

@media (min-width: 992px)
  .sidebar-mini
    .nav-sidebar
      white-space: nowrap
      overflow: hidden

      .nav-link, > .nav-header
        white-space: nowrap
        overflow: hidden

    &.sidebar-collapse
      .d-hidden-mini
        display: none

      .content-wrapper, .main-footer, .main-header
        margin-left: 4.6rem !important

      .nav-sidebar
        .nav-header
          display: none

        .nav-link p
          width: 0

      .brand-text, .nav-sidebar .nav-link p, .sidebar .user-panel > .info
        margin-left: -10px
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden

      .logo-xl
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden

      .logo-xs
        display: inline-block
        -webkit-animation-name: fadeIn
        animation-name: fadeIn
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: visible

      .main-sidebar
        overflow-x: hidden
        margin-left: 0
        width: 4.6rem

        &::before
          margin-left: 0
          width: 4.6rem

        .user-panel .image
          float: none

        &.sidebar-focused, &:hover, &.sidebar-focused .brand-link, &:hover .brand-link
          width: 250px

        &.sidebar-focused .user-panel, &:hover .user-panel
          text-align: left

        &.sidebar-focused .user-panel .image, &:hover .user-panel .image
          float: left

        &.sidebar-focused
          .brand-text, .logo-xl, .nav-sidebar .nav-link p, .user-panel > .info
            display: inline-block
            margin-left: 0
            -webkit-animation-name: fadeIn
            animation-name: fadeIn
            -webkit-animation-duration: .3s
            animation-duration: .3s
            -webkit-animation-fill-mode: both
            animation-fill-mode: both
            visibility: visible

        &:hover
          .brand-text, .logo-xl, .nav-sidebar .nav-link p, .user-panel > .info
            display: inline-block
            margin-left: 0
            -webkit-animation-name: fadeIn
            animation-name: fadeIn
            -webkit-animation-duration: .3s
            animation-duration: .3s
            -webkit-animation-fill-mode: both
            animation-fill-mode: both
            visibility: visible

        &.sidebar-focused .logo-xs, &:hover .logo-xs
          -webkit-animation-name: fadeOut
          animation-name: fadeOut
          -webkit-animation-duration: .3s
          animation-duration: .3s
          -webkit-animation-fill-mode: both
          animation-fill-mode: both
          visibility: hidden

        &.sidebar-focused .brand-image, &:hover .brand-image
          margin-right: .5rem

        &.sidebar-focused
          .sidebar-form, .user-panel > .info
            display: block !important
            transform: translateZ(0)

        &:hover
          .sidebar-form, .user-panel > .info
            display: block !important
            transform: translateZ(0)

        &.sidebar-focused .nav-sidebar > .nav-item > .nav-link > span, &:hover .nav-sidebar > .nav-item > .nav-link > span
          display: inline-block !important

      .visible-sidebar-mini
        display: block !important

      &.layout-fixed
        .main-sidebar:hover .brand-link
          width: 250px

        .brand-link
          width: 4.6rem

@media (max-width: 991.98px)
  .sidebar-mini.sidebar-collapse .main-sidebar
    box-shadow: none !important

@media (min-width: 768px)
  .sidebar-mini-md
    .nav-sidebar
      white-space: nowrap
      overflow: hidden

      .nav-link, > .nav-header
        white-space: nowrap
        overflow: hidden

    &.sidebar-collapse
      .d-hidden-mini
        display: none

      .content-wrapper, .main-footer, .main-header
        margin-left: 4.6rem !important

      .nav-sidebar
        .nav-header
          display: none

        .nav-link p
          width: 0

      .brand-text, .nav-sidebar .nav-link p, .sidebar .user-panel > .info
        margin-left: -10px
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden

      .logo-xl
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden

      .logo-xs
        display: inline-block
        -webkit-animation-name: fadeIn
        animation-name: fadeIn
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: visible

      .main-sidebar
        overflow-x: hidden
        margin-left: 0
        width: 4.6rem

        &::before
          margin-left: 0
          width: 4.6rem

        .user-panel .image
          float: none

        &.sidebar-focused, &:hover, &.sidebar-focused .brand-link, &:hover .brand-link
          width: 250px

        &.sidebar-focused .user-panel, &:hover .user-panel
          text-align: left

        &.sidebar-focused .user-panel .image, &:hover .user-panel .image
          float: left

        &.sidebar-focused
          .brand-text, .logo-xl, .nav-sidebar .nav-link p, .user-panel > .info
            display: inline-block
            margin-left: 0
            -webkit-animation-name: fadeIn
            animation-name: fadeIn
            -webkit-animation-duration: .3s
            animation-duration: .3s
            -webkit-animation-fill-mode: both
            animation-fill-mode: both
            visibility: visible

        &:hover
          .brand-text, .logo-xl, .nav-sidebar .nav-link p, .user-panel > .info
            display: inline-block
            margin-left: 0
            -webkit-animation-name: fadeIn
            animation-name: fadeIn
            -webkit-animation-duration: .3s
            animation-duration: .3s
            -webkit-animation-fill-mode: both
            animation-fill-mode: both
            visibility: visible

        &.sidebar-focused .logo-xs, &:hover .logo-xs
          -webkit-animation-name: fadeOut
          animation-name: fadeOut
          -webkit-animation-duration: .3s
          animation-duration: .3s
          -webkit-animation-fill-mode: both
          animation-fill-mode: both
          visibility: hidden

        &.sidebar-focused .brand-image, &:hover .brand-image
          margin-right: .5rem

        &.sidebar-focused
          .sidebar-form, .user-panel > .info
            display: block !important
            transform: translateZ(0)

        &:hover
          .sidebar-form, .user-panel > .info
            display: block !important
            transform: translateZ(0)

        &.sidebar-focused .nav-sidebar > .nav-item > .nav-link > span, &:hover .nav-sidebar > .nav-item > .nav-link > span
          display: inline-block !important

      .visible-sidebar-mini
        display: block !important

      &.layout-fixed
        .main-sidebar:hover .brand-link
          width: 250px

        .brand-link
          width: 4.6rem

@media (max-width: 767.98px)
  .sidebar-mini-md.sidebar-collapse .main-sidebar
    box-shadow: none !important

@-webkit-keyframes fadeIn
  from
    opacity: 0

  to
    opacity: 1

@keyframes fadeIn
  from
    opacity: 0

  to
    opacity: 1

@-webkit-keyframes fadeOut
  from
    opacity: 1

  to
    opacity: 0

@keyframes fadeOut
  from
    opacity: 1

  to
    opacity: 0

.sidebar-collapse
  .main-sidebar
    &.sidebar-focused .nav-header, &:hover .nav-header
      display: inline-block

  .sidebar-no-expand.main-sidebar
    &.sidebar-focused, &:hover
      width: 4.6rem

    &.sidebar-focused .nav-header, &:hover .nav-header
      display: none

    &.sidebar-focused .brand-link, &:hover .brand-link
      width: 4.6rem !important

    &.sidebar-focused .user-panel .image, &:hover .user-panel .image
      float: none !important

    &.sidebar-focused .logo-xs, &:hover .logo-xs
      -webkit-animation-name: fadeIn
      animation-name: fadeIn
      -webkit-animation-duration: .3s
      animation-duration: .3s
      -webkit-animation-fill-mode: both
      animation-fill-mode: both
      visibility: visible

    &.sidebar-focused .logo-xl, &:hover .logo-xl
      -webkit-animation-name: fadeOut
      animation-name: fadeOut
      -webkit-animation-duration: .3s
      animation-duration: .3s
      -webkit-animation-fill-mode: both
      animation-fill-mode: both
      visibility: hidden

    &.sidebar-focused .nav-sidebar.nav-child-indent .nav-treeview, &:hover .nav-sidebar.nav-child-indent .nav-treeview
      padding-left: 0

    &.sidebar-focused
      .brand-text, .nav-sidebar .nav-link p, .user-panel > .info
        margin-left: -10px
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden
        width: 0

    &:hover
      .brand-text, .nav-sidebar .nav-link p, .user-panel > .info
        margin-left: -10px
        -webkit-animation-name: fadeOut
        animation-name: fadeOut
        -webkit-animation-duration: .3s
        animation-duration: .3s
        -webkit-animation-fill-mode: both
        animation-fill-mode: both
        visibility: hidden
        width: 0

    &.sidebar-focused .nav-sidebar > .nav-item .nav-icon, &:hover .nav-sidebar > .nav-item .nav-icon
      margin-right: 0

.nav-sidebar
  position: relative

  &:hover
    overflow: visible

  > .nav-header
    overflow: hidden
    text-overflow: clip

.sidebar-form
  overflow: hidden
  text-overflow: clip

.nav-sidebar .nav-item > .nav-link
  position: relative

  > .float-right
    margin-top: -7px
    position: absolute
    right: 10px
    top: 50%

.main-sidebar
  .brand-text, .logo-xl, .logo-xs
    transition: margin-left .3s linear,opacity .3s ease,visibility .3s ease

.sidebar
  .nav-link p, .user-panel .info
    transition: margin-left .3s linear,opacity .3s ease,visibility .3s ease

@media (prefers-reduced-motion: reduce)
  .main-sidebar
    .brand-text, .logo-xl, .logo-xs
      transition: none

  .sidebar
    .nav-link p, .user-panel .info
      transition: none

html.control-sidebar-animate
  overflow-x: hidden

.control-sidebar
  bottom: calc(3.5rem + 1px)
  position: absolute
  top: calc(3.5rem + 1px)
  z-index: 1031
  bottom: calc(3.5rem + 1px)
  display: none
  right: -250px
  width: 250px
  transition: right .3s ease-in-out,display .3s ease-in-out

  &::before
    bottom: calc(3.5rem + 1px)
    display: none
    right: -250px
    width: 250px
    transition: right .3s ease-in-out,display .3s ease-in-out
    content: ""
    display: block
    position: fixed
    top: 0
    z-index: -1

@media (prefers-reduced-motion: reduce)
  .control-sidebar
    transition: none

    &::before
      transition: none

body.text-sm .control-sidebar
  bottom: calc(2.9365rem + 1px)
  top: calc(2.93725rem + 1px)

.main-header.text-sm ~ .control-sidebar
  top: calc(2.93725rem + 1px)

.main-footer.text-sm ~ .control-sidebar
  bottom: calc(2.9365rem + 1px)

.control-sidebar-push-slide
  .content-wrapper, .main-footer
    transition: margin-right .3s ease-in-out

@media (prefers-reduced-motion: reduce)
  .control-sidebar-push-slide
    .content-wrapper, .main-footer
      transition: none

.control-sidebar-open
  .control-sidebar
    display: block
    right: 0

    &::before
      right: 0

  &.control-sidebar-push
    .content-wrapper, .main-footer
      margin-right: 250px

  &.control-sidebar-push-slide
    .content-wrapper, .main-footer
      margin-right: 250px

.control-sidebar-slide-open
  .control-sidebar
    display: block
    right: 0
    transition: right .3s ease-in-out,display .3s ease-in-out

    &::before
      right: 0
      transition: right .3s ease-in-out,display .3s ease-in-out

  &.control-sidebar-push
    .content-wrapper, .main-footer
      margin-right: 250px

  &.control-sidebar-push-slide
    .content-wrapper, .main-footer
      margin-right: 250px

@media (prefers-reduced-motion: reduce)
  .control-sidebar-slide-open .control-sidebar
    transition: none

    &::before
      transition: none

.control-sidebar-dark
  background-color: #343a40
  color: #c2c7d0

  .nav-link
    color: #c2c7d0

  a
    color: #c2c7d0

    &:hover
      color: #fff

  h1, h2, h3, h4, h5, h6, label
    color: #fff

  .nav-tabs
    background-color: rgba(255, 255, 255, 0.1)
    border-bottom: 0
    margin-bottom: 5px

    .nav-item
      margin: 0

    .nav-link
      border-radius: 0
      padding: 10px 20px
      position: relative
      text-align: center
      border: 0

      &.active, &:active, &:focus, &:hover
        border: 0

      &.active, &:active, &:focus, &:hover
        border-bottom-color: transparent
        border-left-color: transparent
        border-top-color: transparent
        color: #fff

      &.active
        background-color: #343a40

  .tab-pane
    padding: 10px 15px

.control-sidebar-light
  color: #4b545c
  background-color: #fff
  border-left: 1px solid #dee2e6

.text-sm
  .dropdown-menu
    font-size: 0.875rem !important

  .dropdown-toggle::after
    vertical-align: .2rem

.dropdown-item-title
  font-size: 1rem
  margin: 0

.dropdown-icon::after
  margin-left: 0

.dropdown-menu-lg
  max-width: 300px
  min-width: 280px
  padding: 0

  .dropdown-divider
    margin: 0

  .dropdown-item
    padding: .5rem 1rem

  p
    margin: 0
    white-space: normal

.dropdown-submenu
  position: relative

  >
    a::after
      border-top: .3em solid transparent
      border-right: 0
      border-bottom: .3em solid transparent
      border-left: .3em solid
      float: right
      margin-left: .5rem
      margin-top: .5rem

    .dropdown-menu
      left: 100%
      margin-left: 0
      margin-top: 0
      top: 0

.dropdown-hover
  .dropdown-submenu:hover > .dropdown-menu, &.dropdown-submenu:hover > .dropdown-menu, &.nav-item.dropdown:hover > .dropdown-menu, &:hover > .dropdown-menu
    display: block

.dropdown-menu-xl
  max-width: 420px
  min-width: 360px
  padding: 0

  .dropdown-divider
    margin: 0

  .dropdown-item
    padding: .5rem 1rem

  p
    margin: 0
    white-space: normal

.dropdown-footer, .dropdown-header
  display: block
  font-size: .875rem
  padding: .5rem 1rem
  text-align: center

.open:not(.dropup) > .animated-dropdown-menu
  -webkit-animation: flipInX .7s both
  animation: flipInX .7s both
  -webkit-backface-visibility: visible !important
  backface-visibility: visible !important

@-webkit-keyframes flipInX
  0%
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg)
    transition-timing-function: ease-in
    opacity: 0

  40%
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg)
    transition-timing-function: ease-in

  60%
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg)
    opacity: 1

  80%
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg)

  100%
    transform: perspective(400px)

@keyframes flipInX
  0%
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg)
    transition-timing-function: ease-in
    opacity: 0

  40%
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg)
    transition-timing-function: ease-in

  60%
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg)
    opacity: 1

  80%
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg)

  100%
    transform: perspective(400px)

.navbar-custom-menu > .navbar-nav > li
  position: relative

  > .dropdown-menu
    position: absolute
    right: 0
    left: auto

@media (max-width: 767.98px)
  .navbar-custom-menu > .navbar-nav
    float: right

    > li
      position: static

      > .dropdown-menu
        position: absolute
        right: 5%
        left: auto
        border: 1px solid #ddd
        background-color: #fff

.navbar-nav > .user-menu
  >
    .nav-link::after
      content: none

    .dropdown-menu
      border-top-left-radius: 0
      border-top-right-radius: 0
      padding: 0
      width: 280px
      border-bottom-right-radius: 4px
      border-bottom-left-radius: 4px

      >
        .user-body
          border-bottom-right-radius: 4px
          border-bottom-left-radius: 4px

        li.user-header
          height: 175px
          padding: 10px
          text-align: center

          >
            img
              z-index: 5
              height: 90px
              width: 90px
              border: 3px solid
              border-color: transparent
              border-color: rgba(255, 255, 255, 0.2)

            p
              z-index: 5
              font-size: 17px
              margin-top: 10px

              > small
                display: block
                font-size: 12px

        .user-body
          border-bottom: 1px solid #495057
          border-top: 1px solid #dee2e6
          padding: 15px

          &::after
            display: block
            clear: both
            content: ""

        .user-footer
          background-color: #f8f9fa
          padding: 10px

          &::after
            display: block
            clear: both
            content: ""

          .btn-default
            color: #6c757d

  .user-image
    border-radius: 50%
    float: left
    height: 2.1rem
    margin-right: 10px
    margin-top: -2px
    width: 2.1rem

@media (min-width: 576px)
  .navbar-nav > .user-menu > .dropdown-menu > .user-body a
    background-color: #fff !important
    color: #495057 !important

@media (min-width: 576px)
  .navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default:hover
    background-color: #f8f9fa

@media (min-width: 576px)
  .navbar-nav > .user-menu .user-image
    float: none
    line-height: 10px
    margin-right: .4rem
    margin-top: -8px

.dark-mode
  .dropdown-menu
    background-color: #343a40
    color: #fff

  .dropdown-item
    color: #fff

    &:focus, &:hover
      background-color: #3f474e

  .dropdown-divider
    border-color: #6c757d

  .navbar-nav > .user-menu > .dropdown-menu >
    .user-footer
      background-color: #3a4047
      color: #fff

      .btn-default
        color: #fff

        &:focus, &:hover
          background-color: #3f474e
          color: #dee2e6

        &:focus
          background-color: #454d55

    .user-body
      border-color: #6c757d

      a
        background-color: transparent !important
        color: #fff !important

        &:focus, &:hover
          color: #ced4da !important

.nav-pills
  .nav-link
    color: #6c757d

    &:not(.active):hover
      color: #007bff

  .nav-item.dropdown.show .nav-link:hover
    color: #fff

.nav-tabs.flex-column
  border-bottom: 0
  border-right: 1px solid #dee2e6

  .nav-link
    border-bottom-left-radius: .25rem
    border-top-right-radius: 0
    margin-right: -1px

    &:focus, &:hover
      border-color: #e9ecef transparent #e9ecef #e9ecef

  .nav-item.show .nav-link, .nav-link.active
    border-color: #dee2e6 transparent #dee2e6 #dee2e6

  &.nav-tabs-right
    border-left: 1px solid #dee2e6
    border-right: 0

    .nav-link
      border-bottom-left-radius: 0
      border-bottom-right-radius: .25rem
      border-top-left-radius: 0
      border-top-right-radius: .25rem
      margin-left: -1px

      &:focus, &:hover
        border-color: #e9ecef #e9ecef #e9ecef transparent

    .nav-item.show .nav-link, .nav-link.active
      border-color: #dee2e6 #dee2e6 #dee2e6 transparent

.navbar-no-expand
  -ms-flex-direction: row
  flex-direction: row

  .nav-link
    padding-left: 1rem
    padding-right: 1rem

  .dropdown-menu
    position: absolute

.navbar-light
  background-color: #f8f9fa

.navbar-dark
  background-color: #343a40
  border-color: #4b545c

.navbar-primary
  background-color: #007bff

.navbar-secondary
  background-color: #6c757d

.navbar-success
  background-color: #28a745

.navbar-info
  background-color: #17a2b8

.navbar-warning
  background-color: #ffc107

.navbar-danger
  background-color: #dc3545

.navbar-lightblue
  background-color: #3c8dbc

.navbar-navy
  background-color: #001f3f

.navbar-olive
  background-color: #3d9970

.navbar-lime
  background-color: #01ff70

.navbar-fuchsia
  background-color: #f012be

.navbar-maroon
  background-color: #d81b60

.navbar-blue
  background-color: #007bff

.navbar-indigo
  background-color: #6610f2

.navbar-purple
  background-color: #6f42c1

.navbar-pink
  background-color: #e83e8c

.navbar-red
  background-color: #dc3545

.navbar-orange
  background-color: #fd7e14

.navbar-yellow
  background-color: #ffc107

.navbar-green
  background-color: #28a745

.navbar-teal
  background-color: #20c997

.navbar-cyan
  background-color: #17a2b8

.navbar-white
  background-color: #fff

.navbar-gray
  background-color: #6c757d

.navbar-gray-dark
  background-color: #343a40

.dark-mode
  .nav-pills .nav-link
    color: #ced4da

  .nav-tabs
    border-color: #56606a

    .nav-link
      &:focus, &:hover
        border-color: #56606a

    .nav-item.show .nav-link, .nav-link.active
      background-color: #343a40
      border-color: #56606a #56606a transparent #56606a
      color: #fff

    &.flex-column
      .nav-item.show .nav-link
        &.active, &:focus, &:hover
          border-color: #56606a transparent #56606a #56606a

      .nav-link
        &.active, &:focus, &:hover
          border-color: #56606a transparent #56606a #56606a

      .nav-item.show .nav-link
        &:focus, &:hover
          background-color: #3f474e

      .nav-link
        &:focus, &:hover
          background-color: #3f474e

      &.nav-tabs-right
        border-color: #56606a

        .nav-link
          &.active, &:focus, &:hover
            border-color: #56606a #56606a #56606a transparent

.pagination-month
  .page-item
    justify-self: stretch

    .page-link
      display: -ms-flexbox
      display: flex
      -ms-flex-align: center
      align-items: center
      -ms-flex-pack: center
      justify-content: center
      -ms-flex-direction: column
      flex-direction: column
      box-shadow: none

    &:first-child .page-link, &:last-child .page-link
      height: 100%
      font-size: 1.25rem

    .page-month
      margin-bottom: 0
      font-size: 1.25rem
      font-weight: 700

    .page-year
      margin-bottom: 0

  &.pagination-lg .page-month
    font-size: 1.5625rem

  &.pagination-sm .page-month
    font-size: 1rem

.dark-mode .page-item
  &.disabled .page-link
    background-color: #3a4047
    border-color: #6c757d
    color: #6c757d

  &.active .page-link
    &:focus, &:hover
      color: #ced4da

  &:not(.active) .page-link
    background-color: #343a40
    border-color: #6c757d

    &:focus, &:hover
      color: #1a88ff
      background-color: #3f474e

.form-group.has-icon
  position: relative

  .form-control
    padding-right: 35px

  .form-icon
    background-color: transparent
    border: 0
    cursor: pointer
    font-size: 1rem
    padding: .375rem .75rem
    position: absolute
    right: 3px
    top: 0

.btn-group-vertical .btn.btn-flat
  &:first-of-type, &:last-of-type
    border-radius: 0

.form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(2.25rem + 2px)

.input-group-lg + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(2.875rem + 2px)

.input-lg + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(2.875rem + 2px)

.form-group-lg .form-control + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(2.875rem + 2px)

.input-group-sm + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(1.8125rem + 2px)

.input-sm + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(1.8125rem + 2px)

.form-group-sm .form-control + .form-control-feedback
  &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion, &.svg-inline--fa
    line-height: calc(1.8125rem + 2px)

label:not(.form-check-label):not(.custom-file-label)
  font-weight: 700

.warning-feedback
  font-size: 80%
  color: #ffc107
  display: none
  margin-top: .25rem
  width: 100%

.warning-tooltip
  border-radius: .25rem
  font-size: .875rem
  background-color: rgba(255, 193, 7, 0.9)
  color: #1f2d3d
  display: none
  line-height: 1.5
  margin-top: .1rem
  max-width: 100%
  padding: .25rem .5rem
  position: absolute
  top: 100%
  z-index: 5

.form-control.is-warning
  border-color: #ffc107

  &:focus
    border-color: #ffc107
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.25)

  ~
    .warning-feedback, .warning-tooltip
      display: block

textarea.form-control.is-warning
  padding-right: 2.25rem
  background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem)

.custom-select.is-warning
  border-color: #ffc107

  &:focus
    border-color: #ffc107
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.25)

  ~
    .warning-feedback, .warning-tooltip
      display: block

.form-control-file.is-warning ~
  .warning-feedback, .warning-tooltip
    display: block

.form-check-input.is-warning ~
  .form-check-label
    color: #ffc107

  .warning-feedback, .warning-tooltip
    display: block

.custom-control-input.is-warning
  ~
    .custom-control-label
      color: #ffc107

      &::before
        border-color: #ffc107

    .warning-feedback, .warning-tooltip
      display: block

  &:checked ~ .custom-control-label::before
    background-color: #ffce3a
    border-color: #ffce3a

  &:focus
    ~ .custom-control-label::before
      box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #ffc107

.custom-file-input.is-warning
  ~
    .custom-file-label
      border-color: #ffc107

    .warning-feedback, .warning-tooltip
      display: block

  &:focus ~ .custom-file-label
    border-color: #ffc107
    box-shadow: 0 0 0 0 rgba(255, 193, 7, 0.25)

body.text-sm .input-group-text
  font-size: .875rem

.custom-select.form-control-border, .form-control.form-control-border
  border-top: 0
  border-left: 0
  border-right: 0
  border-radius: 0
  box-shadow: inherit

.custom-select.form-control-border.border-width-2, .form-control.form-control-border.border-width-2
  border-bottom-width: 2px

.custom-select.form-control-border.border-width-3, .form-control.form-control-border.border-width-3
  border-bottom-width: 3px

.custom-switch
  &.custom-switch-off-primary .custom-control-input
    ~ .custom-control-label::before
      background-color: #007bff
      border-color: #004a99

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #003e80

  &.custom-switch-on-primary .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #007bff
      border-color: #004a99

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #99caff

  &.custom-switch-off-secondary .custom-control-input
    ~ .custom-control-label::before
      background-color: #6c757d
      border-color: #3d4246

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    ~ .custom-control-label::after
      background-color: #313539

  &.custom-switch-on-secondary .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #6c757d
      border-color: #3d4246

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    ~ .custom-control-label::after
      background-color: #bcc1c6

  &.custom-switch-off-success .custom-control-input
    ~ .custom-control-label::before
      background-color: #28a745
      border-color: #145523

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #0f401b

  &.custom-switch-on-success .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #28a745
      border-color: #145523

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #86e29b

  &.custom-switch-off-info .custom-control-input
    ~ .custom-control-label::before
      background-color: #17a2b8
      border-color: #0c525d

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    ~ .custom-control-label::after
      background-color: #093e47

  &.custom-switch-on-info .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #17a2b8
      border-color: #0c525d

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    ~ .custom-control-label::after
      background-color: #7adeee

  &.custom-switch-off-warning .custom-control-input
    ~ .custom-control-label::before
      background-color: #ffc107
      border-color: #a07800

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    ~ .custom-control-label::after
      background-color: #876500

  &.custom-switch-on-warning .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #ffc107
      border-color: #a07800

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    ~ .custom-control-label::after
      background-color: #ffe7a0

  &.custom-switch-off-danger .custom-control-input
    ~ .custom-control-label::before
      background-color: #dc3545
      border-color: #921925

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #7c151f

  &.custom-switch-on-danger .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #dc3545
      border-color: #921925

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #f3b7bd

  &.custom-switch-off-light .custom-control-input
    ~ .custom-control-label::before
      background-color: #f8f9fa
      border-color: #bdc6d0

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(248, 249, 250, 0.25)

    ~ .custom-control-label::after
      background-color: #aeb9c5

  &.custom-switch-on-light .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #f8f9fa
      border-color: #bdc6d0

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(248, 249, 250, 0.25)

    ~ .custom-control-label::after
      background-color: #fff

  &.custom-switch-off-dark .custom-control-input
    ~ .custom-control-label::before
      background-color: #343a40
      border-color: #060708

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    ~ .custom-control-label::after
      background-color: #000

  &.custom-switch-on-dark .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #343a40
      border-color: #060708

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    ~ .custom-control-label::after
      background-color: #7a8793

  &.custom-switch-off-lightblue .custom-control-input
    ~ .custom-control-label::before
      background-color: #3c8dbc
      border-color: #23536f

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(60, 141, 188, 0.25)

    ~ .custom-control-label::after
      background-color: #1d455b

  &.custom-switch-on-lightblue .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #3c8dbc
      border-color: #23536f

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(60, 141, 188, 0.25)

    ~ .custom-control-label::after
      background-color: #acd0e5

  &.custom-switch-off-navy .custom-control-input
    ~ .custom-control-label::before
      background-color: #001f3f
      border-color: #000

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 31, 63, 0.25)

    ~ .custom-control-label::after
      background-color: #000

  &.custom-switch-on-navy .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #001f3f
      border-color: #000

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 31, 63, 0.25)

    ~ .custom-control-label::after
      background-color: #006ad8

  &.custom-switch-off-olive .custom-control-input
    ~ .custom-control-label::before
      background-color: #3d9970
      border-color: #20503b

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(61, 153, 112, 0.25)

    ~ .custom-control-label::after
      background-color: #193e2d

  &.custom-switch-on-olive .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #3d9970
      border-color: #20503b

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(61, 153, 112, 0.25)

    ~ .custom-control-label::after
      background-color: #99d6bb

  &.custom-switch-off-lime .custom-control-input
    ~ .custom-control-label::before
      background-color: #01ff70
      border-color: #009a43

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(1, 255, 112, 0.25)

    ~ .custom-control-label::after
      background-color: #008138

  &.custom-switch-on-lime .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #01ff70
      border-color: #009a43

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(1, 255, 112, 0.25)

    ~ .custom-control-label::after
      background-color: #9affc6

  &.custom-switch-off-fuchsia .custom-control-input
    ~ .custom-control-label::before
      background-color: #f012be
      border-color: #930974

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(240, 18, 190, 0.25)

    ~ .custom-control-label::after
      background-color: #7b0861

  &.custom-switch-on-fuchsia .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #f012be
      border-color: #930974

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(240, 18, 190, 0.25)

    ~ .custom-control-label::after
      background-color: #f9a2e5

  &.custom-switch-off-maroon .custom-control-input
    ~ .custom-control-label::before
      background-color: #d81b60
      border-color: #7d1038

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(216, 27, 96, 0.25)

    ~ .custom-control-label::after
      background-color: #670d2e

  &.custom-switch-on-maroon .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #d81b60
      border-color: #7d1038

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(216, 27, 96, 0.25)

    ~ .custom-control-label::after
      background-color: #f29aba

  &.custom-switch-off-blue .custom-control-input
    ~ .custom-control-label::before
      background-color: #007bff
      border-color: #004a99

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #003e80

  &.custom-switch-on-blue .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #007bff
      border-color: #004a99

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #99caff

  &.custom-switch-off-indigo .custom-control-input
    ~ .custom-control-label::before
      background-color: #6610f2
      border-color: #3d0894

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(102, 16, 242, 0.25)

    ~ .custom-control-label::after
      background-color: #33077c

  &.custom-switch-on-indigo .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #6610f2
      border-color: #3d0894

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(102, 16, 242, 0.25)

    ~ .custom-control-label::after
      background-color: #c3a1fa

  &.custom-switch-off-purple .custom-control-input
    ~ .custom-control-label::before
      background-color: #6f42c1
      border-color: #432776

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(111, 66, 193, 0.25)

    ~ .custom-control-label::after
      background-color: #382063

  &.custom-switch-on-purple .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #6f42c1
      border-color: #432776

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(111, 66, 193, 0.25)

    ~ .custom-control-label::after
      background-color: #c7b5e7

  &.custom-switch-off-pink .custom-control-input
    ~ .custom-control-label::before
      background-color: #e83e8c
      border-color: #ac145a

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(232, 62, 140, 0.25)

    ~ .custom-control-label::after
      background-color: #95124e

  &.custom-switch-on-pink .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #e83e8c
      border-color: #ac145a

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(232, 62, 140, 0.25)

    ~ .custom-control-label::after
      background-color: #f8c7dd

  &.custom-switch-off-red .custom-control-input
    ~ .custom-control-label::before
      background-color: #dc3545
      border-color: #921925

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #7c151f

  &.custom-switch-on-red .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #dc3545
      border-color: #921925

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #f3b7bd

  &.custom-switch-off-orange .custom-control-input
    ~ .custom-control-label::before
      background-color: #fd7e14
      border-color: #aa4e01

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(253, 126, 20, 0.25)

    ~ .custom-control-label::after
      background-color: #904201

  &.custom-switch-on-orange .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #fd7e14
      border-color: #aa4e01

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(253, 126, 20, 0.25)

    ~ .custom-control-label::after
      background-color: #fed1ac

  &.custom-switch-off-yellow .custom-control-input
    ~ .custom-control-label::before
      background-color: #ffc107
      border-color: #a07800

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    ~ .custom-control-label::after
      background-color: #876500

  &.custom-switch-on-yellow .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #ffc107
      border-color: #a07800

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    ~ .custom-control-label::after
      background-color: #ffe7a0

  &.custom-switch-off-green .custom-control-input
    ~ .custom-control-label::before
      background-color: #28a745
      border-color: #145523

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #0f401b

  &.custom-switch-on-green .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #28a745
      border-color: #145523

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    ~ .custom-control-label::after
      background-color: #86e29b

  &.custom-switch-off-teal .custom-control-input
    ~ .custom-control-label::before
      background-color: #20c997
      border-color: #127155

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(32, 201, 151, 0.25)

    ~ .custom-control-label::after
      background-color: #0e5b44

  &.custom-switch-on-teal .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #20c997
      border-color: #127155

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(32, 201, 151, 0.25)

    ~ .custom-control-label::after
      background-color: #94eed3

  &.custom-switch-off-cyan .custom-control-input
    ~ .custom-control-label::before
      background-color: #17a2b8
      border-color: #0c525d

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    ~ .custom-control-label::after
      background-color: #093e47

  &.custom-switch-on-cyan .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #17a2b8
      border-color: #0c525d

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    ~ .custom-control-label::after
      background-color: #7adeee

  &.custom-switch-off-white .custom-control-input
    ~ .custom-control-label::before
      background-color: #fff
      border-color: #ccc

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 255, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #bfbfbf

  &.custom-switch-on-white .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #fff
      border-color: #ccc

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 255, 255, 0.25)

    ~ .custom-control-label::after
      background-color: #fff

  &.custom-switch-off-gray .custom-control-input
    ~ .custom-control-label::before
      background-color: #6c757d
      border-color: #3d4246

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    ~ .custom-control-label::after
      background-color: #313539

  &.custom-switch-on-gray .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #6c757d
      border-color: #3d4246

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    ~ .custom-control-label::after
      background-color: #bcc1c6

  &.custom-switch-off-gray-dark .custom-control-input
    ~ .custom-control-label::before
      background-color: #343a40
      border-color: #060708

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    ~ .custom-control-label::after
      background-color: #000

  &.custom-switch-on-gray-dark .custom-control-input:checked
    ~ .custom-control-label::before
      background-color: #343a40
      border-color: #060708

    &:focus ~ .custom-control-label::before
      box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    ~ .custom-control-label::after
      background-color: #7a8793

.custom-range
  &.custom-range-primary
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #007bff

      &:active
        background-color: #b3d7ff

  &.custom-range-secondary
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #6c757d

      &:active
        background-color: #caced1

  &.custom-range-success
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #28a745

      &:active
        background-color: #9be7ac

  &.custom-range-info
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #17a2b8

      &:active
        background-color: #90e4f1

  &.custom-range-warning
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #ffc107

      &:active
        background-color: #ffeeba

  &.custom-range-danger
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #dc3545

      &:active
        background-color: #f6cdd1

  &.custom-range-light
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(248, 249, 250, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #f8f9fa

      &:active
        background-color: #fff

  &.custom-range-dark
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #343a40

      &:active
        background-color: #88939e

  &.custom-range-lightblue
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(60, 141, 188, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #3c8dbc

      &:active
        background-color: #c0dbeb

  &.custom-range-navy
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 31, 63, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #001f3f

      &:active
        background-color: #0077f2

  &.custom-range-olive
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(61, 153, 112, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #3d9970

      &:active
        background-color: #abdec7

  &.custom-range-lime
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(1, 255, 112, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #01ff70

      &:active
        background-color: #b4ffd4

  &.custom-range-fuchsia
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(240, 18, 190, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #f012be

      &:active
        background-color: #fbbaec

  &.custom-range-maroon
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(216, 27, 96, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #d81b60

      &:active
        background-color: #f5b0c9

  &.custom-range-blue
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(0, 123, 255, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #007bff

      &:active
        background-color: #b3d7ff

  &.custom-range-indigo
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(102, 16, 242, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #6610f2

      &:active
        background-color: #d2b9fb

  &.custom-range-purple
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(111, 66, 193, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #6f42c1

      &:active
        background-color: #d5c8ed

  &.custom-range-pink
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(232, 62, 140, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #e83e8c

      &:active
        background-color: #fbddeb

  &.custom-range-red
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(220, 53, 69, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #dc3545

      &:active
        background-color: #f6cdd1

  &.custom-range-orange
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(253, 126, 20, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #fd7e14

      &:active
        background-color: #ffdfc5

  &.custom-range-yellow
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 193, 7, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #ffc107

      &:active
        background-color: #ffeeba

  &.custom-range-green
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(40, 167, 69, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #28a745

      &:active
        background-color: #9be7ac

  &.custom-range-teal
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(32, 201, 151, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #20c997

      &:active
        background-color: #aaf1dc

  &.custom-range-cyan
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(23, 162, 184, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #17a2b8

      &:active
        background-color: #90e4f1

  &.custom-range-white
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(255, 255, 255, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #fff

      &:active
        background-color: #fff

  &.custom-range-gray
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(108, 117, 125, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #6c757d

      &:active
        background-color: #caced1

  &.custom-range-gray-dark
    &:focus
      outline: 0

      &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
        box-shadow: 0 0 0 1px #fff, 0 0 0 2px rgba(52, 58, 64, 0.25)

    &::-webkit-slider-thumb, &::-moz-range-thumb, &::-ms-thumb
      background-color: #343a40

      &:active
        background-color: #88939e

.custom-control-input-primary
  &:checked ~ .custom-control-label::before
    border-color: #007bff
    background-color: #007bff

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23007bff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23007bff'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #80bdff

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #b3d7ff
    border-color: #b3d7ff

.custom-control-input-secondary
  &:checked ~ .custom-control-label::before
    border-color: #6c757d
    background-color: #6c757d

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%236c757d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%236c757d'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(108, 117, 125, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #afb5ba

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #caced1
    border-color: #caced1

.custom-control-input-success
  &:checked ~ .custom-control-label::before
    border-color: #28a745
    background-color: #28a745

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2328a745'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(40, 167, 69, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #71dd8a

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #9be7ac
    border-color: #9be7ac

.custom-control-input-info
  &:checked ~ .custom-control-label::before
    border-color: #17a2b8
    background-color: #17a2b8

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2317a2b8' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2317a2b8'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(23, 162, 184, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #63d9ec

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #90e4f1
    border-color: #90e4f1

.custom-control-input-warning
  &:checked ~ .custom-control-label::before
    border-color: #ffc107
    background-color: #ffc107

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23ffc107' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23ffc107'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(255, 193, 7, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #ffe187

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #ffeeba
    border-color: #ffeeba

.custom-control-input-danger
  &:checked ~ .custom-control-label::before
    border-color: #dc3545
    background-color: #dc3545

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23dc3545' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23dc3545'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(220, 53, 69, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #efa2a9

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #f6cdd1
    border-color: #f6cdd1

.custom-control-input-light
  &:checked ~ .custom-control-label::before
    border-color: #f8f9fa
    background-color: #f8f9fa

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f8f9fa' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23f8f9fa'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(248, 249, 250, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #fff

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #fff
    border-color: #fff

.custom-control-input-dark
  &:checked ~ .custom-control-label::before
    border-color: #343a40
    background-color: #343a40

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23343a40' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23343a40'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(52, 58, 64, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #6d7a86

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #88939e
    border-color: #88939e

.custom-control-input-lightblue
  &:checked ~ .custom-control-label::before
    border-color: #3c8dbc
    background-color: #3c8dbc

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%233c8dbc' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%233c8dbc'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(60, 141, 188, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #99c5de

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #c0dbeb
    border-color: #c0dbeb

.custom-control-input-navy
  &:checked ~ .custom-control-label::before
    border-color: #001f3f
    background-color: #001f3f

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23001f3f' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23001f3f'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(0, 31, 63, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #005ebf

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #0077f2
    border-color: #0077f2

.custom-control-input-olive
  &:checked ~ .custom-control-label::before
    border-color: #3d9970
    background-color: #3d9970

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%233d9970' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%233d9970'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(61, 153, 112, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #87cfaf

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #abdec7
    border-color: #abdec7

.custom-control-input-lime
  &:checked ~ .custom-control-label::before
    border-color: #01ff70
    background-color: #01ff70

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2301ff70' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2301ff70'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(1, 255, 112, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #81ffb8

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #b4ffd4
    border-color: #b4ffd4

.custom-control-input-fuchsia
  &:checked ~ .custom-control-label::before
    border-color: #f012be
    background-color: #f012be

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f012be' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23f012be'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(240, 18, 190, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #f88adf

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #fbbaec
    border-color: #fbbaec

.custom-control-input-maroon
  &:checked ~ .custom-control-label::before
    border-color: #d81b60
    background-color: #d81b60

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23d81b60' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23d81b60'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(216, 27, 96, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #f083ab

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #f5b0c9
    border-color: #f5b0c9

.custom-control-input-blue
  &:checked ~ .custom-control-label::before
    border-color: #007bff
    background-color: #007bff

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23007bff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23007bff'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #80bdff

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #b3d7ff
    border-color: #b3d7ff

.custom-control-input-indigo
  &:checked ~ .custom-control-label::before
    border-color: #6610f2
    background-color: #6610f2

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%236610f2' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%236610f2'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(102, 16, 242, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #b389f9

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #d2b9fb
    border-color: #d2b9fb

.custom-control-input-purple
  &:checked ~ .custom-control-label::before
    border-color: #6f42c1
    background-color: #6f42c1

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%236f42c1' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%236f42c1'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(111, 66, 193, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #b8a2e0

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #d5c8ed
    border-color: #d5c8ed

.custom-control-input-pink
  &:checked ~ .custom-control-label::before
    border-color: #e83e8c
    background-color: #e83e8c

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23e83e8c' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23e83e8c'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(232, 62, 140, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #f6b0d0

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #fbddeb
    border-color: #fbddeb

.custom-control-input-red
  &:checked ~ .custom-control-label::before
    border-color: #dc3545
    background-color: #dc3545

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23dc3545' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23dc3545'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(220, 53, 69, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #efa2a9

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #f6cdd1
    border-color: #f6cdd1

.custom-control-input-orange
  &:checked ~ .custom-control-label::before
    border-color: #fd7e14
    background-color: #fd7e14

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fd7e14' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fd7e14'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(253, 126, 20, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #fec392

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #ffdfc5
    border-color: #ffdfc5

.custom-control-input-yellow
  &:checked ~ .custom-control-label::before
    border-color: #ffc107
    background-color: #ffc107

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23ffc107' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23ffc107'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(255, 193, 7, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #ffe187

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #ffeeba
    border-color: #ffeeba

.custom-control-input-green
  &:checked ~ .custom-control-label::before
    border-color: #28a745
    background-color: #28a745

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2328a745' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2328a745'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(40, 167, 69, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #71dd8a

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #9be7ac
    border-color: #9be7ac

.custom-control-input-teal
  &:checked ~ .custom-control-label::before
    border-color: #20c997
    background-color: #20c997

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2320c997' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2320c997'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(32, 201, 151, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #7eeaca

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #aaf1dc
    border-color: #aaf1dc

.custom-control-input-cyan
  &:checked ~ .custom-control-label::before
    border-color: #17a2b8
    background-color: #17a2b8

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%2317a2b8' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%2317a2b8'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(23, 162, 184, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #63d9ec

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #90e4f1
    border-color: #90e4f1

.custom-control-input-white
  &:checked ~ .custom-control-label::before
    border-color: #fff
    background-color: #fff

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(255, 255, 255, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #fff

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #fff
    border-color: #fff

.custom-control-input-gray
  &:checked ~ .custom-control-label::before
    border-color: #6c757d
    background-color: #6c757d

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%236c757d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%236c757d'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(108, 117, 125, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #afb5ba

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #caced1
    border-color: #caced1

.custom-control-input-gray-dark
  &:checked ~ .custom-control-label::before
    border-color: #343a40
    background-color: #343a40

  &.custom-control-input-outline:checked
    &[type=checkbox] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23343a40' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !important

    &[type=radio] ~ .custom-control-label::after
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23343a40'/%3E%3C/svg%3E") !important

  &:focus
    ~ .custom-control-label::before
      box-shadow: inset 0 0 0 transparent, 0 0 0 0.2rem rgba(52, 58, 64, 0.25)

    &:not(:checked) ~ .custom-control-label::before
      border-color: #6d7a86

  &:not(:disabled):active ~ .custom-control-label::before
    background-color: #88939e
    border-color: #88939e

.custom-control-input-outline
  ~ .custom-control-label::before
    background-color: transparent !important
    box-shadow: none

  &:checked ~ .custom-control-label::before
    background-color: transparent

.dark-mode
  .custom-control-label::before
    background-color: #343a40
    color: #fff

  .custom-file-label
    background-color: #343a40
    color: #fff

    &::after
      background-color: #343a40
      color: #fff

  .custom-select, .form-control, .input-group-text
    background-color: #343a40
    color: #fff

  .form-control:not(.form-control-navbar):not(.is-invalid):not(:focus)
    border-color: #6c757d

  select
    background-color: #343a40
    color: #fff
    border-color: #6c757d

  .input-group-text
    border-color: #6c757d

  .custom-control-input
    &:disabled ~ .custom-control-label::before, &[disabled] ~ .custom-control-label::before
      background-color: #3f474e
      border-color: #6c757d
      color: #fff

  .custom-range
    &::-webkit-slider-runnable-track, &::-moz-range-track, &::-ms-track
      background-color: #454d55

  .navbar-dark
    .btn-navbar, .form-control-navbar
      background-color: #343a40
      border: 1px solid #6c757d

    .btn-navbar
      &:hover
        background-color: #454d55

      &:focus
        background-color: #4b545c

    .form-control-navbar +
      .input-group-append > .btn-navbar, .input-group-prepend > .btn-navbar
        background-color: #3f474e
        color: #fff
        border: 1px solid #6c757d
        border-left: none

.progress
  box-shadow: none
  border-radius: 1px

  &.vertical
    display: inline-block
    height: 200px
    margin-right: 10px
    position: relative
    width: 30px

    > .progress-bar
      bottom: 0
      position: absolute
      width: 100%

    &.progress-sm, &.sm
      width: 20px

    &.progress-xs, &.xs
      width: 10px

    &.progress-xxs, &.xxs
      width: 3px

.progress-group
  margin-bottom: .5rem

.progress-sm
  height: 10px

.progress-xs
  height: 7px

.progress-xxs
  height: 3px

.table tr > td .progress
  margin: 0

.dark-mode .progress
  background: #454d55

.card-primary
  &:not(.card-outline) > .card-header
    background-color: #007bff
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #007bff

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #007bff

.bg-gradient-primary .btn-tool, .bg-primary .btn-tool, .card-primary:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-primary .btn-tool:hover, .bg-primary .btn-tool:hover, .card-primary:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-primary .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-primary .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-primary .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #0067d6
        color: #fff

    thead tr:first-child th:hover
      background-color: #0067d6
      color: #fff

  &.bg-primary .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #0067d6
        color: #fff

    thead tr:first-child th:hover
      background-color: #0067d6
      color: #fff

  &.bg-gradient-primary .bootstrap-datetimepicker-widget table td.today::before, &.bg-primary .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-primary .bootstrap-datetimepicker-widget table td.active, &.bg-primary .bootstrap-datetimepicker-widget table td.active
    background-color: #3395ff
    color: #fff

    &:hover
      background-color: #3395ff
      color: #fff

.card-secondary
  &:not(.card-outline) > .card-header
    background-color: #6c757d
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #6c757d

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #6c757d

.bg-gradient-secondary .btn-tool, .bg-secondary .btn-tool, .card-secondary:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-secondary .btn-tool:hover, .bg-secondary .btn-tool:hover, .card-secondary:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-secondary .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-secondary .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-secondary .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #596167
        color: #fff

    thead tr:first-child th:hover
      background-color: #596167
      color: #fff

  &.bg-secondary .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #596167
        color: #fff

    thead tr:first-child th:hover
      background-color: #596167
      color: #fff

  &.bg-gradient-secondary .bootstrap-datetimepicker-widget table td.today::before, &.bg-secondary .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-secondary .bootstrap-datetimepicker-widget table td.active, &.bg-secondary .bootstrap-datetimepicker-widget table td.active
    background-color: #868e96
    color: #fff

    &:hover
      background-color: #868e96
      color: #fff

.card-success
  &:not(.card-outline) > .card-header
    background-color: #28a745
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #28a745

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #28a745

.bg-gradient-success .btn-tool, .bg-success .btn-tool, .card-success:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-success .btn-tool:hover, .bg-success .btn-tool:hover, .card-success:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-success .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-success .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-success .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #208637
        color: #fff

    thead tr:first-child th:hover
      background-color: #208637
      color: #fff

  &.bg-success .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #208637
        color: #fff

    thead tr:first-child th:hover
      background-color: #208637
      color: #fff

  &.bg-gradient-success .bootstrap-datetimepicker-widget table td.today::before, &.bg-success .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-success .bootstrap-datetimepicker-widget table td.active, &.bg-success .bootstrap-datetimepicker-widget table td.active
    background-color: #34ce57
    color: #fff

    &:hover
      background-color: #34ce57
      color: #fff

.card-info
  &:not(.card-outline) > .card-header
    background-color: #17a2b8
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #17a2b8

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #17a2b8

.bg-gradient-info .btn-tool, .bg-info .btn-tool, .card-info:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-info .btn-tool:hover, .bg-info .btn-tool:hover, .card-info:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-info .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-info .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-info .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #128294
        color: #fff

    thead tr:first-child th:hover
      background-color: #128294
      color: #fff

  &.bg-info .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #128294
        color: #fff

    thead tr:first-child th:hover
      background-color: #128294
      color: #fff

  &.bg-gradient-info .bootstrap-datetimepicker-widget table td.today::before, &.bg-info .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-info .bootstrap-datetimepicker-widget table td.active, &.bg-info .bootstrap-datetimepicker-widget table td.active
    background-color: #1fc8e3
    color: #fff

    &:hover
      background-color: #1fc8e3
      color: #fff

.card-warning
  &:not(.card-outline) > .card-header
    background-color: #ffc107
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #ffc107

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #ffc107

.bg-gradient-warning .btn-tool, .bg-warning .btn-tool, .card-warning:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-warning .btn-tool:hover, .bg-warning .btn-tool:hover, .card-warning:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-warning .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-warning .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-warning .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #dda600
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #dda600
      color: #1f2d3d

  &.bg-warning .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #dda600
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #dda600
      color: #1f2d3d

  &.bg-gradient-warning .bootstrap-datetimepicker-widget table td.today::before, &.bg-warning .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-warning .bootstrap-datetimepicker-widget table td.active, &.bg-warning .bootstrap-datetimepicker-widget table td.active
    background-color: #ffce3a
    color: #1f2d3d

    &:hover
      background-color: #ffce3a
      color: #1f2d3d

.card-danger
  &:not(.card-outline) > .card-header
    background-color: #dc3545
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #dc3545

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #dc3545

.bg-danger .btn-tool, .bg-gradient-danger .btn-tool, .card-danger:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-danger .btn-tool:hover, .bg-gradient-danger .btn-tool:hover, .card-danger:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-danger .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-danger .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-danger .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #c62232
        color: #fff

    thead tr:first-child th:hover
      background-color: #c62232
      color: #fff

  &.bg-gradient-danger .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #c62232
        color: #fff

    thead tr:first-child th:hover
      background-color: #c62232
      color: #fff

  &.bg-danger .bootstrap-datetimepicker-widget table td.today::before, &.bg-gradient-danger .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-danger .bootstrap-datetimepicker-widget table td.active, &.bg-gradient-danger .bootstrap-datetimepicker-widget table td.active
    background-color: #e4606d
    color: #fff

    &:hover
      background-color: #e4606d
      color: #fff

.card-light
  &:not(.card-outline) > .card-header
    background-color: #f8f9fa
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #f8f9fa

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #f8f9fa

.bg-gradient-light .btn-tool, .bg-light .btn-tool, .card-light:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-light .btn-tool:hover, .bg-light .btn-tool:hover, .card-light:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-light .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-light .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-light .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e0e5e9
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #e0e5e9
      color: #1f2d3d

  &.bg-light .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e0e5e9
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #e0e5e9
      color: #1f2d3d

  &.bg-gradient-light .bootstrap-datetimepicker-widget table td.today::before, &.bg-light .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-light .bootstrap-datetimepicker-widget table td.active, &.bg-light .bootstrap-datetimepicker-widget table td.active
    background-color: #fff
    color: #1f2d3d

    &:hover
      background-color: #fff
      color: #1f2d3d

.card-dark
  &:not(.card-outline) > .card-header
    background-color: #343a40
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #343a40

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #343a40

.bg-dark .btn-tool, .bg-gradient-dark .btn-tool, .card-dark:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-dark .btn-tool:hover, .bg-gradient-dark .btn-tool:hover, .card-dark:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-dark .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-dark .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-dark .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #222629
        color: #fff

    thead tr:first-child th:hover
      background-color: #222629
      color: #fff

  &.bg-gradient-dark .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #222629
        color: #fff

    thead tr:first-child th:hover
      background-color: #222629
      color: #fff

  &.bg-dark .bootstrap-datetimepicker-widget table td.today::before, &.bg-gradient-dark .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-dark .bootstrap-datetimepicker-widget table td.active, &.bg-gradient-dark .bootstrap-datetimepicker-widget table td.active
    background-color: #4b545c
    color: #fff

    &:hover
      background-color: #4b545c
      color: #fff

.card-lightblue
  &:not(.card-outline) > .card-header
    background-color: #3c8dbc
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #3c8dbc

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #3c8dbc

.bg-gradient-lightblue .btn-tool, .bg-lightblue .btn-tool, .card-lightblue:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-lightblue .btn-tool:hover, .bg-lightblue .btn-tool:hover, .card-lightblue:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-lightblue .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-lightblue .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-lightblue .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #32769d
        color: #fff

    thead tr:first-child th:hover
      background-color: #32769d
      color: #fff

  &.bg-lightblue .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #32769d
        color: #fff

    thead tr:first-child th:hover
      background-color: #32769d
      color: #fff

  &.bg-gradient-lightblue .bootstrap-datetimepicker-widget table td.today::before, &.bg-lightblue .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-lightblue .bootstrap-datetimepicker-widget table td.active, &.bg-lightblue .bootstrap-datetimepicker-widget table td.active
    background-color: #5fa4cc
    color: #fff

    &:hover
      background-color: #5fa4cc
      color: #fff

.card-navy
  &:not(.card-outline) > .card-header
    background-color: #001f3f
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #001f3f

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #001f3f

.bg-gradient-navy .btn-tool, .bg-navy .btn-tool, .card-navy:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-navy .btn-tool:hover, .bg-navy .btn-tool:hover, .card-navy:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-navy .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-navy .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-navy .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #000b16
        color: #fff

    thead tr:first-child th:hover
      background-color: #000b16
      color: #fff

  &.bg-navy .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #000b16
        color: #fff

    thead tr:first-child th:hover
      background-color: #000b16
      color: #fff

  &.bg-gradient-navy .bootstrap-datetimepicker-widget table td.today::before, &.bg-navy .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-navy .bootstrap-datetimepicker-widget table td.active, &.bg-navy .bootstrap-datetimepicker-widget table td.active
    background-color: #003872
    color: #fff

    &:hover
      background-color: #003872
      color: #fff

.card-olive
  &:not(.card-outline) > .card-header
    background-color: #3d9970
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #3d9970

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #3d9970

.bg-gradient-olive .btn-tool, .bg-olive .btn-tool, .card-olive:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-olive .btn-tool:hover, .bg-olive .btn-tool:hover, .card-olive:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-olive .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-olive .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-olive .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #317c5b
        color: #fff

    thead tr:first-child th:hover
      background-color: #317c5b
      color: #fff

  &.bg-olive .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #317c5b
        color: #fff

    thead tr:first-child th:hover
      background-color: #317c5b
      color: #fff

  &.bg-gradient-olive .bootstrap-datetimepicker-widget table td.today::before, &.bg-olive .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-olive .bootstrap-datetimepicker-widget table td.active, &.bg-olive .bootstrap-datetimepicker-widget table td.active
    background-color: #50b98a
    color: #fff

    &:hover
      background-color: #50b98a
      color: #fff

.card-lime
  &:not(.card-outline) > .card-header
    background-color: #01ff70
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #01ff70

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #01ff70

.bg-gradient-lime .btn-tool, .bg-lime .btn-tool, .card-lime:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-lime .btn-tool:hover, .bg-lime .btn-tool:hover, .card-lime:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-lime .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-lime .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-lime .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #00d75e
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #00d75e
      color: #1f2d3d

  &.bg-lime .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #00d75e
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #00d75e
      color: #1f2d3d

  &.bg-gradient-lime .bootstrap-datetimepicker-widget table td.today::before, &.bg-lime .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-lime .bootstrap-datetimepicker-widget table td.active, &.bg-lime .bootstrap-datetimepicker-widget table td.active
    background-color: #34ff8d
    color: #1f2d3d

    &:hover
      background-color: #34ff8d
      color: #1f2d3d

.card-fuchsia
  &:not(.card-outline) > .card-header
    background-color: #f012be
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #f012be

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #f012be

.bg-fuchsia .btn-tool, .bg-gradient-fuchsia .btn-tool, .card-fuchsia:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-fuchsia .btn-tool:hover, .bg-gradient-fuchsia .btn-tool:hover, .card-fuchsia:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-fuchsia .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-fuchsia .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-fuchsia .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #cc0da1
        color: #fff

    thead tr:first-child th:hover
      background-color: #cc0da1
      color: #fff

  &.bg-gradient-fuchsia .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #cc0da1
        color: #fff

    thead tr:first-child th:hover
      background-color: #cc0da1
      color: #fff

  &.bg-fuchsia .bootstrap-datetimepicker-widget table td.today::before, &.bg-gradient-fuchsia .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-fuchsia .bootstrap-datetimepicker-widget table td.active, &.bg-gradient-fuchsia .bootstrap-datetimepicker-widget table td.active
    background-color: #f342cb
    color: #fff

    &:hover
      background-color: #f342cb
      color: #fff

.card-maroon
  &:not(.card-outline) > .card-header
    background-color: #d81b60
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #d81b60

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #d81b60

.bg-gradient-maroon .btn-tool, .bg-maroon .btn-tool, .card-maroon:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-maroon .btn-tool:hover, .bg-maroon .btn-tool:hover, .card-maroon:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-maroon .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-maroon .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-maroon .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #b41650
        color: #fff

    thead tr:first-child th:hover
      background-color: #b41650
      color: #fff

  &.bg-maroon .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #b41650
        color: #fff

    thead tr:first-child th:hover
      background-color: #b41650
      color: #fff

  &.bg-gradient-maroon .bootstrap-datetimepicker-widget table td.today::before, &.bg-maroon .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-maroon .bootstrap-datetimepicker-widget table td.active, &.bg-maroon .bootstrap-datetimepicker-widget table td.active
    background-color: #e73f7c
    color: #fff

    &:hover
      background-color: #e73f7c
      color: #fff

.card-blue
  &:not(.card-outline) > .card-header
    background-color: #007bff
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #007bff

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #007bff

.bg-blue .btn-tool, .bg-gradient-blue .btn-tool, .card-blue:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-blue .btn-tool:hover, .bg-gradient-blue .btn-tool:hover, .card-blue:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-blue .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-blue .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-blue .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #0067d6
        color: #fff

    thead tr:first-child th:hover
      background-color: #0067d6
      color: #fff

  &.bg-gradient-blue .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #0067d6
        color: #fff

    thead tr:first-child th:hover
      background-color: #0067d6
      color: #fff

  &.bg-blue .bootstrap-datetimepicker-widget table td.today::before, &.bg-gradient-blue .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-blue .bootstrap-datetimepicker-widget table td.active, &.bg-gradient-blue .bootstrap-datetimepicker-widget table td.active
    background-color: #3395ff
    color: #fff

    &:hover
      background-color: #3395ff
      color: #fff

.card-indigo
  &:not(.card-outline) > .card-header
    background-color: #6610f2
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #6610f2

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #6610f2

.bg-gradient-indigo .btn-tool, .bg-indigo .btn-tool, .card-indigo:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-indigo .btn-tool:hover, .bg-indigo .btn-tool:hover, .card-indigo:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-indigo .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-indigo .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-indigo .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #550bce
        color: #fff

    thead tr:first-child th:hover
      background-color: #550bce
      color: #fff

  &.bg-indigo .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #550bce
        color: #fff

    thead tr:first-child th:hover
      background-color: #550bce
      color: #fff

  &.bg-gradient-indigo .bootstrap-datetimepicker-widget table td.today::before, &.bg-indigo .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-indigo .bootstrap-datetimepicker-widget table td.active, &.bg-indigo .bootstrap-datetimepicker-widget table td.active
    background-color: #8540f5
    color: #fff

    &:hover
      background-color: #8540f5
      color: #fff

.card-purple
  &:not(.card-outline) > .card-header
    background-color: #6f42c1
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #6f42c1

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #6f42c1

.bg-gradient-purple .btn-tool, .bg-purple .btn-tool, .card-purple:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-purple .btn-tool:hover, .bg-purple .btn-tool:hover, .card-purple:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-purple .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-purple .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-purple .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #5d36a4
        color: #fff

    thead tr:first-child th:hover
      background-color: #5d36a4
      color: #fff

  &.bg-purple .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #5d36a4
        color: #fff

    thead tr:first-child th:hover
      background-color: #5d36a4
      color: #fff

  &.bg-gradient-purple .bootstrap-datetimepicker-widget table td.today::before, &.bg-purple .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-purple .bootstrap-datetimepicker-widget table td.active, &.bg-purple .bootstrap-datetimepicker-widget table td.active
    background-color: #8c68ce
    color: #fff

    &:hover
      background-color: #8c68ce
      color: #fff

.card-pink
  &:not(.card-outline) > .card-header
    background-color: #e83e8c
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #e83e8c

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #e83e8c

.bg-gradient-pink .btn-tool, .bg-pink .btn-tool, .card-pink:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-pink .btn-tool:hover, .bg-pink .btn-tool:hover, .card-pink:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-pink .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-pink .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-pink .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e21b76
        color: #fff

    thead tr:first-child th:hover
      background-color: #e21b76
      color: #fff

  &.bg-pink .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e21b76
        color: #fff

    thead tr:first-child th:hover
      background-color: #e21b76
      color: #fff

  &.bg-gradient-pink .bootstrap-datetimepicker-widget table td.today::before, &.bg-pink .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-pink .bootstrap-datetimepicker-widget table td.active, &.bg-pink .bootstrap-datetimepicker-widget table td.active
    background-color: #ed6ca7
    color: #fff

    &:hover
      background-color: #ed6ca7
      color: #fff

.card-red
  &:not(.card-outline) > .card-header
    background-color: #dc3545
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #dc3545

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #dc3545

.bg-gradient-red .btn-tool, .bg-red .btn-tool, .card-red:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-red .btn-tool:hover, .bg-red .btn-tool:hover, .card-red:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-red .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-red .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-red .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #c62232
        color: #fff

    thead tr:first-child th:hover
      background-color: #c62232
      color: #fff

  &.bg-red .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #c62232
        color: #fff

    thead tr:first-child th:hover
      background-color: #c62232
      color: #fff

  &.bg-gradient-red .bootstrap-datetimepicker-widget table td.today::before, &.bg-red .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-red .bootstrap-datetimepicker-widget table td.active, &.bg-red .bootstrap-datetimepicker-widget table td.active
    background-color: #e4606d
    color: #fff

    &:hover
      background-color: #e4606d
      color: #fff

.card-orange
  &:not(.card-outline) > .card-header
    background-color: #fd7e14
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #fd7e14

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #fd7e14

.bg-gradient-orange .btn-tool, .bg-orange .btn-tool, .card-orange:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-orange .btn-tool:hover, .bg-orange .btn-tool:hover, .card-orange:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-orange .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-orange .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-orange .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e66a02
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #e66a02
      color: #1f2d3d

  &.bg-orange .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #e66a02
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #e66a02
      color: #1f2d3d

  &.bg-gradient-orange .bootstrap-datetimepicker-widget table td.today::before, &.bg-orange .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active, &.bg-orange .bootstrap-datetimepicker-widget table td.active
    background-color: #fd9a47
    color: #1f2d3d

    &:hover
      background-color: #fd9a47
      color: #1f2d3d

.card-yellow
  &:not(.card-outline) > .card-header
    background-color: #ffc107
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #ffc107

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #ffc107

.bg-gradient-yellow .btn-tool, .bg-yellow .btn-tool, .card-yellow:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-yellow .btn-tool:hover, .bg-yellow .btn-tool:hover, .card-yellow:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-yellow .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-yellow .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-yellow .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #dda600
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #dda600
      color: #1f2d3d

  &.bg-yellow .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #dda600
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #dda600
      color: #1f2d3d

  &.bg-gradient-yellow .bootstrap-datetimepicker-widget table td.today::before, &.bg-yellow .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-yellow .bootstrap-datetimepicker-widget table td.active, &.bg-yellow .bootstrap-datetimepicker-widget table td.active
    background-color: #ffce3a
    color: #1f2d3d

    &:hover
      background-color: #ffce3a
      color: #1f2d3d

.card-green
  &:not(.card-outline) > .card-header
    background-color: #28a745
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #28a745

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #28a745

.bg-gradient-green .btn-tool, .bg-green .btn-tool, .card-green:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-green .btn-tool:hover, .bg-green .btn-tool:hover, .card-green:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-green .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-green .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-green .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #208637
        color: #fff

    thead tr:first-child th:hover
      background-color: #208637
      color: #fff

  &.bg-green .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #208637
        color: #fff

    thead tr:first-child th:hover
      background-color: #208637
      color: #fff

  &.bg-gradient-green .bootstrap-datetimepicker-widget table td.today::before, &.bg-green .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-green .bootstrap-datetimepicker-widget table td.active, &.bg-green .bootstrap-datetimepicker-widget table td.active
    background-color: #34ce57
    color: #fff

    &:hover
      background-color: #34ce57
      color: #fff

.card-teal
  &:not(.card-outline) > .card-header
    background-color: #20c997
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #20c997

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #20c997

.bg-gradient-teal .btn-tool, .bg-teal .btn-tool, .card-teal:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-teal .btn-tool:hover, .bg-teal .btn-tool:hover, .card-teal:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-teal .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-teal .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-teal .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #1aa67d
        color: #fff

    thead tr:first-child th:hover
      background-color: #1aa67d
      color: #fff

  &.bg-teal .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #1aa67d
        color: #fff

    thead tr:first-child th:hover
      background-color: #1aa67d
      color: #fff

  &.bg-gradient-teal .bootstrap-datetimepicker-widget table td.today::before, &.bg-teal .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-teal .bootstrap-datetimepicker-widget table td.active, &.bg-teal .bootstrap-datetimepicker-widget table td.active
    background-color: #3ce0af
    color: #fff

    &:hover
      background-color: #3ce0af
      color: #fff

.card-cyan
  &:not(.card-outline) > .card-header
    background-color: #17a2b8
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #17a2b8

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #17a2b8

.bg-cyan .btn-tool, .bg-gradient-cyan .btn-tool, .card-cyan:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-cyan .btn-tool:hover, .bg-gradient-cyan .btn-tool:hover, .card-cyan:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-cyan .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-cyan .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-cyan .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #128294
        color: #fff

    thead tr:first-child th:hover
      background-color: #128294
      color: #fff

  &.bg-gradient-cyan .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #128294
        color: #fff

    thead tr:first-child th:hover
      background-color: #128294
      color: #fff

  &.bg-cyan .bootstrap-datetimepicker-widget table td.today::before, &.bg-gradient-cyan .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-cyan .bootstrap-datetimepicker-widget table td.active, &.bg-gradient-cyan .bootstrap-datetimepicker-widget table td.active
    background-color: #1fc8e3
    color: #fff

    &:hover
      background-color: #1fc8e3
      color: #fff

.card-white
  &:not(.card-outline) > .card-header
    background-color: #fff
    color: #1f2d3d

    a
      color: #1f2d3d

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #fff

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #fff

.bg-gradient-white .btn-tool, .bg-white .btn-tool, .card-white:not(.card-outline) .btn-tool
  color: rgba(31, 45, 61, 0.8)

.bg-gradient-white .btn-tool:hover, .bg-white .btn-tool:hover, .card-white:not(.card-outline) .btn-tool:hover
  color: #1f2d3d

.card
  &.bg-gradient-white .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-white .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-white .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #ebebeb
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #ebebeb
      color: #1f2d3d

  &.bg-white .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #ebebeb
        color: #1f2d3d

    thead tr:first-child th:hover
      background-color: #ebebeb
      color: #1f2d3d

  &.bg-gradient-white .bootstrap-datetimepicker-widget table td.today::before, &.bg-white .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #1f2d3d

  &.bg-gradient-white .bootstrap-datetimepicker-widget table td.active, &.bg-white .bootstrap-datetimepicker-widget table td.active
    background-color: #fff
    color: #1f2d3d

    &:hover
      background-color: #fff
      color: #1f2d3d

.card-gray
  &:not(.card-outline) > .card-header
    background-color: #6c757d
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #6c757d

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #6c757d

.bg-gradient-gray .btn-tool, .bg-gray .btn-tool, .card-gray:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-gray .btn-tool:hover, .bg-gray .btn-tool:hover, .card-gray:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-gray .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gray .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-gray .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #596167
        color: #fff

    thead tr:first-child th:hover
      background-color: #596167
      color: #fff

  &.bg-gray .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #596167
        color: #fff

    thead tr:first-child th:hover
      background-color: #596167
      color: #fff

  &.bg-gradient-gray .bootstrap-datetimepicker-widget table td.today::before, &.bg-gray .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-gray .bootstrap-datetimepicker-widget table td.active, &.bg-gray .bootstrap-datetimepicker-widget table td.active
    background-color: #868e96
    color: #fff

    &:hover
      background-color: #868e96
      color: #fff

.card-gray-dark
  &:not(.card-outline) > .card-header
    background-color: #343a40
    color: #fff

    a
      color: #fff

      &.active
        color: #1f2d3d

  &.card-outline
    border-top: 3px solid #343a40

  &.card-outline-tabs > .card-header a
    &:hover
      border-top: 3px solid #dee2e6

    &.active
      border-top: 3px solid #343a40

.bg-gradient-gray-dark .btn-tool, .bg-gray-dark .btn-tool, .card-gray-dark:not(.card-outline) .btn-tool
  color: rgba(255, 255, 255, 0.8)

.bg-gradient-gray-dark .btn-tool:hover, .bg-gray-dark .btn-tool:hover, .card-gray-dark:not(.card-outline) .btn-tool:hover
  color: #fff

.card
  &.bg-gradient-gray-dark .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gray-dark .bootstrap-datetimepicker-widget .table
    td, th
      border: none

  &.bg-gradient-gray-dark .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #222629
        color: #fff

    thead tr:first-child th:hover
      background-color: #222629
      color: #fff

  &.bg-gray-dark .bootstrap-datetimepicker-widget table
    td
      &.day:hover, &.hour:hover, &.minute:hover, &.second:hover
        background-color: #222629
        color: #fff

    thead tr:first-child th:hover
      background-color: #222629
      color: #fff

  &.bg-gradient-gray-dark .bootstrap-datetimepicker-widget table td.today::before, &.bg-gray-dark .bootstrap-datetimepicker-widget table td.today::before
    border-bottom-color: #fff

  &.bg-gradient-gray-dark .bootstrap-datetimepicker-widget table td.active, &.bg-gray-dark .bootstrap-datetimepicker-widget table td.active
    background-color: #4b545c
    color: #fff

    &:hover
      background-color: #4b545c
      color: #fff

  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)
  margin-bottom: 1rem

  &.bg-dark
    .card-header
      border-color: #383f45

    color: #fff

    .card-body
      color: #fff

  &.maximized-card
    height: 100% !important
    left: 0
    max-height: 100% !important
    max-width: 100% !important
    position: fixed
    top: 0
    width: 100% !important
    z-index: 1040

    &.was-collapsed .card-body
      display: block !important

    .card-body
      overflow: auto

    [data-widget=collapse]
      display: none

    .card-footer, .card-header
      border-radius: 0 !important

  &.collapsed-card
    .card-body, .card-footer
      display: none

  .nav.flex-column > li
    border-bottom: 1px solid rgba(0, 0, 0, 0.125)
    margin: 0

    &:last-of-type
      border-bottom: 0

  &.height-control .card-body
    max-height: 300px
    overflow: auto

  .border-right
    border-right: 1px solid rgba(0, 0, 0, 0.125)

  .border-left
    border-left: 1px solid rgba(0, 0, 0, 0.125)

  &.card-tabs
    &:not(.card-outline) > .card-header
      border-bottom: 0

      .nav-item:first-child .nav-link
        border-left-color: transparent

    &.card-outline .nav-item
      border-bottom: 0

      &:first-child .nav-link
        border-left: 0
        margin-left: 0

    .card-tools
      margin: .3rem .5rem

    &:not(.expanding-card).collapsed-card .card-header
      border-bottom: 0

      .nav-tabs
        border-bottom: 0

        .nav-item
          margin-bottom: 0

    &.expanding-card .card-header .nav-tabs .nav-item
      margin-bottom: -1px

  &.card-outline-tabs
    border-top: 0

    .card-header
      .nav-item:first-child .nav-link
        border-left: 0
        margin-left: 0

      a
        border-top: 3px solid transparent

        &:hover
          border-top: 3px solid #dee2e6

        &.active:hover
          margin-top: 0

    .card-tools
      margin: .5rem .5rem .3rem

    &:not(.expanding-card).collapsed-card .card-header
      border-bottom: 0

      .nav-tabs
        border-bottom: 0

        .nav-item
          margin-bottom: 0

    &.expanding-card .card-header .nav-tabs .nav-item
      margin-bottom: -1px

html.maximized-card
  overflow: hidden

.card-body::after, .card-footer::after
  display: block
  clear: both
  content: ""

.card-header
  &::after
    display: block
    clear: both
    content: ""

  background-color: transparent
  border-bottom: 1px solid rgba(0, 0, 0, 0.125)
  padding: .75rem 1.25rem
  position: relative
  border-top-left-radius: .25rem
  border-top-right-radius: .25rem

.collapsed-card .card-header
  border-bottom: 0

.card-header > .card-tools
  float: right
  margin-right: -.625rem

  .input-group, .nav, .pagination
    margin-bottom: -.3rem
    margin-top: -.3rem

  [data-toggle=tooltip]
    position: relative

.card-title
  float: left
  font-size: 1.1rem
  font-weight: 400
  margin: 0

.card-text
  clear: both

.btn-tool
  background-color: transparent
  color: #adb5bd
  font-size: .875rem
  margin: -.75rem 0
  padding: .25rem .5rem

.btn-group.show .btn-tool
  color: #495057

.btn-tool
  &:hover
    color: #495057

  &:focus
    box-shadow: none !important

.show .btn-tool
  box-shadow: none !important

.text-sm
  .card-title
    font-size: 1rem

  .nav-link
    padding: .4rem .8rem

.card-body
  > .table
    margin-bottom: 0

    > thead > tr >
      td, th
        border-top-width: 0

  .fc
    margin-top: 5px

  .full-width-chart
    margin: -19px

  &.p-0 .full-width-chart
    margin: -9px

.chart-legend
  padding-left: 0
  list-style: none
  margin: 10px 0

@media (max-width: 576px)
  .chart-legend > li
    float: left
    margin-right: 10px

.card-comments
  background-color: #f8f9fa

  .card-comment
    border-bottom: 1px solid #e9ecef
    padding: 8px 0

    &::after
      display: block
      clear: both
      content: ""

    &:last-of-type
      border-bottom: 0

    &:first-of-type
      padding-top: 0

    img
      height: 1.875rem
      width: 1.875rem
      float: left

  .comment-text
    color: #78838e
    margin-left: 40px

  .username
    color: #495057
    display: block
    font-weight: 600

  .text-muted
    font-size: 12px
    font-weight: 400

.todo-list
  list-style: none
  margin: 0
  overflow: auto
  padding: 0

  > li
    border-radius: 2px
    background-color: #f8f9fa
    border-left: 2px solid #e9ecef
    color: #495057
    margin-bottom: 2px
    padding: 10px

    &:last-of-type
      margin-bottom: 0

    > input[type=checkbox]
      margin: 0 10px 0 5px

    .text
      display: inline-block
      font-weight: 600
      margin-left: 5px

    .badge
      font-size: .7rem
      margin-left: 10px

    .tools
      color: #dc3545
      display: none
      float: right

      >
        .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
          cursor: pointer
          margin-right: 5px

    &:hover .tools
      display: inline-block

    &.done
      color: #697582

      .text
        font-weight: 500
        text-decoration: line-through

      .badge
        background-color: #adb5bd !important

  .primary
    border-left-color: #007bff

  .secondary
    border-left-color: #6c757d

  .success
    border-left-color: #28a745

  .info
    border-left-color: #17a2b8

  .warning
    border-left-color: #ffc107

  .danger
    border-left-color: #dc3545

  .light
    border-left-color: #f8f9fa

  .dark
    border-left-color: #343a40

  .lightblue
    border-left-color: #3c8dbc

  .navy
    border-left-color: #001f3f

  .olive
    border-left-color: #3d9970

  .lime
    border-left-color: #01ff70

  .fuchsia
    border-left-color: #f012be

  .maroon
    border-left-color: #d81b60

  .blue
    border-left-color: #007bff

  .indigo
    border-left-color: #6610f2

  .purple
    border-left-color: #6f42c1

  .pink
    border-left-color: #e83e8c

  .red
    border-left-color: #dc3545

  .orange
    border-left-color: #fd7e14

  .yellow
    border-left-color: #ffc107

  .green
    border-left-color: #28a745

  .teal
    border-left-color: #20c997

  .cyan
    border-left-color: #17a2b8

  .white
    border-left-color: #fff

  .gray
    border-left-color: #6c757d

  .gray-dark
    border-left-color: #343a40

  .handle
    cursor: move
    display: inline-block
    margin: 0 5px

.card-input
  max-width: 200px

.card-default .nav-item:first-child .nav-link
  border-left: 0

.dark-mode
  .card
    background-color: #343a40
    color: #fff

    .card
      background-color: #3f474e
      color: #fff

    .nav.flex-column > li
      border-bottom-color: #6c757d

    .card-footer
      background-color: rgba(0, 0, 0, 0.1)

    &.card-outline-tabs .card-header a:hover
      border-color: #6c757d

    &:not(.card-outline) > .card-header a.active
      color: #fff

  .card-comments
    background-color: #373d44

    .username
      color: #ced4da

    .card-comment
      border-bottom-color: #454d55

  .todo-list > li
    background-color: #3f474e
    border-color: #454d55
    color: #fff

.modal-dialog .overlay
  background-color: #000
  display: block
  height: 100%
  left: 0
  opacity: .7
  position: absolute
  top: 0
  width: 100%
  z-index: 1052

.modal-content
  &.bg-warning
    .modal-footer, .modal-header
      border-color: #343a40

  &.bg-danger
    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

  &.bg-info
    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

  &.bg-primary
    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

  &.bg-secondary
    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

  &.bg-success
    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

.dark-mode
  .modal-footer, .modal-header
    border-color: #6c757d

  .modal-content
    background-color: #343a40

    &.bg-warning
      .modal-footer, .modal-header
        border-color: #6c757d

      .close, .mailbox-attachment-close
        color: #343a40 !important
        text-shadow: 0 1px 0 #495057 !important

    &.bg-danger
      .modal-footer, .modal-header
        border-color: #fff

    &.bg-info
      .modal-footer, .modal-header
        border-color: #fff

    &.bg-primary
      .modal-footer, .modal-header
        border-color: #fff

    &.bg-secondary
      .modal-footer, .modal-header
        border-color: #fff

    &.bg-success
      .modal-footer, .modal-header
        border-color: #fff

.toasts-top-right
  position: absolute
  right: 0
  top: 0
  z-index: 1040

  &.fixed
    position: fixed

.toasts-top-left
  left: 0
  position: absolute
  top: 0
  z-index: 1040

  &.fixed
    position: fixed

.toasts-bottom-right
  bottom: 0
  position: absolute
  right: 0
  z-index: 1040

  &.fixed
    position: fixed

.toasts-bottom-left
  bottom: 0
  left: 0
  position: absolute
  z-index: 1040

  &.fixed
    position: fixed

.dark-mode .toast
  background-color: rgba(52, 58, 64, 0.85)
  color: #fff

  .toast-header
    background-color: rgba(52, 58, 64, 0.7)
    color: #f8f9fa

.toast
  &.bg-primary
    background-color: rgba(0, 123, 255, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(0, 123, 255, 0.85)
      color: #fff

  &.bg-secondary
    background-color: rgba(108, 117, 125, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(108, 117, 125, 0.85)
      color: #fff

  &.bg-success
    background-color: rgba(40, 167, 69, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(40, 167, 69, 0.85)
      color: #fff

  &.bg-info
    background-color: rgba(23, 162, 184, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(23, 162, 184, 0.85)
      color: #fff

  &.bg-warning
    background-color: rgba(255, 193, 7, 0.9) !important

    .toast-header
      background-color: rgba(255, 193, 7, 0.85)
      color: #1f2d3d

  &.bg-danger
    background-color: rgba(220, 53, 69, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(220, 53, 69, 0.85)
      color: #fff

  &.bg-light
    background-color: rgba(248, 249, 250, 0.9) !important

    .toast-header
      background-color: rgba(248, 249, 250, 0.85)
      color: #1f2d3d

  &.bg-dark
    background-color: rgba(52, 58, 64, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(52, 58, 64, 0.85)
      color: #fff

  &.bg-lightblue
    background-color: rgba(60, 141, 188, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(60, 141, 188, 0.85)
      color: #fff

  &.bg-navy
    background-color: rgba(0, 31, 63, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(0, 31, 63, 0.85)
      color: #fff

  &.bg-olive
    background-color: rgba(61, 153, 112, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(61, 153, 112, 0.85)
      color: #fff

  &.bg-lime
    background-color: rgba(1, 255, 112, 0.9) !important

    .toast-header
      background-color: rgba(1, 255, 112, 0.85)
      color: #1f2d3d

  &.bg-fuchsia
    background-color: rgba(240, 18, 190, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(240, 18, 190, 0.85)
      color: #fff

  &.bg-maroon
    background-color: rgba(216, 27, 96, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(216, 27, 96, 0.85)
      color: #fff

  &.bg-blue
    background-color: rgba(0, 123, 255, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(0, 123, 255, 0.85)
      color: #fff

  &.bg-indigo
    background-color: rgba(102, 16, 242, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(102, 16, 242, 0.85)
      color: #fff

  &.bg-purple
    background-color: rgba(111, 66, 193, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(111, 66, 193, 0.85)
      color: #fff

  &.bg-pink
    background-color: rgba(232, 62, 140, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(232, 62, 140, 0.85)
      color: #fff

  &.bg-red
    background-color: rgba(220, 53, 69, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(220, 53, 69, 0.85)
      color: #fff

  &.bg-orange
    background-color: rgba(253, 126, 20, 0.9) !important

    .toast-header
      background-color: rgba(253, 126, 20, 0.85)
      color: #1f2d3d

  &.bg-yellow
    background-color: rgba(255, 193, 7, 0.9) !important

    .toast-header
      background-color: rgba(255, 193, 7, 0.85)
      color: #1f2d3d

  &.bg-green
    background-color: rgba(40, 167, 69, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(40, 167, 69, 0.85)
      color: #fff

  &.bg-teal
    background-color: rgba(32, 201, 151, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(32, 201, 151, 0.85)
      color: #fff

  &.bg-cyan
    background-color: rgba(23, 162, 184, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(23, 162, 184, 0.85)
      color: #fff

  &.bg-white
    background-color: rgba(255, 255, 255, 0.9) !important

    .toast-header
      background-color: rgba(255, 255, 255, 0.85)
      color: #1f2d3d

  &.bg-gray
    background-color: rgba(108, 117, 125, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(108, 117, 125, 0.85)
      color: #fff

  &.bg-gray-dark
    background-color: rgba(52, 58, 64, 0.9) !important

    .close, .mailbox-attachment-close
      color: #fff
      text-shadow: 0 1px 0 #000

    .toast-header
      background-color: rgba(52, 58, 64, 0.85)
      color: #fff

.btn
  &.disabled, &:disabled
    cursor: not-allowed

  &.btn-flat
    border-radius: 0
    border-width: 1px
    box-shadow: none

  &.btn-file
    overflow: hidden
    position: relative

    > input[type=file]
      background-color: #fff
      cursor: inherit
      display: block
      font-size: 100px
      min-height: 100%
      min-width: 100%
      opacity: 0
      outline: 0
      position: absolute
      right: 0
      text-align: right
      top: 0

.text-sm .btn
  font-size: 0.875rem !important

.btn-default
  background-color: #f8f9fa
  border-color: #ddd
  color: #444

  &.hover, &:active, &:hover
    background-color: #e9ecef
    color: #2b2b2b

.btn-app
  border-radius: 3px
  background-color: #f8f9fa
  border: 1px solid #ddd
  color: #6c757d
  font-size: 12px
  height: 60px
  margin: 0 0 10px 10px
  min-width: 80px
  padding: 15px 5px
  position: relative
  text-align: center

  >
    .fa, .fab, .fad, .fal, .far, .fas, .ion
      display: block
      font-size: 20px

    .svg-inline--fa
      display: block
      font-size: 20px
      margin: 0 auto

  &:hover
    background-color: #f8f9fa
    border-color: #aaa
    color: #444

  &:active, &:focus
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125)

  > .badge
    font-size: 10px
    font-weight: 400
    position: absolute
    right: -10px
    top: -3px

.btn-xs
  padding: .125rem .25rem
  font-size: .75rem
  line-height: 1.5
  border-radius: .15rem

.dark-mode
  .btn-app, .btn-default
    background-color: #3a4047
    color: #fff
    border-color: #6c757d

  .btn-app
    &:focus, &:hover
      background-color: #3f474e
      color: #dee2e6
      border-color: #727b84

  .btn-default
    &:focus, &:hover
      background-color: #3f474e
      color: #dee2e6
      border-color: #727b84

  .btn-light
    background-color: #454d55
    color: #fff
    border-color: #6c757d

    &:focus, &:hover
      background-color: #4b545c
      color: #dee2e6
      border-color: #78828a

.callout
  border-radius: .25rem
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)
  background-color: #fff
  border-left: 5px solid #e9ecef
  margin-bottom: 1rem
  padding: 1rem

  a
    color: #495057
    text-decoration: underline

    &:hover
      color: #e9ecef

  p:last-child
    margin-bottom: 0

  &.callout-danger
    border-left-color: #bd2130

  &.callout-warning
    border-left-color: #d39e00

  &.callout-info
    border-left-color: #117a8b

  &.callout-success
    border-left-color: #1e7e34

.dark-mode .callout
  background-color: #3f474e

.alert
  .icon
    margin-right: 10px

  .close, .mailbox-attachment-close
    color: #000
    opacity: .2

  .close:hover, .mailbox-attachment-close:hover
    opacity: .5

  a
    color: #fff
    text-decoration: underline

.alert-primary
  color: #fff
  background-color: #007bff
  border-color: #006fe6

.alert-default-primary
  color: #004085
  background-color: #cce5ff
  border-color: #b8daff

  hr
    border-top-color: #9fcdff

  .alert-link
    color: #002752

.alert-secondary
  color: #fff
  background-color: #6c757d
  border-color: #60686f

.alert-default-secondary
  color: #383d41
  background-color: #e2e3e5
  border-color: #d6d8db

  hr
    border-top-color: #c8cbcf

  .alert-link
    color: #202326

.alert-success
  color: #fff
  background-color: #28a745
  border-color: #23923d

.alert-default-success
  color: #155724
  background-color: #d4edda
  border-color: #c3e6cb

  hr
    border-top-color: #b1dfbb

  .alert-link
    color: #0b2e13

.alert-info
  color: #fff
  background-color: #17a2b8
  border-color: #148ea1

.alert-default-info
  color: #0c5460
  background-color: #d1ecf1
  border-color: #bee5eb

  hr
    border-top-color: #abdde5

  .alert-link
    color: #062c33

.alert-warning
  color: #1f2d3d
  background-color: #ffc107
  border-color: #edb100

.alert-default-warning
  color: #856404
  background-color: #fff3cd
  border-color: #ffeeba

  hr
    border-top-color: #ffe8a1

  .alert-link
    color: #533f03

.alert-danger
  color: #fff
  background-color: #dc3545
  border-color: #d32535

.alert-default-danger
  color: #721c24
  background-color: #f8d7da
  border-color: #f5c6cb

  hr
    border-top-color: #f1b0b7

  .alert-link
    color: #491217

.alert-light
  color: #1f2d3d
  background-color: #f8f9fa
  border-color: #e9ecef

.alert-default-light
  color: #818182
  background-color: #fefefe
  border-color: #fdfdfe

  hr
    border-top-color: #ececf6

  .alert-link
    color: #686868

.alert-dark
  color: #fff
  background-color: #343a40
  border-color: #292d32

.alert-default-dark
  color: #1b1e21
  background-color: #d6d8d9
  border-color: #c6c8ca

  hr
    border-top-color: #b9bbbe

  .alert-link
    color: #040505

.table
  &:not(.table-dark)
    color: inherit

  &.table-head-fixed
    thead tr:nth-child(1) th
      background-color: #fff
      border-bottom: 0
      box-shadow: inset 0 1px 0 #dee2e6,inset 0 -1px 0 #dee2e6
      position: -webkit-sticky
      position: sticky
      top: 0
      z-index: 10

    &.table-dark thead tr:nth-child(1) th
      background-color: #212529
      box-shadow: inset 0 1px 0 #383f45,inset 0 -1px 0 #383f45

  &.no-border
    border: 0

    td, th
      border: 0

  &.text-center
    text-align: center

    td, th
      text-align: center

  &.table-valign-middle
    tbody > tr >
      td, th
        vertical-align: middle

    thead > tr >
      td, th
        vertical-align: middle

.card-body.p-0 .table
  tbody > tr >
    td:first-of-type, th:first-of-type
      padding-left: 1.5rem

  tfoot > tr >
    td:first-of-type, th:first-of-type
      padding-left: 1.5rem

  thead > tr >
    td:first-of-type, th:first-of-type
      padding-left: 1.5rem

  tbody > tr >
    td:last-of-type, th:last-of-type
      padding-right: 1.5rem

  tfoot > tr >
    td:last-of-type, th:last-of-type
      padding-right: 1.5rem

  thead > tr >
    td:last-of-type, th:last-of-type
      padding-right: 1.5rem

.table-hover tbody tr.expandable-body:hover
  background-color: inherit !important

[data-widget=expandable-table]
  cursor: pointer

  i
    transition: transform .3s linear

  &[aria-expanded=true] td > i
    &[class*=right]
      transform: rotate(90deg)

    &[class*=left]
      transform: rotate(-90deg)

.expandable-body
  > td
    padding: 0 !important
    width: 100%

    >
      div, p
        padding: .75rem

  .table
    width: calc(100% - .75rem)
    margin: 0 0 0 .75rem

    tr:first-child
      td, th
        border-top: none

.dark-mode
  .table-bordered
    border-color: #6c757d

    td, th
      border-color: #6c757d

  .table-hover tbody tr:hover
    color: #dee2e6
    background-color: #3a4047
    border-color: #6c757d

  .table
    thead th
      border-bottom-color: #6c757d

    td, th
      border-top-color: #6c757d

    &.table-head-fixed thead tr:nth-child(1) th
      background-color: #3f474e

.carousel-control-prev .carousel-control-custom-icon
  margin-left: -20px

.carousel-control-next .carousel-control-custom-icon
  margin-right: 20px

.carousel-control-custom-icon >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    display: inline-block
    font-size: 40px
    margin-top: -20px
    position: absolute
    top: 50%
    z-index: 5

.close, .mailbox-attachment-close
  float: right
  font-size: 1.5rem
  font-weight: 700
  line-height: 1
  color: #000
  text-shadow: 0 1px 0 #fff
  opacity: .5

.close:hover, .mailbox-attachment-close:hover
  color: #000
  text-decoration: none

.close:not(:disabled):not(.disabled)
  &:focus, &:hover
    opacity: .75

.mailbox-attachment-close:not(:disabled):not(.disabled)
  &:focus, &:hover
    opacity: .75

.close:focus, .mailbox-attachment-close:focus
  outline: 0

button
  &.close, &.mailbox-attachment-close
    padding: 0
    background-color: transparent
    border: 0

a
  &.close.disabled, &.disabled.mailbox-attachment-close
    pointer-events: none

.small-box
  border-radius: .25rem
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)
  display: block
  margin-bottom: 20px
  position: relative

  >
    .inner
      padding: 10px

    .small-box-footer
      background-color: rgba(0, 0, 0, 0.1)
      color: rgba(255, 255, 255, 0.8)
      display: block
      padding: 3px 0
      position: relative
      text-align: center
      text-decoration: none
      z-index: 10

      &:hover
        background-color: rgba(0, 0, 0, 0.15)
        color: #fff

  h3
    font-size: 2.2rem
    font-weight: 700
    margin: 0 0 10px
    padding: 0
    white-space: nowrap

  p
    font-size: 1rem

    > small
      color: #f8f9fa
      display: block
      font-size: .9rem
      margin-top: 5px

  h3, p
    z-index: 5

  .icon
    color: rgba(0, 0, 0, 0.15)
    z-index: 0

    > i
      font-size: 90px
      position: absolute
      right: 15px
      top: 15px
      transition: transform .3s linear

      &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion
        font-size: 70px
        top: 20px

    svg
      font-size: 70px
      position: absolute
      right: 15px
      top: 15px
      transition: transform .3s linear

  &:hover
    text-decoration: none

    .icon >
      i
        transform: scale(1.1)

        &.fa, &.fab, &.fad, &.fal, &.far, &.fas, &.ion
          transform: scale(1.1)

      svg
        transform: scale(1.1)

@media (min-width: 992px)
  .col-lg-2 .small-box h3, .col-md-2 .small-box h3, .col-xl-2 .small-box h3, .col-lg-3 .small-box h3, .col-md-3 .small-box h3, .col-xl-3 .small-box h3
    font-size: 1.6rem

@media (min-width: 1200px)
  .col-lg-2 .small-box h3, .col-md-2 .small-box h3, .col-xl-2 .small-box h3, .col-lg-3 .small-box h3, .col-md-3 .small-box h3, .col-xl-3 .small-box h3
    font-size: 2.2rem

@media (max-width: 767.98px)
  .small-box
    text-align: center

    .icon
      display: none

    p
      font-size: 12px

.info-box
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)
  border-radius: .25rem
  background-color: #fff
  display: -ms-flexbox
  display: flex
  margin-bottom: 1rem
  min-height: 80px
  padding: .5rem
  position: relative
  width: 100%

  .progress
    background-color: rgba(0, 0, 0, 0.125)
    height: 2px
    margin: 5px 0

    .progress-bar
      background-color: #fff

  .info-box-icon
    border-radius: .25rem
    -ms-flex-align: center
    align-items: center
    display: -ms-flexbox
    display: flex
    font-size: 1.875rem
    -ms-flex-pack: center
    justify-content: center
    text-align: center
    width: 70px

    > img
      max-width: 100%

  .info-box-content
    display: -ms-flexbox
    display: flex
    -ms-flex-direction: column
    flex-direction: column
    -ms-flex-pack: center
    justify-content: center
    line-height: 1.8
    -ms-flex: 1
    flex: 1
    padding: 0 10px

  .info-box-number
    display: block
    margin-top: .25rem
    font-weight: 700

  .info-box-text, .progress-description
    display: block
    overflow: hidden
    text-overflow: ellipsis
    white-space: nowrap

  .info-box
    .bg-gradient-primary, .bg-primary
      color: #fff

    .bg-gradient-primary .progress-bar, .bg-primary .progress-bar
      background-color: #fff

    .bg-gradient-secondary, .bg-secondary
      color: #fff

    .bg-gradient-secondary .progress-bar, .bg-secondary .progress-bar
      background-color: #fff

    .bg-gradient-success, .bg-success
      color: #fff

    .bg-gradient-success .progress-bar, .bg-success .progress-bar
      background-color: #fff

    .bg-gradient-info, .bg-info
      color: #fff

    .bg-gradient-info .progress-bar, .bg-info .progress-bar
      background-color: #fff

    .bg-gradient-warning, .bg-warning
      color: #1f2d3d

    .bg-gradient-warning .progress-bar, .bg-warning .progress-bar
      background-color: #1f2d3d

    .bg-danger, .bg-gradient-danger
      color: #fff

    .bg-danger .progress-bar, .bg-gradient-danger .progress-bar
      background-color: #fff

    .bg-gradient-light, .bg-light
      color: #1f2d3d

    .bg-gradient-light .progress-bar, .bg-light .progress-bar
      background-color: #1f2d3d

    .bg-dark, .bg-gradient-dark
      color: #fff

    .bg-dark .progress-bar, .bg-gradient-dark .progress-bar
      background-color: #fff

  .info-box-more
    display: block

  .progress-description
    margin: 0

@media (min-width: 768px)
  .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description, .col-xl-2 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description, .col-xl-3 .info-box .progress-description
    display: none

@media (min-width: 992px)
  .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description, .col-xl-2 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description, .col-xl-3 .info-box .progress-description
    font-size: .75rem
    display: block

@media (min-width: 1200px)
  .col-lg-2 .info-box .progress-description, .col-md-2 .info-box .progress-description, .col-xl-2 .info-box .progress-description, .col-lg-3 .info-box .progress-description, .col-md-3 .info-box .progress-description, .col-xl-3 .info-box .progress-description
    font-size: 1rem
    display: block

.dark-mode .info-box
  background-color: #343a40
  color: #fff

.timeline
  margin: 0 0 45px
  padding: 0
  position: relative

  &::before
    border-radius: .25rem
    background-color: #dee2e6
    bottom: 0
    content: ""
    left: 31px
    margin: 0
    position: absolute
    top: 0
    width: 4px

  >
    div
      margin-bottom: 15px
      margin-right: 10px
      position: relative

      &::after, &::before
        content: ""
        display: table

      >
        .timeline-item
          box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)
          border-radius: .25rem
          background-color: #fff
          color: #495057
          margin-left: 60px
          margin-right: 15px
          margin-top: 0
          padding: 0
          position: relative

          >
            .time
              color: #999
              float: right
              font-size: 12px
              padding: 10px

            .timeline-header
              border-bottom: 1px solid rgba(0, 0, 0, 0.125)
              color: #495057
              font-size: 16px
              line-height: 1.1
              margin: 0
              padding: 10px

              > a
                font-weight: 600

            .timeline-body, .timeline-footer
              padding: 10px

            .timeline-body
              > img
                margin: 10px

              ol, ul, > dl
                margin: 0

            .timeline-footer > a
              color: #fff

        .fa, .fab, .fad, .fal, .far, .fas, .ion
          background-color: #adb5bd
          border-radius: 50%
          font-size: 16px
          height: 30px
          left: 18px
          line-height: 30px
          position: absolute
          text-align: center
          top: 0
          width: 30px

        .svg-inline--fa
          background-color: #adb5bd
          border-radius: 50%
          font-size: 16px
          height: 30px
          left: 18px
          line-height: 30px
          position: absolute
          text-align: center
          top: 0
          width: 30px
          padding: 7px

    .time-label > span
      border-radius: 4px
      background-color: #fff
      display: inline-block
      font-weight: 600
      padding: 5px

.timeline-inverse > div > .timeline-item
  box-shadow: none
  background-color: #f8f9fa
  border: 1px solid #dee2e6

  > .timeline-header
    border-bottom-color: #dee2e6

.dark-mode .timeline
  &::before
    background-color: #6c757d

  > div > .timeline-item
    background-color: #343a40
    color: #fff
    border-color: #6c757d

    >
      .timeline-header
        color: #ced4da
        border-color: #6c757d

      .time
        color: #ced4da

.products-list
  list-style: none
  margin: 0
  padding: 0

  > .item
    border-radius: .25rem
    background-color: #fff
    padding: 10px 0

    &::after
      display: block
      clear: both
      content: ""

  .product-img
    float: left

    img
      height: 50px
      width: 50px

  .product-info
    margin-left: 60px

  .product-title
    font-weight: 600

  .product-description
    color: #6c757d
    display: block
    overflow: hidden
    text-overflow: ellipsis
    white-space: nowrap

.product-list-in-card > .item
  border-radius: 0
  border-bottom: 1px solid rgba(0, 0, 0, 0.125)

  &:last-of-type
    border-bottom-width: 0

.dark-mode
  .products-list > .item
    background-color: #343a40
    color: #fff
    border-bottom-color: #6c757d

  .product-description
    color: #ced4da

.direct-chat
  .card-body
    overflow-x: hidden
    padding: 0
    position: relative

  &.chat-pane-open .direct-chat-contacts
    transform: translate(0, 0)

  &.timestamp-light .direct-chat-timestamp
    color: #30465f

  &.timestamp-dark .direct-chat-timestamp
    color: #ccc

.direct-chat-messages
  transform: translate(0, 0)
  height: 250px
  overflow: auto
  padding: 10px

.direct-chat-msg, .direct-chat-text
  display: block

.direct-chat-msg
  margin-bottom: 10px

  &::after
    display: block
    clear: both
    content: ""

.direct-chat-contacts, .direct-chat-messages
  transition: transform .5s ease-in-out

.direct-chat-text
  border-radius: .3rem
  background-color: #d2d6de
  border: 1px solid #d2d6de
  color: #444
  margin: 5px 0 0 50px
  padding: 5px 10px
  position: relative

  &::after, &::before
    border: solid transparent
    border-right-color: #d2d6de
    content: " "
    height: 0
    pointer-events: none
    position: absolute
    right: 100%
    top: 15px
    width: 0

  &::after
    border-width: 5px
    margin-top: -5px

  &::before
    border-width: 6px
    margin-top: -6px

.right .direct-chat-text
  margin-left: 0
  margin-right: 50px

  &::after, &::before
    border-left-color: #d2d6de
    border-right-color: transparent
    left: 100%
    right: auto

.direct-chat-img
  border-radius: 50%
  float: left
  height: 40px
  width: 40px

.right .direct-chat-img
  float: right

.direct-chat-infos
  display: block
  font-size: .875rem
  margin-bottom: 2px

.direct-chat-name
  font-weight: 600

.direct-chat-timestamp
  color: #697582

.direct-chat-contacts-open .direct-chat-contacts
  transform: translate(0, 0)

.direct-chat-contacts
  transform: translate(101%, 0)
  background-color: #343a40
  bottom: 0
  color: #fff
  height: 250px
  overflow: auto
  position: absolute
  top: 0
  width: 100%

.direct-chat-contacts-light
  background-color: #f8f9fa

  .contacts-list-name
    color: #495057

  .contacts-list-date
    color: #6c757d

  .contacts-list-msg
    color: #545b62

.contacts-list
  padding-left: 0
  list-style: none

  > li
    border-bottom: 1px solid rgba(0, 0, 0, 0.2)
    margin: 0
    padding: 10px

    &::after
      display: block
      clear: both
      content: ""

    &:last-of-type
      border-bottom: 0

.contacts-list-img
  border-radius: 50%
  float: left
  width: 40px

.contacts-list-info
  color: #fff
  margin-left: 45px

.contacts-list-name, .contacts-list-status
  display: block

.contacts-list-name
  font-weight: 600

.contacts-list-status
  font-size: .875rem

.contacts-list-date
  color: #ced4da
  font-weight: 400

.contacts-list-msg
  color: #b1bbc4

.direct-chat-primary .right > .direct-chat-text
  background-color: #007bff
  border-color: #007bff
  color: #fff

  &::after, &::before
    border-left-color: #007bff

.direct-chat-secondary .right > .direct-chat-text
  background-color: #6c757d
  border-color: #6c757d
  color: #fff

  &::after, &::before
    border-left-color: #6c757d

.direct-chat-success .right > .direct-chat-text
  background-color: #28a745
  border-color: #28a745
  color: #fff

  &::after, &::before
    border-left-color: #28a745

.direct-chat-info .right > .direct-chat-text
  background-color: #17a2b8
  border-color: #17a2b8
  color: #fff

  &::after, &::before
    border-left-color: #17a2b8

.direct-chat-warning .right > .direct-chat-text
  background-color: #ffc107
  border-color: #ffc107
  color: #1f2d3d

  &::after, &::before
    border-left-color: #ffc107

.direct-chat-danger .right > .direct-chat-text
  background-color: #dc3545
  border-color: #dc3545
  color: #fff

  &::after, &::before
    border-left-color: #dc3545

.direct-chat-light .right > .direct-chat-text
  background-color: #f8f9fa
  border-color: #f8f9fa
  color: #1f2d3d

  &::after, &::before
    border-left-color: #f8f9fa

.direct-chat-dark .right > .direct-chat-text
  background-color: #343a40
  border-color: #343a40
  color: #fff

  &::after, &::before
    border-left-color: #343a40

.direct-chat-lightblue .right > .direct-chat-text
  background-color: #3c8dbc
  border-color: #3c8dbc
  color: #fff

  &::after, &::before
    border-left-color: #3c8dbc

.direct-chat-navy .right > .direct-chat-text
  background-color: #001f3f
  border-color: #001f3f
  color: #fff

  &::after, &::before
    border-left-color: #001f3f

.direct-chat-olive .right > .direct-chat-text
  background-color: #3d9970
  border-color: #3d9970
  color: #fff

  &::after, &::before
    border-left-color: #3d9970

.direct-chat-lime .right > .direct-chat-text
  background-color: #01ff70
  border-color: #01ff70
  color: #1f2d3d

  &::after, &::before
    border-left-color: #01ff70

.direct-chat-fuchsia .right > .direct-chat-text
  background-color: #f012be
  border-color: #f012be
  color: #fff

  &::after, &::before
    border-left-color: #f012be

.direct-chat-maroon .right > .direct-chat-text
  background-color: #d81b60
  border-color: #d81b60
  color: #fff

  &::after, &::before
    border-left-color: #d81b60

.direct-chat-blue .right > .direct-chat-text
  background-color: #007bff
  border-color: #007bff
  color: #fff

  &::after, &::before
    border-left-color: #007bff

.direct-chat-indigo .right > .direct-chat-text
  background-color: #6610f2
  border-color: #6610f2
  color: #fff

  &::after, &::before
    border-left-color: #6610f2

.direct-chat-purple .right > .direct-chat-text
  background-color: #6f42c1
  border-color: #6f42c1
  color: #fff

  &::after, &::before
    border-left-color: #6f42c1

.direct-chat-pink .right > .direct-chat-text
  background-color: #e83e8c
  border-color: #e83e8c
  color: #fff

  &::after, &::before
    border-left-color: #e83e8c

.direct-chat-red .right > .direct-chat-text
  background-color: #dc3545
  border-color: #dc3545
  color: #fff

  &::after, &::before
    border-left-color: #dc3545

.direct-chat-orange .right > .direct-chat-text
  background-color: #fd7e14
  border-color: #fd7e14
  color: #1f2d3d

  &::after, &::before
    border-left-color: #fd7e14

.direct-chat-yellow .right > .direct-chat-text
  background-color: #ffc107
  border-color: #ffc107
  color: #1f2d3d

  &::after, &::before
    border-left-color: #ffc107

.direct-chat-green .right > .direct-chat-text
  background-color: #28a745
  border-color: #28a745
  color: #fff

  &::after, &::before
    border-left-color: #28a745

.direct-chat-teal .right > .direct-chat-text
  background-color: #20c997
  border-color: #20c997
  color: #fff

  &::after, &::before
    border-left-color: #20c997

.direct-chat-cyan .right > .direct-chat-text
  background-color: #17a2b8
  border-color: #17a2b8
  color: #fff

  &::after, &::before
    border-left-color: #17a2b8

.direct-chat-white .right > .direct-chat-text
  background-color: #fff
  border-color: #fff
  color: #1f2d3d

  &::after, &::before
    border-left-color: #fff

.direct-chat-gray .right > .direct-chat-text
  background-color: #6c757d
  border-color: #6c757d
  color: #fff

  &::after, &::before
    border-left-color: #6c757d

.direct-chat-gray-dark .right > .direct-chat-text
  background-color: #343a40
  border-color: #343a40
  color: #fff

  &::after, &::before
    border-left-color: #343a40

.dark-mode
  .direct-chat-text
    background-color: #454d55
    border-color: #4b545c
    color: #fff

    &::after, &::before
      border-right-color: #4b545c

  .direct-chat-timestamp
    color: #adb5bd

  .right > .direct-chat-text
    &::after, &::before
      border-right-color: transparent

.users-list
  padding-left: 0
  list-style: none

  > li
    float: left
    padding: 10px
    text-align: center
    width: 25%

    img
      border-radius: 50%
      height: auto
      max-width: 100%

    > a:hover
      color: #999

      .users-list-name
        color: #999

.users-list-date
  display: block

.users-list-name
  display: block
  color: #495057
  font-size: .875rem
  overflow: hidden
  text-overflow: ellipsis
  white-space: nowrap

.users-list-date
  color: #748290
  font-size: 12px

.dark-mode
  .users-list-name
    color: #ced4da

  .users-list-date
    color: #adb5bd

.card-widget
  border: 0
  position: relative

.widget-user
  .widget-user-header
    border-top-left-radius: .25rem
    border-top-right-radius: .25rem
    height: 135px
    padding: 1rem
    text-align: center

  .widget-user-username
    font-size: 25px
    font-weight: 300
    margin-bottom: 0
    margin-top: 0
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2)

  .widget-user-desc
    margin-top: 0

  .widget-user-image
    left: 50%
    margin-left: -45px
    position: absolute
    top: 80px

    > img
      border: 3px solid #fff
      height: auto
      width: 90px

  .card-footer
    padding-top: 50px

.widget-user-2
  .widget-user-header
    border-top-left-radius: .25rem
    border-top-right-radius: .25rem
    padding: 1rem

  .widget-user-username
    font-size: 25px
    font-weight: 300
    margin-bottom: 5px
    margin-top: 5px

  .widget-user-desc
    margin-top: 0
    margin-left: 75px

  .widget-user-username
    margin-left: 75px

  .widget-user-image > img
    float: left
    height: auto
    width: 65px

.mailbox-messages > .table
  margin: 0

.mailbox-controls
  padding: 5px

  &.with-border
    border-bottom: 1px solid rgba(0, 0, 0, 0.125)

.mailbox-read-info
  border-bottom: 1px solid rgba(0, 0, 0, 0.125)
  padding: 10px

  h3
    font-size: 20px
    margin: 0

  h5
    margin: 0
    padding: 5px 0 0

.mailbox-read-time
  color: #999
  font-size: 13px

.mailbox-read-message
  padding: 10px

.mailbox-attachments
  padding-left: 0
  list-style: none

  li
    border: 1px solid #eee
    float: left
    margin-bottom: 10px
    margin-right: 10px
    width: 200px

.mailbox-attachment-name
  color: #666
  font-weight: 700

.mailbox-attachment-icon, .mailbox-attachment-info, .mailbox-attachment-size
  display: block

.mailbox-attachment-info
  background-color: #f8f9fa
  padding: 10px

.mailbox-attachment-size
  color: #999
  font-size: 12px

  > span
    display: inline-block
    padding-top: .75rem

.mailbox-attachment-icon
  color: #666
  font-size: 65px
  max-height: 132.5px
  padding: 20px 10px
  text-align: center

  &.has-img
    padding: 0

    > img
      height: auto
      max-width: 100%

.lockscreen
  background-color: #e9ecef

  .lockscreen-name
    font-weight: 600
    text-align: center

.lockscreen-logo
  font-size: 35px
  font-weight: 300
  margin-bottom: 25px
  text-align: center

  a
    color: #495057

.lockscreen-wrapper
  margin: 0 auto
  margin-top: 10%
  max-width: 400px

.lockscreen-item
  border-radius: 4px
  background-color: #fff
  margin: 10px auto 30px
  padding: 0
  position: relative
  width: 290px

.lockscreen-image
  border-radius: 50%
  background-color: #fff
  left: -10px
  padding: 5px
  position: absolute
  top: -25px
  z-index: 10

  > img
    border-radius: 50%
    height: 70px
    width: 70px

.lockscreen-credentials
  margin-left: 70px

  .form-control
    border: 0

  .btn
    background-color: #fff
    border: 0
    padding: 0 10px

.lockscreen-footer
  margin-top: 10px

.dark-mode
  .lockscreen-item
    background-color: #343a40

  .lockscreen-logo a
    color: #fff

  .lockscreen-credentials .btn
    background-color: #343a40

  .lockscreen-image
    background-color: #6c757d

.login-logo, .register-logo
  font-size: 2.1rem
  font-weight: 300
  margin-bottom: .9rem
  text-align: center

.login-logo a, .register-logo a
  color: #495057

.login-page, .register-page
  -ms-flex-align: center
  align-items: center
  background-color: #e9ecef
  display: -ms-flexbox
  display: flex
  -ms-flex-direction: column
  flex-direction: column
  height: 100vh
  -ms-flex-pack: center
  justify-content: center

.login-box, .register-box
  width: 360px

@media (max-width: 576px)
  .login-box, .register-box
    margin-top: .5rem
    width: 90%

.login-box .card, .register-box .card
  margin-bottom: 0

.login-card-body, .register-card-body
  background-color: #fff
  border-top: 0
  color: #666
  padding: 20px

.login-card-body .input-group .form-control, .register-card-body .input-group .form-control
  border-right: 0

.login-card-body .input-group .form-control:focus, .register-card-body .input-group .form-control:focus
  box-shadow: none

.login-card-body .input-group .form-control:focus ~
  .input-group-append .input-group-text, .input-group-prepend .input-group-text
    border-color: #80bdff

.register-card-body .input-group .form-control:focus ~
  .input-group-append .input-group-text, .input-group-prepend .input-group-text
    border-color: #80bdff

.login-card-body .input-group .form-control.is-valid:focus, .register-card-body .input-group .form-control.is-valid:focus
  box-shadow: none

.login-card-body .input-group .form-control.is-valid ~
  .input-group-append .input-group-text, .input-group-prepend .input-group-text
    border-color: #28a745

.register-card-body .input-group .form-control.is-valid ~
  .input-group-append .input-group-text, .input-group-prepend .input-group-text
    border-color: #28a745

.login-card-body .input-group .form-control.is-invalid:focus, .register-card-body .input-group .form-control.is-invalid:focus
  box-shadow: none

.login-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text, .register-card-body .input-group .form-control.is-invalid ~ .input-group-append .input-group-text
  border-color: #dc3545

.login-card-body .input-group .input-group-text, .register-card-body .input-group .input-group-text
  background-color: transparent
  border-bottom-right-radius: .25rem
  border-left: 0
  border-top-right-radius: .25rem
  color: #777
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out

.login-box-msg, .register-box-msg
  margin: 0
  padding: 0 20px 20px
  text-align: center

.social-auth-links
  margin: 10px 0

.dark-mode
  .login-card-body, .register-card-body
    background-color: #343a40
    border-color: #6c757d
    color: #fff

  .login-logo a, .register-logo a
    color: #fff

.error-page
  margin: 20px auto 0
  width: 600px

  >
    .headline
      float: left
      font-size: 100px
      font-weight: 300

    .error-content
      display: block
      margin-left: 190px

      > h3
        font-size: 25px
        font-weight: 300

@media (max-width: 767.98px)
  .error-page
    width: 100%

@media (max-width: 767.98px)
  .error-page > .headline
    float: none
    text-align: center

@media (max-width: 767.98px)
  .error-page > .error-content
    margin-left: 0

@media (max-width: 767.98px)
  .error-page > .error-content > h3
    text-align: center

.invoice
  background-color: #fff
  border: 1px solid rgba(0, 0, 0, 0.125)
  position: relative

.invoice-title
  margin-top: 0

.dark-mode .invoice
  background-color: #343a40

.profile-user-img
  border: 3px solid #adb5bd
  margin: 0 auto
  padding: 3px
  width: 100px

.profile-username
  font-size: 21px
  margin-top: 5px

.post
  border-bottom: 1px solid #adb5bd
  color: #666
  margin-bottom: 15px
  padding-bottom: 15px

  &:last-of-type
    border-bottom: 0
    margin-bottom: 0
    padding-bottom: 0

  .user-block
    margin-bottom: 15px
    width: 100%

  .row
    width: 100%

.dark-mode .post
  color: #fff
  border-color: #6c757d

.product-image
  max-width: 100%
  height: auto
  width: 100%

.product-image-thumbs
  -ms-flex-align: stretch
  align-items: stretch
  display: -ms-flexbox
  display: flex
  margin-top: 2rem

.product-image-thumb
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075)
  border-radius: .25rem
  background-color: #fff
  border: 1px solid #dee2e6
  display: -ms-flexbox
  display: flex
  margin-right: 1rem
  max-width: 7rem
  padding: .5rem

  img
    max-width: 100%
    height: auto
    -ms-flex-item-align: center
    align-self: center

  &:hover
    opacity: .5

.product-share a
  margin-right: .5rem

.projects
  td
    vertical-align: middle

  .list-inline
    margin-bottom: 0

  .table-avatar img, img.table-avatar
    border-radius: 50%
    display: inline
    width: 2.5rem

  .project-state
    text-align: center

body
  &.iframe-mode
    .main-sidebar
      display: none

    .content-wrapper
      margin-left: 0 !important
      margin-top: 0 !important
      padding-bottom: 0 !important

    .main-footer, .main-header
      display: none

  &.iframe-mode-fullscreen
    overflow: hidden

.content-wrapper
  height: 100%

  &.iframe-mode
    .navbar-nav
      overflow-y: auto
      width: 100%

      .nav-link
        white-space: nowrap

    .tab-content
      position: relative

    .tab-empty
      width: 100%
      display: -ms-flexbox
      display: flex
      -ms-flex-pack: center
      justify-content: center
      -ms-flex-align: center
      align-items: center

    .tab-loading
      position: absolute
      top: 0
      left: 0
      width: 100%
      display: none
      background-color: #f4f6f9

      > div
        display: -ms-flexbox
        display: flex
        -ms-flex-pack: center
        justify-content: center
        -ms-flex-align: center
        align-items: center
        width: 100%
        height: 100%

    iframe
      border: 0
      width: 100%
      height: 100%

      .content-wrapper
        padding-bottom: 0 !important

body.iframe-mode-fullscreen .content-wrapper.iframe-mode
  position: absolute
  left: 0
  top: 0
  right: 0
  bottom: 0
  margin-left: 0 !important
  height: 100%
  min-height: 100%
  z-index: 1048

.content-wrapper.kanban
  height: 1px

  .content
    height: 100%
    overflow-x: auto
    overflow-y: hidden

    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl
      width: -webkit-max-content
      width: -moz-max-content
      width: max-content
      display: -ms-flexbox
      display: flex
      -ms-flex-align: stretch
      align-items: stretch

  .content-header + .content
    height: calc(100% - ((2 * 15px) + (1.8rem * 1.2)))

  .card
    .card-body
      padding: .5rem

    &.card-row
      width: 340px
      display: inline-block
      margin: 0 .5rem

      &:first-child
        margin-left: 0

      .card-body
        height: 100%
        overflow-y: auto

      .card
        .card-header
          padding: .5rem .75rem

        .card-body
          padding: .75rem

  .btn-tool.btn-link
    text-decoration: underline
    padding-left: 0
    padding-right: 0

.fc-button
  background: #f8f9fa
  background-image: none
  border-bottom-color: #ddd
  border-color: #ddd
  color: #495057

  &.hover, &:active, &:hover
    background-color: #e9e9e9

.fc-header-title h2
  color: #666
  font-size: 15px
  line-height: 1.6em
  margin-left: 10px

.fc-header-right
  padding-right: 10px

.fc-header-left
  padding-left: 10px

.fc-widget-header
  background: #fafafa

.fc-grid
  border: 0
  width: 100%

.fc-widget-content:first-of-type, .fc-widget-header:first-of-type
  border-left: 0
  border-right: 0

.fc-widget-content:last-of-type, .fc-widget-header:last-of-type
  border-right: 0

.fc-toolbar
  margin: 0
  padding: 1rem

  &.fc-header-toolbar
    margin: 0
    padding: 1rem

@media (max-width: 575.98px)
  .fc-toolbar
    -ms-flex-direction: column
    flex-direction: column

    .fc-left
      -ms-flex-order: 1
      order: 1
      margin-bottom: .5rem

    .fc-center
      -ms-flex-order: 0
      order: 0
      margin-bottom: .375rem

    .fc-right
      -ms-flex-order: 2
      order: 2

.fc-day-number
  font-size: 20px
  font-weight: 300
  padding-right: 10px

.fc-color-picker
  list-style: none
  margin: 0
  padding: 0

  > li
    float: left
    font-size: 30px
    line-height: 30px
    margin-right: 5px

    .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
      transition: transform linear .3s

    .fa:hover, .fab:hover, .fad:hover, .fal:hover, .far:hover, .fas:hover, .ion:hover, .svg-inline--fa:hover
      transform: rotate(30deg)

#add-new-event
  transition: all linear .3s

.external-event
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2)
  border-radius: .25rem
  cursor: move
  font-weight: 700
  margin-bottom: 4px
  padding: 5px 10px

  &:hover
    box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.2)

.select2-container--default
  .select2-selection--single
    border: 1px solid #ced4da
    padding: .46875rem .75rem
    height: calc(2.25rem + 2px)

  &.select2-container--open .select2-selection--single
    border-color: #80bdff

  .select2-dropdown
    border: 1px solid #ced4da

  .select2-results__option
    padding: 6px 12px
    -webkit-user-select: none
    -moz-user-select: none
    -ms-user-select: none
    user-select: none

  .select2-selection--single .select2-selection__rendered
    padding-left: 0
    height: auto
    margin-top: -3px

  &[dir=rtl] .select2-selection--single .select2-selection__rendered
    padding-right: 6px
    padding-left: 20px

  .select2-selection--single .select2-selection__arrow
    height: 31px
    right: 6px

    b
      margin-top: 0

  .select2-dropdown .select2-search__field, .select2-search--inline .select2-search__field
    border: 1px solid #ced4da

  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus
    outline: 0
    border: 1px solid #80bdff

  .select2-dropdown
    &.select2-dropdown--below
      border-top: 0

    &.select2-dropdown--above
      border-bottom: 0

  .select2-results__option
    &[aria-disabled=true]
      color: #6c757d

    &[aria-selected=true]
      background-color: #dee2e6
      color: #1f2d3d

      &:hover
        color: #1f2d3d

  .select2-results__option--highlighted
    background-color: #007bff
    color: #fff

    &[aria-selected]
      background-color: #0074f0
      color: #fff

      &:hover
        background-color: #0074f0
        color: #fff

  .select2-selection--multiple
    border: 1px solid #ced4da
    min-height: calc(2.25rem + 2px)

    &:focus
      border-color: #80bdff

    .select2-selection__rendered
      padding: 0 .375rem .375rem
      margin-bottom: -.375rem

      li:first-child.select2-search.select2-search--inline
        width: 100%
        margin-left: .375rem

        .select2-search__field
          width: 100% !important

      .select2-search.select2-search--inline .select2-search__field
        border: 0
        margin-top: 6px

    .select2-selection__choice
      background-color: #007bff
      border-color: #006fe6
      color: #fff
      padding: 0 10px
      margin-top: .31rem

    .select2-selection__choice__remove
      color: rgba(255, 255, 255, 0.7)
      float: right
      margin-left: 5px
      margin-right: -2px

      &:hover
        color: #fff

    &.text-sm .select2-search.select2-search--inline .select2-search__field
      margin-top: 8px

.text-sm .select2-container--default .select2-selection--multiple .select2-search.select2-search--inline .select2-search__field
  margin-top: 8px

.select2-container--default .select2-selection--multiple.text-sm .select2-selection__choice, .text-sm .select2-container--default .select2-selection--multiple .select2-selection__choice
  margin-top: .4rem

.select2-container--default
  &.select2-container--focus
    .select2-selection--multiple, .select2-selection--single
      border-color: #80bdff

    .select2-search__field
      border: 0

  .select2-selection--single .select2-selection__rendered li
    padding-right: 10px

.input-group-prepend ~ .select2-container--default .select2-selection
  border-bottom-left-radius: 0
  border-top-left-radius: 0

.input-group > .select2-container--default:not(:last-child) .select2-selection
  border-bottom-right-radius: 0
  border-top-right-radius: 0

.select2-container--bootstrap4.select2-container--focus .select2-selection
  box-shadow: none

select.form-control-sm ~ .select2-container--default
  font-size: .875rem

.text-sm .select2-container--default .select2-selection--single, select.form-control-sm ~ .select2-container--default .select2-selection--single
  height: calc(1.8125rem + 2px)

.text-sm .select2-container--default .select2-selection--single .select2-selection__rendered, select.form-control-sm ~ .select2-container--default .select2-selection--single .select2-selection__rendered
  margin-top: -.4rem

.text-sm .select2-container--default .select2-selection--single .select2-selection__arrow, select.form-control-sm ~ .select2-container--default .select2-selection--single .select2-selection__arrow
  top: -.12rem

.text-sm .select2-container--default .select2-selection--multiple, select.form-control-sm ~ .select2-container--default .select2-selection--multiple
  min-height: calc(1.8125rem + 2px)

.text-sm .select2-container--default .select2-selection--multiple .select2-selection__rendered, select.form-control-sm ~ .select2-container--default .select2-selection--multiple .select2-selection__rendered
  padding: 0 .25rem .25rem
  margin-top: -.1rem

.text-sm .select2-container--default .select2-selection--multiple .select2-selection__rendered li:first-child.select2-search.select2-search--inline, select.form-control-sm ~ .select2-container--default .select2-selection--multiple .select2-selection__rendered li:first-child.select2-search.select2-search--inline
  margin-left: .25rem

.text-sm .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search.select2-search--inline .select2-search__field, select.form-control-sm ~ .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search.select2-search--inline .select2-search__field
  margin-top: 6px

.maximized-card .select2-dropdown
  z-index: 9999

.select2-primary + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #80bdff

.select2-container--default .select2-primary
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #80bdff

.select2-primary .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #80bdff

.select2-container--default .select2-primary .select2-results__option--highlighted, .select2-primary .select2-container--default .select2-results__option--highlighted
  background-color: #007bff
  color: #fff

.select2-container--default .select2-primary .select2-results__option--highlighted[aria-selected], .select2-primary .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #0074f0
  color: #fff

  &:hover
    background-color: #0074f0
    color: #fff

.select2-container--default .select2-primary .select2-selection--multiple:focus, .select2-primary .select2-container--default .select2-selection--multiple:focus
  border-color: #80bdff

.select2-container--default .select2-primary .select2-selection--multiple .select2-selection__choice, .select2-primary .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #007bff
  border-color: #006fe6
  color: #fff

.select2-container--default .select2-primary .select2-selection--multiple .select2-selection__choice__remove, .select2-primary .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-primary .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-primary .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-primary.select2-container--focus .select2-selection--multiple, .select2-primary .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #80bdff

.select2-secondary + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #afb5ba

.select2-container--default .select2-secondary
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #afb5ba

.select2-secondary .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #afb5ba

.select2-container--default .select2-secondary .select2-results__option--highlighted, .select2-secondary .select2-container--default .select2-results__option--highlighted
  background-color: #6c757d
  color: #fff

.select2-container--default .select2-secondary .select2-results__option--highlighted[aria-selected], .select2-secondary .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #656d75
  color: #fff

  &:hover
    background-color: #656d75
    color: #fff

.select2-container--default .select2-secondary .select2-selection--multiple:focus, .select2-secondary .select2-container--default .select2-selection--multiple:focus
  border-color: #afb5ba

.select2-container--default .select2-secondary .select2-selection--multiple .select2-selection__choice, .select2-secondary .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #6c757d
  border-color: #60686f
  color: #fff

.select2-container--default .select2-secondary .select2-selection--multiple .select2-selection__choice__remove, .select2-secondary .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-secondary .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-secondary .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-secondary.select2-container--focus .select2-selection--multiple, .select2-secondary .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #afb5ba

.select2-success + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #71dd8a

.select2-container--default .select2-success
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #71dd8a

.select2-success .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #71dd8a

.select2-container--default .select2-success .select2-results__option--highlighted, .select2-success .select2-container--default .select2-results__option--highlighted
  background-color: #28a745
  color: #fff

.select2-container--default .select2-success .select2-results__option--highlighted[aria-selected], .select2-success .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #259b40
  color: #fff

  &:hover
    background-color: #259b40
    color: #fff

.select2-container--default .select2-success .select2-selection--multiple:focus, .select2-success .select2-container--default .select2-selection--multiple:focus
  border-color: #71dd8a

.select2-container--default .select2-success .select2-selection--multiple .select2-selection__choice, .select2-success .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #28a745
  border-color: #23923d
  color: #fff

.select2-container--default .select2-success .select2-selection--multiple .select2-selection__choice__remove, .select2-success .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-success .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-success .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-success.select2-container--focus .select2-selection--multiple, .select2-success .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #71dd8a

.select2-info + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #63d9ec

.select2-container--default .select2-info
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #63d9ec

.select2-info .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #63d9ec

.select2-container--default .select2-info .select2-results__option--highlighted, .select2-info .select2-container--default .select2-results__option--highlighted
  background-color: #17a2b8
  color: #fff

.select2-container--default .select2-info .select2-results__option--highlighted[aria-selected], .select2-info .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #1596aa
  color: #fff

  &:hover
    background-color: #1596aa
    color: #fff

.select2-container--default .select2-info .select2-selection--multiple:focus, .select2-info .select2-container--default .select2-selection--multiple:focus
  border-color: #63d9ec

.select2-container--default .select2-info .select2-selection--multiple .select2-selection__choice, .select2-info .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #17a2b8
  border-color: #148ea1
  color: #fff

.select2-container--default .select2-info .select2-selection--multiple .select2-selection__choice__remove, .select2-info .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-info .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-info .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-info.select2-container--focus .select2-selection--multiple, .select2-info .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #63d9ec

.select2-warning + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #ffe187

.select2-container--default .select2-warning
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #ffe187

.select2-warning .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #ffe187

.select2-container--default .select2-warning .select2-results__option--highlighted, .select2-warning .select2-container--default .select2-results__option--highlighted
  background-color: #ffc107
  color: #1f2d3d

.select2-container--default .select2-warning .select2-results__option--highlighted[aria-selected], .select2-warning .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #f7b900
  color: #1f2d3d

  &:hover
    background-color: #f7b900
    color: #1f2d3d

.select2-container--default .select2-warning .select2-selection--multiple:focus, .select2-warning .select2-container--default .select2-selection--multiple:focus
  border-color: #ffe187

.select2-container--default .select2-warning .select2-selection--multiple .select2-selection__choice, .select2-warning .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #ffc107
  border-color: #edb100
  color: #1f2d3d

.select2-container--default .select2-warning .select2-selection--multiple .select2-selection__choice__remove, .select2-warning .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-warning .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-warning .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-warning.select2-container--focus .select2-selection--multiple, .select2-warning .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #ffe187

.select2-danger + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #efa2a9

.select2-container--default .select2-danger
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #efa2a9

.select2-danger .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #efa2a9

.select2-container--default .select2-danger .select2-results__option--highlighted, .select2-danger .select2-container--default .select2-results__option--highlighted
  background-color: #dc3545
  color: #fff

.select2-container--default .select2-danger .select2-results__option--highlighted[aria-selected], .select2-danger .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #da2839
  color: #fff

  &:hover
    background-color: #da2839
    color: #fff

.select2-container--default .select2-danger .select2-selection--multiple:focus, .select2-danger .select2-container--default .select2-selection--multiple:focus
  border-color: #efa2a9

.select2-container--default .select2-danger .select2-selection--multiple .select2-selection__choice, .select2-danger .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #dc3545
  border-color: #d32535
  color: #fff

.select2-container--default .select2-danger .select2-selection--multiple .select2-selection__choice__remove, .select2-danger .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-danger .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-danger .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-danger.select2-container--focus .select2-selection--multiple, .select2-danger .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #efa2a9

.select2-light + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #fff

.select2-container--default .select2-light
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fff

.select2-light .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fff

.select2-container--default .select2-light .select2-results__option--highlighted, .select2-light .select2-container--default .select2-results__option--highlighted
  background-color: #f8f9fa
  color: #1f2d3d

.select2-container--default .select2-light .select2-results__option--highlighted[aria-selected], .select2-light .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #eff1f4
  color: #1f2d3d

  &:hover
    background-color: #eff1f4
    color: #1f2d3d

.select2-container--default .select2-light .select2-selection--multiple:focus, .select2-light .select2-container--default .select2-selection--multiple:focus
  border-color: #fff

.select2-container--default .select2-light .select2-selection--multiple .select2-selection__choice, .select2-light .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #f8f9fa
  border-color: #e9ecef
  color: #1f2d3d

.select2-container--default .select2-light .select2-selection--multiple .select2-selection__choice__remove, .select2-light .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-light .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-light .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-light.select2-container--focus .select2-selection--multiple, .select2-light .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #fff

.select2-dark + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #6d7a86

.select2-container--default .select2-dark
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #6d7a86

.select2-dark .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #6d7a86

.select2-container--default .select2-dark .select2-results__option--highlighted, .select2-dark .select2-container--default .select2-results__option--highlighted
  background-color: #343a40
  color: #fff

.select2-container--default .select2-dark .select2-results__option--highlighted[aria-selected], .select2-dark .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #2d3238
  color: #fff

  &:hover
    background-color: #2d3238
    color: #fff

.select2-container--default .select2-dark .select2-selection--multiple:focus, .select2-dark .select2-container--default .select2-selection--multiple:focus
  border-color: #6d7a86

.select2-container--default .select2-dark .select2-selection--multiple .select2-selection__choice, .select2-dark .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #343a40
  border-color: #292d32
  color: #fff

.select2-container--default .select2-dark .select2-selection--multiple .select2-selection__choice__remove, .select2-dark .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-dark .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-dark .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-dark.select2-container--focus .select2-selection--multiple, .select2-dark .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #6d7a86

.select2-lightblue + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #99c5de

.select2-container--default .select2-lightblue
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #99c5de

.select2-lightblue .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #99c5de

.select2-container--default .select2-lightblue .select2-results__option--highlighted, .select2-lightblue .select2-container--default .select2-results__option--highlighted
  background-color: #3c8dbc
  color: #fff

.select2-container--default .select2-lightblue .select2-results__option--highlighted[aria-selected], .select2-lightblue .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #3884b0
  color: #fff

  &:hover
    background-color: #3884b0
    color: #fff

.select2-container--default .select2-lightblue .select2-selection--multiple:focus, .select2-lightblue .select2-container--default .select2-selection--multiple:focus
  border-color: #99c5de

.select2-container--default .select2-lightblue .select2-selection--multiple .select2-selection__choice, .select2-lightblue .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #3c8dbc
  border-color: #367fa9
  color: #fff

.select2-container--default .select2-lightblue .select2-selection--multiple .select2-selection__choice__remove, .select2-lightblue .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-lightblue .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-lightblue .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-lightblue.select2-container--focus .select2-selection--multiple, .select2-lightblue .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #99c5de

.select2-navy + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #005ebf

.select2-container--default .select2-navy
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #005ebf

.select2-navy .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #005ebf

.select2-container--default .select2-navy .select2-results__option--highlighted, .select2-navy .select2-container--default .select2-results__option--highlighted
  background-color: #001f3f
  color: #fff

.select2-container--default .select2-navy .select2-results__option--highlighted[aria-selected], .select2-navy .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #001730
  color: #fff

  &:hover
    background-color: #001730
    color: #fff

.select2-container--default .select2-navy .select2-selection--multiple:focus, .select2-navy .select2-container--default .select2-selection--multiple:focus
  border-color: #005ebf

.select2-container--default .select2-navy .select2-selection--multiple .select2-selection__choice, .select2-navy .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #001f3f
  border-color: #001226
  color: #fff

.select2-container--default .select2-navy .select2-selection--multiple .select2-selection__choice__remove, .select2-navy .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-navy .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-navy .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-navy.select2-container--focus .select2-selection--multiple, .select2-navy .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #005ebf

.select2-olive + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #87cfaf

.select2-container--default .select2-olive
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #87cfaf

.select2-olive .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #87cfaf

.select2-container--default .select2-olive .select2-results__option--highlighted, .select2-olive .select2-container--default .select2-results__option--highlighted
  background-color: #3d9970
  color: #fff

.select2-container--default .select2-olive .select2-results__option--highlighted[aria-selected], .select2-olive .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #398e68
  color: #fff

  &:hover
    background-color: #398e68
    color: #fff

.select2-container--default .select2-olive .select2-selection--multiple:focus, .select2-olive .select2-container--default .select2-selection--multiple:focus
  border-color: #87cfaf

.select2-container--default .select2-olive .select2-selection--multiple .select2-selection__choice, .select2-olive .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #3d9970
  border-color: #368763
  color: #fff

.select2-container--default .select2-olive .select2-selection--multiple .select2-selection__choice__remove, .select2-olive .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-olive .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-olive .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-olive.select2-container--focus .select2-selection--multiple, .select2-olive .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #87cfaf

.select2-lime + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #81ffb8

.select2-container--default .select2-lime
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #81ffb8

.select2-lime .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #81ffb8

.select2-container--default .select2-lime .select2-results__option--highlighted, .select2-lime .select2-container--default .select2-results__option--highlighted
  background-color: #01ff70
  color: #1f2d3d

.select2-container--default .select2-lime .select2-results__option--highlighted[aria-selected], .select2-lime .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #00f169
  color: #1f2d3d

  &:hover
    background-color: #00f169
    color: #1f2d3d

.select2-container--default .select2-lime .select2-selection--multiple:focus, .select2-lime .select2-container--default .select2-selection--multiple:focus
  border-color: #81ffb8

.select2-container--default .select2-lime .select2-selection--multiple .select2-selection__choice, .select2-lime .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #01ff70
  border-color: #00e765
  color: #1f2d3d

.select2-container--default .select2-lime .select2-selection--multiple .select2-selection__choice__remove, .select2-lime .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-lime .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-lime .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-lime.select2-container--focus .select2-selection--multiple, .select2-lime .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #81ffb8

.select2-fuchsia + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #f88adf

.select2-container--default .select2-fuchsia
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f88adf

.select2-fuchsia .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f88adf

.select2-container--default .select2-fuchsia .select2-results__option--highlighted, .select2-fuchsia .select2-container--default .select2-results__option--highlighted
  background-color: #f012be
  color: #fff

.select2-container--default .select2-fuchsia .select2-results__option--highlighted[aria-selected], .select2-fuchsia .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #e40eb4
  color: #fff

  &:hover
    background-color: #e40eb4
    color: #fff

.select2-container--default .select2-fuchsia .select2-selection--multiple:focus, .select2-fuchsia .select2-container--default .select2-selection--multiple:focus
  border-color: #f88adf

.select2-container--default .select2-fuchsia .select2-selection--multiple .select2-selection__choice, .select2-fuchsia .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #f012be
  border-color: #db0ead
  color: #fff

.select2-container--default .select2-fuchsia .select2-selection--multiple .select2-selection__choice__remove, .select2-fuchsia .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-fuchsia .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-fuchsia .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-fuchsia.select2-container--focus .select2-selection--multiple, .select2-fuchsia .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #f88adf

.select2-maroon + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #f083ab

.select2-container--default .select2-maroon
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f083ab

.select2-maroon .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f083ab

.select2-container--default .select2-maroon .select2-results__option--highlighted, .select2-maroon .select2-container--default .select2-results__option--highlighted
  background-color: #d81b60
  color: #fff

.select2-container--default .select2-maroon .select2-results__option--highlighted[aria-selected], .select2-maroon .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #ca195a
  color: #fff

  &:hover
    background-color: #ca195a
    color: #fff

.select2-container--default .select2-maroon .select2-selection--multiple:focus, .select2-maroon .select2-container--default .select2-selection--multiple:focus
  border-color: #f083ab

.select2-container--default .select2-maroon .select2-selection--multiple .select2-selection__choice, .select2-maroon .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #d81b60
  border-color: #c11856
  color: #fff

.select2-container--default .select2-maroon .select2-selection--multiple .select2-selection__choice__remove, .select2-maroon .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-maroon .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-maroon .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-maroon.select2-container--focus .select2-selection--multiple, .select2-maroon .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #f083ab

.select2-blue
  + .select2-container--default
    &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
      border-color: #80bdff

  .select2-container--default
    .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
      border: 1px solid #80bdff

.select2-container--default .select2-blue
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #80bdff

.select2-blue .select2-container--default .select2-results__option--highlighted, .select2-container--default .select2-blue .select2-results__option--highlighted
  background-color: #007bff
  color: #fff

.select2-blue .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-blue .select2-results__option--highlighted[aria-selected]
  background-color: #0074f0
  color: #fff

  &:hover
    background-color: #0074f0
    color: #fff

.select2-blue .select2-container--default .select2-selection--multiple:focus, .select2-container--default .select2-blue .select2-selection--multiple:focus
  border-color: #80bdff

.select2-blue .select2-container--default .select2-selection--multiple .select2-selection__choice, .select2-container--default .select2-blue .select2-selection--multiple .select2-selection__choice
  background-color: #007bff
  border-color: #006fe6
  color: #fff

.select2-blue .select2-container--default .select2-selection--multiple .select2-selection__choice__remove, .select2-container--default .select2-blue .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-blue .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-container--default .select2-blue .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-blue .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-blue.select2-container--focus .select2-selection--multiple
  border-color: #80bdff

.select2-indigo + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #b389f9

.select2-container--default .select2-indigo
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #b389f9

.select2-indigo .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #b389f9

.select2-container--default .select2-indigo .select2-results__option--highlighted, .select2-indigo .select2-container--default .select2-results__option--highlighted
  background-color: #6610f2
  color: #fff

.select2-container--default .select2-indigo .select2-results__option--highlighted[aria-selected], .select2-indigo .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #5f0de6
  color: #fff

  &:hover
    background-color: #5f0de6
    color: #fff

.select2-container--default .select2-indigo .select2-selection--multiple:focus, .select2-indigo .select2-container--default .select2-selection--multiple:focus
  border-color: #b389f9

.select2-container--default .select2-indigo .select2-selection--multiple .select2-selection__choice, .select2-indigo .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #6610f2
  border-color: #5b0cdd
  color: #fff

.select2-container--default .select2-indigo .select2-selection--multiple .select2-selection__choice__remove, .select2-indigo .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-indigo .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-indigo .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-indigo.select2-container--focus .select2-selection--multiple, .select2-indigo .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #b389f9

.select2-purple + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #b8a2e0

.select2-container--default .select2-purple
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #b8a2e0

.select2-purple .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #b8a2e0

.select2-container--default .select2-purple .select2-results__option--highlighted, .select2-purple .select2-container--default .select2-results__option--highlighted
  background-color: #6f42c1
  color: #fff

.select2-container--default .select2-purple .select2-results__option--highlighted[aria-selected], .select2-purple .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #683cb8
  color: #fff

  &:hover
    background-color: #683cb8
    color: #fff

.select2-container--default .select2-purple .select2-selection--multiple:focus, .select2-purple .select2-container--default .select2-selection--multiple:focus
  border-color: #b8a2e0

.select2-container--default .select2-purple .select2-selection--multiple .select2-selection__choice, .select2-purple .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #6f42c1
  border-color: #643ab0
  color: #fff

.select2-container--default .select2-purple .select2-selection--multiple .select2-selection__choice__remove, .select2-purple .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-purple .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-purple .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-purple.select2-container--focus .select2-selection--multiple, .select2-purple .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #b8a2e0

.select2-pink + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #f6b0d0

.select2-container--default .select2-pink
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f6b0d0

.select2-pink .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #f6b0d0

.select2-container--default .select2-pink .select2-results__option--highlighted, .select2-pink .select2-container--default .select2-results__option--highlighted
  background-color: #e83e8c
  color: #fff

.select2-container--default .select2-pink .select2-results__option--highlighted[aria-selected], .select2-pink .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #e63084
  color: #fff

  &:hover
    background-color: #e63084
    color: #fff

.select2-container--default .select2-pink .select2-selection--multiple:focus, .select2-pink .select2-container--default .select2-selection--multiple:focus
  border-color: #f6b0d0

.select2-container--default .select2-pink .select2-selection--multiple .select2-selection__choice, .select2-pink .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #e83e8c
  border-color: #e5277e
  color: #fff

.select2-container--default .select2-pink .select2-selection--multiple .select2-selection__choice__remove, .select2-pink .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-pink .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-pink .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-pink.select2-container--focus .select2-selection--multiple, .select2-pink .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #f6b0d0

.select2-red + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #efa2a9

.select2-container--default .select2-red
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #efa2a9

.select2-red .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #efa2a9

.select2-container--default .select2-red .select2-results__option--highlighted, .select2-red .select2-container--default .select2-results__option--highlighted
  background-color: #dc3545
  color: #fff

.select2-container--default .select2-red .select2-results__option--highlighted[aria-selected], .select2-red .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #da2839
  color: #fff

  &:hover
    background-color: #da2839
    color: #fff

.select2-container--default .select2-red .select2-selection--multiple:focus, .select2-red .select2-container--default .select2-selection--multiple:focus
  border-color: #efa2a9

.select2-container--default .select2-red .select2-selection--multiple .select2-selection__choice, .select2-red .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #dc3545
  border-color: #d32535
  color: #fff

.select2-container--default .select2-red .select2-selection--multiple .select2-selection__choice__remove, .select2-red .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-red .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-red .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-red.select2-container--focus .select2-selection--multiple, .select2-red .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #efa2a9

.select2-orange + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #fec392

.select2-container--default .select2-orange
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fec392

.select2-orange .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fec392

.select2-container--default .select2-orange .select2-results__option--highlighted, .select2-orange .select2-container--default .select2-results__option--highlighted
  background-color: #fd7e14
  color: #1f2d3d

.select2-container--default .select2-orange .select2-results__option--highlighted[aria-selected], .select2-orange .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #fd7605
  color: #fff

  &:hover
    background-color: #fd7605
    color: #fff

.select2-container--default .select2-orange .select2-selection--multiple:focus, .select2-orange .select2-container--default .select2-selection--multiple:focus
  border-color: #fec392

.select2-container--default .select2-orange .select2-selection--multiple .select2-selection__choice, .select2-orange .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #fd7e14
  border-color: #f57102
  color: #1f2d3d

.select2-container--default .select2-orange .select2-selection--multiple .select2-selection__choice__remove, .select2-orange .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-orange .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-orange .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-orange.select2-container--focus .select2-selection--multiple, .select2-orange .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #fec392

.select2-yellow + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #ffe187

.select2-container--default .select2-yellow
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #ffe187

.select2-yellow .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #ffe187

.select2-container--default .select2-yellow .select2-results__option--highlighted, .select2-yellow .select2-container--default .select2-results__option--highlighted
  background-color: #ffc107
  color: #1f2d3d

.select2-container--default .select2-yellow .select2-results__option--highlighted[aria-selected], .select2-yellow .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #f7b900
  color: #1f2d3d

  &:hover
    background-color: #f7b900
    color: #1f2d3d

.select2-container--default .select2-yellow .select2-selection--multiple:focus, .select2-yellow .select2-container--default .select2-selection--multiple:focus
  border-color: #ffe187

.select2-container--default .select2-yellow .select2-selection--multiple .select2-selection__choice, .select2-yellow .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #ffc107
  border-color: #edb100
  color: #1f2d3d

.select2-container--default .select2-yellow .select2-selection--multiple .select2-selection__choice__remove, .select2-yellow .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-yellow .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-yellow .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-yellow.select2-container--focus .select2-selection--multiple, .select2-yellow .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #ffe187

.select2-green + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #71dd8a

.select2-container--default .select2-green
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #71dd8a

.select2-green .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #71dd8a

.select2-container--default .select2-green .select2-results__option--highlighted, .select2-green .select2-container--default .select2-results__option--highlighted
  background-color: #28a745
  color: #fff

.select2-container--default .select2-green .select2-results__option--highlighted[aria-selected], .select2-green .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #259b40
  color: #fff

  &:hover
    background-color: #259b40
    color: #fff

.select2-container--default .select2-green .select2-selection--multiple:focus, .select2-green .select2-container--default .select2-selection--multiple:focus
  border-color: #71dd8a

.select2-container--default .select2-green .select2-selection--multiple .select2-selection__choice, .select2-green .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #28a745
  border-color: #23923d
  color: #fff

.select2-container--default .select2-green .select2-selection--multiple .select2-selection__choice__remove, .select2-green .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-green .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-green .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-green.select2-container--focus .select2-selection--multiple, .select2-green .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #71dd8a

.select2-teal + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #7eeaca

.select2-container--default .select2-teal
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #7eeaca

.select2-teal .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #7eeaca

.select2-container--default .select2-teal .select2-results__option--highlighted, .select2-teal .select2-container--default .select2-results__option--highlighted
  background-color: #20c997
  color: #fff

.select2-container--default .select2-teal .select2-results__option--highlighted[aria-selected], .select2-teal .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #1ebc8d
  color: #fff

  &:hover
    background-color: #1ebc8d
    color: #fff

.select2-container--default .select2-teal .select2-selection--multiple:focus, .select2-teal .select2-container--default .select2-selection--multiple:focus
  border-color: #7eeaca

.select2-container--default .select2-teal .select2-selection--multiple .select2-selection__choice, .select2-teal .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #20c997
  border-color: #1cb386
  color: #fff

.select2-container--default .select2-teal .select2-selection--multiple .select2-selection__choice__remove, .select2-teal .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-teal .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-teal .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-teal.select2-container--focus .select2-selection--multiple, .select2-teal .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #7eeaca

.select2-cyan + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #63d9ec

.select2-container--default .select2-cyan
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #63d9ec

.select2-cyan .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #63d9ec

.select2-container--default .select2-cyan .select2-results__option--highlighted, .select2-cyan .select2-container--default .select2-results__option--highlighted
  background-color: #17a2b8
  color: #fff

.select2-container--default .select2-cyan .select2-results__option--highlighted[aria-selected], .select2-cyan .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #1596aa
  color: #fff

  &:hover
    background-color: #1596aa
    color: #fff

.select2-container--default .select2-cyan .select2-selection--multiple:focus, .select2-cyan .select2-container--default .select2-selection--multiple:focus
  border-color: #63d9ec

.select2-container--default .select2-cyan .select2-selection--multiple .select2-selection__choice, .select2-cyan .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #17a2b8
  border-color: #148ea1
  color: #fff

.select2-container--default .select2-cyan .select2-selection--multiple .select2-selection__choice__remove, .select2-cyan .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-cyan .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-cyan .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-cyan.select2-container--focus .select2-selection--multiple, .select2-cyan .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #63d9ec

.select2-white + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #fff

.select2-container--default .select2-white
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fff

.select2-white .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #fff

.select2-container--default .select2-white .select2-results__option--highlighted, .select2-white .select2-container--default .select2-results__option--highlighted
  background-color: #fff
  color: #1f2d3d

.select2-container--default .select2-white .select2-results__option--highlighted[aria-selected], .select2-white .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #f7f7f7
  color: #1f2d3d

  &:hover
    background-color: #f7f7f7
    color: #1f2d3d

.select2-container--default .select2-white .select2-selection--multiple:focus, .select2-white .select2-container--default .select2-selection--multiple:focus
  border-color: #fff

.select2-container--default .select2-white .select2-selection--multiple .select2-selection__choice, .select2-white .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #fff
  border-color: #f2f2f2
  color: #1f2d3d

.select2-container--default .select2-white .select2-selection--multiple .select2-selection__choice__remove, .select2-white .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(31, 45, 61, 0.7)

.select2-container--default .select2-white .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-white .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #1f2d3d

.select2-container--default .select2-white.select2-container--focus .select2-selection--multiple, .select2-white .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #fff

.select2-gray + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #afb5ba

.select2-container--default .select2-gray
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #afb5ba

.select2-gray .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #afb5ba

.select2-container--default .select2-gray .select2-results__option--highlighted, .select2-gray .select2-container--default .select2-results__option--highlighted
  background-color: #6c757d
  color: #fff

.select2-container--default .select2-gray .select2-results__option--highlighted[aria-selected], .select2-gray .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #656d75
  color: #fff

  &:hover
    background-color: #656d75
    color: #fff

.select2-container--default .select2-gray .select2-selection--multiple:focus, .select2-gray .select2-container--default .select2-selection--multiple:focus
  border-color: #afb5ba

.select2-container--default .select2-gray .select2-selection--multiple .select2-selection__choice, .select2-gray .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #6c757d
  border-color: #60686f
  color: #fff

.select2-container--default .select2-gray .select2-selection--multiple .select2-selection__choice__remove, .select2-gray .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-gray .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-gray .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-gray.select2-container--focus .select2-selection--multiple, .select2-gray .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #afb5ba

.select2-gray-dark + .select2-container--default
  &.select2-container--open .select2-selection--single, &.select2-container--focus .select2-selection--single
    border-color: #6d7a86

.select2-container--default .select2-gray-dark
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #6d7a86

.select2-gray-dark .select2-container--default
  .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus, &.select2-dropdown .select2-search__field:focus
    border: 1px solid #6d7a86

.select2-container--default .select2-gray-dark .select2-results__option--highlighted, .select2-gray-dark .select2-container--default .select2-results__option--highlighted
  background-color: #343a40
  color: #fff

.select2-container--default .select2-gray-dark .select2-results__option--highlighted[aria-selected], .select2-gray-dark .select2-container--default .select2-results__option--highlighted[aria-selected]
  background-color: #2d3238
  color: #fff

  &:hover
    background-color: #2d3238
    color: #fff

.select2-container--default .select2-gray-dark .select2-selection--multiple:focus, .select2-gray-dark .select2-container--default .select2-selection--multiple:focus
  border-color: #6d7a86

.select2-container--default .select2-gray-dark .select2-selection--multiple .select2-selection__choice, .select2-gray-dark .select2-container--default .select2-selection--multiple .select2-selection__choice
  background-color: #343a40
  border-color: #292d32
  color: #fff

.select2-container--default .select2-gray-dark .select2-selection--multiple .select2-selection__choice__remove, .select2-gray-dark .select2-container--default .select2-selection--multiple .select2-selection__choice__remove
  color: rgba(255, 255, 255, 0.7)

.select2-container--default .select2-gray-dark .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-gray-dark .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover
  color: #fff

.select2-container--default .select2-gray-dark.select2-container--focus .select2-selection--multiple, .select2-gray-dark .select2-container--default.select2-container--focus .select2-selection--multiple
  border-color: #6d7a86

.dark-mode
  .select2-selection
    background-color: #343a40
    border-color: #6c757d

  .select2-container--disabled .select2-selection--single
    background-color: #454d55

  .select2-selection--single
    background-color: #343a40
    border-color: #6c757d

    .select2-selection__rendered
      color: #fff

  .select2-dropdown .select2-search__field, .select2-search--inline .select2-search__field, .select2-dropdown
    background-color: #343a40
    border-color: #6c757d
    color: #fff

  .select2-results__option[aria-selected=true]
    background-color: #3f474e !important
    color: #dee2e6

  .select2-container .select2-search--inline .select2-search__field
    background-color: transparent
    color: #fff

  .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice
    color: #fff

.slider
  .tooltip.in
    opacity: .9

  &.slider-vertical
    height: 100%

  &.slider-horizontal
    width: 100%

.slider-primary .slider .slider-selection
  background: #007bff

.slider-secondary .slider .slider-selection
  background: #6c757d

.slider-success .slider .slider-selection
  background: #28a745

.slider-info .slider .slider-selection
  background: #17a2b8

.slider-warning .slider .slider-selection
  background: #ffc107

.slider-danger .slider .slider-selection
  background: #dc3545

.slider-light .slider .slider-selection
  background: #f8f9fa

.slider-dark .slider .slider-selection
  background: #343a40

.slider-lightblue .slider .slider-selection
  background: #3c8dbc

.slider-navy .slider .slider-selection
  background: #001f3f

.slider-olive .slider .slider-selection
  background: #3d9970

.slider-lime .slider .slider-selection
  background: #01ff70

.slider-fuchsia .slider .slider-selection
  background: #f012be

.slider-maroon .slider .slider-selection
  background: #d81b60

.slider-blue .slider .slider-selection
  background: #007bff

.slider-indigo .slider .slider-selection
  background: #6610f2

.slider-purple .slider .slider-selection
  background: #6f42c1

.slider-pink .slider .slider-selection
  background: #e83e8c

.slider-red .slider .slider-selection
  background: #dc3545

.slider-orange .slider .slider-selection
  background: #fd7e14

.slider-yellow .slider .slider-selection
  background: #ffc107

.slider-green .slider .slider-selection
  background: #28a745

.slider-teal .slider .slider-selection
  background: #20c997

.slider-cyan .slider .slider-selection
  background: #17a2b8

.slider-white .slider .slider-selection
  background: #fff

.slider-gray .slider .slider-selection
  background: #6c757d

.slider-gray-dark .slider .slider-selection
  background: #343a40

.dark-mode .slider-track
  background-color: #4b545c
  background-image: none

.icheck-primary > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #007bff

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #007bff

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #007bff
      border-color: #007bff

.icheck-secondary > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #6c757d

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #6c757d

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #6c757d
      border-color: #6c757d

.icheck-success > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #28a745

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #28a745

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #28a745
      border-color: #28a745

.icheck-info > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #17a2b8

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #17a2b8

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #17a2b8
      border-color: #17a2b8

.icheck-warning > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #ffc107

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #ffc107

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #ffc107
      border-color: #ffc107

.icheck-danger > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #dc3545

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #dc3545

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #dc3545
      border-color: #dc3545

.icheck-light > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #f8f9fa

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #f8f9fa

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #f8f9fa
      border-color: #f8f9fa

.icheck-dark > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #343a40

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #343a40

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #343a40
      border-color: #343a40

.icheck-lightblue > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #3c8dbc

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #3c8dbc

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #3c8dbc
      border-color: #3c8dbc

.icheck-navy > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #001f3f

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #001f3f

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #001f3f
      border-color: #001f3f

.icheck-olive > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #3d9970

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #3d9970

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #3d9970
      border-color: #3d9970

.icheck-lime > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #01ff70

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #01ff70

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #01ff70
      border-color: #01ff70

.icheck-fuchsia > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #f012be

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #f012be

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #f012be
      border-color: #f012be

.icheck-maroon > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #d81b60

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #d81b60

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #d81b60
      border-color: #d81b60

.icheck-blue > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #007bff

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #007bff

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #007bff
      border-color: #007bff

.icheck-indigo > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #6610f2

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #6610f2

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #6610f2
      border-color: #6610f2

.icheck-purple > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #6f42c1

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #6f42c1

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #6f42c1
      border-color: #6f42c1

.icheck-pink > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #e83e8c

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #e83e8c

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #e83e8c
      border-color: #e83e8c

.icheck-red > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #dc3545

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #dc3545

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #dc3545
      border-color: #dc3545

.icheck-orange > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #fd7e14

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #fd7e14

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #fd7e14
      border-color: #fd7e14

.icheck-yellow > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #ffc107

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #ffc107

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #ffc107
      border-color: #ffc107

.icheck-green > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #28a745

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #28a745

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #28a745
      border-color: #28a745

.icheck-teal > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #20c997

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #20c997

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #20c997
      border-color: #20c997

.icheck-cyan > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #17a2b8

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #17a2b8

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #17a2b8
      border-color: #17a2b8

.icheck-white > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #fff

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #fff

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #fff
      border-color: #fff

.icheck-gray > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #6c757d

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #6c757d

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #6c757d
      border-color: #6c757d

.icheck-gray-dark > input:first-child
  &:not(:checked):not(:disabled)
    &:hover +
      input[type=hidden] + label::before, label::before
        border-color: #343a40

    &:focus +
      input[type=hidden] + label::before, label::before
        border-color: #343a40

  &:checked +
    input[type=hidden] + label::before, label::before
      background-color: #343a40
      border-color: #343a40

.dark-mode [class*=icheck-] > input:first-child:not(:checked) +
  input[type=hidden] + label::before, label::before
    border-color: #6c757d

.mapael
  .map
    position: relative

  .mapTooltip
    font-family: "Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
    font-style: normal
    font-weight: 400
    line-height: 1.5
    text-align: left
    text-align: start
    text-decoration: none
    text-shadow: none
    text-transform: none
    letter-spacing: normal
    word-break: normal
    word-spacing: normal
    white-space: normal
    line-break: auto
    border-radius: .25rem
    font-size: .875rem
    background-color: #000
    color: #fff
    display: block
    max-width: 200px
    padding: .25rem .5rem
    position: absolute
    text-align: center
    word-wrap: break-word
    z-index: 1070

  .myLegend
    background-color: #f8f9fa
    border: 1px solid #adb5bd
    padding: 10px
    width: 600px

  .zoomButton
    background-color: #f8f9fa
    border: 1px solid #ddd
    border-radius: .25rem
    color: #444
    cursor: pointer
    font-weight: 700
    height: 16px
    left: 10px
    line-height: 14px
    padding-left: 1px
    position: absolute
    text-align: center
    top: 0
    -webkit-user-select: none
    -moz-user-select: none
    -ms-user-select: none
    user-select: none
    width: 16px

    &.hover, &:active, &:hover
      background-color: #e9ecef
      color: #2b2b2b

  .zoomReset
    line-height: 12px
    top: 10px

  .zoomIn
    top: 30px

  .zoomOut
    top: 50px

.jqvmap-zoomin, .jqvmap-zoomout
  background-color: #f8f9fa
  border: 1px solid #ddd
  border-radius: .25rem
  color: #444
  height: 15px
  width: 15px

.jqvmap-zoomin
  &.hover, &:active, &:hover
    background-color: #e9ecef
    color: #2b2b2b

.jqvmap-zoomout
  &.hover, &:active, &:hover
    background-color: #e9ecef
    color: #2b2b2b

.swal2-icon
  &.swal2-info
    border-color: ligthen(#17a2b8, 20%)
    color: #17a2b8

  &.swal2-warning
    border-color: ligthen(#ffc107, 20%)
    color: #ffc107

  &.swal2-error
    border-color: ligthen(#dc3545, 20%)
    color: #dc3545

  &.swal2-question
    border-color: ligthen(#6c757d, 20%)
    color: #6c757d

  &.swal2-success
    border-color: ligthen(#28a745, 20%)
    color: #28a745

    .swal2-success-ring
      border-color: ligthen(#28a745, 20%)

    [class^=swal2-success-line]
      background-color: #28a745

.dark-mode .swal2-popup
  background-color: #343a40
  color: #e9ecef

  .swal2-content, .swal2-title
    color: #e9ecef

#toast-container
  .toast
    background-color: #007bff

  .toast-success
    background-color: #28a745

  .toast-error
    background-color: #dc3545

  .toast-info
    background-color: #17a2b8

  .toast-warning
    background-color: #ffc107

.toast-bottom-full-width .toast, .toast-top-full-width .toast
  max-width: inherit

.pace
  z-index: 1048

  .pace-progress
    z-index: 1049

  .pace-activity
    z-index: 1050

.pace-primary .pace .pace-progress
  background: #007bff

.pace-barber-shop-primary .pace
  background: #fff

  .pace-progress
    background: #007bff

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-primary .pace .pace-progress::after
  color: rgba(0, 123, 255, 0.2)

.pace-bounce-primary .pace .pace-activity
  background: #007bff

.pace-center-atom-primary
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #007bff
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #007bff

    &::after, &::before
      border-color: #007bff

.pace-center-circle-primary .pace .pace-progress
  background: rgba(0, 123, 255, 0.8)
  color: #fff

.pace-center-radar-primary .pace .pace-activity
  border-color: #007bff transparent transparent

  &::before
    border-color: #007bff transparent transparent

.pace-center-simple-primary .pace
  background: #fff
  border-color: #007bff

  .pace-progress
    background: #007bff

.pace-material-primary .pace
  color: #007bff

.pace-corner-indicator-primary .pace .pace-activity
  background: #007bff

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(0, 123, 255, 0.2)
    border-left-color: rgba(0, 123, 255, 0.2)

  &::after
    border-top-color: rgba(0, 123, 255, 0.2)
    border-bottom-color: rgba(0, 123, 255, 0.2)

.pace-fill-left-primary .pace .pace-progress
  background-color: rgba(0, 123, 255, 0.2)

.pace-flash-primary .pace
  .pace-progress
    background: #007bff

  .pace-progress-inner
    box-shadow: 0 0 10px #007bff,0 0 5px #007bff

  .pace-activity
    border-top-color: #007bff
    border-left-color: #007bff

.pace-loading-bar-primary .pace
  .pace-progress
    background: #007bff
    color: #007bff
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #007bff,inset 0 0 0 7px #fff

.pace-mac-osx-primary .pace
  .pace-progress
    background-color: #007bff
    box-shadow: inset -1px 0 #007bff, inset 0 -1px #007bff, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-primary .pace-progress
  color: #007bff

.pace-secondary .pace .pace-progress
  background: #6c757d

.pace-barber-shop-secondary .pace
  background: #fff

  .pace-progress
    background: #6c757d

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-secondary .pace .pace-progress::after
  color: rgba(108, 117, 125, 0.2)

.pace-bounce-secondary .pace .pace-activity
  background: #6c757d

.pace-center-atom-secondary
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #6c757d
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #6c757d

    &::after, &::before
      border-color: #6c757d

.pace-center-circle-secondary .pace .pace-progress
  background: rgba(108, 117, 125, 0.8)
  color: #fff

.pace-center-radar-secondary .pace .pace-activity
  border-color: #6c757d transparent transparent

  &::before
    border-color: #6c757d transparent transparent

.pace-center-simple-secondary .pace
  background: #fff
  border-color: #6c757d

  .pace-progress
    background: #6c757d

.pace-material-secondary .pace
  color: #6c757d

.pace-corner-indicator-secondary .pace .pace-activity
  background: #6c757d

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(108, 117, 125, 0.2)
    border-left-color: rgba(108, 117, 125, 0.2)

  &::after
    border-top-color: rgba(108, 117, 125, 0.2)
    border-bottom-color: rgba(108, 117, 125, 0.2)

.pace-fill-left-secondary .pace .pace-progress
  background-color: rgba(108, 117, 125, 0.2)

.pace-flash-secondary .pace
  .pace-progress
    background: #6c757d

  .pace-progress-inner
    box-shadow: 0 0 10px #6c757d,0 0 5px #6c757d

  .pace-activity
    border-top-color: #6c757d
    border-left-color: #6c757d

.pace-loading-bar-secondary .pace
  .pace-progress
    background: #6c757d
    color: #6c757d
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #6c757d,inset 0 0 0 7px #fff

.pace-mac-osx-secondary .pace
  .pace-progress
    background-color: #6c757d
    box-shadow: inset -1px 0 #6c757d, inset 0 -1px #6c757d, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-secondary .pace-progress
  color: #6c757d

.pace-success .pace .pace-progress
  background: #28a745

.pace-barber-shop-success .pace
  background: #fff

  .pace-progress
    background: #28a745

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-success .pace .pace-progress::after
  color: rgba(40, 167, 69, 0.2)

.pace-bounce-success .pace .pace-activity
  background: #28a745

.pace-center-atom-success
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #28a745
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #28a745

    &::after, &::before
      border-color: #28a745

.pace-center-circle-success .pace .pace-progress
  background: rgba(40, 167, 69, 0.8)
  color: #fff

.pace-center-radar-success .pace .pace-activity
  border-color: #28a745 transparent transparent

  &::before
    border-color: #28a745 transparent transparent

.pace-center-simple-success .pace
  background: #fff
  border-color: #28a745

  .pace-progress
    background: #28a745

.pace-material-success .pace
  color: #28a745

.pace-corner-indicator-success .pace .pace-activity
  background: #28a745

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(40, 167, 69, 0.2)
    border-left-color: rgba(40, 167, 69, 0.2)

  &::after
    border-top-color: rgba(40, 167, 69, 0.2)
    border-bottom-color: rgba(40, 167, 69, 0.2)

.pace-fill-left-success .pace .pace-progress
  background-color: rgba(40, 167, 69, 0.2)

.pace-flash-success .pace
  .pace-progress
    background: #28a745

  .pace-progress-inner
    box-shadow: 0 0 10px #28a745,0 0 5px #28a745

  .pace-activity
    border-top-color: #28a745
    border-left-color: #28a745

.pace-loading-bar-success .pace
  .pace-progress
    background: #28a745
    color: #28a745
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #28a745,inset 0 0 0 7px #fff

.pace-mac-osx-success .pace
  .pace-progress
    background-color: #28a745
    box-shadow: inset -1px 0 #28a745, inset 0 -1px #28a745, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-success .pace-progress
  color: #28a745

.pace-info .pace .pace-progress
  background: #17a2b8

.pace-barber-shop-info .pace
  background: #fff

  .pace-progress
    background: #17a2b8

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-info .pace .pace-progress::after
  color: rgba(23, 162, 184, 0.2)

.pace-bounce-info .pace .pace-activity
  background: #17a2b8

.pace-center-atom-info
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #17a2b8
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #17a2b8

    &::after, &::before
      border-color: #17a2b8

.pace-center-circle-info .pace .pace-progress
  background: rgba(23, 162, 184, 0.8)
  color: #fff

.pace-center-radar-info .pace .pace-activity
  border-color: #17a2b8 transparent transparent

  &::before
    border-color: #17a2b8 transparent transparent

.pace-center-simple-info .pace
  background: #fff
  border-color: #17a2b8

  .pace-progress
    background: #17a2b8

.pace-material-info .pace
  color: #17a2b8

.pace-corner-indicator-info .pace .pace-activity
  background: #17a2b8

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(23, 162, 184, 0.2)
    border-left-color: rgba(23, 162, 184, 0.2)

  &::after
    border-top-color: rgba(23, 162, 184, 0.2)
    border-bottom-color: rgba(23, 162, 184, 0.2)

.pace-fill-left-info .pace .pace-progress
  background-color: rgba(23, 162, 184, 0.2)

.pace-flash-info .pace
  .pace-progress
    background: #17a2b8

  .pace-progress-inner
    box-shadow: 0 0 10px #17a2b8,0 0 5px #17a2b8

  .pace-activity
    border-top-color: #17a2b8
    border-left-color: #17a2b8

.pace-loading-bar-info .pace
  .pace-progress
    background: #17a2b8
    color: #17a2b8
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #17a2b8,inset 0 0 0 7px #fff

.pace-mac-osx-info .pace
  .pace-progress
    background-color: #17a2b8
    box-shadow: inset -1px 0 #17a2b8, inset 0 -1px #17a2b8, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-info .pace-progress
  color: #17a2b8

.pace-warning .pace .pace-progress
  background: #ffc107

.pace-barber-shop-warning .pace
  background: #1f2d3d

  .pace-progress
    background: #ffc107

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-warning .pace .pace-progress::after
  color: rgba(255, 193, 7, 0.2)

.pace-bounce-warning .pace .pace-activity
  background: #ffc107

.pace-center-atom-warning
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #ffc107
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #ffc107

    &::after, &::before
      border-color: #ffc107

.pace-center-circle-warning .pace .pace-progress
  background: rgba(255, 193, 7, 0.8)
  color: #1f2d3d

.pace-center-radar-warning .pace .pace-activity
  border-color: #ffc107 transparent transparent

  &::before
    border-color: #ffc107 transparent transparent

.pace-center-simple-warning .pace
  background: #1f2d3d
  border-color: #ffc107

  .pace-progress
    background: #ffc107

.pace-material-warning .pace
  color: #ffc107

.pace-corner-indicator-warning .pace .pace-activity
  background: #ffc107

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(255, 193, 7, 0.2)
    border-left-color: rgba(255, 193, 7, 0.2)

  &::after
    border-top-color: rgba(255, 193, 7, 0.2)
    border-bottom-color: rgba(255, 193, 7, 0.2)

.pace-fill-left-warning .pace .pace-progress
  background-color: rgba(255, 193, 7, 0.2)

.pace-flash-warning .pace
  .pace-progress
    background: #ffc107

  .pace-progress-inner
    box-shadow: 0 0 10px #ffc107,0 0 5px #ffc107

  .pace-activity
    border-top-color: #ffc107
    border-left-color: #ffc107

.pace-loading-bar-warning .pace
  .pace-progress
    background: #ffc107
    color: #ffc107
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #ffc107,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-warning .pace
  .pace-progress
    background-color: #ffc107
    box-shadow: inset -1px 0 #ffc107, inset 0 -1px #ffc107, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-warning .pace-progress
  color: #ffc107

.pace-danger .pace .pace-progress
  background: #dc3545

.pace-barber-shop-danger .pace
  background: #fff

  .pace-progress
    background: #dc3545

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-danger .pace .pace-progress::after
  color: rgba(220, 53, 69, 0.2)

.pace-bounce-danger .pace .pace-activity
  background: #dc3545

.pace-center-atom-danger
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #dc3545
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #dc3545

    &::after, &::before
      border-color: #dc3545

.pace-center-circle-danger .pace .pace-progress
  background: rgba(220, 53, 69, 0.8)
  color: #fff

.pace-center-radar-danger .pace .pace-activity
  border-color: #dc3545 transparent transparent

  &::before
    border-color: #dc3545 transparent transparent

.pace-center-simple-danger .pace
  background: #fff
  border-color: #dc3545

  .pace-progress
    background: #dc3545

.pace-material-danger .pace
  color: #dc3545

.pace-corner-indicator-danger .pace .pace-activity
  background: #dc3545

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(220, 53, 69, 0.2)
    border-left-color: rgba(220, 53, 69, 0.2)

  &::after
    border-top-color: rgba(220, 53, 69, 0.2)
    border-bottom-color: rgba(220, 53, 69, 0.2)

.pace-fill-left-danger .pace .pace-progress
  background-color: rgba(220, 53, 69, 0.2)

.pace-flash-danger .pace
  .pace-progress
    background: #dc3545

  .pace-progress-inner
    box-shadow: 0 0 10px #dc3545,0 0 5px #dc3545

  .pace-activity
    border-top-color: #dc3545
    border-left-color: #dc3545

.pace-loading-bar-danger .pace
  .pace-progress
    background: #dc3545
    color: #dc3545
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #dc3545,inset 0 0 0 7px #fff

.pace-mac-osx-danger .pace
  .pace-progress
    background-color: #dc3545
    box-shadow: inset -1px 0 #dc3545, inset 0 -1px #dc3545, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-danger .pace-progress
  color: #dc3545

.pace-light .pace .pace-progress
  background: #f8f9fa

.pace-barber-shop-light .pace
  background: #1f2d3d

  .pace-progress
    background: #f8f9fa

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-light .pace .pace-progress::after
  color: rgba(248, 249, 250, 0.2)

.pace-bounce-light .pace .pace-activity
  background: #f8f9fa

.pace-center-atom-light
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #f8f9fa
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #f8f9fa

    &::after, &::before
      border-color: #f8f9fa

.pace-center-circle-light .pace .pace-progress
  background: rgba(248, 249, 250, 0.8)
  color: #1f2d3d

.pace-center-radar-light .pace .pace-activity
  border-color: #f8f9fa transparent transparent

  &::before
    border-color: #f8f9fa transparent transparent

.pace-center-simple-light .pace
  background: #1f2d3d
  border-color: #f8f9fa

  .pace-progress
    background: #f8f9fa

.pace-material-light .pace
  color: #f8f9fa

.pace-corner-indicator-light .pace .pace-activity
  background: #f8f9fa

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(248, 249, 250, 0.2)
    border-left-color: rgba(248, 249, 250, 0.2)

  &::after
    border-top-color: rgba(248, 249, 250, 0.2)
    border-bottom-color: rgba(248, 249, 250, 0.2)

.pace-fill-left-light .pace .pace-progress
  background-color: rgba(248, 249, 250, 0.2)

.pace-flash-light .pace
  .pace-progress
    background: #f8f9fa

  .pace-progress-inner
    box-shadow: 0 0 10px #f8f9fa,0 0 5px #f8f9fa

  .pace-activity
    border-top-color: #f8f9fa
    border-left-color: #f8f9fa

.pace-loading-bar-light .pace
  .pace-progress
    background: #f8f9fa
    color: #f8f9fa
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #f8f9fa,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-light .pace
  .pace-progress
    background-color: #f8f9fa
    box-shadow: inset -1px 0 #f8f9fa, inset 0 -1px #f8f9fa, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-light .pace-progress
  color: #f8f9fa

.pace-dark .pace .pace-progress
  background: #343a40

.pace-barber-shop-dark .pace
  background: #fff

  .pace-progress
    background: #343a40

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-dark .pace .pace-progress::after
  color: rgba(52, 58, 64, 0.2)

.pace-bounce-dark .pace .pace-activity
  background: #343a40

.pace-center-atom-dark
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #343a40
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #343a40

    &::after, &::before
      border-color: #343a40

.pace-center-circle-dark .pace .pace-progress
  background: rgba(52, 58, 64, 0.8)
  color: #fff

.pace-center-radar-dark .pace .pace-activity
  border-color: #343a40 transparent transparent

  &::before
    border-color: #343a40 transparent transparent

.pace-center-simple-dark .pace
  background: #fff
  border-color: #343a40

  .pace-progress
    background: #343a40

.pace-material-dark .pace
  color: #343a40

.pace-corner-indicator-dark .pace .pace-activity
  background: #343a40

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(52, 58, 64, 0.2)
    border-left-color: rgba(52, 58, 64, 0.2)

  &::after
    border-top-color: rgba(52, 58, 64, 0.2)
    border-bottom-color: rgba(52, 58, 64, 0.2)

.pace-fill-left-dark .pace .pace-progress
  background-color: rgba(52, 58, 64, 0.2)

.pace-flash-dark .pace
  .pace-progress
    background: #343a40

  .pace-progress-inner
    box-shadow: 0 0 10px #343a40,0 0 5px #343a40

  .pace-activity
    border-top-color: #343a40
    border-left-color: #343a40

.pace-loading-bar-dark .pace
  .pace-progress
    background: #343a40
    color: #343a40
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #343a40,inset 0 0 0 7px #fff

.pace-mac-osx-dark .pace
  .pace-progress
    background-color: #343a40
    box-shadow: inset -1px 0 #343a40, inset 0 -1px #343a40, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-dark .pace-progress
  color: #343a40

.pace-lightblue .pace .pace-progress
  background: #3c8dbc

.pace-barber-shop-lightblue .pace
  background: #fff

  .pace-progress
    background: #3c8dbc

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-lightblue .pace .pace-progress::after
  color: rgba(60, 141, 188, 0.2)

.pace-bounce-lightblue .pace .pace-activity
  background: #3c8dbc

.pace-center-atom-lightblue
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #3c8dbc
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #3c8dbc

    &::after, &::before
      border-color: #3c8dbc

.pace-center-circle-lightblue .pace .pace-progress
  background: rgba(60, 141, 188, 0.8)
  color: #fff

.pace-center-radar-lightblue .pace .pace-activity
  border-color: #3c8dbc transparent transparent

  &::before
    border-color: #3c8dbc transparent transparent

.pace-center-simple-lightblue .pace
  background: #fff
  border-color: #3c8dbc

  .pace-progress
    background: #3c8dbc

.pace-material-lightblue .pace
  color: #3c8dbc

.pace-corner-indicator-lightblue .pace .pace-activity
  background: #3c8dbc

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(60, 141, 188, 0.2)
    border-left-color: rgba(60, 141, 188, 0.2)

  &::after
    border-top-color: rgba(60, 141, 188, 0.2)
    border-bottom-color: rgba(60, 141, 188, 0.2)

.pace-fill-left-lightblue .pace .pace-progress
  background-color: rgba(60, 141, 188, 0.2)

.pace-flash-lightblue .pace
  .pace-progress
    background: #3c8dbc

  .pace-progress-inner
    box-shadow: 0 0 10px #3c8dbc,0 0 5px #3c8dbc

  .pace-activity
    border-top-color: #3c8dbc
    border-left-color: #3c8dbc

.pace-loading-bar-lightblue .pace
  .pace-progress
    background: #3c8dbc
    color: #3c8dbc
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #3c8dbc,inset 0 0 0 7px #fff

.pace-mac-osx-lightblue .pace
  .pace-progress
    background-color: #3c8dbc
    box-shadow: inset -1px 0 #3c8dbc, inset 0 -1px #3c8dbc, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-lightblue .pace-progress
  color: #3c8dbc

.pace-navy .pace .pace-progress
  background: #001f3f

.pace-barber-shop-navy .pace
  background: #fff

  .pace-progress
    background: #001f3f

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-navy .pace .pace-progress::after
  color: rgba(0, 31, 63, 0.2)

.pace-bounce-navy .pace .pace-activity
  background: #001f3f

.pace-center-atom-navy
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #001f3f
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #001f3f

    &::after, &::before
      border-color: #001f3f

.pace-center-circle-navy .pace .pace-progress
  background: rgba(0, 31, 63, 0.8)
  color: #fff

.pace-center-radar-navy .pace .pace-activity
  border-color: #001f3f transparent transparent

  &::before
    border-color: #001f3f transparent transparent

.pace-center-simple-navy .pace
  background: #fff
  border-color: #001f3f

  .pace-progress
    background: #001f3f

.pace-material-navy .pace
  color: #001f3f

.pace-corner-indicator-navy .pace .pace-activity
  background: #001f3f

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(0, 31, 63, 0.2)
    border-left-color: rgba(0, 31, 63, 0.2)

  &::after
    border-top-color: rgba(0, 31, 63, 0.2)
    border-bottom-color: rgba(0, 31, 63, 0.2)

.pace-fill-left-navy .pace .pace-progress
  background-color: rgba(0, 31, 63, 0.2)

.pace-flash-navy .pace
  .pace-progress
    background: #001f3f

  .pace-progress-inner
    box-shadow: 0 0 10px #001f3f,0 0 5px #001f3f

  .pace-activity
    border-top-color: #001f3f
    border-left-color: #001f3f

.pace-loading-bar-navy .pace
  .pace-progress
    background: #001f3f
    color: #001f3f
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #001f3f,inset 0 0 0 7px #fff

.pace-mac-osx-navy .pace
  .pace-progress
    background-color: #001f3f
    box-shadow: inset -1px 0 #001f3f, inset 0 -1px #001f3f, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-navy .pace-progress
  color: #001f3f

.pace-olive .pace .pace-progress
  background: #3d9970

.pace-barber-shop-olive .pace
  background: #fff

  .pace-progress
    background: #3d9970

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-olive .pace .pace-progress::after
  color: rgba(61, 153, 112, 0.2)

.pace-bounce-olive .pace .pace-activity
  background: #3d9970

.pace-center-atom-olive
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #3d9970
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #3d9970

    &::after, &::before
      border-color: #3d9970

.pace-center-circle-olive .pace .pace-progress
  background: rgba(61, 153, 112, 0.8)
  color: #fff

.pace-center-radar-olive .pace .pace-activity
  border-color: #3d9970 transparent transparent

  &::before
    border-color: #3d9970 transparent transparent

.pace-center-simple-olive .pace
  background: #fff
  border-color: #3d9970

  .pace-progress
    background: #3d9970

.pace-material-olive .pace
  color: #3d9970

.pace-corner-indicator-olive .pace .pace-activity
  background: #3d9970

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(61, 153, 112, 0.2)
    border-left-color: rgba(61, 153, 112, 0.2)

  &::after
    border-top-color: rgba(61, 153, 112, 0.2)
    border-bottom-color: rgba(61, 153, 112, 0.2)

.pace-fill-left-olive .pace .pace-progress
  background-color: rgba(61, 153, 112, 0.2)

.pace-flash-olive .pace
  .pace-progress
    background: #3d9970

  .pace-progress-inner
    box-shadow: 0 0 10px #3d9970,0 0 5px #3d9970

  .pace-activity
    border-top-color: #3d9970
    border-left-color: #3d9970

.pace-loading-bar-olive .pace
  .pace-progress
    background: #3d9970
    color: #3d9970
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #3d9970,inset 0 0 0 7px #fff

.pace-mac-osx-olive .pace
  .pace-progress
    background-color: #3d9970
    box-shadow: inset -1px 0 #3d9970, inset 0 -1px #3d9970, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-olive .pace-progress
  color: #3d9970

.pace-lime .pace .pace-progress
  background: #01ff70

.pace-barber-shop-lime .pace
  background: #1f2d3d

  .pace-progress
    background: #01ff70

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-lime .pace .pace-progress::after
  color: rgba(1, 255, 112, 0.2)

.pace-bounce-lime .pace .pace-activity
  background: #01ff70

.pace-center-atom-lime
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #01ff70
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #01ff70

    &::after, &::before
      border-color: #01ff70

.pace-center-circle-lime .pace .pace-progress
  background: rgba(1, 255, 112, 0.8)
  color: #1f2d3d

.pace-center-radar-lime .pace .pace-activity
  border-color: #01ff70 transparent transparent

  &::before
    border-color: #01ff70 transparent transparent

.pace-center-simple-lime .pace
  background: #1f2d3d
  border-color: #01ff70

  .pace-progress
    background: #01ff70

.pace-material-lime .pace
  color: #01ff70

.pace-corner-indicator-lime .pace .pace-activity
  background: #01ff70

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(1, 255, 112, 0.2)
    border-left-color: rgba(1, 255, 112, 0.2)

  &::after
    border-top-color: rgba(1, 255, 112, 0.2)
    border-bottom-color: rgba(1, 255, 112, 0.2)

.pace-fill-left-lime .pace .pace-progress
  background-color: rgba(1, 255, 112, 0.2)

.pace-flash-lime .pace
  .pace-progress
    background: #01ff70

  .pace-progress-inner
    box-shadow: 0 0 10px #01ff70,0 0 5px #01ff70

  .pace-activity
    border-top-color: #01ff70
    border-left-color: #01ff70

.pace-loading-bar-lime .pace
  .pace-progress
    background: #01ff70
    color: #01ff70
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #01ff70,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-lime .pace
  .pace-progress
    background-color: #01ff70
    box-shadow: inset -1px 0 #01ff70, inset 0 -1px #01ff70, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-lime .pace-progress
  color: #01ff70

.pace-fuchsia .pace .pace-progress
  background: #f012be

.pace-barber-shop-fuchsia .pace
  background: #fff

  .pace-progress
    background: #f012be

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-fuchsia .pace .pace-progress::after
  color: rgba(240, 18, 190, 0.2)

.pace-bounce-fuchsia .pace .pace-activity
  background: #f012be

.pace-center-atom-fuchsia
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #f012be
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #f012be

    &::after, &::before
      border-color: #f012be

.pace-center-circle-fuchsia .pace .pace-progress
  background: rgba(240, 18, 190, 0.8)
  color: #fff

.pace-center-radar-fuchsia .pace .pace-activity
  border-color: #f012be transparent transparent

  &::before
    border-color: #f012be transparent transparent

.pace-center-simple-fuchsia .pace
  background: #fff
  border-color: #f012be

  .pace-progress
    background: #f012be

.pace-material-fuchsia .pace
  color: #f012be

.pace-corner-indicator-fuchsia .pace .pace-activity
  background: #f012be

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(240, 18, 190, 0.2)
    border-left-color: rgba(240, 18, 190, 0.2)

  &::after
    border-top-color: rgba(240, 18, 190, 0.2)
    border-bottom-color: rgba(240, 18, 190, 0.2)

.pace-fill-left-fuchsia .pace .pace-progress
  background-color: rgba(240, 18, 190, 0.2)

.pace-flash-fuchsia .pace
  .pace-progress
    background: #f012be

  .pace-progress-inner
    box-shadow: 0 0 10px #f012be,0 0 5px #f012be

  .pace-activity
    border-top-color: #f012be
    border-left-color: #f012be

.pace-loading-bar-fuchsia .pace
  .pace-progress
    background: #f012be
    color: #f012be
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #f012be,inset 0 0 0 7px #fff

.pace-mac-osx-fuchsia .pace
  .pace-progress
    background-color: #f012be
    box-shadow: inset -1px 0 #f012be, inset 0 -1px #f012be, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-fuchsia .pace-progress
  color: #f012be

.pace-maroon .pace .pace-progress
  background: #d81b60

.pace-barber-shop-maroon .pace
  background: #fff

  .pace-progress
    background: #d81b60

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-maroon .pace .pace-progress::after
  color: rgba(216, 27, 96, 0.2)

.pace-bounce-maroon .pace .pace-activity
  background: #d81b60

.pace-center-atom-maroon
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #d81b60
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #d81b60

    &::after, &::before
      border-color: #d81b60

.pace-center-circle-maroon .pace .pace-progress
  background: rgba(216, 27, 96, 0.8)
  color: #fff

.pace-center-radar-maroon .pace .pace-activity
  border-color: #d81b60 transparent transparent

  &::before
    border-color: #d81b60 transparent transparent

.pace-center-simple-maroon .pace
  background: #fff
  border-color: #d81b60

  .pace-progress
    background: #d81b60

.pace-material-maroon .pace
  color: #d81b60

.pace-corner-indicator-maroon .pace .pace-activity
  background: #d81b60

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(216, 27, 96, 0.2)
    border-left-color: rgba(216, 27, 96, 0.2)

  &::after
    border-top-color: rgba(216, 27, 96, 0.2)
    border-bottom-color: rgba(216, 27, 96, 0.2)

.pace-fill-left-maroon .pace .pace-progress
  background-color: rgba(216, 27, 96, 0.2)

.pace-flash-maroon .pace
  .pace-progress
    background: #d81b60

  .pace-progress-inner
    box-shadow: 0 0 10px #d81b60,0 0 5px #d81b60

  .pace-activity
    border-top-color: #d81b60
    border-left-color: #d81b60

.pace-loading-bar-maroon .pace
  .pace-progress
    background: #d81b60
    color: #d81b60
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #d81b60,inset 0 0 0 7px #fff

.pace-mac-osx-maroon .pace
  .pace-progress
    background-color: #d81b60
    box-shadow: inset -1px 0 #d81b60, inset 0 -1px #d81b60, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-maroon .pace-progress
  color: #d81b60

.pace-blue .pace .pace-progress
  background: #007bff

.pace-barber-shop-blue .pace
  background: #fff

  .pace-progress
    background: #007bff

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-blue .pace .pace-progress::after
  color: rgba(0, 123, 255, 0.2)

.pace-bounce-blue .pace .pace-activity
  background: #007bff

.pace-center-atom-blue
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #007bff
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #007bff

    &::after, &::before
      border-color: #007bff

.pace-center-circle-blue .pace .pace-progress
  background: rgba(0, 123, 255, 0.8)
  color: #fff

.pace-center-radar-blue .pace .pace-activity
  border-color: #007bff transparent transparent

  &::before
    border-color: #007bff transparent transparent

.pace-center-simple-blue .pace
  background: #fff
  border-color: #007bff

  .pace-progress
    background: #007bff

.pace-material-blue .pace
  color: #007bff

.pace-corner-indicator-blue .pace .pace-activity
  background: #007bff

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(0, 123, 255, 0.2)
    border-left-color: rgba(0, 123, 255, 0.2)

  &::after
    border-top-color: rgba(0, 123, 255, 0.2)
    border-bottom-color: rgba(0, 123, 255, 0.2)

.pace-fill-left-blue .pace .pace-progress
  background-color: rgba(0, 123, 255, 0.2)

.pace-flash-blue .pace
  .pace-progress
    background: #007bff

  .pace-progress-inner
    box-shadow: 0 0 10px #007bff,0 0 5px #007bff

  .pace-activity
    border-top-color: #007bff
    border-left-color: #007bff

.pace-loading-bar-blue .pace
  .pace-progress
    background: #007bff
    color: #007bff
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #007bff,inset 0 0 0 7px #fff

.pace-mac-osx-blue .pace
  .pace-progress
    background-color: #007bff
    box-shadow: inset -1px 0 #007bff, inset 0 -1px #007bff, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-blue .pace-progress
  color: #007bff

.pace-indigo .pace .pace-progress
  background: #6610f2

.pace-barber-shop-indigo .pace
  background: #fff

  .pace-progress
    background: #6610f2

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-indigo .pace .pace-progress::after
  color: rgba(102, 16, 242, 0.2)

.pace-bounce-indigo .pace .pace-activity
  background: #6610f2

.pace-center-atom-indigo
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #6610f2
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #6610f2

    &::after, &::before
      border-color: #6610f2

.pace-center-circle-indigo .pace .pace-progress
  background: rgba(102, 16, 242, 0.8)
  color: #fff

.pace-center-radar-indigo .pace .pace-activity
  border-color: #6610f2 transparent transparent

  &::before
    border-color: #6610f2 transparent transparent

.pace-center-simple-indigo .pace
  background: #fff
  border-color: #6610f2

  .pace-progress
    background: #6610f2

.pace-material-indigo .pace
  color: #6610f2

.pace-corner-indicator-indigo .pace .pace-activity
  background: #6610f2

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(102, 16, 242, 0.2)
    border-left-color: rgba(102, 16, 242, 0.2)

  &::after
    border-top-color: rgba(102, 16, 242, 0.2)
    border-bottom-color: rgba(102, 16, 242, 0.2)

.pace-fill-left-indigo .pace .pace-progress
  background-color: rgba(102, 16, 242, 0.2)

.pace-flash-indigo .pace
  .pace-progress
    background: #6610f2

  .pace-progress-inner
    box-shadow: 0 0 10px #6610f2,0 0 5px #6610f2

  .pace-activity
    border-top-color: #6610f2
    border-left-color: #6610f2

.pace-loading-bar-indigo .pace
  .pace-progress
    background: #6610f2
    color: #6610f2
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #6610f2,inset 0 0 0 7px #fff

.pace-mac-osx-indigo .pace
  .pace-progress
    background-color: #6610f2
    box-shadow: inset -1px 0 #6610f2, inset 0 -1px #6610f2, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-indigo .pace-progress
  color: #6610f2

.pace-purple .pace .pace-progress
  background: #6f42c1

.pace-barber-shop-purple .pace
  background: #fff

  .pace-progress
    background: #6f42c1

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-purple .pace .pace-progress::after
  color: rgba(111, 66, 193, 0.2)

.pace-bounce-purple .pace .pace-activity
  background: #6f42c1

.pace-center-atom-purple
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #6f42c1
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #6f42c1

    &::after, &::before
      border-color: #6f42c1

.pace-center-circle-purple .pace .pace-progress
  background: rgba(111, 66, 193, 0.8)
  color: #fff

.pace-center-radar-purple .pace .pace-activity
  border-color: #6f42c1 transparent transparent

  &::before
    border-color: #6f42c1 transparent transparent

.pace-center-simple-purple .pace
  background: #fff
  border-color: #6f42c1

  .pace-progress
    background: #6f42c1

.pace-material-purple .pace
  color: #6f42c1

.pace-corner-indicator-purple .pace .pace-activity
  background: #6f42c1

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(111, 66, 193, 0.2)
    border-left-color: rgba(111, 66, 193, 0.2)

  &::after
    border-top-color: rgba(111, 66, 193, 0.2)
    border-bottom-color: rgba(111, 66, 193, 0.2)

.pace-fill-left-purple .pace .pace-progress
  background-color: rgba(111, 66, 193, 0.2)

.pace-flash-purple .pace
  .pace-progress
    background: #6f42c1

  .pace-progress-inner
    box-shadow: 0 0 10px #6f42c1,0 0 5px #6f42c1

  .pace-activity
    border-top-color: #6f42c1
    border-left-color: #6f42c1

.pace-loading-bar-purple .pace
  .pace-progress
    background: #6f42c1
    color: #6f42c1
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #6f42c1,inset 0 0 0 7px #fff

.pace-mac-osx-purple .pace
  .pace-progress
    background-color: #6f42c1
    box-shadow: inset -1px 0 #6f42c1, inset 0 -1px #6f42c1, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-purple .pace-progress
  color: #6f42c1

.pace-pink .pace .pace-progress
  background: #e83e8c

.pace-barber-shop-pink .pace
  background: #fff

  .pace-progress
    background: #e83e8c

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-pink .pace .pace-progress::after
  color: rgba(232, 62, 140, 0.2)

.pace-bounce-pink .pace .pace-activity
  background: #e83e8c

.pace-center-atom-pink
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #e83e8c
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #e83e8c

    &::after, &::before
      border-color: #e83e8c

.pace-center-circle-pink .pace .pace-progress
  background: rgba(232, 62, 140, 0.8)
  color: #fff

.pace-center-radar-pink .pace .pace-activity
  border-color: #e83e8c transparent transparent

  &::before
    border-color: #e83e8c transparent transparent

.pace-center-simple-pink .pace
  background: #fff
  border-color: #e83e8c

  .pace-progress
    background: #e83e8c

.pace-material-pink .pace
  color: #e83e8c

.pace-corner-indicator-pink .pace .pace-activity
  background: #e83e8c

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(232, 62, 140, 0.2)
    border-left-color: rgba(232, 62, 140, 0.2)

  &::after
    border-top-color: rgba(232, 62, 140, 0.2)
    border-bottom-color: rgba(232, 62, 140, 0.2)

.pace-fill-left-pink .pace .pace-progress
  background-color: rgba(232, 62, 140, 0.2)

.pace-flash-pink .pace
  .pace-progress
    background: #e83e8c

  .pace-progress-inner
    box-shadow: 0 0 10px #e83e8c,0 0 5px #e83e8c

  .pace-activity
    border-top-color: #e83e8c
    border-left-color: #e83e8c

.pace-loading-bar-pink .pace
  .pace-progress
    background: #e83e8c
    color: #e83e8c
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #e83e8c,inset 0 0 0 7px #fff

.pace-mac-osx-pink .pace
  .pace-progress
    background-color: #e83e8c
    box-shadow: inset -1px 0 #e83e8c, inset 0 -1px #e83e8c, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-pink .pace-progress
  color: #e83e8c

.pace-red .pace .pace-progress
  background: #dc3545

.pace-barber-shop-red .pace
  background: #fff

  .pace-progress
    background: #dc3545

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-red .pace .pace-progress::after
  color: rgba(220, 53, 69, 0.2)

.pace-bounce-red .pace .pace-activity
  background: #dc3545

.pace-center-atom-red
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #dc3545
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #dc3545

    &::after, &::before
      border-color: #dc3545

.pace-center-circle-red .pace .pace-progress
  background: rgba(220, 53, 69, 0.8)
  color: #fff

.pace-center-radar-red .pace .pace-activity
  border-color: #dc3545 transparent transparent

  &::before
    border-color: #dc3545 transparent transparent

.pace-center-simple-red .pace
  background: #fff
  border-color: #dc3545

  .pace-progress
    background: #dc3545

.pace-material-red .pace
  color: #dc3545

.pace-corner-indicator-red .pace .pace-activity
  background: #dc3545

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(220, 53, 69, 0.2)
    border-left-color: rgba(220, 53, 69, 0.2)

  &::after
    border-top-color: rgba(220, 53, 69, 0.2)
    border-bottom-color: rgba(220, 53, 69, 0.2)

.pace-fill-left-red .pace .pace-progress
  background-color: rgba(220, 53, 69, 0.2)

.pace-flash-red .pace
  .pace-progress
    background: #dc3545

  .pace-progress-inner
    box-shadow: 0 0 10px #dc3545,0 0 5px #dc3545

  .pace-activity
    border-top-color: #dc3545
    border-left-color: #dc3545

.pace-loading-bar-red .pace
  .pace-progress
    background: #dc3545
    color: #dc3545
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #dc3545,inset 0 0 0 7px #fff

.pace-mac-osx-red .pace
  .pace-progress
    background-color: #dc3545
    box-shadow: inset -1px 0 #dc3545, inset 0 -1px #dc3545, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-red .pace-progress
  color: #dc3545

.pace-orange .pace .pace-progress
  background: #fd7e14

.pace-barber-shop-orange .pace
  background: #1f2d3d

  .pace-progress
    background: #fd7e14

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-orange .pace .pace-progress::after
  color: rgba(253, 126, 20, 0.2)

.pace-bounce-orange .pace .pace-activity
  background: #fd7e14

.pace-center-atom-orange
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #fd7e14
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #fd7e14

    &::after, &::before
      border-color: #fd7e14

.pace-center-circle-orange .pace .pace-progress
  background: rgba(253, 126, 20, 0.8)
  color: #1f2d3d

.pace-center-radar-orange .pace .pace-activity
  border-color: #fd7e14 transparent transparent

  &::before
    border-color: #fd7e14 transparent transparent

.pace-center-simple-orange .pace
  background: #1f2d3d
  border-color: #fd7e14

  .pace-progress
    background: #fd7e14

.pace-material-orange .pace
  color: #fd7e14

.pace-corner-indicator-orange .pace .pace-activity
  background: #fd7e14

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(253, 126, 20, 0.2)
    border-left-color: rgba(253, 126, 20, 0.2)

  &::after
    border-top-color: rgba(253, 126, 20, 0.2)
    border-bottom-color: rgba(253, 126, 20, 0.2)

.pace-fill-left-orange .pace .pace-progress
  background-color: rgba(253, 126, 20, 0.2)

.pace-flash-orange .pace
  .pace-progress
    background: #fd7e14

  .pace-progress-inner
    box-shadow: 0 0 10px #fd7e14,0 0 5px #fd7e14

  .pace-activity
    border-top-color: #fd7e14
    border-left-color: #fd7e14

.pace-loading-bar-orange .pace
  .pace-progress
    background: #fd7e14
    color: #fd7e14
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #fd7e14,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-orange .pace
  .pace-progress
    background-color: #fd7e14
    box-shadow: inset -1px 0 #fd7e14, inset 0 -1px #fd7e14, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-orange .pace-progress
  color: #fd7e14

.pace-yellow .pace .pace-progress
  background: #ffc107

.pace-barber-shop-yellow .pace
  background: #1f2d3d

  .pace-progress
    background: #ffc107

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-yellow .pace .pace-progress::after
  color: rgba(255, 193, 7, 0.2)

.pace-bounce-yellow .pace .pace-activity
  background: #ffc107

.pace-center-atom-yellow
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #ffc107
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #ffc107

    &::after, &::before
      border-color: #ffc107

.pace-center-circle-yellow .pace .pace-progress
  background: rgba(255, 193, 7, 0.8)
  color: #1f2d3d

.pace-center-radar-yellow .pace .pace-activity
  border-color: #ffc107 transparent transparent

  &::before
    border-color: #ffc107 transparent transparent

.pace-center-simple-yellow .pace
  background: #1f2d3d
  border-color: #ffc107

  .pace-progress
    background: #ffc107

.pace-material-yellow .pace
  color: #ffc107

.pace-corner-indicator-yellow .pace .pace-activity
  background: #ffc107

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(255, 193, 7, 0.2)
    border-left-color: rgba(255, 193, 7, 0.2)

  &::after
    border-top-color: rgba(255, 193, 7, 0.2)
    border-bottom-color: rgba(255, 193, 7, 0.2)

.pace-fill-left-yellow .pace .pace-progress
  background-color: rgba(255, 193, 7, 0.2)

.pace-flash-yellow .pace
  .pace-progress
    background: #ffc107

  .pace-progress-inner
    box-shadow: 0 0 10px #ffc107,0 0 5px #ffc107

  .pace-activity
    border-top-color: #ffc107
    border-left-color: #ffc107

.pace-loading-bar-yellow .pace
  .pace-progress
    background: #ffc107
    color: #ffc107
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #ffc107,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-yellow .pace
  .pace-progress
    background-color: #ffc107
    box-shadow: inset -1px 0 #ffc107, inset 0 -1px #ffc107, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-yellow .pace-progress
  color: #ffc107

.pace-green .pace .pace-progress
  background: #28a745

.pace-barber-shop-green .pace
  background: #fff

  .pace-progress
    background: #28a745

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-green .pace .pace-progress::after
  color: rgba(40, 167, 69, 0.2)

.pace-bounce-green .pace .pace-activity
  background: #28a745

.pace-center-atom-green
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #28a745
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #28a745

    &::after, &::before
      border-color: #28a745

.pace-center-circle-green .pace .pace-progress
  background: rgba(40, 167, 69, 0.8)
  color: #fff

.pace-center-radar-green .pace .pace-activity
  border-color: #28a745 transparent transparent

  &::before
    border-color: #28a745 transparent transparent

.pace-center-simple-green .pace
  background: #fff
  border-color: #28a745

  .pace-progress
    background: #28a745

.pace-material-green .pace
  color: #28a745

.pace-corner-indicator-green .pace .pace-activity
  background: #28a745

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(40, 167, 69, 0.2)
    border-left-color: rgba(40, 167, 69, 0.2)

  &::after
    border-top-color: rgba(40, 167, 69, 0.2)
    border-bottom-color: rgba(40, 167, 69, 0.2)

.pace-fill-left-green .pace .pace-progress
  background-color: rgba(40, 167, 69, 0.2)

.pace-flash-green .pace
  .pace-progress
    background: #28a745

  .pace-progress-inner
    box-shadow: 0 0 10px #28a745,0 0 5px #28a745

  .pace-activity
    border-top-color: #28a745
    border-left-color: #28a745

.pace-loading-bar-green .pace
  .pace-progress
    background: #28a745
    color: #28a745
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #28a745,inset 0 0 0 7px #fff

.pace-mac-osx-green .pace
  .pace-progress
    background-color: #28a745
    box-shadow: inset -1px 0 #28a745, inset 0 -1px #28a745, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-green .pace-progress
  color: #28a745

.pace-teal .pace .pace-progress
  background: #20c997

.pace-barber-shop-teal .pace
  background: #fff

  .pace-progress
    background: #20c997

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-teal .pace .pace-progress::after
  color: rgba(32, 201, 151, 0.2)

.pace-bounce-teal .pace .pace-activity
  background: #20c997

.pace-center-atom-teal
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #20c997
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #20c997

    &::after, &::before
      border-color: #20c997

.pace-center-circle-teal .pace .pace-progress
  background: rgba(32, 201, 151, 0.8)
  color: #fff

.pace-center-radar-teal .pace .pace-activity
  border-color: #20c997 transparent transparent

  &::before
    border-color: #20c997 transparent transparent

.pace-center-simple-teal .pace
  background: #fff
  border-color: #20c997

  .pace-progress
    background: #20c997

.pace-material-teal .pace
  color: #20c997

.pace-corner-indicator-teal .pace .pace-activity
  background: #20c997

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(32, 201, 151, 0.2)
    border-left-color: rgba(32, 201, 151, 0.2)

  &::after
    border-top-color: rgba(32, 201, 151, 0.2)
    border-bottom-color: rgba(32, 201, 151, 0.2)

.pace-fill-left-teal .pace .pace-progress
  background-color: rgba(32, 201, 151, 0.2)

.pace-flash-teal .pace
  .pace-progress
    background: #20c997

  .pace-progress-inner
    box-shadow: 0 0 10px #20c997,0 0 5px #20c997

  .pace-activity
    border-top-color: #20c997
    border-left-color: #20c997

.pace-loading-bar-teal .pace
  .pace-progress
    background: #20c997
    color: #20c997
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #20c997,inset 0 0 0 7px #fff

.pace-mac-osx-teal .pace
  .pace-progress
    background-color: #20c997
    box-shadow: inset -1px 0 #20c997, inset 0 -1px #20c997, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-teal .pace-progress
  color: #20c997

.pace-cyan .pace .pace-progress
  background: #17a2b8

.pace-barber-shop-cyan .pace
  background: #fff

  .pace-progress
    background: #17a2b8

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-cyan .pace .pace-progress::after
  color: rgba(23, 162, 184, 0.2)

.pace-bounce-cyan .pace .pace-activity
  background: #17a2b8

.pace-center-atom-cyan
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #17a2b8
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #17a2b8

    &::after, &::before
      border-color: #17a2b8

.pace-center-circle-cyan .pace .pace-progress
  background: rgba(23, 162, 184, 0.8)
  color: #fff

.pace-center-radar-cyan .pace .pace-activity
  border-color: #17a2b8 transparent transparent

  &::before
    border-color: #17a2b8 transparent transparent

.pace-center-simple-cyan .pace
  background: #fff
  border-color: #17a2b8

  .pace-progress
    background: #17a2b8

.pace-material-cyan .pace
  color: #17a2b8

.pace-corner-indicator-cyan .pace .pace-activity
  background: #17a2b8

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(23, 162, 184, 0.2)
    border-left-color: rgba(23, 162, 184, 0.2)

  &::after
    border-top-color: rgba(23, 162, 184, 0.2)
    border-bottom-color: rgba(23, 162, 184, 0.2)

.pace-fill-left-cyan .pace .pace-progress
  background-color: rgba(23, 162, 184, 0.2)

.pace-flash-cyan .pace
  .pace-progress
    background: #17a2b8

  .pace-progress-inner
    box-shadow: 0 0 10px #17a2b8,0 0 5px #17a2b8

  .pace-activity
    border-top-color: #17a2b8
    border-left-color: #17a2b8

.pace-loading-bar-cyan .pace
  .pace-progress
    background: #17a2b8
    color: #17a2b8
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #17a2b8,inset 0 0 0 7px #fff

.pace-mac-osx-cyan .pace
  .pace-progress
    background-color: #17a2b8
    box-shadow: inset -1px 0 #17a2b8, inset 0 -1px #17a2b8, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-cyan .pace-progress
  color: #17a2b8

.pace-white .pace .pace-progress
  background: #fff

.pace-barber-shop-white .pace
  background: #1f2d3d

  .pace-progress
    background: #fff

  .pace-activity
    background-image: linear-gradient(45deg, rgba(31, 45, 61, 0.2) 25%, transparent 25%, transparent 50%, rgba(31, 45, 61, 0.2) 50%, rgba(31, 45, 61, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-white .pace .pace-progress::after
  color: rgba(255, 255, 255, 0.2)

.pace-bounce-white .pace .pace-activity
  background: #fff

.pace-center-atom-white
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #fff
      color: #1f2d3d
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #fff

    &::after, &::before
      border-color: #fff

.pace-center-circle-white .pace .pace-progress
  background: rgba(255, 255, 255, 0.8)
  color: #1f2d3d

.pace-center-radar-white .pace .pace-activity
  border-color: #fff transparent transparent

  &::before
    border-color: #fff transparent transparent

.pace-center-simple-white .pace
  background: #1f2d3d
  border-color: #fff

  .pace-progress
    background: #fff

.pace-material-white .pace
  color: #fff

.pace-corner-indicator-white .pace .pace-activity
  background: #fff

  &::after
    border: 5px solid #1f2d3d

  &::before
    border: 5px solid #1f2d3d
    border-right-color: rgba(255, 255, 255, 0.2)
    border-left-color: rgba(255, 255, 255, 0.2)

  &::after
    border-top-color: rgba(255, 255, 255, 0.2)
    border-bottom-color: rgba(255, 255, 255, 0.2)

.pace-fill-left-white .pace .pace-progress
  background-color: rgba(255, 255, 255, 0.2)

.pace-flash-white .pace
  .pace-progress
    background: #fff

  .pace-progress-inner
    box-shadow: 0 0 10px #fff,0 0 5px #fff

  .pace-activity
    border-top-color: #fff
    border-left-color: #fff

.pace-loading-bar-white .pace
  .pace-progress
    background: #fff
    color: #fff
    box-shadow: 120px 0 #1f2d3d,240px 0 #1f2d3d

  .pace-activity
    box-shadow: inset 0 0 0 2px #fff,inset 0 0 0 7px #1f2d3d

.pace-mac-osx-white .pace
  .pace-progress
    background-color: #fff
    box-shadow: inset -1px 0 #fff, inset 0 -1px #fff, inset 0 2px rgba(31, 45, 61, 0.5), inset 0 6px rgba(31, 45, 61, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(31, 45, 61, 0.65) 0, rgba(31, 45, 61, 0.15) 100%)
    height: 12px

.pace-progress-color-white .pace-progress
  color: #fff

.pace-gray .pace .pace-progress
  background: #6c757d

.pace-barber-shop-gray .pace
  background: #fff

  .pace-progress
    background: #6c757d

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-gray .pace .pace-progress::after
  color: rgba(108, 117, 125, 0.2)

.pace-bounce-gray .pace .pace-activity
  background: #6c757d

.pace-center-atom-gray
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #6c757d
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #6c757d

    &::after, &::before
      border-color: #6c757d

.pace-center-circle-gray .pace .pace-progress
  background: rgba(108, 117, 125, 0.8)
  color: #fff

.pace-center-radar-gray .pace .pace-activity
  border-color: #6c757d transparent transparent

  &::before
    border-color: #6c757d transparent transparent

.pace-center-simple-gray .pace
  background: #fff
  border-color: #6c757d

  .pace-progress
    background: #6c757d

.pace-material-gray .pace
  color: #6c757d

.pace-corner-indicator-gray .pace .pace-activity
  background: #6c757d

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(108, 117, 125, 0.2)
    border-left-color: rgba(108, 117, 125, 0.2)

  &::after
    border-top-color: rgba(108, 117, 125, 0.2)
    border-bottom-color: rgba(108, 117, 125, 0.2)

.pace-fill-left-gray .pace .pace-progress
  background-color: rgba(108, 117, 125, 0.2)

.pace-flash-gray .pace
  .pace-progress
    background: #6c757d

  .pace-progress-inner
    box-shadow: 0 0 10px #6c757d,0 0 5px #6c757d

  .pace-activity
    border-top-color: #6c757d
    border-left-color: #6c757d

.pace-loading-bar-gray .pace
  .pace-progress
    background: #6c757d
    color: #6c757d
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #6c757d,inset 0 0 0 7px #fff

.pace-mac-osx-gray .pace
  .pace-progress
    background-color: #6c757d
    box-shadow: inset -1px 0 #6c757d, inset 0 -1px #6c757d, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-gray .pace-progress
  color: #6c757d

.pace-gray-dark .pace .pace-progress
  background: #343a40

.pace-barber-shop-gray-dark .pace
  background: #fff

  .pace-progress
    background: #343a40

  .pace-activity
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent)

.pace-big-counter-gray-dark .pace .pace-progress::after
  color: rgba(52, 58, 64, 0.2)

.pace-bounce-gray-dark .pace .pace-activity
  background: #343a40

.pace-center-atom-gray-dark
  .pace-progress
    height: 100px
    width: 80px

    &::before
      background: #343a40
      color: #fff
      font-size: .8rem
      line-height: .7rem
      padding-top: 17%

  .pace-activity
    border-color: #343a40

    &::after, &::before
      border-color: #343a40

.pace-center-circle-gray-dark .pace .pace-progress
  background: rgba(52, 58, 64, 0.8)
  color: #fff

.pace-center-radar-gray-dark .pace .pace-activity
  border-color: #343a40 transparent transparent

  &::before
    border-color: #343a40 transparent transparent

.pace-center-simple-gray-dark .pace
  background: #fff
  border-color: #343a40

  .pace-progress
    background: #343a40

.pace-material-gray-dark .pace
  color: #343a40

.pace-corner-indicator-gray-dark .pace .pace-activity
  background: #343a40

  &::after
    border: 5px solid #fff

  &::before
    border: 5px solid #fff
    border-right-color: rgba(52, 58, 64, 0.2)
    border-left-color: rgba(52, 58, 64, 0.2)

  &::after
    border-top-color: rgba(52, 58, 64, 0.2)
    border-bottom-color: rgba(52, 58, 64, 0.2)

.pace-fill-left-gray-dark .pace .pace-progress
  background-color: rgba(52, 58, 64, 0.2)

.pace-flash-gray-dark .pace
  .pace-progress
    background: #343a40

  .pace-progress-inner
    box-shadow: 0 0 10px #343a40,0 0 5px #343a40

  .pace-activity
    border-top-color: #343a40
    border-left-color: #343a40

.pace-loading-bar-gray-dark .pace
  .pace-progress
    background: #343a40
    color: #343a40
    box-shadow: 120px 0 #fff,240px 0 #fff

  .pace-activity
    box-shadow: inset 0 0 0 2px #343a40,inset 0 0 0 7px #fff

.pace-mac-osx-gray-dark .pace
  .pace-progress
    background-color: #343a40
    box-shadow: inset -1px 0 #343a40, inset 0 -1px #343a40, inset 0 2px rgba(255, 255, 255, 0.5), inset 0 6px rgba(255, 255, 255, 0.3)

  .pace-activity
    background-image: radial-gradient(rgba(255, 255, 255, 0.65) 0, rgba(255, 255, 255, 0.15) 100%)
    height: 12px

.pace-progress-color-gray-dark .pace-progress
  color: #343a40

.bootstrap-switch
  border: 1px solid #ced4da
  border-radius: .25rem
  cursor: pointer
  direction: ltr
  display: inline-block
  line-height: .5rem
  overflow: hidden
  position: relative
  text-align: left
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s
  -webkit-user-select: none
  -moz-user-select: none
  -ms-user-select: none
  user-select: none
  vertical-align: middle
  z-index: 0

  .bootstrap-switch-container
    border-radius: .25rem
    display: inline-block
    top: 0
    transform: translate3d(0, 0, 0)

  &:focus-within
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25)

  .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
    box-sizing: border-box
    cursor: pointer
    display: table-cell
    font-size: 1rem
    font-weight: 500
    line-height: 1.2rem
    padding: .25rem .5rem
    vertical-align: middle

  .bootstrap-switch-handle-off, .bootstrap-switch-handle-on
    text-align: center
    z-index: 1

  .bootstrap-switch-handle-off.bootstrap-switch-default, .bootstrap-switch-handle-on.bootstrap-switch-default
    background: #e9ecef
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-primary, .bootstrap-switch-handle-on.bootstrap-switch-primary
    background: #007bff
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-secondary, .bootstrap-switch-handle-on.bootstrap-switch-secondary
    background: #6c757d
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-success, .bootstrap-switch-handle-on.bootstrap-switch-success
    background: #28a745
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-info, .bootstrap-switch-handle-on.bootstrap-switch-info
    background: #17a2b8
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-warning, .bootstrap-switch-handle-on.bootstrap-switch-warning
    background: #ffc107
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-danger, .bootstrap-switch-handle-on.bootstrap-switch-danger
    background: #dc3545
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-light, .bootstrap-switch-handle-on.bootstrap-switch-light
    background: #f8f9fa
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-dark, .bootstrap-switch-handle-on.bootstrap-switch-dark
    background: #343a40
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-lightblue, .bootstrap-switch-handle-on.bootstrap-switch-lightblue
    background: #3c8dbc
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-navy, .bootstrap-switch-handle-on.bootstrap-switch-navy
    background: #001f3f
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-olive, .bootstrap-switch-handle-on.bootstrap-switch-olive
    background: #3d9970
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-lime, .bootstrap-switch-handle-on.bootstrap-switch-lime
    background: #01ff70
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-fuchsia, .bootstrap-switch-handle-on.bootstrap-switch-fuchsia
    background: #f012be
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-maroon, .bootstrap-switch-handle-on.bootstrap-switch-maroon
    background: #d81b60
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-blue, .bootstrap-switch-handle-on.bootstrap-switch-blue
    background: #007bff
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-indigo, .bootstrap-switch-handle-on.bootstrap-switch-indigo
    background: #6610f2
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-purple, .bootstrap-switch-handle-on.bootstrap-switch-purple
    background: #6f42c1
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-pink, .bootstrap-switch-handle-on.bootstrap-switch-pink
    background: #e83e8c
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-red, .bootstrap-switch-handle-on.bootstrap-switch-red
    background: #dc3545
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-orange, .bootstrap-switch-handle-on.bootstrap-switch-orange
    background: #fd7e14
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-yellow, .bootstrap-switch-handle-on.bootstrap-switch-yellow
    background: #ffc107
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-green, .bootstrap-switch-handle-on.bootstrap-switch-green
    background: #28a745
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-teal, .bootstrap-switch-handle-on.bootstrap-switch-teal
    background: #20c997
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-cyan, .bootstrap-switch-handle-on.bootstrap-switch-cyan
    background: #17a2b8
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-white, .bootstrap-switch-handle-on.bootstrap-switch-white
    background: #fff
    color: #1f2d3d

  .bootstrap-switch-handle-off.bootstrap-switch-gray, .bootstrap-switch-handle-on.bootstrap-switch-gray
    background: #6c757d
    color: #fff

  .bootstrap-switch-handle-off.bootstrap-switch-gray-dark
    background: #343a40
    color: #fff

  .bootstrap-switch-handle-on
    &.bootstrap-switch-gray-dark
      background: #343a40
      color: #fff

    border-bottom-left-radius: .1rem
    border-top-left-radius: .1rem

  .bootstrap-switch-handle-off
    border-bottom-right-radius: .1rem
    border-top-right-radius: .1rem

  input
    &[type=checkbox], &[type=radio]
      left: 0
      margin: 0
      opacity: 0
      position: absolute
      top: 0
      visibility: hidden
      z-index: -1

  &.bootstrap-switch-mini
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      font-size: .875rem
      line-height: 1.5
      padding: .1rem .3rem

  &.bootstrap-switch-small
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      font-size: .875rem
      line-height: 1.5
      padding: .2rem .4rem

  &.bootstrap-switch-large
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      font-size: 1.25rem
      line-height: 1.3333333rem
      padding: .3rem .5rem

  &.bootstrap-switch-disabled, &.bootstrap-switch-indeterminate, &.bootstrap-switch-readonly
    cursor: default

  &.bootstrap-switch-disabled
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      cursor: default
      opacity: .5

  &.bootstrap-switch-indeterminate
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      cursor: default
      opacity: .5

  &.bootstrap-switch-readonly
    .bootstrap-switch-handle-off, .bootstrap-switch-handle-on, .bootstrap-switch-label
      cursor: default
      opacity: .5

  &.bootstrap-switch-animate .bootstrap-switch-container
    transition: margin-left .5s

  &.bootstrap-switch-inverse
    .bootstrap-switch-handle-on
      border-radius: 0 .1rem .1rem 0

    .bootstrap-switch-handle-off
      border-radius: .1rem 0 0 .1rem

    &.bootstrap-switch-off .bootstrap-switch-label
      border-bottom-right-radius: .1rem
      border-top-right-radius: .1rem

  &.bootstrap-switch-on .bootstrap-switch-label
    border-bottom-right-radius: .1rem
    border-top-right-radius: .1rem

  &.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label, &.bootstrap-switch-off .bootstrap-switch-label
    border-bottom-left-radius: .1rem
    border-top-left-radius: .1rem

.dark-mode .bootstrap-switch
  border-color: #6c757d

  .bootstrap-switch-handle-off.bootstrap-switch-default, .bootstrap-switch-handle-on.bootstrap-switch-default
    background-color: #3a4047
    color: #fff
    border-color: #454d55

.jqstooltip
  height: auto !important
  padding: 5px !important
  width: auto !important

.connectedSortable
  min-height: 100px

.ui-helper-hidden-accessible
  border: 0
  clip: rect(0 0 0 0)
  height: 1px
  margin: -1px
  overflow: hidden
  padding: 0
  position: absolute
  width: 1px

.sort-highlight
  background: #f8f9fa
  border: 1px dashed #dee2e6
  margin-bottom: 10px

.chart
  overflow: hidden
  position: relative

.dark-mode
  .irs--flat .irs-line
    background-color: #4b545c

  .jsgrid-alt-row > .jsgrid-cell, .jsgrid-edit-row > .jsgrid-cell, .jsgrid-filter-row > .jsgrid-cell, .jsgrid-grid-body, .jsgrid-grid-header, .jsgrid-header-row > .jsgrid-header-cell, .jsgrid-insert-row > .jsgrid-cell, .jsgrid-row > .jsgrid-cell
    border-color: #6c757d

  .jsgrid-header-row > .jsgrid-header-cell, .jsgrid-row > .jsgrid-cell
    background-color: #343a40

  .jsgrid-alt-row > .jsgrid-cell
    background-color: #3a4047

  .jsgrid-selected-row > .jsgrid-cell
    background-color: #3f474e

.border-transparent
  border-color: transparent !important

.description-block
  display: block
  margin: 10px 0
  text-align: center

  &.margin-bottom
    margin-bottom: 25px

  >
    .description-header
      font-size: 16px
      font-weight: 600
      margin: 0
      padding: 0

    .description-text
      text-transform: uppercase

  .description-icon
    font-size: 16px

.list-group-unbordered > .list-group-item
  border-left: 0
  border-radius: 0
  border-right: 0
  padding-left: 0
  padding-right: 0

.list-header
  color: #6c757d
  font-size: 15px
  font-weight: 700
  padding: 10px 4px

.list-seperator
  background-color: rgba(0, 0, 0, 0.125)
  height: 1px
  margin: 15px 0 9px

.list-link > a
  color: #6c757d
  padding: 4px

  &:hover
    color: #212529

.user-block
  float: left

  img
    float: left
    height: 40px
    width: 40px

  .comment, .description
    display: block
    margin-left: 50px

  .username
    display: block
    margin-left: 50px
    font-size: 16px
    font-weight: 600
    margin-top: -1px

  .description
    color: #6c757d
    font-size: 13px
    margin-top: -3px

  &.user-block-sm
    img
      width: 1.875rem
      height: 1.875rem

    .comment, .description
      margin-left: 40px

    .username
      margin-left: 40px
      font-size: 14px

.img-lg, .img-md
  float: left

.img-sm
  float: left
  height: 1.875rem
  width: 1.875rem

  + .img-push
    margin-left: 2.5rem

.img-md
  width: 3.75rem
  height: 3.75rem

  + .img-push
    margin-left: 4.375rem

.img-lg
  width: 6.25rem
  height: 6.25rem

  + .img-push
    margin-left: 6.875rem

.img-bordered
  border: 3px solid #adb5bd
  padding: 3px

.img-bordered-sm
  border: 2px solid #adb5bd
  padding: 2px

.img-rounded
  border-radius: .25rem

.img-circle
  border-radius: 50%

.img-size-32, .img-size-50
  height: auto

.img-size-64
  height: auto
  width: 64px

.img-size-50
  width: 50px

.img-size-32
  width: 32px

.size-32, .size-40, .size-50
  display: block
  text-align: center

.size-32
  height: 32px
  line-height: 32px
  width: 32px

.size-40
  height: 40px
  line-height: 40px
  width: 40px

.size-50
  height: 50px
  line-height: 50px
  width: 50px

.attachment-block
  background-color: #f8f9fa
  border: 1px solid rgba(0, 0, 0, 0.125)
  margin-bottom: 10px
  padding: 5px

  .attachment-img
    float: left
    height: auto
    max-height: 100px
    max-width: 100px

  .attachment-pushed
    margin-left: 110px

  .attachment-heading
    margin: 0

  .attachment-text
    color: #495057

.card >
  .loading-img, .overlay
    height: 100%
    left: 0
    position: absolute
    top: 0
    width: 100%

.info-box >
  .loading-img, .overlay
    height: 100%
    left: 0
    position: absolute
    top: 0
    width: 100%

.overlay-wrapper >
  .loading-img, .overlay
    height: 100%
    left: 0
    position: absolute
    top: 0
    width: 100%

.small-box >
  .loading-img, .overlay
    height: 100%
    left: 0
    position: absolute
    top: 0
    width: 100%

.card .overlay, .info-box .overlay, .overlay-wrapper .overlay, .small-box .overlay
  border-radius: .25rem
  -ms-flex-align: center
  align-items: center
  background-color: rgba(255, 255, 255, 0.7)
  display: -ms-flexbox
  display: flex
  -ms-flex-pack: center
  justify-content: center
  z-index: 50

.card .overlay >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #343a40

.info-box .overlay >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #343a40

.overlay-wrapper .overlay >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #343a40

.small-box .overlay >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #343a40

.card .overlay.dark, .info-box .overlay.dark, .overlay-wrapper .overlay.dark, .small-box .overlay.dark
  background-color: rgba(0, 0, 0, 0.5)

.card .overlay.dark >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #ced4da

.info-box .overlay.dark >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #ced4da

.overlay-wrapper .overlay.dark >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #ced4da

.small-box .overlay.dark >
  .fa, .fab, .fad, .fal, .far, .fas, .ion, .svg-inline--fa
    color: #ced4da

.tab-pane > .overlay-wrapper
  position: relative

  > .overlay
    border-top-left-radius: 0
    border-top-right-radius: 0
    -ms-flex-direction: column
    flex-direction: column
    margin-top: -1.25rem
    margin-left: -1.25rem
    height: calc(100% + 2 * 1.25rem)
    width: calc(100% + 2 * 1.25rem)

    &.dark
      color: #fff

.ribbon-wrapper
  height: 70px
  overflow: hidden
  position: absolute
  right: -2px
  top: -2px
  width: 70px
  z-index: 10

  &.ribbon-lg
    height: 120px
    width: 120px

    .ribbon
      right: 0
      top: 26px
      width: 160px

  &.ribbon-xl
    height: 180px
    width: 180px

    .ribbon
      right: 4px
      top: 47px
      width: 240px

  .ribbon
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3)
    font-size: .8rem
    line-height: 100%
    padding: .375rem 0
    position: relative
    right: -2px
    text-align: center
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4)
    text-transform: uppercase
    top: 10px
    transform: rotate(45deg)
    width: 90px

    &::after
      border-left: 3px solid transparent
      border-right: 3px solid transparent
      border-top: 3px solid #9e9e9e
      bottom: -3px
      content: ""
      position: absolute

    &::before
      border-left: 3px solid transparent
      border-right: 3px solid transparent
      border-top: 3px solid #9e9e9e
      bottom: -3px
      content: ""
      position: absolute
      left: 0

    &::after
      right: 0

.back-to-top
  bottom: 1.25rem
  position: fixed
  right: 1.25rem
  z-index: 1032

  &:focus
    box-shadow: none

pre
  padding: .75rem

blockquote
  background-color: #fff
  border-left: .7rem solid #007bff
  margin: 1.5em .7rem
  padding: .5em .7rem

.box blockquote
  background-color: #e9ecef

blockquote
  p:last-child
    margin-bottom: 0

  h1, h2, h3, h4, h5, h6
    color: #007bff
    font-size: 1.25rem
    font-weight: 600

  &.quote-primary
    border-color: #007bff

    h1, h2, h3, h4, h5, h6
      color: #007bff

  &.quote-secondary
    border-color: #6c757d

    h1, h2, h3, h4, h5, h6
      color: #6c757d

  &.quote-success
    border-color: #28a745

    h1, h2, h3, h4, h5, h6
      color: #28a745

  &.quote-info
    border-color: #17a2b8

    h1, h2, h3, h4, h5, h6
      color: #17a2b8

  &.quote-warning
    border-color: #ffc107

    h1, h2, h3, h4, h5, h6
      color: #ffc107

  &.quote-danger
    border-color: #dc3545

    h1, h2, h3, h4, h5, h6
      color: #dc3545

  &.quote-light
    border-color: #f8f9fa

    h1, h2, h3, h4, h5, h6
      color: #f8f9fa

  &.quote-dark
    border-color: #343a40

    h1, h2, h3, h4, h5, h6
      color: #343a40

  &.quote-lightblue
    border-color: #3c8dbc

    h1, h2, h3, h4, h5, h6
      color: #3c8dbc

  &.quote-navy
    border-color: #001f3f

    h1, h2, h3, h4, h5, h6
      color: #001f3f

  &.quote-olive
    border-color: #3d9970

    h1, h2, h3, h4, h5, h6
      color: #3d9970

  &.quote-lime
    border-color: #01ff70

    h1, h2, h3, h4, h5, h6
      color: #01ff70

  &.quote-fuchsia
    border-color: #f012be

    h1, h2, h3, h4, h5, h6
      color: #f012be

  &.quote-maroon
    border-color: #d81b60

    h1, h2, h3, h4, h5, h6
      color: #d81b60

  &.quote-blue
    border-color: #007bff

    h1, h2, h3, h4, h5, h6
      color: #007bff

  &.quote-indigo
    border-color: #6610f2

    h1, h2, h3, h4, h5, h6
      color: #6610f2

  &.quote-purple
    border-color: #6f42c1

    h1, h2, h3, h4, h5, h6
      color: #6f42c1

  &.quote-pink
    border-color: #e83e8c

    h1, h2, h3, h4, h5, h6
      color: #e83e8c

  &.quote-red
    border-color: #dc3545

    h1, h2, h3, h4, h5, h6
      color: #dc3545

  &.quote-orange
    border-color: #fd7e14

    h1, h2, h3, h4, h5, h6
      color: #fd7e14

  &.quote-yellow
    border-color: #ffc107

    h1, h2, h3, h4, h5, h6
      color: #ffc107

  &.quote-green
    border-color: #28a745

    h1, h2, h3, h4, h5, h6
      color: #28a745

  &.quote-teal
    border-color: #20c997

    h1, h2, h3, h4, h5, h6
      color: #20c997

  &.quote-cyan
    border-color: #17a2b8

    h1, h2, h3, h4, h5, h6
      color: #17a2b8

  &.quote-white
    border-color: #fff

    h1, h2, h3, h4, h5, h6
      color: #fff

  &.quote-gray
    border-color: #6c757d

    h1, h2, h3, h4, h5, h6
      color: #6c757d

  &.quote-gray-dark
    border-color: #343a40

    h1, h2, h3, h4, h5, h6
      color: #343a40

.tab-custom-content
  border-top: 1px solid #dee2e6
  margin-top: .5rem
  padding-top: .5rem

.nav + .tab-custom-content
  border-top: none
  border-bottom: 1px solid #dee2e6
  margin-top: 0
  margin-bottom: .5rem
  padding-bottom: .5rem

.badge-btn
  border-radius: .15rem
  font-size: .75rem
  font-weight: 400
  padding: .25rem .5rem

  &.badge-pill
    padding: .375rem .6rem

.dark-mode
  a:not(.btn):hover
    color: #3395ff

  .attachment-block
    background-color: #3d444b

    .attachment-text
      color: #ced4da

  blockquote
    background-color: #3f474e

  .close, .mailbox-attachment-close
    color: #adb5bd
    text-shadow: 0 1px 0 #495057

  .tab-custom-content
    border-color: #6c757d

  .list-group-item
    background-color: #343a40
    border-color: #6c757d

@media print
  .content-header, .main-header, .main-sidebar, .no-print
    display: none !important

  .content-wrapper, .main-footer
    transform: translate(0, 0)
    margin-left: 0 !important
    min-height: 0 !important

  .layout-fixed .content-wrapper
    padding-top: 0 !important

  .invoice
    border: 0
    margin: 0
    padding: 0
    width: 100%

  .invoice-col
    float: left
    width: 33.3333333%

  .table-responsive
    overflow: auto

    > .table tr
      td, th
        white-space: normal !important

.text-bold
  font-weight: 700

  &.table
    td, th
      font-weight: 700

.text-xs
  font-size: 0.75rem !important

.text-sm
  font-size: 0.875rem !important

.text-md
  font-size: 1rem !important

.text-lg
  font-size: 1.25rem !important

.text-xl
  font-size: 2rem !important

.text-lightblue
  color: #3c8dbc !important

.text-navy
  color: #001f3f !important

.text-olive
  color: #3d9970 !important

.text-lime
  color: #01ff70 !important

.text-fuchsia
  color: #f012be !important

.text-maroon
  color: #d81b60 !important

.text-blue
  color: #007bff !important

.text-indigo
  color: #6610f2 !important

.text-purple
  color: #6f42c1 !important

.text-pink
  color: #e83e8c !important

.text-red
  color: #dc3545 !important

.text-orange
  color: #fd7e14 !important

.text-yellow
  color: #ffc107 !important

.text-green
  color: #28a745 !important

.text-teal
  color: #20c997 !important

.text-cyan
  color: #17a2b8 !important

.text-white
  color: #fff !important

.text-gray
  color: #6c757d !important

.text-gray-dark
  color: #343a40 !important

.dark-mode .text-muted
  color: #adb5bd !important

.elevation-0
  box-shadow: none !important

.elevation-1
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important

.elevation-2
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23) !important

.elevation-3
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23) !important

.elevation-4
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22) !important

.elevation-5
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22) !important

.bg-primary
  background-color: #007bff !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #0062cc
      color: #ececec

    &.active, &:active
      background-color: #0062cc !important
      border-color: #005cbf
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #0062cc !important
        border-color: #005cbf
        color: #fff

.bg-secondary
  background-color: #6c757d !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #545b62
      color: #ececec

    &.active, &:active
      background-color: #545b62 !important
      border-color: #4e555b
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #545b62 !important
        border-color: #4e555b
        color: #fff

.bg-success
  background-color: #28a745 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #1e7e34
      color: #ececec

    &.active, &:active
      background-color: #1e7e34 !important
      border-color: #1c7430
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #1e7e34 !important
        border-color: #1c7430
        color: #fff

.bg-info
  background-color: #17a2b8 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #117a8b
      color: #ececec

    &.active, &:active
      background-color: #117a8b !important
      border-color: #10707f
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #117a8b !important
        border-color: #10707f
        color: #fff

.bg-warning
  background-color: #ffc107 !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #d39e00
      color: #121a24

    &.active, &:active
      background-color: #d39e00 !important
      border-color: #c69500
      color: #1f2d3d

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #d39e00 !important
        border-color: #c69500
        color: #1f2d3d

.bg-danger
  background-color: #dc3545 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #bd2130
      color: #ececec

    &.active, &:active
      background-color: #bd2130 !important
      border-color: #b21f2d
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #bd2130 !important
        border-color: #b21f2d
        color: #fff

.bg-light
  background-color: #f8f9fa !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #dae0e5
      color: #121a24

    &.active, &:active
      background-color: #dae0e5 !important
      border-color: #d3d9df
      color: #1f2d3d

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #dae0e5 !important
        border-color: #d3d9df
        color: #1f2d3d

.bg-dark
  background-color: #343a40 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #1d2124
      color: #ececec

    &.active, &:active
      background-color: #1d2124 !important
      border-color: #171a1d
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #1d2124 !important
        border-color: #171a1d
        color: #fff

.bg-lightblue
  background-color: #3c8dbc !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #307095
      color: #ececec

    &.active, &:active
      background-color: #307095 !important
      border-color: #2d698c
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #307095 !important
        border-color: #2d698c
        color: #fff

.bg-navy
  background-color: #001f3f !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #00060c
      color: #ececec

    &.active, &:active
      background-color: #00060c !important
      border-color: #000
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #00060c !important
        border-color: #000
        color: #fff

.bg-olive
  background-color: #3d9970 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #2e7555
      color: #ececec

    &.active, &:active
      background-color: #2e7555 !important
      border-color: #2b6b4f
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #2e7555 !important
        border-color: #2b6b4f
        color: #fff

.bg-lime
  background-color: #01ff70 !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #00cd5a
      color: #121a24

    &.active, &:active
      background-color: #00cd5a !important
      border-color: #00c054
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #00cd5a !important
        border-color: #00c054
        color: #fff

.bg-fuchsia
  background-color: #f012be !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #c30c9a
      color: #ececec

    &.active, &:active
      background-color: #c30c9a !important
      border-color: #b70c90
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #c30c9a !important
        border-color: #b70c90
        color: #fff

.bg-maroon
  background-color: #d81b60 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #ab154c
      color: #ececec

    &.active, &:active
      background-color: #ab154c !important
      border-color: #9f1447
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #ab154c !important
        border-color: #9f1447
        color: #fff

.bg-blue
  background-color: #007bff !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #0062cc
      color: #ececec

    &.active, &:active
      background-color: #0062cc !important
      border-color: #005cbf
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #0062cc !important
        border-color: #005cbf
        color: #fff

.bg-indigo
  background-color: #6610f2 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #510bc4
      color: #ececec

    &.active, &:active
      background-color: #510bc4 !important
      border-color: #4c0ab8
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #510bc4 !important
        border-color: #4c0ab8
        color: #fff

.bg-purple
  background-color: #6f42c1 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #59339d
      color: #ececec

    &.active, &:active
      background-color: #59339d !important
      border-color: #533093
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #59339d !important
        border-color: #533093
        color: #fff

.bg-pink
  background-color: #e83e8c !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #d91a72
      color: #ececec

    &.active, &:active
      background-color: #d91a72 !important
      border-color: #ce196c
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #d91a72 !important
        border-color: #ce196c
        color: #fff

.bg-red
  background-color: #dc3545 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #bd2130
      color: #ececec

    &.active, &:active
      background-color: #bd2130 !important
      border-color: #b21f2d
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #bd2130 !important
        border-color: #b21f2d
        color: #fff

.bg-orange
  background-color: #fd7e14 !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #dc6502
      color: #121a24

    &.active, &:active
      background-color: #dc6502 !important
      border-color: #cf5f02
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #dc6502 !important
        border-color: #cf5f02
        color: #fff

.bg-yellow
  background-color: #ffc107 !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #d39e00
      color: #121a24

    &.active, &:active
      background-color: #d39e00 !important
      border-color: #c69500
      color: #1f2d3d

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #d39e00 !important
        border-color: #c69500
        color: #1f2d3d

.bg-green
  background-color: #28a745 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #1e7e34
      color: #ececec

    &.active, &:active
      background-color: #1e7e34 !important
      border-color: #1c7430
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #1e7e34 !important
        border-color: #1c7430
        color: #fff

.bg-teal
  background-color: #20c997 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #199d76
      color: #ececec

    &.active, &:active
      background-color: #199d76 !important
      border-color: #17926e
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #199d76 !important
        border-color: #17926e
        color: #fff

.bg-cyan
  background-color: #17a2b8 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #117a8b
      color: #ececec

    &.active, &:active
      background-color: #117a8b !important
      border-color: #10707f
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #117a8b !important
        border-color: #10707f
        color: #fff

.bg-white
  background-color: #fff !important
  color: #1f2d3d !important

  > a
    color: #1f2d3d !important

  &.btn
    &:hover
      border-color: #e6e6e6
      color: #121a24

    &.active, &:active
      background-color: #e6e6e6 !important
      border-color: #dfdfdf
      color: #1f2d3d

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #e6e6e6 !important
        border-color: #dfdfdf
        color: #1f2d3d

.bg-gray
  background-color: #6c757d !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #545b62
      color: #ececec

    &.active, &:active
      background-color: #545b62 !important
      border-color: #4e555b
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #545b62 !important
        border-color: #4e555b
        color: #fff

.bg-gray-dark
  background-color: #343a40 !important
  color: #fff !important

  > a
    color: #fff !important

  &.btn
    &:hover
      border-color: #1d2124
      color: #ececec

    &.active, &:active
      background-color: #1d2124 !important
      border-color: #171a1d
      color: #fff

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-color: #1d2124 !important
        border-color: #171a1d
        color: #fff

.bg-gray
  background-color: #adb5bd
  color: #1f2d3d

.bg-gray-light
  background-color: #f2f4f5
  color: #1f2d3d !important

.bg-black
  background-color: #000
  color: #fff !important

.bg-white
  background-color: #fff
  color: #1f2d3d !important

.bg-gradient-primary
  background: #007bff linear-gradient(180deg, #268fff, #007bff) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-primary.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-primary.btn
  &:hover
    background: #007bff linear-gradient(180deg, #267fde, #0069d9) repeat-x !important
    border-color: #0062cc
    color: #ececec

  &.active, &:active
    background: #007bff linear-gradient(180deg, #267ad4, #0062cc) repeat-x !important
    border-color: #005cbf
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #007bff linear-gradient(180deg, #267ad4, #0062cc) repeat-x !important
      border-color: #005cbf
      color: #fff

.bg-gradient-secondary
  background: #6c757d linear-gradient(180deg, #828a91, #6c757d) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-secondary.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-secondary.btn
  &:hover
    background: #6c757d linear-gradient(180deg, #73797f, #5a6268) repeat-x !important
    border-color: #545b62
    color: #ececec

  &.active, &:active
    background: #6c757d linear-gradient(180deg, #6e7479, #545b62) repeat-x !important
    border-color: #4e555b
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #6c757d linear-gradient(180deg, #6e7479, #545b62) repeat-x !important
      border-color: #4e555b
      color: #fff

.bg-gradient-success
  background: #28a745 linear-gradient(180deg, #48b461, #28a745) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-success.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-success.btn
  &:hover
    background: #28a745 linear-gradient(180deg, #429a56, #218838) repeat-x !important
    border-color: #1e7e34
    color: #ececec

  &.active, &:active
    background: #28a745 linear-gradient(180deg, #409152, #1e7e34) repeat-x !important
    border-color: #1c7430
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #28a745 linear-gradient(180deg, #409152, #1e7e34) repeat-x !important
      border-color: #1c7430
      color: #fff

.bg-gradient-info
  background: #17a2b8 linear-gradient(180deg, #3ab0c3, #17a2b8) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-info.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-info.btn
  &:hover
    background: #17a2b8 linear-gradient(180deg, #3697a6, #138496) repeat-x !important
    border-color: #117a8b
    color: #ececec

  &.active, &:active
    background: #17a2b8 linear-gradient(180deg, #358e9c, #117a8b) repeat-x !important
    border-color: #10707f
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #17a2b8 linear-gradient(180deg, #358e9c, #117a8b) repeat-x !important
      border-color: #10707f
      color: #fff

.bg-gradient-warning
  background: #ffc107 linear-gradient(180deg, #ffca2c, #ffc107) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-warning.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-warning.btn
  &:hover
    background: #ffc107 linear-gradient(180deg, #e4b526, #e0a800) repeat-x !important
    border-color: #d39e00
    color: #121a24

  &.active, &:active
    background: #ffc107 linear-gradient(180deg, #daad26, #d39e00) repeat-x !important
    border-color: #c69500
    color: #1f2d3d

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #ffc107 linear-gradient(180deg, #daad26, #d39e00) repeat-x !important
      border-color: #c69500
      color: #1f2d3d

.bg-gradient-danger
  background: #dc3545 linear-gradient(180deg, #e15361, #dc3545) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-danger.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-danger.btn
  &:hover
    background: #dc3545 linear-gradient(180deg, #d04451, #c82333) repeat-x !important
    border-color: #bd2130
    color: #ececec

  &.active, &:active
    background: #dc3545 linear-gradient(180deg, #c7424f, #bd2130) repeat-x !important
    border-color: #b21f2d
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #dc3545 linear-gradient(180deg, #c7424f, #bd2130) repeat-x !important
      border-color: #b21f2d
      color: #fff

.bg-gradient-light
  background: #f8f9fa linear-gradient(180deg, #f9fafb, #f8f9fa) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-light.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-light.btn
  &:hover
    background: #f8f9fa linear-gradient(180deg, #e6eaed, #e2e6ea) repeat-x !important
    border-color: #dae0e5
    color: #121a24

  &.active, &:active
    background: #f8f9fa linear-gradient(180deg, #e0e4e9, #dae0e5) repeat-x !important
    border-color: #d3d9df
    color: #1f2d3d

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #f8f9fa linear-gradient(180deg, #e0e4e9, #dae0e5) repeat-x !important
      border-color: #d3d9df
      color: #1f2d3d

.bg-gradient-dark
  background: #343a40 linear-gradient(180deg, #52585d, #343a40) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-dark.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-dark.btn
  &:hover
    background: #343a40 linear-gradient(180deg, #44474b, #23272b) repeat-x !important
    border-color: #1d2124
    color: #ececec

  &.active, &:active
    background: #343a40 linear-gradient(180deg, #3f4245, #1d2124) repeat-x !important
    border-color: #171a1d
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #343a40 linear-gradient(180deg, #3f4245, #1d2124) repeat-x !important
      border-color: #171a1d
      color: #fff

.bg-gradient-lightblue
  background: #3c8dbc linear-gradient(180deg, #599ec6, #3c8dbc) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-lightblue.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-lightblue.btn
  &:hover
    background: #3c8dbc linear-gradient(180deg, #518cad, #33779f) repeat-x !important
    border-color: #307095
    color: #ececec

  &.active, &:active
    background: #3c8dbc linear-gradient(180deg, #4f85a5, #307095) repeat-x !important
    border-color: #2d698c
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #3c8dbc linear-gradient(180deg, #4f85a5, #307095) repeat-x !important
      border-color: #2d698c
      color: #fff

.bg-gradient-navy
  background: #001f3f linear-gradient(180deg, #26415c, #001f3f) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-navy.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-navy.btn
  &:hover
    background: #001f3f linear-gradient(180deg, #26313b, #000c19) repeat-x !important
    border-color: #00060c
    color: #ececec

  &.active, &:active
    background: #001f3f linear-gradient(180deg, #262b30, #00060c) repeat-x !important
    border-color: #000
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #001f3f linear-gradient(180deg, #262b30, #00060c) repeat-x !important
      border-color: #000
      color: #fff

.bg-gradient-olive
  background: #3d9970 linear-gradient(180deg, #5aa885, #3d9970) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-olive.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-olive.btn
  &:hover
    background: #3d9970 linear-gradient(180deg, #519174, #327e5c) repeat-x !important
    border-color: #2e7555
    color: #ececec

  &.active, &:active
    background: #3d9970 linear-gradient(180deg, #4e896f, #2e7555) repeat-x !important
    border-color: #2b6b4f
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #3d9970 linear-gradient(180deg, #4e896f, #2e7555) repeat-x !important
      border-color: #2b6b4f
      color: #fff

.bg-gradient-lime
  background: #01ff70 linear-gradient(180deg, #27ff85, #01ff70) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-lime.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-lime.btn
  &:hover
    background: #01ff70 linear-gradient(180deg, #26df77, #00da5f) repeat-x !important
    border-color: #00cd5a
    color: #121a24

  &.active, &:active
    background: #01ff70 linear-gradient(180deg, #26d572, #00cd5a) repeat-x !important
    border-color: #00c054
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #01ff70 linear-gradient(180deg, #26d572, #00cd5a) repeat-x !important
      border-color: #00c054
      color: #fff

.bg-gradient-fuchsia
  background: #f012be linear-gradient(180deg, #f236c8, #f012be) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-fuchsia.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-fuchsia.btn
  &:hover
    background: #f012be linear-gradient(180deg, #d631b1, #cf0da3) repeat-x !important
    border-color: #c30c9a
    color: #ececec

  &.active, &:active
    background: #f012be linear-gradient(180deg, #cc31a9, #c30c9a) repeat-x !important
    border-color: #b70c90
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #f012be linear-gradient(180deg, #cc31a9, #c30c9a) repeat-x !important
      border-color: #b70c90
      color: #fff

.bg-gradient-maroon
  background: #d81b60 linear-gradient(180deg, #de3d78, #d81b60) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-maroon.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-maroon.btn
  &:hover
    background: #d81b60 linear-gradient(180deg, #c13a6b, #b61751) repeat-x !important
    border-color: #ab154c
    color: #ececec

  &.active, &:active
    background: #d81b60 linear-gradient(180deg, #b73867, #ab154c) repeat-x !important
    border-color: #9f1447
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #d81b60 linear-gradient(180deg, #b73867, #ab154c) repeat-x !important
      border-color: #9f1447
      color: #fff

.bg-gradient-blue
  background: #007bff linear-gradient(180deg, #268fff, #007bff) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-blue.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-blue.btn
  &:hover
    background: #007bff linear-gradient(180deg, #267fde, #0069d9) repeat-x !important
    border-color: #0062cc
    color: #ececec

  &.active, &:active
    background: #007bff linear-gradient(180deg, #267ad4, #0062cc) repeat-x !important
    border-color: #005cbf
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #007bff linear-gradient(180deg, #267ad4, #0062cc) repeat-x !important
      border-color: #005cbf
      color: #fff

.bg-gradient-indigo
  background: #6610f2 linear-gradient(180deg, #7d34f4, #6610f2) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-indigo.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-indigo.btn
  &:hover
    background: #6610f2 linear-gradient(180deg, #7030d7, #560bd0) repeat-x !important
    border-color: #510bc4
    color: #ececec

  &.active, &:active
    background: #6610f2 linear-gradient(180deg, #6b2fcd, #510bc4) repeat-x !important
    border-color: #4c0ab8
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #6610f2 linear-gradient(180deg, #6b2fcd, #510bc4) repeat-x !important
      border-color: #4c0ab8
      color: #fff

.bg-gradient-purple
  background: #6f42c1 linear-gradient(180deg, #855eca, #6f42c1) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-purple.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-purple.btn
  &:hover
    background: #6f42c1 linear-gradient(180deg, #7655b4, #5e37a6) repeat-x !important
    border-color: #59339d
    color: #ececec

  &.active, &:active
    background: #6f42c1 linear-gradient(180deg, #7252ab, #59339d) repeat-x !important
    border-color: #533093
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #6f42c1 linear-gradient(180deg, #7252ab, #59339d) repeat-x !important
      border-color: #533093
      color: #fff

.bg-gradient-pink
  background: #e83e8c linear-gradient(180deg, #eb5b9d, #e83e8c) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-pink.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-pink.btn
  &:hover
    background: #e83e8c linear-gradient(180deg, #e83e8c, #e41c78) repeat-x !important
    border-color: #d91a72
    color: #ececec

  &.active, &:active
    background: #e83e8c linear-gradient(180deg, #df3c87, #d91a72) repeat-x !important
    border-color: #ce196c
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #e83e8c linear-gradient(180deg, #df3c87, #d91a72) repeat-x !important
      border-color: #ce196c
      color: #fff

.bg-gradient-red
  background: #dc3545 linear-gradient(180deg, #e15361, #dc3545) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-red.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-red.btn
  &:hover
    background: #dc3545 linear-gradient(180deg, #d04451, #c82333) repeat-x !important
    border-color: #bd2130
    color: #ececec

  &.active, &:active
    background: #dc3545 linear-gradient(180deg, #c7424f, #bd2130) repeat-x !important
    border-color: #b21f2d
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #dc3545 linear-gradient(180deg, #c7424f, #bd2130) repeat-x !important
      border-color: #b21f2d
      color: #fff

.bg-gradient-orange
  background: #fd7e14 linear-gradient(180deg, #fd9137, #fd7e14) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-orange.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-orange.btn
  &:hover
    background: #fd7e14 linear-gradient(180deg, #ec8128, #e96b02) repeat-x !important
    border-color: #dc6502
    color: #121a24

  &.active, &:active
    background: #fd7e14 linear-gradient(180deg, #e17c28, #dc6502) repeat-x !important
    border-color: #cf5f02
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #fd7e14 linear-gradient(180deg, #e17c28, #dc6502) repeat-x !important
      border-color: #cf5f02
      color: #fff

.bg-gradient-yellow
  background: #ffc107 linear-gradient(180deg, #ffca2c, #ffc107) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-yellow.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-yellow.btn
  &:hover
    background: #ffc107 linear-gradient(180deg, #e4b526, #e0a800) repeat-x !important
    border-color: #d39e00
    color: #121a24

  &.active, &:active
    background: #ffc107 linear-gradient(180deg, #daad26, #d39e00) repeat-x !important
    border-color: #c69500
    color: #1f2d3d

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #ffc107 linear-gradient(180deg, #daad26, #d39e00) repeat-x !important
      border-color: #c69500
      color: #1f2d3d

.bg-gradient-green
  background: #28a745 linear-gradient(180deg, #48b461, #28a745) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-green.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-green.btn
  &:hover
    background: #28a745 linear-gradient(180deg, #429a56, #218838) repeat-x !important
    border-color: #1e7e34
    color: #ececec

  &.active, &:active
    background: #28a745 linear-gradient(180deg, #409152, #1e7e34) repeat-x !important
    border-color: #1c7430
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #28a745 linear-gradient(180deg, #409152, #1e7e34) repeat-x !important
      border-color: #1c7430
      color: #fff

.bg-gradient-teal
  background: #20c997 linear-gradient(180deg, #41d1a7, #20c997) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-teal.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-teal.btn
  &:hover
    background: #20c997 linear-gradient(180deg, #3db592, #1ba87e) repeat-x !important
    border-color: #199d76
    color: #ececec

  &.active, &:active
    background: #20c997 linear-gradient(180deg, #3bac8b, #199d76) repeat-x !important
    border-color: #17926e
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #20c997 linear-gradient(180deg, #3bac8b, #199d76) repeat-x !important
      border-color: #17926e
      color: #fff

.bg-gradient-cyan
  background: #17a2b8 linear-gradient(180deg, #3ab0c3, #17a2b8) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-cyan.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-cyan.btn
  &:hover
    background: #17a2b8 linear-gradient(180deg, #3697a6, #138496) repeat-x !important
    border-color: #117a8b
    color: #ececec

  &.active, &:active
    background: #17a2b8 linear-gradient(180deg, #358e9c, #117a8b) repeat-x !important
    border-color: #10707f
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #17a2b8 linear-gradient(180deg, #358e9c, #117a8b) repeat-x !important
      border-color: #10707f
      color: #fff

.bg-gradient-white
  background: #fff linear-gradient(180deg, #fff, #fff) repeat-x !important
  color: #1f2d3d

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-white.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-white.btn
  &:hover
    background: #fff linear-gradient(180deg, #efefef, #ececec) repeat-x !important
    border-color: #e6e6e6
    color: #121a24

  &.active, &:active
    background: #fff linear-gradient(180deg, #e9e9e9, #e6e6e6) repeat-x !important
    border-color: #dfdfdf
    color: #1f2d3d

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #fff linear-gradient(180deg, #e9e9e9, #e6e6e6) repeat-x !important
      border-color: #dfdfdf
      color: #1f2d3d

.bg-gradient-gray
  background: #6c757d linear-gradient(180deg, #828a91, #6c757d) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-gray.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-gray.btn
  &:hover
    background: #6c757d linear-gradient(180deg, #73797f, #5a6268) repeat-x !important
    border-color: #545b62
    color: #ececec

  &.active, &:active
    background: #6c757d linear-gradient(180deg, #6e7479, #545b62) repeat-x !important
    border-color: #4e555b
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #6c757d linear-gradient(180deg, #6e7479, #545b62) repeat-x !important
      border-color: #4e555b
      color: #fff

.bg-gradient-gray-dark
  background: #343a40 linear-gradient(180deg, #52585d, #343a40) repeat-x !important
  color: #fff

  &.btn
    &.disabled, &:disabled
      background-image: none !important

    &:not(:disabled):not(.disabled)
      &.active, &:active
        background-image: none !important

.show > .bg-gradient-gray-dark.btn.dropdown-toggle
  background-image: none !important

.bg-gradient-gray-dark.btn
  &:hover
    background: #343a40 linear-gradient(180deg, #44474b, #23272b) repeat-x !important
    border-color: #1d2124
    color: #ececec

  &.active, &:active
    background: #343a40 linear-gradient(180deg, #3f4245, #1d2124) repeat-x !important
    border-color: #171a1d
    color: #fff

  &:not(:disabled):not(.disabled)
    &.active, &:active
      background: #343a40 linear-gradient(180deg, #3f4245, #1d2124) repeat-x !important
      border-color: #171a1d
      color: #fff

[class^=bg-].disabled
  opacity: .65

a.text-muted:hover
  color: #007bff !important

.link-muted
  color: #5d6974

  &:focus, &:hover
    color: #464f58

.link-black
  color: #6c757d

  &:focus, &:hover
    color: #e6e8ea

.accent-primary
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #007bff

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #0056b3

  .dropdown-item
    &.active, &:active
      background-color: #007bff
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #007bff
        border-color: #004a99

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #80bdff

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #80bdff

  .page-item
    .page-link
      color: #007bff

    &.active
      .page-link, a
        background-color: #007bff
        border-color: #007bff
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-primary .page-item .page-link
  &:focus, &:hover
    color: #1a88ff

.accent-secondary
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #6c757d

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #494f54

  .dropdown-item
    &.active, &:active
      background-color: #6c757d
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #6c757d
        border-color: #3d4246

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #afb5ba

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #afb5ba

  .page-item
    .page-link
      color: #6c757d

    &.active
      .page-link, a
        background-color: #6c757d
        border-color: #6c757d
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-secondary .page-item .page-link
  &:focus, &:hover
    color: #78828a

.accent-success
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #28a745

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #19692c

  .dropdown-item
    &.active, &:active
      background-color: #28a745
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #28a745
        border-color: #145523

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #71dd8a

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #71dd8a

  .page-item
    .page-link
      color: #28a745

    &.active
      .page-link, a
        background-color: #28a745
        border-color: #28a745
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-success .page-item .page-link
  &:focus, &:hover
    color: #2dbc4e

.accent-info
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #17a2b8

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #0f6674

  .dropdown-item
    &.active, &:active
      background-color: #17a2b8
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #17a2b8
        border-color: #0c525d

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #63d9ec

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #63d9ec

  .page-item
    .page-link
      color: #17a2b8

    &.active
      .page-link, a
        background-color: #17a2b8
        border-color: #17a2b8
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-info .page-item .page-link
  &:focus, &:hover
    color: #1ab6cf

.accent-warning
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #ffc107

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #ba8b00

  .dropdown-item
    &.active, &:active
      background-color: #ffc107
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #ffc107
        border-color: #a07800

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #ffe187

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #ffe187

  .page-item
    .page-link
      color: #ffc107

    &.active
      .page-link, a
        background-color: #ffc107
        border-color: #ffc107
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-warning .page-item .page-link
  &:focus, &:hover
    color: #ffc721

.accent-danger
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #dc3545

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #a71d2a

  .dropdown-item
    &.active, &:active
      background-color: #dc3545
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #dc3545
        border-color: #921925

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #efa2a9

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #efa2a9

  .page-item
    .page-link
      color: #dc3545

    &.active
      .page-link, a
        background-color: #dc3545
        border-color: #dc3545
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-danger .page-item .page-link
  &:focus, &:hover
    color: #e04b59

.accent-light
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #f8f9fa

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #cbd3da

  .dropdown-item
    &.active, &:active
      background-color: #f8f9fa
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #f8f9fa
        border-color: #bdc6d0

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #fff

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #fff

  .page-item
    .page-link
      color: #f8f9fa

    &.active
      .page-link, a
        background-color: #f8f9fa
        border-color: #f8f9fa
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-light .page-item .page-link
  &:focus, &:hover
    color: #fff

.accent-dark
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #343a40

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #121416

  .dropdown-item
    &.active, &:active
      background-color: #343a40
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #343a40
        border-color: #060708

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #6d7a86

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #6d7a86

  .page-item
    .page-link
      color: #343a40

    &.active
      .page-link, a
        background-color: #343a40
        border-color: #343a40
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-dark .page-item .page-link
  &:focus, &:hover
    color: #3f474e

.accent-lightblue
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #3c8dbc

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #296282

  .dropdown-item
    &.active, &:active
      background-color: #3c8dbc
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #3c8dbc
        border-color: #23536f

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #99c5de

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #99c5de

  .page-item
    .page-link
      color: #3c8dbc

    &.active
      .page-link, a
        background-color: #3c8dbc
        border-color: #3c8dbc
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-lightblue .page-item .page-link
  &:focus, &:hover
    color: #4c99c6

.accent-navy
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #001f3f

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #000

  .dropdown-item
    &.active, &:active
      background-color: #001f3f
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #001f3f
        border-color: #000

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #005ebf

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #005ebf

  .page-item
    .page-link
      color: #001f3f

    &.active
      .page-link, a
        background-color: #001f3f
        border-color: #001f3f
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-navy .page-item .page-link
  &:focus, &:hover
    color: #002c59

.accent-olive
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #3d9970

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #276248

  .dropdown-item
    &.active, &:active
      background-color: #3d9970
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #3d9970
        border-color: #20503b

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #87cfaf

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #87cfaf

  .page-item
    .page-link
      color: #3d9970

    &.active
      .page-link, a
        background-color: #3d9970
        border-color: #3d9970
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-olive .page-item .page-link
  &:focus, &:hover
    color: #44ab7d

.accent-lime
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #01ff70

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #00b44e

  .dropdown-item
    &.active, &:active
      background-color: #01ff70
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #01ff70
        border-color: #009a43

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #81ffb8

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #81ffb8

  .page-item
    .page-link
      color: #01ff70

    &.active
      .page-link, a
        background-color: #01ff70
        border-color: #01ff70
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-lime .page-item .page-link
  &:focus, &:hover
    color: #1bff7e

.accent-fuchsia
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #f012be

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #ab0b87

  .dropdown-item
    &.active, &:active
      background-color: #f012be
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #f012be
        border-color: #930974

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #f88adf

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #f88adf

  .page-item
    .page-link
      color: #f012be

    &.active
      .page-link, a
        background-color: #f012be
        border-color: #f012be
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-fuchsia .page-item .page-link
  &:focus, &:hover
    color: #f22ac5

.accent-maroon
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #d81b60

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #941342

  .dropdown-item
    &.active, &:active
      background-color: #d81b60
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #d81b60
        border-color: #7d1038

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #f083ab

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #f083ab

  .page-item
    .page-link
      color: #d81b60

    &.active
      .page-link, a
        background-color: #d81b60
        border-color: #d81b60
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-maroon .page-item .page-link
  &:focus, &:hover
    color: #e4286d

.accent-blue
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #007bff

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #0056b3

  .dropdown-item
    &.active, &:active
      background-color: #007bff
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #007bff
        border-color: #004a99

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #80bdff

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #80bdff

  .page-item
    .page-link
      color: #007bff

    &.active
      .page-link, a
        background-color: #007bff
        border-color: #007bff
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-blue .page-item .page-link
  &:focus, &:hover
    color: #1a88ff

.accent-indigo
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #6610f2

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #4709ac

  .dropdown-item
    &.active, &:active
      background-color: #6610f2
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #6610f2
        border-color: #3d0894

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #b389f9

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #b389f9

  .page-item
    .page-link
      color: #6610f2

    &.active
      .page-link, a
        background-color: #6610f2
        border-color: #6610f2
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-indigo .page-item .page-link
  &:focus, &:hover
    color: #7528f3

.accent-purple
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #6f42c1

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #4e2d89

  .dropdown-item
    &.active, &:active
      background-color: #6f42c1
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #6f42c1
        border-color: #432776

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #b8a2e0

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #b8a2e0

  .page-item
    .page-link
      color: #6f42c1

    &.active
      .page-link, a
        background-color: #6f42c1
        border-color: #6f42c1
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-purple .page-item .page-link
  &:focus, &:hover
    color: #7e55c7

.accent-pink
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #e83e8c

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #c21766

  .dropdown-item
    &.active, &:active
      background-color: #e83e8c
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #e83e8c
        border-color: #ac145a

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #f6b0d0

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #f6b0d0

  .page-item
    .page-link
      color: #e83e8c

    &.active
      .page-link, a
        background-color: #e83e8c
        border-color: #e83e8c
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-pink .page-item .page-link
  &:focus, &:hover
    color: #eb559a

.accent-red
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #dc3545

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #a71d2a

  .dropdown-item
    &.active, &:active
      background-color: #dc3545
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #dc3545
        border-color: #921925

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #efa2a9

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #efa2a9

  .page-item
    .page-link
      color: #dc3545

    &.active
      .page-link, a
        background-color: #dc3545
        border-color: #dc3545
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-red .page-item .page-link
  &:focus, &:hover
    color: #e04b59

.accent-orange
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #fd7e14

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #c35a02

  .dropdown-item
    &.active, &:active
      background-color: #fd7e14
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #fd7e14
        border-color: #aa4e01

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #fec392

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #fec392

  .page-item
    .page-link
      color: #fd7e14

    &.active
      .page-link, a
        background-color: #fd7e14
        border-color: #fd7e14
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-orange .page-item .page-link
  &:focus, &:hover
    color: #fd8c2d

.accent-yellow
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #ffc107

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #ba8b00

  .dropdown-item
    &.active, &:active
      background-color: #ffc107
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #ffc107
        border-color: #a07800

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #ffe187

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #ffe187

  .page-item
    .page-link
      color: #ffc107

    &.active
      .page-link, a
        background-color: #ffc107
        border-color: #ffc107
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-yellow .page-item .page-link
  &:focus, &:hover
    color: #ffc721

.accent-green
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #28a745

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #19692c

  .dropdown-item
    &.active, &:active
      background-color: #28a745
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #28a745
        border-color: #145523

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #71dd8a

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #71dd8a

  .page-item
    .page-link
      color: #28a745

    &.active
      .page-link, a
        background-color: #28a745
        border-color: #28a745
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-green .page-item .page-link
  &:focus, &:hover
    color: #2dbc4e

.accent-teal
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #20c997

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #158765

  .dropdown-item
    &.active, &:active
      background-color: #20c997
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #20c997
        border-color: #127155

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #7eeaca

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #7eeaca

  .page-item
    .page-link
      color: #20c997

    &.active
      .page-link, a
        background-color: #20c997
        border-color: #20c997
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-teal .page-item .page-link
  &:focus, &:hover
    color: #26dca6

.accent-cyan
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #17a2b8

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #0f6674

  .dropdown-item
    &.active, &:active
      background-color: #17a2b8
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #17a2b8
        border-color: #0c525d

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #63d9ec

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #63d9ec

  .page-item
    .page-link
      color: #17a2b8

    &.active
      .page-link, a
        background-color: #17a2b8
        border-color: #17a2b8
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-cyan .page-item .page-link
  &:focus, &:hover
    color: #1ab6cf

.accent-white
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #fff

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #d9d9d9

  .dropdown-item
    &.active, &:active
      background-color: #fff
      color: #1f2d3d

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #fff
        border-color: #ccc

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #fff

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #fff

  .page-item
    .page-link
      color: #fff

    &.active
      .page-link, a
        background-color: #fff
        border-color: #fff
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-white .page-item .page-link
  &:focus, &:hover
    color: #fff

.accent-gray
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #6c757d

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #494f54

  .dropdown-item
    &.active, &:active
      background-color: #6c757d
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #6c757d
        border-color: #3d4246

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #afb5ba

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #afb5ba

  .page-item
    .page-link
      color: #6c757d

    &.active
      .page-link, a
        background-color: #6c757d
        border-color: #6c757d
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-gray .page-item .page-link
  &:focus, &:hover
    color: #78828a

.accent-gray-dark
  .btn-link, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn)
    color: #343a40

  .btn-link:hover, a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn):hover
    color: #121416

  .dropdown-item
    &.active, &:active
      background-color: #343a40
      color: #fff

  .custom-control-input
    &:checked ~ .custom-control-label
      &::before
        background-color: #343a40
        border-color: #060708

      &::after
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")

    &:focus:not(:checked) ~ .custom-control-label::before
      border-color: #6d7a86

  .custom-file-input:focus ~ .custom-file-label, .custom-select:focus, .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid)
    border-color: #6d7a86

  .page-item
    .page-link
      color: #343a40

    &.active
      .page-link, a
        background-color: #343a40
        border-color: #343a40
        color: #fff

    &.disabled
      .page-link, a
        background-color: #fff
        border-color: #dee2e6
        color: #6c757d

  [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #c2c7d0

    &:hover
      color: #fff

  [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link)
    color: #343a40

    &:hover
      color: #212529

.dark-mode.accent-gray-dark .page-item .page-link
  &:focus, &:hover
    color: #3f474e

[class*=accent-] a
  &.btn-primary, &.btn-secondary, &.btn-success, &.btn-info
    color: #fff

  &.btn-warning
    color: #1f2d3d

  &.btn-danger
    color: #fff

  &.btn-light
    color: #1f2d3d

  &.btn-dark
    color: #fff

.dark-mode
  .bg-light
    background-color: #454d55 !important
    color: #fff !important

  .link-black, .link-dark, .text-black, .text-dark
    color: #ced4da

/*# sourceMappingURL=adminlte.min.css.map #*//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) *//* (ignored) */