﻿body.themed {
  /* Workarounds for Internet Exploder */
  font-family: "Montserrat", "Open Sans", Arial, Helvetica, Sans-Serif;
}
@media (-ms-high-contrast: none), (-ms-high-contrast: active) {
  body.themed *, body.themed ::after, body.themed ::before {
    box-sizing: content-box;
  }
  body.themed html body .row {
    display: block;
  }
  body.themed .input-group > .custom-file, body.themed .input-group > .custom-select, body.themed .input-group > .form-control, body.themed .input-group > .form-control-plaintext {
    /*width: auto;*/
  }
  body.themed .col, body.themed .col-1, body.themed .col-10, body.themed .col-11, body.themed .col-12, body.themed .col-2, body.themed .col-3, body.themed .col-4, body.themed .col-5, body.themed .col-6, body.themed .col-7, body.themed .col-8, body.themed .col-9, body.themed .col-auto, body.themed .col-lg, body.themed .col-lg-1, body.themed .col-lg-10, body.themed .col-lg-11, body.themed .col-lg-12, body.themed .col-lg-2, body.themed .col-lg-3, body.themed .col-lg-4, body.themed .col-lg-5, body.themed .col-lg-6, body.themed .col-lg-7, body.themed .col-lg-8, body.themed .col-lg-9, body.themed .col-lg-auto, body.themed .col-md, body.themed .col-md-1, body.themed .col-md-10, body.themed .col-md-11, body.themed .col-md-12, body.themed .col-md-2, body.themed .col-md-3, body.themed .col-md-4, body.themed .col-md-5, body.themed .col-md-6, body.themed .col-md-7, body.themed .col-md-8, body.themed .col-md-9, body.themed .col-md-auto, body.themed .col-sm, body.themed .col-sm-1, body.themed .col-sm-10, body.themed .col-sm-11, body.themed .col-sm-12, body.themed .col-sm-2, body.themed .col-sm-3, body.themed .col-sm-4, body.themed .col-sm-5, body.themed .col-sm-6, body.themed .col-sm-7, body.themed .col-sm-8, body.themed .col-sm-9, body.themed .col-sm-auto, body.themed .col-xl, body.themed .col-xl-1, body.themed .col-xl-10, body.themed .col-xl-11, body.themed .col-xl-12, body.themed .col-xl-2, body.themed .col-xl-3, body.themed .col-xl-4, body.themed .col-xl-5, body.themed .col-xl-6, body.themed .col-xl-7, body.themed .col-xl-8, body.themed .col-xl-9, body.themed .col-xl-auto {
    /*width: auto;*/
    flex-basis: auto;
  }
  body.themed .d-flex {
    display: block !important; /* plz kill me */
  }
  body.themed .navbar-brand {
    background-repeat: no-repeat;
  }
  body.themed #servicesTable_wrapper > div:nth-child(2) > div {
    box-sizing: border-box;
  }
  body.themed .dataTables_wrapper .row *, body.themed .tile, body.themed #login-form > fieldset > div > div:nth-child(1) > div.col-10.offset-1 {
    box-sizing: border-box;
  }
  body.themed .period_picker .year_picker .year_display {
    box-sizing: border-box;
    width: 81%;
  }
  body.themed .period_picker .year_picker .col, body.themed .period_picker .year_picker .col-1, body.themed .period_picker .year_picker .col-10, body.themed .period_picker .year_picker .col-11, body.themed .period_picker .year_picker .col-12, body.themed .period_picker .year_picker .col-2, body.themed .period_picker .year_picker .col-3, body.themed .period_picker .year_picker .col-4, body.themed .period_picker .year_picker .col-5, body.themed .period_picker .year_picker .col-6, body.themed .period_picker .year_picker .col-7, body.themed .period_picker .year_picker .col-8, body.themed .period_picker .year_picker .col-9, body.themed .period_picker .year_picker .col-auto, body.themed .period_picker .year_picker .col-lg, body.themed .period_picker .year_picker .col-lg-1, body.themed .period_picker .year_picker .col-lg-10, body.themed .period_picker .year_picker .col-lg-11, body.themed .period_picker .year_picker .col-lg-12, body.themed .period_picker .year_picker .col-lg-2, body.themed .period_picker .year_picker .col-lg-3, body.themed .period_picker .year_picker .col-lg-4, body.themed .period_picker .year_picker .col-lg-5, body.themed .period_picker .year_picker .col-lg-6, body.themed .period_picker .year_picker .col-lg-7, body.themed .period_picker .year_picker .col-lg-8, body.themed .period_picker .year_picker .col-lg-9, body.themed .period_picker .year_picker .col-lg-auto, body.themed .period_picker .year_picker .col-md, body.themed .period_picker .year_picker .col-md-1, body.themed .period_picker .year_picker .col-md-10, body.themed .period_picker .year_picker .col-md-11, body.themed .period_picker .year_picker .col-md-12, body.themed .period_picker .year_picker .col-md-2, body.themed .period_picker .year_picker .col-md-3, body.themed .period_picker .year_picker .col-md-4, body.themed .period_picker .year_picker .col-md-5, body.themed .period_picker .year_picker .col-md-6, body.themed .period_picker .year_picker .col-md-7, body.themed .period_picker .year_picker .col-md-8, body.themed .period_picker .year_picker .col-md-9, body.themed .period_picker .year_picker .col-md-auto, body.themed .period_picker .year_picker .col-sm, body.themed .period_picker .year_picker .col-sm-1, body.themed .period_picker .year_picker .col-sm-10, body.themed .period_picker .year_picker .col-sm-11, body.themed .period_picker .year_picker .col-sm-12, body.themed .period_picker .year_picker .col-sm-2, body.themed .period_picker .year_picker .col-sm-3, body.themed .period_picker .year_picker .col-sm-4, body.themed .period_picker .year_picker .col-sm-5, body.themed .period_picker .year_picker .col-sm-6, body.themed .period_picker .year_picker .col-sm-7, body.themed .period_picker .year_picker .col-sm-8, body.themed .period_picker .year_picker .col-sm-9, body.themed .period_picker .year_picker .col-sm-auto, body.themed .period_picker .year_picker .col-xl, body.themed .period_picker .year_picker .col-xl-1, body.themed .period_picker .year_picker .col-xl-10, body.themed .period_picker .year_picker .col-xl-11, body.themed .period_picker .year_picker .col-xl-12, body.themed .period_picker .year_picker .col-xl-2, body.themed .period_picker .year_picker .col-xl-3, body.themed .period_picker .year_picker .col-xl-4, body.themed .period_picker .year_picker .col-xl-5, body.themed .period_picker .year_picker .col-xl-6, body.themed .period_picker .year_picker .col-xl-7, body.themed .period_picker .year_picker .col-xl-8, body.themed .period_picker .year_picker .col-xl-9, body.themed .period_picker .year_picker .col-xl-auto {
    box-sizing: border-box;
    width: auto;
  }
  body.themed .period_picker .form-group .btn.col-3 {
    box-sizing: border-box;
    width: 24%;
  }
  body.themed .tile-container {
    box-sizing: border-box;
  }
  body.themed .account_tile_set .row .row .tile-container.w-100 {
    width: 95% !important;
  }
}
body.themed .navbar.navbar-dark.bg-darken {
  background-color: #fff !important;
}
body.themed .navbar.navbar-dark .navbar-nav .nav-link {
  color: #fff;
}
body.themed .navbar-brand {
  background-image: url("../../img/sym-brand/wavenet-master-RGB_content.svg");
  width: 246px;
  height: 52px;
}
body.themed .navbar-brand img {
  display: none;
}
body.themed .BgThemeColour {
  stop-color: #fff;
}
body.themed .BgThemeSecondary {
  stop-color: #fff;
}
body.themed div.option + div.option {
  border-top: 4px dotted;
  padding-top: 4px;
  border-top-color: white;
}
body.themed .custom-control-input:checked ~ .custom-control-label::before, body.themed .btn-primary, body.themed .page-item.active .page-link {
  border-color: #fff;
  background-color: #fff;
  color: #fff;
}
body.themed .custom-control-input:checked ~ .custom-control-label:hover::before, body.themed .btn.btn-primary:hover, body.themed .page-item.active .page-link:hover {
  border-color: white;
  background-color: white;
  color: #fff;
}
body.themed .custom-control-input:checked ~ .custom-control-label:active::before, body.themed .btn.btn-primary:active, body.themed .page-item.active .page-link:active {
  border-color: white;
  background-color: white;
  color: #fff;
}
body.themed #logout.bg-blue-dark, body.themed nav > button.navbar-toggler {
  border-color: #fff;
  background-color: #fff !important;
  color: #fff;
}
body.themed #logout.bg-blue-dark:hover, body.themed nav > button.navbar-toggler:hover {
  border-color: white;
  background-color: white !important;
  color: #fff;
}
body.themed #logout.bg-blue-dark:active, body.themed nav > button.navbar-toggler:active {
  border-color: white;
  background-color: white !important;
  color: #fff;
}
body.themed .status-light.status-enabled {
  background-image: linear-gradient(to top right, #010802, #1cd41c);
}
body.themed .status-light.status-disabled {
  background-image: linear-gradient(to top right, #010802, #f90404);
}
body.themed .bg-primary {
  background-color: #fff !important;
}
body.themed .txt-primary {
  color: #fff;
}
body.themed .bg-secondary {
  background-color: #fff !important;
}
body.themed .txt-secondary {
  color: #fff;
}
body.themed .tile#account address {
  white-space: pre-line;
}
body.themed div nav.tileset ul li.tile,
body.themed .sa-page-body .sym-login-rnd-corners,
body.themed .tile,
body.themed #content > div > div.col-12.col-sm-8 > div,
body.themed #invoice.tile {
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 0;
  background: rgb(230, 230, 230);
  color: #1D252C;
  border: 0px solid #fff;
  border-image-width: 0px;
  border-image: url("../../img/sym-brand/gradient-1.png") 0 stretch;
}
body.themed .tile.tile-style-1, body.themed .tile-style-1 .tile {
  border-image: url("../../img/sym-brand/gradient-1.png") 0 stretch !important;
}
body.themed .tile.tile-style-2, body.themed .tile-style-2 .tile {
  border-image: url("../../img/sym-brand/gradient-2.png") 0 stretch !important;
}
body.themed .tile.tile-style-3, body.themed .tile-style-3 .tile {
  border-image: url("../../img/sym-brand/gradient-3.png") 0 stretch !important;
}
body.themed .tile.tile-style-4, body.themed .tile-style-4 .tile {
  border-image: url("../../img/sym-brand/gradient-4.png") 0 stretch !important;
}
body.themed .tile.tile-style-5, body.themed .tile-style-5 .tile {
  border-image: url("../../img/sym-brand/gradient-3.png") 0 stretch !important;
}
body.themed div nav.tileset ul li.tile,
body.themed .sa-page-body .sym-login-rnd-corners,
body.themed .tile,
body.themed #content > div > div.col-12.col-sm-8 > div,
body.themed #invoice.tile {
  border-radius: 0;
}
body.themed .btn {
  border-radius: 0;
}
body.themed .btn .toggle-handle {
  border-radius: 20px;
}
body.themed .toggle.btn.off, body.themed .toggle.btn.on, body.themed .toggle.btn {
  border-radius: 30px;
}
body.themed .toggle.btn.off .toggle-off, body.themed .toggle.btn.on .toggle-off, body.themed .toggle.btn .toggle-off {
  padding-left: 35px;
}
body.themed .toggle.btn.off .toggle-off, body.themed .toggle.btn.off .toggle-on, body.themed .toggle.btn.on .toggle-off, body.themed .toggle.btn.on .toggle-on, body.themed .toggle.btn .toggle-off, body.themed .toggle.btn .toggle-on {
  line-height: 1.2em;
}
body.themed .form-group.disabled label {
  opacity: 0.7;
}
body.themed .sa-page-body {
  background: url(../../img/sym-brand/Portal_bg.jpg) no-repeat center center fixed;
  background-size: cover;
  background-blend-mode: multiply, multiply;
}
body.themed.index .svgWrapper {
  display: none;
}
body.themed .svgWrapper {
  display: none;
}

