@charset "UTF-8";
/*            FOOTER                  */
#footer-component {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 1111;
}
#footer-component.cShow .hide-container {
  display: flex;
}
#footer-component.cShow .show-container {
  display: none;
  visibility: none;
}
#footer-component.cShow .disclaimer-container {
  display: flex;
}
#footer-component.cHide .hide-container {
  display: none;
  visibility: none;
}
#footer-component.cHide .show-container {
  display: flex;
}
#footer-component.cHide .disclaimer-container {
  display: none;
  visibility: none;
}
#footer-component .disclaimer-text, #footer-component a, #footer-component p {
  color: white;
}
#footer-component .disclaimer-text {
  padding: 5px;
  font-size: 11px;
  text-align: center;
}
#footer-component .disclaimer-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  background: #002b55;
  border-top: 3px solid #103B5D;
  padding: 10px;
  column-gap: 10px;
}
#footer-component .button-container {
  padding: 0 5px;
  display: flex;
  justify-content: flex-end;
  gap: 3px;
}
#footer-component .footer-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  flex-grow: 2;
  gap: 10px;
}
#footer-component .footer-info ul.breadcrumb {
  text-align: center;
}
#footer-component .footer-info ul.breadcrumb li::after {
  content: "|";
  float: right;
  color: #fff;
  margin: 0 5px;
}
#footer-component .footer-info ul.breadcrumb li:last-child::after {
  display: none;
}
#footer-component .footer-info ul.breadcrumb li a {
  font-size: 16px;
}
#footer-component .footer-info a {
  font-size: 13px;
}
#footer-component .footer-info p {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
}
#footer-component .wtsda-logo {
  min-width: 50px;
  max-width: 75px;
  display: none;
}
#footer-component .language-selector li {
  padding: 3px;
}
#footer-component .language-selector li:hover {
  background-color: #e5e6e7;
}
#footer-component .language-selector .dropdown-menu {
  left: unset;
  right: 0;
}
#footer-component .language-selector .dropdown-toggle {
  padding-left: 0;
  padding-right: 0;
}
#footer-component .language-selector .language-button {
  display: flex;
  gap: 5px;
  border: none;
  background-color: unset;
  flex-direction: row;
  font-size: small;
}
#footer-component .language-selector .flag-image {
  width: 32px;
  min-width: unset;
}

