/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    height: 100%;
  }
  body {
    margin: 0;
    height: 100%;
  }
  main {
    display: block;
  }
  h1, h2, h3, h4, h5, h6, p, ul, ol, li, a {
    margin: 0;
    padding: 0;
  }
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  a {
    background-color: transparent;
  }
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  b,
  strong {
    font-weight: bolder;
  }
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  small {
    font-size: 80%;
  }
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  img {
    border-style: none;
  }
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  button,
  input { /* 1 */
    overflow: visible;
  }
  button,
  select { /* 1 */
    text-transform: none;
  }
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  progress {
    vertical-align: baseline;
  }
  textarea {
    overflow: auto;
  }
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  details {
    display: block;
  }
  summary {
    display: list-item;
  }
  template {
    display: none;
  }
  [hidden] {
    display: none;
  }
  *, ::after, ::before {
      box-sizing: border-box;
  }
  iframe {
    border: none;
  }
  
  
  /* Strike BI */
  body
  {
      display: flex;
      flex-direction: column;
      color: #181c32;    
      background-color: #f9fafb;
      font-family: Poppins,Helvetica,sans-serif;
  }
  #content
  {
      flex: 1;
      flex-direction: column;
      display: flex;
  }
  #contentContainer
  {
      flex: 1 0 auto;
      flex-direction: row;
      display: flex;
  }
  #side
  {
      display: flex;
      flex-direction: column;
      background-color: #f2f3f5;
      padding: 0;
  }
  #sideLogo 
  {
      display: flex;
  }
  #sideLogoContainer
  {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #sideLogoBox
  {
      flex-shrink: 0;
      width: 100%;
  }
  #sideLogo
  {
      background: #edeff5;
      padding-top: 24px;
      padding-bottom: 24px;
  }
  #sideLogo p
  {
      text-align: center;
  }
  #sideLogo img
  {
      width: 170px;
  }
  #sideMenu
  {
      display: flex;
      align-items: center;
      width: 100%;
      flex: 1 0 auto;
  }
  #sideMenuContainer
  {
      flex: none;
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #menuBox
  {
      display: flex;
      flex-direction: column;
      width: 100%;
      margin-top: auto!important;
      margin-bottom: auto!important;
  }
  #menuBox ul li
  {
      text-align: center;
      text-transform: uppercase;
      font-size: 14px;
      font-weight: 500;
      padding-bottom: 2px;
  }
  #menuBox ul li a
  {
      color: #ab1e78;
      text-decoration: none;
      display: block;
      padding: 9px 0;
      background-color: transparent;
      transition: background-color 300ms ease-in-out;
  }
  #menuBox ul li a:hover,
  #menuBox ul li a:active,
  #menuBox ul li a:focus
  {
      background-color: #e3e9ef;
  }
  
  
  #menuBox ul#secondaryMenu li
  {
      font-size: 12px;
  }
  #menuBox ul#secondaryMenu li a
  {
      color: #372d5f;
  }
  
  
  #sideFooter
  {
      display: flex;
  }
  #sideFooterContainer
  {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #sideUser, 
  #sideCredit
  {
      flex-shrink: 0;
      width: 100%;
  }
  #sideUser p,
  #sideCredit p
  {
      text-align: center;
  }
  p.headerUser_name,
  p.headerUser_role
  {
      font-size: 14px;
      font-weight: 400;
      color: #444;
  }
  p.headerUser_role
  {
      font-size: 11px;
      text-transform: uppercase;
  }
  p.headerUser_action
  {
      font-size: 12px;
      padding-top: 6px;
  }
  p.headerUser_action a
  {
      color: #333;
      text-decoration: none;
  }
  p.headerUser_action a:hover,
  p.headerUser_action a:active,
  p.headerUser_action a:focus
  {
      color: #ab1e78;
      text-decoration: underline;
  }
  #sideCredit
  {
      background: #edeff5;
      margin-top: 45px;
      padding-top: 18px;
      padding-bottom: 18px;
  }
  .sideCredit_title
  {
      color: #444;
      font-size: 10px;
      padding-bottom: 4px;
  }
  .sideCredit_name img
  {
      width: 58px;
  }
  
  #main
  {
      flex: 1 auto;
      min-width: 0;
      flex-direction: column;
      display: flex;
  }
  #header
  {
      flex: 1 0 auto;    
      display: flex;
  }
  #headerContent
  {
      padding: 0 30px;
      width: 100%;
      margin-right: auto;
      margin-left: auto;
  }
  #headerContentContainer
  {
      display: flex;
      width: 100%;
      --bs-gutter-x: 2.5em;
      --bs-gutter-y: 2.5em;
  }

  #headerRightContent
  {
      padding-right: 50px ;
  }

  #headerTitle
  {
      padding-right: calc(var(--bs-gutter-x) * .5);
      padding-bottom: var(--bs-gutter-y);
      padding-left: calc(var(--bs-gutter-x) * .5);
  }
  #headerTitle h1
  {
      font-size: 1.65em;
      font-weight: 500;
      color: #222;
  }
  #mainContent
  {
      flex: 1 0 auto;
      flex-direction: column;
      display: flex;
  }
  .boxContent
  {
      padding: 0 30px;
      width: 100%;
      margin-right: auto;
      margin-left: auto;
  }
  .boxContentContainer
  {
      display: flex;
      width: 100%;
      --bs-gutter-x: 2.5em;
      --bs-gutter-y: 2.5em;
      padding-bottom: 2.6em;
  }
.dashboardsGrid .boxContentContainer
{
    flex-flow: row wrap;
}
 #main.home .boxContentContainer
{
    flex-direction: column;
}
  .boxItem
  {
      flex: 0 0 auto;
      width: 33.33333333%;
      max-width: 100%;
      border-radius: .65em;
      padding-left: calc(var(--bs-gutter-x) * .5);
      padding-right: calc(var(--bs-gutter-x) * .5);
  }
  .dashboardsGrid .boxContentContainer .boxItem
  {
      padding-bottom: calc(var(--bs-gutter-x) * .9);
  }
  .boxItemInside
  {
      border-radius: 0.65em;
      padding: 21px 30px 33px;
      height: 100%;
  }
  .boxItemDashboard .boxItemInside
  {
      background: #cbd4f4;
  }
  .boxItemUsers .boxItemInside
  {
      background: #d4ecef;
  }
  .boxItemDashboardsContainer .boxItemInside
  {
      background: #e7ecff;
  }
  #main.singleDashboard .boxItemDashboardsContainer .boxItemInside
  {
      background: transparent;
      padding: 0;
      border-radius: 0;
  }
  .boxItemFullWidth
  {
      flex: 0 0 auto;
      width: 100%;
      max-width: 100%;
      border-radius: .65em;
      padding-left: calc(var(--bs-gutter-x) * .5);
      padding-right: calc(var(--bs-gutter-x) * .5);
  }
  .boxItemFullWidth img
  {
      max-width: 100%;
  }
  
  #main.home .boxItem
  {
      flex: none;
  }
  #main.home .boxItem.boxItemDashboard
  {
      padding-bottom: 36px;
  }
  
  .feedbackBox
  {
      padding: 15px 27px 18px 27px;
      border-radius: 0.15em;
      background: #e5f5f7;
  }
  
  .extraLinkBox p a 
  {
      margin-left: 21px;
  }

  .extraLinkBox p input
  {
      margin-left: 21px;
  }

  .extraLinkBox p a,
  .extraLinkBox p a:link,
  .extraLinkBox p a:visited
  {
      color: #ab1e78;
      text-transform: uppercase;
      font-size: 14px;
      font-weight: 500;
      text-decoration: none;
      transition: color 400ms ease-in-out;
  }
  .extraLinkBox p a:hover,
  .extraLinkBox p a:active,
  .extraLinkBox p a:focus
  {
      color: #372d5f;
  }
  
  .boxItemUsersContainer .boxItemInside,
  .boxItemSingleUserContainer .boxItemInside
  {
      background: #e5f5f7;
  }
  #main.users .boxContentContainer 
  {
      display: block;
  }
  #main.users .boxItem 
  {
      display: block;
      width: 100%;
      margin-bottom: 2.6em;
  }
  .userLine p 
  {
      font-weight: 400;
      color: #222;
  }
  .userLine p.userLine_name 
  {
      font-size: 1.3em;
      line-height: 1.5em;
  
  }
  .userLine p.userLine_type 
  {
      font-size: 1.1em;
      line-height: 1.1em;
      padding-bottom: 12px;
  }
  .userLine p.userLine_id,
  .userLine p.userLine_role 
  {
      font-size: 0.9em;
      line-height: 1.3em;
  }
  .userLine p.userLine_status 
  {
      font-size: 0.6em;
      padding-top: 6px;
      text-transform: uppercase;
      letter-spacing: 0.02em;
  }
  
  .boxItemSingleUserContainer
  {
      width: 100%;
  }
  .boxItemSingleUserContainer .boxItemInside
  {
      padding: 36px;
  }
  .formBox 
  {
      padding-bottom: 30px;
  }
  .formBox .formCheckbox
  {
      padding-top: 6px;
  }
  .formBox input.fieldText,
  .formBox select
  {
      padding: 8px 10px;
      border: 1px solid #50818b;
      background: transparent;
      border-radius: 2px;
      font-size: 16px;
      width: 420px;
  }

  .formBox textarea.fieldTextArea
  {
      padding: 8px 10px;
      border: 1px solid #50818b;
      background: transparent;
      border-radius: 2px;
      font-size: 16px;
      width: 420px;
  }

  .formBox input.fieldCheckbox,
  .formBox input.fieldRadio
  {
      border-color: #50818b;
  }
  .formBox select
  {
      padding: 6px;
  }
  .formBox label.formLabel,
  .formBox input.fieldText,
  .formBox select
  {
      display: block;
  }
  .formBox label.formLabel,
  .formBox p.labelText
  {
      font-size: 14px;
      font-weight: 500;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 3px;
  }
  .formBox .formBoxCheckbox
  {
      padding-top: 9px;
  }

  h3
  {
    font-size: 1.5em;
    font-weight: 500;
    color: #222;
    
  }
  
  .boxItem h2
  {
      font-size: 1.3em;
      font-weight: 500;
      color: #222;
  }
  .boxItem p.boxItemDesc
  {
      font-size: 0.9em;
      line-height: 1.6em;
      font-weight: 400;
      color: #222;
      padding-top: 18px;
  }
  .boxItem p.boxItemLink
  {
      font-size: 0.9em;
      line-height: 1.6em;
      font-weight: 400;
      margin-top: 21px;
  }
  #main.usersGrid .boxItem p.boxItemLink
  {
      margin-top: 12px;
  }
  a.button, 
  input.button
  {
      color: #fff;
      background: #ab1e78;
      text-decoration: none;
      display: inline-block;
      padding: 4px 12px;
      border-radius: 2px;
      font-size: 12px;
      font-weight: 400;
      text-transform: uppercase;
      letter-spacing: 0.08em;
  }
  a.button, 
  input.button
  {
      padding: 9px 12px;
      border: none;
  }
  .formBoxMessage
  {
      border-left: 2px solid black;
      padding-top: 12px;
      padding-left: 15px;
  }
  #main.login .formBoxMessage
  {
      margin-top: 36px;
  }
  .formBoxMessage p
  {
      font-size: 14px;
      font-weight: 500;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 12px;
  }
  .formBoxMessageError p
  {
      color: crimson;
  }
  .formBoxMessageConfirm p
  {
      color: seagreen;
  }
  .formBoxMessageError
  {
      border-color: crimson;
  }
  .formBoxMessageConfirm
  {
      border-color: seagreen;
  }
  
  #main.login
  {
      padding-left: 0;
      padding-top: 90px;
  }
  #main.login #headerContentContainer 
  {
      display: block;
      text-align: center;
  }
  #main.login .boxItem 
  {
      width: 100%;
  }
  .boxItemLoginContainer .boxItemInside 
  {
      max-width: 330px;
      margin-left: auto;
      margin-right: auto;
      background: #e7ecff;
      padding: 36px 39px 36px;
  }
  #main.login .formBox input.fieldText
  {
      width: 100%;
      border-color: #7081c1;
      font-size: 14px;
      padding: 10px;
  }
  #main.login .formBox label.formLabel 
  {
      font-size: 12px;
      font-weight: 400;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 2px;
  }
  #main.login .formBox
  {
      padding-bottom: 21px;
  }
  
  #main.login .formBoxLast 
  {
      padding-top: 6px;
      padding-bottom: 0;
  }
  body.login
  {
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center bottom;
      background-color: #d9e1ff;
      background-color: #f5f5f5;
  }
  
  #menu{
	width: 35px;
	height: 30px;
	cursor: pointer;
    padding-top: 9px;
}

.bar{
	height: 5px;
	width: 100%;
	background-color:#ab1e78;
	display: block;
	border-radius: 5px;
	transition: 0.3s ease;
}
#bar1{
	transform: translateY(-4px);
}
#bar3{
	transform: translateY(4px);
}
.nav li a{
    color: #372d5f;
	text-decoration: none;
    text-align: center;
}
.nav li a:hover{
	font-weight: bold;
}

