/* paths */
/*
----------------------------------------
COLORS
----------------------------------------
*/
/* palette */
/* stylelint-disable color-no-hex */
/* palette shades */
/* primary */
/* accent */
/* red-brand */
/* yellow-brand */
/* Function colours */
/* Main Text colors */
/* Background colors */
/* colour opacities (mainly used for font-colors & hovers) */
/* utility colors */
/* font colour (on eg. buttons) */
/* layout colors and helpers */
/*
--------------------------------------
Color Maps
--------------------------------------
*/
/* theme colors */
/* theme shades map */
/* functional colors map */
/* functional color shades map */
/* provide neutral text grayscale map for css variable generation */
/* provide surface grayscale map for css variable generation */
/*
----------------------------------------
Fonts
----------------------------------------
*/
/* fonts */
/*
html font-size: 100% = 16px -> REM is based on this!!!
body font-size: 0.875rem = 14px
*/
/* box shadows */
/* elevation levels */
/* kinda the same as box shadow variables, but for now extra variables to not break anything */
/* borders */
/* badge */
/* navbar & footer */
/* sidebar */
/* bootstrap nav vars */
/* stylelint-disable-next-line color-named */
/* TODO on rework of slidein, these can probably be removed */
/* pagination */
/* arrow */
/* tooltip */
/* stylelint-disable-next-line color-named */
/* table */
/* List group */
/* form elements */
/** inputs -fields general **/
/* stylelint-disable-next-line color-named */
/**
* input fields (and buttons inside input-fields)
* heights
**/
/**
* buttons
* bootstrap uses:
* @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
**/
/* stylelint-disable-next-line color-named */
/* grid */
/** grid breakpoints **/
/** defines the minimum dimensions at which your layout will change, adapting to different screen sizes, for use in media queries **/
/** container breakpoints **/
/** defines the maximum width of `.container` for different screen sizes **/
/** grid columns **/
/** sets the number of columns and specifies the width of the gutters **/
/* toggles */
/** (keep these at the bottom of the file please) **/
/* add 'inherit' to the $overflows of bootstrap, to get the .overflow-inherit class */
/* Modals */
/* Drawer */
/*
----------------------------------------
COLORS
----------------------------------------
*/
/* palette */
/* stylelint-disable color-no-hex */
/* palette shades */
/* primary */
/* accent */
/* red-brand */
/* yellow-brand */
/* Function colours */
/* Main Text colors */
/* Background colors */
/* colour opacities (mainly used for font-colors & hovers) */
/* utility colors */
/* font colour (on eg. buttons) */
/* layout colors and helpers */
/*
--------------------------------------
Color Maps
--------------------------------------
*/
/* theme colors */
/* theme shades map */
/* functional colors map */
/* functional color shades map */
/* provide neutral text grayscale map for css variable generation */
/* provide surface grayscale map for css variable generation */
@keyframes icon-rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(-180deg);
  }
}
.rotate:before {
  transform: rotate(180deg);
  transition: 0.4s ease;
}

.normal:before {
  transform: rotate(0deg);
  transition: 0.4s ease;
}

.nav-link, .nav-item {
  color: #555d71 !important;
}

.nav-link.selected::after {
  border-bottom-color: #f8ad07;
  border-bottom-width: 3px;
  border-bottom-style: solid;
}

.dropdown-item:hover, .nav-link:hover a, .nav-link:hover {
  background-color: #870b58;
  color: white !important;
  text-decoration: none;
}

.dropdown-menu {
  padding: 0;
  width: 15em;
}
.dropdown-menu .submenu {
  transform: translateX(calc(15em - 2px)) translateY(-44px);
}
.dropdown-menu .dropdown-item.active, .dropdown-menu .dropdown-item:active {
  background: none;
}
.dropdown-menu .dropdown-item.active::before, .dropdown-menu .dropdown-item:active::before {
  border-left: none;
}

.dropdown-toggle::after, .dropdown-toggle.show::after {
  display: none;
}

.avatar-center {
  display: flex !important;
  -webkit-box-pack: center !important;
  -webkit-justify-content: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
  -webkit-box-align: center !important;
  -webkit-align-items: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
}