@media only screen and (min-width: 980px) {
  #footer-component .disclaimer-container {
    flex-direction: row;
  }
  #footer-component .disclaimer-container .disclaimer-text {
    max-width: 45%;
    text-align: left;
  }
  #footer-component .wtsda-logo {
    display: flex;
  }
}
.integrity-page {
  display: grid;
  row-gap: 20px;
  column-gap: 20px;
}
@media only screen and (min-width: 680px) {
  .integrity-page {
    grid-template-columns: 1fr 1fr;
  }
}
@media only screen and (min-width: 980px) {
  .integrity-page {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.integrity-page .widget {
  background-color: white;
  border-radius: 6px;
  overflow: hidden;
}
.integrity-page .widget .header {
  display: flex;
  flex-direction: row;
  gap: 10px;
  background-color: #002b55;
  color: white;
  padding: 10px;
}
.integrity-page .widget .header .w-title {
  flex-grow: 1;
}
.integrity-page .widget .content {
  padding: 5px;
}
.integrity-page .widget .w-table {
  margin: 0;
  border-collapse: collapse;
  width: 100%;
  font-size: smaller;
}
.integrity-page .widget .w-table td {
  padding: 3px;
}
.integrity-page .widget table, .integrity-page .widget td, .integrity-page .widget th {
  border: 1px solid black;
}

/*            MEMBER STATUS SWITCH                   */
.mssw span.caret {
  margin-top: 8px;
}

nav#main-navigation {
  pointer-events: none;
}
nav#main-navigation .horizontal {
  display: none;
  width: 100%;
  padding: 5px;
  gap: 5px;
  align-items: center;
  background-color: #002b55;
}
nav#main-navigation .horizontal .brand-logo img {
  width: 30px;
}
nav#main-navigation .horizontal .btn-mini {
  font-size: 11px;
  font-weight: bold;
  height: 22px;
}
nav#main-navigation .horizontal i.icon-star {
  display: none;
}
nav#main-navigation .horizontal li.active {
  background-color: #FCF3CF;
}
nav#main-navigation .horizontal li.active a {
  color: black;
  background: none;
}
nav#main-navigation .horizontal li.active i.icon-star {
  display: inline-block;
}
nav#main-navigation .horizontal li.active i.icon-star-empty {
  display: none;
}
nav#main-navigation .vertical {
  display: flex;
  flex-direction: column;
  pointer-events: initial;
  color: white;
  background: linear-gradient(to bottom, #002b55 0%, #002b55 50%, #3d505e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
nav#main-navigation .vertical .btn.btn-mini {
  display: none;
}
nav#main-navigation .vertical .accordion-heading {
  background: none;
  margin-top: 4px;
}
nav#main-navigation .vertical .accordion-heading a {
  border: none;
  padding: 22px 10px;
  display: flex;
  gap: 5px;
  align-items: center;
}
nav#main-navigation .vertical .accordion-heading a i.icon-chevron-right {
  transform: rotate(90deg);
  order: 3;
}
nav#main-navigation .vertical .accordion-heading a.accordion-toggle.collapsed i.icon-chevron-right {
  transform: none;
}
nav#main-navigation .vertical .accordion-heading a.active {
  color: black;
  background-color: darkorange;
}
nav#main-navigation .vertical .accordion-heading a.active i.icon-chevron-right {
  transform: none;
}
nav#main-navigation .vertical .accordion-heading a span {
  flex-grow: 2;
}
nav#main-navigation .vertical .accordion-heading a i {
  font-size: 20px;
  width: 22px;
  text-align: center;
}
nav#main-navigation .vertical .accordion-inner {
  background: none;
  padding: 0 20px;
}
nav#main-navigation .vertical .accordion-inner a {
  border-left: solid orange 1px;
  background: #154360;
  padding: 10px;
  margin-bottom: 3px;
}
nav#main-navigation .vertical .accordion-inner .accordion-toggle.active {
  color: black;
  background-color: darkorange;
}
nav#main-navigation .vertical .brand-logo {
  text-align: center;
  padding: 5px;
  position: relative;
}
nav#main-navigation .vertical .brand-logo a img {
  width: 50px;
}
nav#main-navigation .vertical .brand-logo p {
  font-size: 20px;
  color: white;
}
nav#main-navigation #menu-art {
  display: none;
}