.nav li{
	list-style: none;
    align-content: center;
    padding: 10px 10px;
}
.nav{
    background-color:#edeff5;
	transition: 0.3s ease;
	display: none;
}

.menu-bg{
	width: 0;
	height: 0;
	transition: 0.3s ease;
}

.change{
	display: block;
}

.loading{
    display: none;
    justify-content: center;
}

.loading::after{
    content: "";
    width: 300px;
    height: 300px;
    border: 50px solid #dddddd;
    border-top-color: #ab1e78;
    border-radius: 50%;
    animation: loading 2s linear infinite
}

@keyframes loading {
    to {
        transform: rotate(1turn);
    }
}

  /* desktop only */
  @media (min-width: 960px) {
  #side {
      position: fixed;
      top: 30px;
      bottom: 30px;
      left: 30px;
      z-index: 100;
      overflow: hidden;
      width: 210px;
      border-radius: 0.3em;
  }
  #side #sideLogo {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  #menuBox ul#secondaryMenu {
      padding-top: 24px;
  }
  #main {
      padding-top: 30px;
      padding-left: 240px;
  }
  .feedbackBox {
      margin-left: 21px;
  }
  #footer {
      display: none;
  }
  }
  
  
  /* desktop only by BI */
  @media only screen and (max-width: 10600px) {
      section#report-container {
          height: calc(0.6 * 80vw);
      }
  }
  
  
  /* mobile only */
  @media (max-width: 959px) {
  #sideFooter {
      display: none;
  }
  #menuBox ul {
      text-align: center;
  }
  #menuBox ul li {
      display: inline-block;
      padding: 3px 9px;
  }
  #menuBox ul li a:hover, 
  #menuBox ul li a:active,
  #menuBox ul li a:focus {
      background-color: transparent;
  }
  #menuBox ul#secondaryMenu {
      border-top: 1px solid #edeff5;
  }
  #contentContainer {
      display: block;
  }
  #side,
  #main {
      display: block;
  }
  #headerContentContainer {
      display: block;
  }
  #headerContent {
      padding: 0;
  }
  #headerTitle {
      padding: 27px 12px;
  }
  #headerTitle h1 {
      text-align: center;
  }
  #main.singleDashboard .boxContentContainer {
      padding-bottom: 0;
  }
  .boxContent,
  .boxItemFullWidth {
      padding: 0;
  }
  .boxItemInside {
      padding: 12px;
  }
  #main.singleDashboard .boxItemInside {
      border-radius: 0;
  }
  #main.dashboards .boxContent .boxContentContainer {
      display: block;
      padding-bottom: 0;
  }
  #main.dashboards .boxContent .boxItem {
      display: block;
      width: 100%;
      padding: 0 12px 12px 12px;
  }
  #main.dashboards .boxContent .boxItem .boxItemInside {
      padding: 24px 27px 30px 27px;
      border-radius: 0.25em;
  }
  #main.dashboards .boxItem p.boxItemDesc {
      padding-top: 6px;
  }
  #main.dashboards .boxItem p.boxItemLink {
      margin-top: 18px;
  }
  .feedbackBox {
      margin: 0 12px 12px 12px;
  }
  #main.users .boxItem {
      margin-bottom: 0;
  }
  #main.singleUser .boxContentContainer {
      padding-bottom: 21px;
  }
  .extraLinkBox
  {
      text-align: center;
      padding-bottom: 36px;
  }
  #footer {
      text-align: center;
  }
  #footerUser {
      background-color: #f2f3f5;
      padding: 24px 12px;
  }
  #footerCredit {
      background-color: #edeff5;
      padding: 12px 12px;
  }




  }
  

  
 
 
  
  /* small mobile only */
  @media (max-width: 569px) { 
  #main.login {
      padding-left: 0;
      padding-top: 45px;
  }
  #main.singleUser .formBox input.fieldText, 
  #main.singleUser .formBox select {
      width: 100%;
  }
  .boxItemSingleUserContainer .boxItemInside {
      padding: 18px;
  }
  .boxItem.boxItemSingleUserContainer {
      padding-left: 0;
      padding-right: 0;
  }
  .boxItem.boxItemSingleUserContainer .boxItemInside {
      border-radius: 0.65em 0.65em 0 0;
  }
  #main.singleUser .boxContentContainer {
      padding-bottom: 0;
  }
  }  



  /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    height: 100%;
  }
  body {
    margin: 0;
    height: 100%;
  }
  main {
    display: block;
  }
  h1, h2, h3, h4, h5, h6, p, ul, ol, li, a {
    margin: 0;
    padding: 0;
  }
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  a {
    background-color: transparent;
  }
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  b,
  strong {
    font-weight: bolder;
  }
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  small {
    font-size: 80%;
  }
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }
  img {
    border-style: none;
  }
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  button,
  input { /* 1 */
    overflow: visible;
  }
  button,
  select { /* 1 */
    text-transform: none;
  }
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  progress {
    vertical-align: baseline;
  }
  textarea {
    overflow: auto;
  }
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  details {
    display: block;
  }
  summary {
    display: list-item;
  }
  template {
    display: none;
  }
  [hidden] {
    display: none;
  }
  *, ::after, ::before {
      box-sizing: border-box;
  }
  iframe {
    border: none;
  }
  
  
  /* Strike BI */
  body
  {
      display: flex;
      flex-direction: column;
      color: #181c32;    
      background-color: #f9fafb;
      font-family: Poppins,Helvetica,sans-serif;
  }
  #content
  {
      flex: 1;
      flex-direction: column;
      display: flex;
  }
  #contentContainer
  {
      flex: 1 0 auto;
      flex-direction: row;
      display: flex;
  }
  #side
  {
      display: flex;
      flex-direction: column;
      background-color: #f2f3f5;
      padding: 0;
  }
  #sideLogo 
  {
      display: flex;
  }
  #sideLogoContainer
  {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #sideLogoBox
  {
      flex-shrink: 0;
      width: 100%;
  }
  #sideLogo
  {
      background: #edeff5;
      padding-top: 24px;
      padding-bottom: 24px;
  }
  #sideLogo p
  {
      text-align: center;
  }
  #sideLogo img
  {
      width: 170px;
  }
  #sideMenu
  {
      display: flex;
      align-items: center;
      width: 100%;
      flex: 1 0 auto;
  }
  #sideMenuContainer
  {
      flex: none;
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #menuBox
  {
      display: flex;
      flex-direction: column;
      width: 100%;
      margin-top: auto!important;
      margin-bottom: auto!important;
  }
  #menuBox ul li
  {
      text-align: center;
      text-transform: uppercase;
      font-size: 14px;
      font-weight: 500;
      padding-bottom: 2px;
  }
  #menuBox ul li a
  {
      color: #ab1e78;
      text-decoration: none;
      display: block;
      padding: 9px 0;
      background-color: transparent;
      transition: background-color 300ms ease-in-out;
  }
  #menuBox ul li a:hover,
  #menuBox ul li a:active,
  #menuBox ul li a:focus
  {
      background-color: #e3e9ef;
  }
  
  
  #menuBox ul#secondaryMenu li
  {
      font-size: 12px;
  }
  #menuBox ul#secondaryMenu li a
  {
      color: #372d5f;
  }
  
  
  #sideFooter
  {
      display: flex;
  }
  #sideFooterContainer
  {
      display: flex;
      width: 100%;
      flex-wrap: wrap;
  }
  #sideUser, 
  #sideCredit
  {
      flex-shrink: 0;
      width: 100%;
  }
  #sideUser p,
  #sideCredit p
  {
      text-align: center;
  }
  p.headerUser_name,
  p.headerUser_role
  {
      font-size: 14px;
      font-weight: 400;
      color: #444;
  }
  p.headerUser_role
  {
      font-size: 11px;
      text-transform: uppercase;
  }
  p.headerUser_action
  {
      font-size: 12px;
      padding-top: 6px;
  }
  p.headerUser_action a
  {
      color: #333;
      text-decoration: none;
  }
  p.headerUser_action a:hover,
  p.headerUser_action a:active,
  p.headerUser_action a:focus
  {
      color: #ab1e78;
      text-decoration: underline;
  }
  #sideCredit
  {
      background: #edeff5;
      margin-top: 45px;
      padding-top: 18px;
      padding-bottom: 18px;
  }
  .sideCredit_title
  {
      color: #444;
      font-size: 10px;
      padding-bottom: 4px;
  }
  .sideCredit_name img
  {
      width: 58px;
  }
  
  #main
  {
      flex: 1 auto;
      min-width: 0;
      flex-direction: column;
      display: flex;
  }
  #header
  {
      flex: 1 0 auto;
      flex-direction: column;
      display: flex;
  }
  #headerContent
  {
      padding: 0 30px;
      width: 100%;
      margin-right: auto;
      margin-left: auto;
  }
  #headerContentContainer
  {
      display: flex;
      display: block;
      width: 100%;
      --bs-gutter-x: 2.5em;
      --bs-gutter-y: 2.5em;
  }
  #headerTitle
  {
      padding-top: ;
      padding-right: calc(var(--bs-gutter-x) * .5);
      padding-bottom: var(--bs-gutter-y);
      padding-left: calc(var(--bs-gutter-x) * .5);
  }
  #headerLinks
  {
      padding-top: ;
      padding-right: calc(var(--bs-gutter-x) * .5);
      padding-bottom: var(--bs-gutter-y);
      padding-left: calc(var(--bs-gutter-x) * .5);
  }
  #headerLinks ul,
  #headerLinks ul li
  {
      padding: 0;
      margin: 0;
      list-style: none;
  }
  #headerLinks ul li
  {
      display: inline-block;
      margin-right: 18px;
  }
  #headerLinks ul li a,
  #headerLinks ul li a:link,
  #headerLinks ul li a:visited,
  #headerLinks ul li a:hover,
  #headerLinks ul li a:active,
  #headerLinks ul li a:focus
  {
      color: #222;
      text-decoration: underline;
      font-size: 0.85em;
      font-weight: 500;
  }
  .dashboardsGridFolder
  {
      padding: 0 0 27px 21px;
  }
  #headerTitle h1,
  .dashboardsGridFolder h2
  {
      font-size: 1.65em;
      font-weight: 500;
      color: #222;
  }
  .dashboardsGridFolder h2
  {
      font-size: 1.3em;
  }
  #mainContent
  {
      flex: 1 0 auto;
      flex-direction: column;
      display: flex;
  }
  .boxContent
  {
      padding: 0 30px;
      width: 100%;
      margin-right: auto;
      margin-left: auto;
  }
  .boxContentContainer
  {
      display: flex;
      width: 100%;
      --bs-gutter-x: 2.5em;
      --bs-gutter-y: 2.5em;
      padding-bottom: 2.6em;
  }
  .dashboardsGrid .boxContentContainer
  {
      padding-bottom: 1.3em;
  }
  .dashboardsGrid .boxContentContainer,
  .workspacesGrid .boxContentContainer,
  .companiesGrid .boxContentContainer,
  .foldersGrid .boxContentContainer,
  .dashboardsManageGrid .boxContentContainer
  {
      flex-flow: row wrap;
  }
  #main.home .boxContentContainer
  {
      flex-direction: column;
  }
  .boxItem
  {
      flex: 0 0 auto;
      width: 33.33333333%;
      max-width: 100%;
      border-radius: .65em;
      padding-left: calc(var(--bs-gutter-x) * .5);
      padding-right: calc(var(--bs-gutter-x) * .5);
  }
  .dashboardsGrid .boxContentContainer .boxItem
  {
      padding-bottom: calc(var(--bs-gutter-x) * .9);
  }
  .boxItemInside
  {
      border-radius: 0.65em;
      padding: 21px 30px 33px;
      height: 100%;
  }
  .boxItemCompaniesContainer .boxItemInside
  {
      padding-bottom: 21px;
  }
  .boxItemDashboard .boxItemInside
  {
      background: #cbd4f4;
  }
  .boxItemUsers .boxItemInside
  {
      background: #d4ecef;
  }
  .boxItemWorkspaces .boxItemInside
  {
      background: #ffd6d8;
  }
  .boxItemFolders .boxItemInside
  {
      background: #ffd6d8;
  }
  .boxItemDashboardsmanage .boxItemInside
  {
      background: #becbda;
  }
  .boxItemGroups .boxItemInside
  {
      background: #D5C4C3;
  }
  .boxItemDashboardsContainer .boxItemInside
  {
      background: #e7ecff;
  }
  #main.singleDashboard .boxItemDashboardsContainer .boxItemInside
  {
      background: transparent;
      padding: 0;
      border-radius: 0;
  }
  .boxItemFullWidth
  {
      flex: 0 0 auto;
      width: 100%;
      max-width: 100%;
      border-radius: .65em;
      padding-left: calc(var(--bs-gutter-x) * .5);
      padding-right: calc(var(--bs-gutter-x) * .5);
  }
  .boxItemFullWidth img
  {
      max-width: 100%;
  }
  
  #main.home .boxItem
  {
      flex: none;
  }
  #main.home .boxItem.boxItemDashboard,
  #main.home .boxItem.boxItemUsers,
  #main.home .boxItem.boxItemFolders,
  #main.home .boxItem.boxItemDashboardsmanage,
  #main.home .boxItem.boxItemGroups
  {
      padding-bottom: 36px;
  }
  
  .feedbackBox
  {
      padding: 15px 27px 18px 27px;
      border-radius: 0.15em;
      background: #e5f5f7;
  }
  
  .extraLinkBox p a
  {
      margin-left: 21px;
  }
  .extraLinkBox p a,
  .extraLinkBox p a:link,
  .extraLinkBox p a:visited
  {
      color: #ab1e78;
      text-transform: uppercase;
      font-size: 14px;
      font-weight: 500;
      text-decoration: none;
      transition: color 400ms ease-in-out;
  }
  .extraLinkBox p a:hover,
  .extraLinkBox p a:active,
  .extraLinkBox p a:focus
  {
      color: #372d5f;
  }
  
  
  .boxItemListContainer .boxItemInside, 
  .boxItemFormContainer .boxItemInside
  {
      background: #e5f5f7;
  }
  #main.users .boxContentContainer,
  #main.workspaces .boxContentContainer, 
  #main.companies .boxContentContainer, 
  #main.folders .boxContentContainer, 
  #main.dashboardsManage .boxContentContainer 
  {
      display: block;
  }
  #main.users .boxItem,
  #main.workspaces .boxItem, 
  #main.companies .boxItem,
  #main.folders .boxItem, 
  #main.dashboardsManage .boxItem 
  {
      display: block;
      width: 100%;
      margin-bottom: 2.6em;
  }
  .listElementLine p
  {
      font-weight: 400;
      color: #222;
  }
  .listElementLine p.listElement_1
  {
      font-size: 1.3em;
      line-height: 1.5em;
  }
  .listElementLine p.listElement_1 a, 
  .listElementLine p.listElement_1 a:link, 
  .listElementLine p.listElement_1 a:visited 
  {
      color: #222;
      text-decoration: none;
  }
  .listElementLine p.listElement_1 a:hover, 
  .listElementLine p.listElement_1 a:active, 
  .listElementLine p.listElement_1 a:focus 
  {
      color: #222;
      text-decoration: underline;
  }
  .userLine p.userLine_type 
  {
      font-size: 1.1em;
      line-height: 1.1em;
      padding-bottom: 12px;
  }
  .listElementLine p.listElement_2 
  {
      font-size: 0.9em;
      line-height: 1.3em;
  }
  .listElementLine p.listElement_2 a, 
  .listElementLine p.listElement_2 a:link, 
  .listElementLine p.listElement_2 a:visited 
  {
      color: #222;
      text-decoration: none;
  }
  .listElementLine p.listElement_2 a:hover, 
  .listElementLine p.listElement_2 a:active, 
  .listElementLine p.listElement_2 a:focus 
  {
      color: #222;
      text-decoration: underline;
  }
  .listElementLine p.listElement_3 
  {
      font-size: 0.6em;
      padding-top: 6px;
      text-transform: uppercase;
      letter-spacing: 0.02em;
  }
  .listElementLine p.listElement_3 a, 
  .listElementLine p.listElement_3 a:link, 
  .listElementLine p.listElement_3 a:visited 
  {
      color: #222;
      text-decoration: none;
  }
  .listElementLine p.listElement_3 a:hover, 
  .listElementLine p.listElement_3 a:active, 
  .listElementLine p.listElement_3 a:focus 
  {
      color: #222;
      text-decoration: underline;
  }
  
  .boxItemFormContainer 
  {
      width: 100%;
  }
  .boxItemFormContainer .boxItemInside 
  {
      padding: 36px;
  }
  .formBox 
  {
      padding-bottom: 30px;
  }
  .formBox .formCheckbox
  {
      padding-top: 6px;
  }
  .formBox textarea,
  .formBox input.fieldText,
  .formBox select
  {
      padding: 8px 10px;
      border: 1px solid #50818b;
      background: transparent;
      border-radius: 2px;
      font-size: 16px;
      width: 420px;
  }
  .formBox input.fieldCheckbox,
  .formBox input.fieldRadio
  {
      border-color: #50818b;
  }
  .formBox select
  {
      padding: 6px;
  }
  .formBox label.formLabel,
  .formBox input.fieldText,
  .formBox select
  {
      display: block;
  }
  .formBox label.formLabel,
  .formBox p.labelText
  {
      font-size: 14px;
      font-weight: 500;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 3px;
  }
  .formBox .formBoxCheckbox
  {
      padding-top: 9px;
  }
  .formBox .companyLogo img
  {
      max-width: 170px;
      margin-top: 12px;
  }
  
  .boxItem h2, 
  .boxItem h3
  {
      font-size: 1.3em;
      font-weight: 500;
      color: #222;
  }
  .boxItem.notActive h2
  {
      color: #999;
  }
  .boxItem h3
  {
      font-size: 1em;
      padding-top: 12px;
  }
  .boxItem p.boxItemDesc
  {
      font-size: 0.9em;
      line-height: 1.6em;
      font-weight: 400;
      color: #222;
      padding-top: 18px;
  }
  .boxItem.notActive p.boxItemDesc
  {
      color: #999;
  }
  .boxItem p.boxItemPreviewPic img
  {
      margin-top: 18px;
      max-width: 170px;
  }
  .boxItem.notActive p.boxItemPreviewPic img
  {
      filter: blur(0.3rem);
  }
  .boxItem p.boxItemLink
  {
      font-size: 0.9em;
      line-height: 1.6em;
      font-weight: 400;
      margin-top: 21px;
  }
  #main.usersGrid .boxItem p.boxItemLink
  {
      margin-top: 12px;
  }
  a.button, 
  input.button
  {
      color: #fff;
      background: #ab1e78;
      text-decoration: none;
      display: inline-block;
      padding: 4px 12px;
      border-radius: 2px;
      font-size: 12px;
      font-weight: 400;
      text-transform: uppercase;
      letter-spacing: 0.08em;
  }
  input.button
  {
      padding: 9px 12px;
      border: none;
  }
  .formBoxMessage
  {
      border-left: 2px solid black;
      padding-top: 12px;
      padding-left: 15px;
  }
  #main.login .formBoxMessage
  {
      margin-top: 36px;
  }
  .formBoxMessage p
  {
      font-size: 14px;
      font-weight: 500;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 12px;
  }
  .formBoxMessageError p
  {
      color: crimson;
  }
  .formBoxMessageConfirm p
  {
      color: seagreen;
  }
  .formBoxMessageError
  {
      border-color: crimson;
  }
  .formBoxMessageConfirm
  {
      border-color: seagreen;
  }
  .deleteLink 
  {
      padding-top: 27px;
      font-size: 12px;
      font-weight: 500;
      color: #222;
  }
  .deleteLink a,
  .deleteLink a:link,
  .deleteLink a:visited
  {
      color: #222;
      text-decoration: none;
  }
  .deleteLink a:hover,
  .deleteLink a:active,
  .deleteLink a:focus
  {
      color: #222;
      text-decoration: underline;
  }
  
  #main.login
  {
      padding-left: 0;
      padding-top: 90px;
  }
  #main.login #headerContentContainer 
  {
      display: block;
      text-align: center;
  }
  #main.login .boxItem 
  {
      width: 100%;
  }
  .boxItemLoginContainer .boxItemInside 
  {
      max-width: 330px;
      margin-left: auto;
      margin-right: auto;
      background: #e7ecff;
      padding: 36px 39px 36px;
  }
  #main.login .formBox input.fieldText
  {
      width: 100%;
      border-color: #7081c1;
      font-size: 14px;
      padding: 10px;
  }
  #main.login .formBox label.formLabel 
  {
      font-size: 12px;
      font-weight: 400;
      color: #222;
      text-transform: uppercase;
      padding-bottom: 2px;
  }
  #main.login .formBox
  {
      padding-bottom: 21px;
  }
  
  #main.login .formBoxLast 
  {
      padding-top: 6px;
      padding-bottom: 0;
  }
  body.login
  {
      background-color: #d9e1ff;
      background-color: #f5f5f5;
  }
  #loginLogo img 
  {
      max-width: 40px;
      margin-bottom: 15px;
  }
  
  
  /* desktop only */
  @media (min-width: 960px) {
  #side {
      position: fixed;
      top: 30px;
      bottom: 30px;
      left: 30px;
      z-index: 100;
      overflow: hidden;
      width: 210px;
      border-radius: 0.3em;
  }
  #side #sideLogo {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  #menuBox ul#secondaryMenu {
      padding-top: 24px;
  }
  #main {
      padding-top: 30px;
      padding-left: 240px;
  }
  .feedbackBox {
      margin-left: 21px;
  }
  #footer {
      display: none;
  }
  }
  
  
  /* desktop only by BI */
  @media only screen and (max-width: 10600px) {
      section#report-container {
          height: calc(0.6 * 80vw);
      }
  }
  
  
  /* mobile only */
  @media (max-width: 959px) {
  #sideFooter {
      display: none;
  }
  #menuBox ul {
      text-align: center;
      padding: 9px 0;
  }
  #menuBox ul li {
      display: inline-block;
      padding: 3px 9px;
  }
  #menuBox ul li a:hover, 
  #menuBox ul li a:active,
  #menuBox ul li a:focus {
      background-color: transparent;
  }
  #menuBox ul#secondaryMenu {
      border-top: 1px solid #edeff5;
  }
  #contentContainer {
      display: block;
  }
  #side,
  #main {
      display: block;
  }
  #headerContentContainer {
      display: block;
  }
  #headerContent {
      padding: 0;
  }
  #headerTitle, 
  .dashboardsGridFolder {
      padding: 27px 12px;
  }
  #headerTitle h1, 
  .dashboardsGridFolder h2 {
      text-align: center;
  }
  #main.singleDashboard .boxContentContainer {
      padding-bottom: 0;
  }
  .extraLinkBox p a {
      margin-left: 0;
  }
  .boxContent,
  .boxItemFullWidth {
      padding: 0;
  }
  .boxItemInside {
      padding: 12px;
  }
  #main.singleDashboard .boxItemInside {
      border-radius: 0;
  }
  #main.dashboards .boxContent .boxContentContainer {
      display: block;
      padding-bottom: 0;
  }
  #main.dashboards .boxContent .boxItem {
      display: block;
      width: 100%;
      padding: 0 12px 12px 12px;
  }
  #main.dashboards .boxContent .boxItem .boxItemInside {
      padding: 24px 27px 30px 27px;
      border-radius: 0.25em;
  }
  #main.dashboards .boxItem p.boxItemDesc {
      padding-top: 6px;
  }
  #main.dashboards .boxItem p.boxItemLink {
      margin-top: 18px;
  }
  .feedbackBox {
      margin: 0 12px 12px 12px;
  }
  #main.users .boxItem {
      margin-bottom: 0;
  }
  #main.singleUser .boxContentContainer, 
  #main.singleWorkspace .boxContentContainer {
      padding-bottom: 21px;
  }
  .extraLinkBox
  {
      text-align: center;
      padding-bottom: 0;
  }
  #footer {
      text-align: center;
  }
  #footerUser {
      background-color: #f2f3f5;
      padding: 24px 12px;
  }
  #footerCredit {
      background-color: #edeff5;
      padding: 12px 12px;
  }
  }
  
  
  /* small mobile only */
  @media (max-width: 569px) { 
  #main.login {
      padding-left: 0;
      padding-top: 45px;
  }
  #menuBox ul li {
      display: block;
      padding: 1px 9px;
  }
  #main.users .boxItem,
  #main.workspaces .boxItem, 
  #main.companies .boxItem,
  #main.folders .boxItem, 
  #main.dashboardsManage .boxItem {
      margin-bottom: 0.6em;
  }
  #main.singleUser .formBox input.fieldText, 
  #main.singleUser .formBox select, 
  #main.singleWorkspace .formBox input.fieldText, 
  #main.singleWorkspace .formBox select {
      width: 100%;
  }
  .formBox textarea, .formBox input.fieldText, .formBox select {
      width: 100%;
  }
  .boxItemFormContainer .boxItemInside {
      padding: 18px;
  }
  .boxItem.boxItemFormContainer {
      padding-left: 0;
      padding-right: 0;
  }
  .boxItem.boxItemFormContainer .boxItemInside {
      border-radius: 0.65em 0.65em 0 0;
  }
  #main.singleUser .boxContentContainer, 
  #main.singleWorkspace .boxContentContainer {
      padding-bottom: 0;
  }
  }