.extr-page body.themed.index .svgWrapper {
  display: none;
}

body.themed.index .svgWrapper {
  display: block;
}

body.themed {
  /*    .page-item.active .page-link:hover {
      background-color: $WavenetBlue;
  }*/
  /* .btn-default:not([disabled]):not(.disabled):hover */
}
body.themed .svgWrapper {
  display: block;
}
body.themed .btn {
  border-width: 2px;
  font-weight: bold;
  box-shadow: none;
}
body.themed .toggle-group .toggle-on {
  padding-left: 0;
}
body.themed .toggle-group .toggle-off {
  padding-right: 33px;
}
body.themed .navbar.navbar-dark .navbar-nav .nav-link {
  color: #1D252C;
  border-bottom: 2px solid transparent;
}
body.themed .navbar.navbar-dark .navbar-nav .nav-link:hover {
  border-bottom: 2px solid #1D252C;
  transition: border-bottom 250ms ease-in-out;
}
body.themed div.option + div.option {
  border-top: solid 1px #dee2e6;
}
body.themed .navbar {
  font-size: 16px;
  font-weight: 400;
  border-bottom: solid 1px rgb(210, 211, 213);
}
body.themed .navbar .btn.bg-blue-dark {
  background: #4A5156 !important;
  color: #fff !important;
}
body.themed div nav.tileset ul li.tile a, body.themed .tile a {
  color: #1D252C;
}
body.themed div nav.tileset ul li.tile a header, body.themed .tile a header {
  font-family: Outfit, sans-serif;
}
body.themed div nav.tileset ul li.tile a .fa, body.themed .tile a .fa {
  color: #006DCB;
}
body.themed address, body.themed .tile#account address {
  white-space: pre-line;
  white-space-collapse: collapse;
}
body.themed address span, body.themed .tile#account address span {
  display: block;
}
body.themed .bg_info {
  background-color: #3DB6C7 !important;
}
body.themed .btn:not(:disabled):not(.disabled) {
  box-shadow: none;
}
body.themed .btn-default, body.themed .btn-edit, body.themed .btn-edit-centre, body.themed .btn-edit-nickname, body.themed .btn-edit-costcentre, body.themed .btn-edit-costcentre2, body.themed .page-item.active .page-link {
  background-color: #006DCB;
  border-color: #006DCB;
  border-style: solid;
  box-shadow: inset 0 0 0 0 #006DCB;
  color: #fff;
  transition: background-color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
body.themed .btn-default:not([disabled]):not(.disabled):hover, body.themed .btn-edit:hover, body.themed .btn-edit-centre:hover, body.themed .btn-edit-nickname:hover, body.themed .btn-edit-costcentre:hover, body.themed .btn-edit-costcentre2:hover, body.themed .page-item.active .page-link:hover {
  background-color: #005298;
  border-color: #005298;
  border-style: solid;
  box-shadow: inset 250px 0 0 0 #005298;
}
body.themed .btn-default:not([disabled]):not(.disabled).active, body.themed .btn-primary:not([disabled]):not(.disabled) {
  background-color: #F1DC00;
  border-color: #F1DC00;
  border-style: solid;
  color: #1D252C;
  box-shadow: inset 0 0 0 0 #F1DC00;
  transition: background-color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
body.themed .btn-default:not([disabled]):not(.disabled).active:hover, body.themed .btn-edit.active:hover, body.themed .btn-primary:not([disabled]):not(.disabled):hover {
  background-color: #bead00;
  border-color: #bead00;
  box-shadow: inset 250px 0 0 0 #bead00;
}
body.themed .btn-light:not([disabled]):not(.disabled), body.themed .btn-light:not([disabled]):not(.disabled).active {
  border-color: #3DB6C7;
  background-color: #3DB6C7;
  color: #fff;
}
body.themed .btn-light:not([disabled]):not(.disabled):hover, body.themed .btn-light:not([disabled]):not(.disabled):hover.active {
  border-color: #2f94a2;
  background-color: #2f94a2;
  color: #fff;
}
body.themed .btn-secondary, body.themed .btn-secondary:not([disabled]):not(.disabled):hover, body.themed .btn-secondary:not([disabled]):not(.disabled):hover.active,
body.themed a.btn-secondary span {
  border-color: #2FA283;
  background-color: #2FA283;
  color: #fff;
}
body.themed .btn-danger, body.themed .btn-danger:not([disabled]):not(.disabled):hover, body.themed .btn-danger:not([disabled]):not(.disabled):hover.active {
  border-color: #D50057;
  background-color: #D50057;
  color: #fff;
}
body.themed .btn.btn-secondary .fa {
  color: #fff;
}
body.themed .btn:not([disabled]):not(.disabled).active.toggle-off {
  border-radius: 30px;
  background-color: rgb(244, 244, 244);
  border: outset 2px #000;
}
body.themed .btn:not([disabled]):not(.disabled).active.toggle-off:hover {
  background-color: #a8a8a8;
  box-shadow: inset 250px 0 0 0 #dbdbdb;
}
body.themed .btn-group label {
  margin-left: 0;
  margin-right: 0;
}
body.themed .form-control.form-control-sm {
  padding: 0.25rem 0.5rem;
  height: 1rem;
}
body.themed .dt-search {
  margin-bottom: 0.25em;
}
body.themed .extraFilters .form-select {
  width: auto;
}
body.themed .table .thead-dark {
  background-color: #1D252C;
}
body.themed .table .thead-dark th, body.themed .table .thead-dark span, body.themed .table .thead-dark div {
  background-color: #1D252C;
  color: #fff;
}
body.themed .table .btn-default .fa {
  color: #fff;
}
body.themed .tilebody .table thead tr, body.themed .tilebody .table thead tr th {
  background: #1D252C;
  color: #fff;
}
body.themed .tilebody .dataTables_info {
  color: #1D252C;
}
body.themed img.big_icon {
  height: 104px;
}
body.themed h2.swal2-title {
  font-family: "Montserrat", "Open Sans", Arial, Helvetica, Sans-Serif;
}
body.themed .swal2-popup {
  border-radius: 0;
}
body.themed .swal2-popup .swal2-confirm, body.themed .swal2-popup .swal2-cancel {
  font-family: "Montserrat", "Open Sans", Arial, Helvetica, Sans-Serif;
  border-radius: 0;
}
body.themed .swal2-popup .swal2-confirm {
  background-color: #006DCB;
  transition: background-color 0.35s ease;
}
body.themed .swal2-popup .swal2-confirm:hover {
  background-color: darker(#006DCB, 10%);
}
body.themed .dataTables_length select {
  padding-right: 2rem;
}
body.themed #content > div > div.col-12.col-sm-8 > div, body.themed .sa-page-body .sym-login-rnd-corners {
  /*        
  background: $WavenetDarkBlue;
  color: #fff;
  */
  border: none;
  /*        input, input:-internal-autofill-selected {
      background: $WavenetTrustedGrey !important;
      color: #fff !important;
      border: 1px solid #a5a8ab;
      font-family: Outfit, sans-serif;
  }*/
}
body.themed #content > div > div.col-12.col-sm-8 > div label, body.themed #content > div > div.col-12.col-sm-8 > div a, body.themed .sa-page-body .sym-login-rnd-corners label, body.themed .sa-page-body .sym-login-rnd-corners a {
  color: #000;
}
body.themed #content > div > div.col-12.col-sm-8 > div form, body.themed .sa-page-body .sym-login-rnd-corners form {
  background: none;
}
body.themed #content > div > div.col-12.col-sm-8 > div .error, body.themed .sa-page-body .sym-login-rnd-corners .error {
  color: #3DB6C7 !important;
}
body.themed #logout.bg-blue-dark {
  background-color: #4A5156 !important;
  color: #fff !important;
  transition: color 0.35s ease, background 0.35s ease;
  border: none;
}
body.themed #logout.bg-blue-dark:hover {
  background-color: #006DCB !important;
  border: none;
}
body.themed #CliTable tr td {
  vertical-align: middle;
}