/*              MEDIA QUERIES        */
@media only screen and (min-width: 980px) {
  #wrap.pin nav#main-navigation .vertical {
    width: 250px;
  }
  #wrap.pin nav#main-navigation .vertical .accordion {
    overflow-y: auto;
    overflow-x: hidden;
  }
  #wrap.pin nav#main-navigation .vertical .brand-logo p, #wrap.pin nav#main-navigation .vertical .accordion-heading span, #wrap.pin nav#main-navigation .vertical .accordion-inner, #wrap.pin nav#main-navigation .vertical i.icon-chevron-right {
    display: block;
  }
  #wrap.pin nav#main-navigation .vertical .brand-logo .action-area {
    display: flex;
    position: absolute;
    justify-content: flex-end;
    gap: 5px;
    right: 5px;
    top: 5px;
  }
  #wrap.pin nav#main-navigation .vertical .brand-logo p, #wrap.pin nav#main-navigation .vertical .accordion-heading span, #wrap.pin nav#main-navigation .vertical .accordion-inner, #wrap.pin nav#main-navigation .vertical i.icon-chevron-right {
    overflow: unset;
    white-space: unset;
  }
  nav#main-navigation {
    position: fixed;
    width: 100%;
    z-index: 10;
  }
  nav#main-navigation.menu-hz .horizontal {
    display: flex;
  }
  nav#main-navigation.menu-hz .vertical {
    display: none;
  }
  nav#main-navigation .horizontal {
    pointer-events: initial;
  }
  nav#main-navigation .vertical {
    pointer-events: initial;
    display: flex;
    height: 100vh;
    width: 50px;
  }
  nav#main-navigation .vertical .btn.btn-mini {
    display: block;
  }
  nav#main-navigation .vertical, nav#main-navigation .vertical a {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  nav#main-navigation .vertical .brand-logo p, nav#main-navigation .vertical .accordion-heading span, nav#main-navigation .vertical .accordion-inner, nav#main-navigation .vertical i.icon-chevron-right {
    overflow: hidden;
    white-space: nowrap;
    display: none;
  }
  nav#main-navigation .vertical a {
    justify-content: center;
  }
  nav#main-navigation .vertical a:hover {
    transform: translateX(5px);
  }
  nav#main-navigation .vertical:hover {
    width: 300px;
  }
  nav#main-navigation .vertical:hover .accordion {
    overflow-y: auto;
    overflow-x: hidden;
  }
  nav#main-navigation .vertical:hover .brand-logo p, nav#main-navigation .vertical:hover .accordion-heading span, nav#main-navigation .vertical:hover .accordion-inner, nav#main-navigation .vertical:hover i.icon-chevron-right {
    display: block;
  }
  nav#main-navigation .vertical:hover .brand-logo .action-area {
    display: flex;
    position: absolute;
    justify-content: flex-end;
    gap: 5px;
    right: 5px;
    top: 5px;
  }
  nav#main-navigation .vertical .brand-logo .action-area {
    display: none;
  }
}
/*            PAGINATOR                   */
.paginator {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.paginator .pagination {
  margin: 20px 0 0 0;
}
.paginator li.desktop-btn {
  display: none;
}
.paginator a.nav-btn span {
  display: none;
  padding: 0 3px;
}

@media only screen and (min-width: 980px) {
  .paginator {
    flex-direction: row;
  }
  .paginator li.desktop-btn {
    display: inline;
  }
  .paginator a.nav-btn span {
    display: inline;
  }
}
/*              SMART TABLE         */
/*              DESKTOP FIRST        */
.smart-table-container div.text-center {
  text-align: center;
}
.smart-table-container table {
  margin: 0;
  padding: 0;
}
.smart-table-container button.disabled {
  pointer-events: none;
}
.smart-table-container thead tr th.bulk-action-column {
  width: 25px;
}
.smart-table-container tbody tr.selected td {
  background-color: lemonchiffon !important;
}
.smart-table-container tbody tr:hover td {
  background-color: lemonchiffon !important;
}
.smart-table-container th.visible-desktop {
  color: black;
  text-wrap: nowrap;
  display: table-cell !important;
}
.smart-table-container th.visible-desktop a {
  color: #F18A2D;
  border-bottom: 1px solid #F18A2D;
  margin: 3px;
  padding: 0;
}
.smart-table-container th.visible-desktop a:hover {
  text-decoration: none;
}
.smart-table-container th.visible-desktop a span {
  color: #F18A2D;
}
.smart-table-container th.visible-desktop a.selected {
  background-color: peru;
  color: white;
  padding: 3px;
}
.smart-table-container th.visible-desktop a.selected span {
  color: white;
}
.smart-table-container th.visible-desktop span {
  color: black;
}
.smart-table-container td strong {
  display: none;
}
.smart-table-container td p {
  margin: 0;
  padding: 0;
}
.smart-table-container td p em {
  font-size: 12px;
}
.smart-table-container td p.warning {
  padding: 2px;
  background-color: #FCF3CF !important;
}
.smart-table-container td p.danger {
  padding: 2px;
  background-color: #F6DDCC !important;
}
.smart-table-container td.smart-table-action {
  text-align: center;
}
.smart-table-container td.smart-table-action a, .smart-table-container td.smart-table-action button {
  margin: 0 5px;
}
.smart-table-container .filter-area {
  display: flex;
  gap: 5px;
  flex-direction: row;
}

/*              SMART TABLE TOOLBAR        */
.smart-table-toolbar .actions-area {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  column-gap: 5px;
}
.smart-table-toolbar .actions-area a i {
  margin-right: 5px;
}
.smart-table-toolbar .filter-area {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.smart-table-toolbar .filter-area .toolbar-filter {
  zoom: 0.8;
  display: flex;
  padding: 5px;
  gap: 5px;
  border: 1px solid white;
  border-radius: 3px;
  align-items: center;
}
.smart-table-toolbar .filter-area .toolbar-filter label {
  margin: 0;
  padding: 0;
}
.smart-table-toolbar .filter-area select {
  max-width: 130px;
  padding: 0;
  margin: 0;
}
.smart-table-toolbar .filter-area select[name=memberStatus] {
  max-width: 160px;
}
.smart-table-toolbar .filter-area .typeahead-wrapper, .smart-table-toolbar .filter-area .btn-group {
  margin: 0;
}
.smart-table-toolbar .quick-search-area {
  padding: 10px;
}
.smart-table-toolbar .quick-search-area input[name=qs] {
  border-radius: 20px;
  padding-left: 10px;
  width: calc(100% - 32px);
}

.smart-table-bulk-actions {
  background-color: #f79955;
  display: flex;
  gap: 10px;
  padding: 10px;
}

/*              MEDIA QUERIES        */
@media only screen and (max-width: 980px) {
  .smart-table-container thead tr {
    flex-direction: row;
    flex-wrap: wrap;
    padding: 5px;
    gap: 5px;
  }
  .smart-table-container tr {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid;
  }
  .smart-table-container th {
    padding: 0 0 0 10px !important;
  }
  .smart-table-container th ul li {
    text-align: left;
  }
  .smart-table-container th.visible-desktop {
    display: none !important;
  }
  .smart-table-container td {
    text-align: left !important;
    border: 0;
    width: unset !important;
    margin: 0;
    padding: 0;
  }
  .smart-table-container td div {
    display: flex;
    margin: 5px 0 5px 10px;
  }
  .smart-table-container td div.mssw.btn-group {
    margin: 0;
  }
  .smart-table-container td strong {
    color: black;
    font-weight: bold;
    width: 130px;
    display: inline-flex;
    margin: 0;
    padding: 0;
  }
}
@media only screen and (min-width: 980px) {
  .smart-table-toolbar .quick-search-area input[name=qs] {
    width: 40%;
  }
  .smart-table-toolbar .quick-search-area button {
    border: none;
  }
}
.tutorial-btn {
  padding: 10px;
  margin-bottom: 5px;
  background-color: #FCF3CF;
  border: 2px solid black;
}

.tutorial .carousel-control {
  font-size: 2em;
  padding-top: 2px;
}
.tutorial .carousel-control.right {
  right: 5px;
}
.tutorial .carousel-control.left {
  left: 5px;
}

.typeahead-wrapper {
  color: black;
  display: flex;
  flex-direction: column;
  justify-items: flex-start;
  position: relative;
  margin-bottom: 10px;
}
.typeahead-wrapper .contents {
  z-index: 0;
  position: relative;
}
.typeahead-wrapper .contents.active {
  z-index: 30200;
}
.typeahead-wrapper .btn-group {
  position: relative;
}
.typeahead-wrapper .overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 30000;
}
.typeahead-wrapper .search-area {
  background-color: #e5e6e7;
  display: flex;
  flex-direction: column;
  padding: 5px;
  position: absolute;
  top: 30px;
  left: 0;
  max-width: 270px;
  min-width: 270px;
}
.typeahead-wrapper .search-area.cHide {
  display: none;
}
.typeahead-wrapper .search-area.cShow {
  display: flex;
}
.typeahead-wrapper .search-area .search-field-area input {
  width: 100%;
}
.typeahead-wrapper .search-area .search-field-area i {
  position: absolute;
  top: 12px;
  right: 12px;
}
.typeahead-wrapper .options-container {
  padding: 0;
  margin: 0;
  max-height: 250px;
  overflow-y: auto;
}
.typeahead-wrapper .option {
  display: flex;
  border-bottom: 1px #CCC solid;
  padding: 5px;
  cursor: pointer;
  min-width: 250px;
}
.typeahead-wrapper .option.selected {
  background-color: orange;
}

#wrap {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  opacity: 0%;
}
#wrap.visible {
  opacity: 100%;
}
#wrap.ready {
  opacity: 100%;
}
#wrap .main-container {
  padding: 10px;
}

span.badge[class*=" rank-"] {
  color: white;
  background-color: black;
  border: 1px solid gray;
  width: 32px;
  text-align: center;
}
span.badge.rank-\?\? {
  background-color: yellow;
  color: black;
}
span.badge.rank-4M, span.badge.rank-5M {
  color: white;
  background: linear-gradient(to bottom, black, red, black);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
}
span.badge.rank-6M, span.badge.rank-7M {
  color: white;
  background: linear-gradient(to bottom, black, red, black, red, black);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-position: top bottom;
}
span.badge.rank-4D, span.badge.rank-5D, span.badge.rank-6D, span.badge.rank-7D {
  color: gold;
}
span.badge.rank-8M {
  color: black;
  background: linear-gradient(to right, white, red);
  background-repeat: no-repeat, no-repeat;
  background-position: top bottom;
}
span.badge.rank-9M {
  color: white;
  background: linear-gradient(to right, black, red);
  background-repeat: no-repeat, no-repeat;
  background-position: top bottom;
}
span.badge.rank-❤ {
  color: red;
  background: linear-gradient(to bottom, gold, white, pink, white, gold);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-position: top bottom;
}
span.badge.rank-10 {
  background-color: white;
  color: black;
}
span.badge.rank-9 {
  background: linear-gradient(to right, white, white, darkorange);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
  color: black;
}
span.badge.rank-8 {
  background-color: darkorange;
}
span.badge.rank-7 {
  background: linear-gradient(to right, darkorange, darkorange, seagreen);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
  color: white;
}
span.badge.rank-6 {
  background-color: seagreen;
}
span.badge.rank-5 {
  background: linear-gradient(to right, seagreen, seagreen, saddlebrown);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
  color: white;
}
span.badge.rank-4 {
  background-color: saddlebrown;
}
span.badge.rank-3 {
  background: linear-gradient(to right, saddlebrown, saddlebrown, crimson);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
  color: white;
}
span.badge.rank-2 {
  background-color: crimson;
}
span.badge.rank-1 {
  background: linear-gradient(to right, crimson, crimson, royalblue);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: top middle bottom;
  color: white;
}
span.badge.rank-- {
  background-color: royalblue;
}

.nowrap {
  white-space: nowrap;
}

.btn {
  touch-action: none;
}

.pl-5 {
  padding-left: 5px;
}

/*              MEDIA QUERIES        */
@media only screen and (min-width: 980px) {
  #wrap.pin .main-container {
    padding: 30px 30px 30px 260px;
  }
  #wrap .main-container {
    padding: 30px 30px 30px 60px;
  }
  #wrap.menu-hz .main-container {
    padding: 50px 30px 30px 30px;
  }
  #wrap.menu-hz table.smart-table th {
    top: 38px;
  }
}

/*# sourceMappingURL=ui-components.css.map */