@charset "UTF-8";
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300 400 700;
  font-display: swap;
  src: url("/font/Roboto_Condensed/RobotoCondensed-VariableFont_wght.ttf") format("truetype"); }
@font-face {
  font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 300 400 700;
  font-display: swap;
  src: url("/font/Roboto_Condensed/RobotoCondensed-Italic-VariableFont_wght.ttf") format("truetype"); }
#km-enrollments {
  font-family: 'Roboto Condensed', sans-serif;
  padding: 20px;
  font-weight: 300; }
  #km-enrollments .km-col {
    overflow: visible; }
    #km-enrollments .km-col .card-expiry-warning {
      background: #ffe9e9;
      border: 2px solid #ff4d4d;
      color: #b30000;
      padding: 10px;
      margin-bottom: 10px;
      font-weight: bold;
      font-size: 1rem;
      border-radius: 6px;
      align-items: center;
      gap: 10px;
      margin-top: 10px; }
      #km-enrollments .km-col .card-expiry-warning a {
        color: #222 !important;
        text-decoration: underline; }
    #km-enrollments .km-col > #enrollments_top {
      padding: 20px 20px 0px 20px;
      font-size: 1.1em;
      font-weight: 400;
      display: flex;
      flex-wrap: wrap;
      white-space: pre; }
      #km-enrollments .km-col > #enrollments_top > #user {
        margin-right: auto;
        min-height: 29px;
        max-height: 78px; }
        #km-enrollments .km-col > #enrollments_top > #user .user_icon {
          margin-right: 10px; }
        #km-enrollments .km-col > #enrollments_top > #user #user_id {
          background-color: rgba(255, 255, 255, 0.75);
          padding: 2px 6px;
          margin-left: 3px;
          border-radius: 5px;
          font-size: 0.75em;
          cursor: pointer;
          position: relative; }
          #km-enrollments .km-col > #enrollments_top > #user #user_id > span {
            color: #222 !important; }
          #km-enrollments .km-col > #enrollments_top > #user #user_id::after {
            content: "Kopieret";
            position: absolute;
            left: 100%;
            margin-left: 10px;
            width: auto;
            white-space: nowrap;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.3s ease; }
          #km-enrollments .km-col > #enrollments_top > #user #user_id.copied::after {
            opacity: 1; }
        #km-enrollments .km-col > #enrollments_top > #user .active_card {
          display: flex;
          align-items: center;
          gap: 10px; }
          #km-enrollments .km-col > #enrollments_top > #user .active_card .card-mask {
            font-family: monospace;
            font-size: 1rem; }
          #km-enrollments .km-col > #enrollments_top > #user .active_card .visa {
            background-color: #fff;
            border-radius: 3px; }
          #km-enrollments .km-col > #enrollments_top > #user .active_card .mastercard {
            border-radius: 3px; }
          #km-enrollments .km-col > #enrollments_top > #user .active_card .update-card-link {
            background-color: rgba(255, 255, 255, 0.75);
            color: #222 !important;
            padding: 2px 6px;
            margin-left: 3px;
            border-radius: 5px;
            font-size: 0.75em;
            cursor: pointer;
            position: relative; }
            #km-enrollments .km-col > #enrollments_top > #user .active_card .update-card-link:hover {
              text-decoration: none; }
      #km-enrollments .km-col > #enrollments_top .membercard-wrapper {
        display: flex;
        gap: 10px; }
        #km-enrollments .km-col > #enrollments_top .membercard-wrapper .membercard-link {
          position: relative;
          white-space: nowrap;
          background-color: rgba(255, 255, 255, 0.75);
          color: #222 !important;
          align-self: flex-start;
          padding: 4px 25px 4px 10px;
          align-items: center;
          height: auto;
          width: auto;
          font-weight: 300;
          float: none;
          line-height: normal;
          border-radius: 9px;
          cursor: pointer;
          transition: all 0.2s ease; }
          #km-enrollments .km-col > #enrollments_top .membercard-wrapper .membercard-link:hover {
            text-decoration: none;
            background-color: rgba(255, 255, 255, 0.85); }
  #km-enrollments .km-col-inner .group-wrapper {
    margin-top: 10px;
    margin-bottom: 25px; }
    #km-enrollments .km-col-inner .group-wrapper .group-header {
      margin-bottom: 10px; }
      #km-enrollments .km-col-inner .group-wrapper .group-header .default_header {
        font-size: 20px; }
        #km-enrollments .km-col-inner .group-wrapper .group-header .default_header i {
          width: 30px; }
  #km-enrollments .km-col-inner .month-short {
    display: none; }
  #km-enrollments .km-col-inner .list-item {
    position: relative;
    overflow: hidden;
    display: block;
    border-radius: 5px;
    height: 44px;
    margin-bottom: 7px;
    display: flex;
    padding: 0 10px;
    font-size: 16px;
    align-items: center;
    cursor: pointer;
    /* Custom width*/
    /* Custom width end*/ }
    @media (max-width: 768px) {
      #km-enrollments .km-col-inner .list-item {
        height: 54px; } }
    #km-enrollments .km-col-inner .list-item .list-item-icon {
      width: 25px;
      flex-shrink: 0; }
      @media (max-width: 768px) {
        #km-enrollments .km-col-inner .list-item .list-item-icon {
          width: 30px; } }
    #km-enrollments .km-col-inner .list-item .list-item-content {
      flex: 1;
      display: flex;
      flex-wrap: wrap;
      height: 100%;
      flex-wrap: wrap;
      overflow: hidden;
      align-content: space-evenly; }
      @media (max-width: 768px) {
        #km-enrollments .km-col-inner .list-item .list-item-content {
          width: calc(100% - 60px); } }
      #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt {
        flex: 1;
        overflow: hidden;
        padding-right: 10px;
        white-space: nowrap;
        text-overflow: ellipsis; }
        @media (max-width: 401px) {
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.longtxt {
            font-size: 14px; } }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.fixed {
          flex: 0 0 auto; }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.flex-2 {
          flex: 2; }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.flex-3 {
          flex: 3; }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.flex-4 {
          flex: 4; }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt i {
          margin-right: 6px; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt i.after {
            margin-left: 6px;
            margin-right: 0; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt i:not(:first-child), #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt i.left {
            margin-left: 6px; }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .status-short {
          display: none; }
        @media (min-width: 769px) and (max-width: 991px) {
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .month-short {
            display: inline; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .month-full {
            display: none; } }
        @media (max-width: 768px) {
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.mobile-short .month-short {
            display: inline; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.mobile-short .month-full {
            display: none; } }
        @media (max-width: 991px) {
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .status-full {
            display: none; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .status-short {
            display: inline; } }
        @media (max-width: 420px) {
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .month-short {
            display: inline; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .month-full {
            display: none; } }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .darker {
          color: rgba(0, 0, 0, 0.5); }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .list-item-btn {
          background-color: rgba(0, 0, 0, 0.5);
          font-size: 15px;
          padding: 6px 7px;
          font-weight: 600;
          display: inline-block;
          border-radius: 5px;
          top: 50%;
          position: absolute;
          transform: translateY(-50%);
          margin-left: 5px; }
          @media (max-width: 768px) {
            #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .list-item-btn {
              background-color: rgba(0, 0, 0, 0.5);
              font-size: 13px;
              padding: 2px 10px;
              font-weight: 600;
              display: inline-block;
              border-radius: 5px;
              top: auto;
              position: relative;
              transform: translateY(0%);
              margin-left: 0px; } }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .list-item-btn.first {
            margin-left: 0; }
          @media (max-width: 768px) {
            #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .list-item-btn.mobile-full {
              font-size: 15px;
              padding: 12px 10px;
              top: 50%;
              right: 30px;
              position: absolute;
              transform: translateY(-50%); } }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .multi-btn {
          position: absolute;
          transform: translateY(-50%);
          top: 50%; }
          #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .multi-btn .list-item-btn {
            position: relative;
            transform: translateY(0%); }
          @media (max-width: 768px) {
            #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .multi-btn.mobile-full {
              top: 50%;
              right: 30px;
              position: absolute;
              transform: translateY(-50%); }
              #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt .multi-btn.mobile-full .list-item-btn {
                font-size: 15px;
                padding: 12px 10px; } }
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt.sms-preview {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          display: block;
          min-width: 0; }
      @media (max-width: 768px) {
        #km-enrollments .km-col-inner .list-item .list-item-content > .list-item-txt {
          flex: 0 0 100% !important;
          text-align: left; }
        #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt {
          flex: 0 0 50% !important; }
          #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt:nth-child(1), #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt:nth-child(3) {
            text-align: left; }
          #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt:nth-child(2), #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt:nth-child(4) {
            text-align: right; }
          #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt.full {
            flex: 0 0 100% !important; }
            #km-enrollments .km-col-inner .list-item .list-item-content:has(> .list-item-txt:nth-child(3)) > .list-item-txt.full + .list-item-txt {
              text-align: left; } }
      #km-enrollments .km-col-inner .list-item .list-item-content .hover-btn {
        transition: all 0.2s ease-in-out;
        opacity: 0; }
      #km-enrollments .km-col-inner .list-item .list-item-content:hover .hover-btn {
        opacity: 1; }
      @media (max-width: 768px) {
        #km-enrollments .km-col-inner .list-item .list-item-content i:first-child {
          display: none; } }
    #km-enrollments .km-col-inner .list-item:hover {
      text-decoration: none; }
      #km-enrollments .km-col-inner .list-item:hover * {
        text-decoration: none; }
    #km-enrollments .km-col-inner .list-item .message-date {
      width: 235px; }
    #km-enrollments .km-col-inner .list-item.header {
      color: #222;
      font-weight: 600;
      height: 20px;
      margin-top: 4px; }
      @media (max-width: 768px) {
        #km-enrollments .km-col-inner .list-item.header {
          display: none; }
          #km-enrollments .km-col-inner .list-item.header.mshow {
            display: block; }
            #km-enrollments .km-col-inner .list-item.header.mshow .mhide {
              display: none; } }
    #km-enrollments .km-col-inner .list-item.italic {
      font-style: italic; }
    #km-enrollments .km-col-inner .list-item.loader {
      opacity: 0.5; }
      #km-enrollments .km-col-inner .list-item.loader::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        transform: translateX(-100%);
        background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0));
        animation: shimmer 3s infinite;
        content: ''; }
@keyframes shimmer {
  100% {
    transform: translateX(100%); } }
    #km-enrollments .km-col-inner .list-item .shine-overlay {
      position: absolute;
      top: 0;
      left: -100%;
      pointer-events: none;
      width: 50%;
      height: 100%;
      background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
      transform: skewX(-25deg);
      z-index: 2; }
    #km-enrollments .km-col-inner .list-item:hover .shine-overlay {
      animation: shine 1s; }
  #km-enrollments .km-col-inner .item {
    display: none;
    overflow: hidden; }
    #km-enrollments .km-col-inner .item .item-textbox {
      margin: 10px 5px 15px 5px;
      padding: 15px;
      border-radius: 9px;
      background-color: rgba(255, 255, 255, 0.8); }
    #km-enrollments .km-col-inner .item .item-top {
      text-align: right; }
      #km-enrollments .km-col-inner .item .item-top .item-top-txt {
        margin: 9px 0 10px 15px;
        display: inline-block; }
        #km-enrollments .km-col-inner .item .item-top .item-top-txt a {
          padding: 5px 10px;
          border-radius: 9px;
          text-decoration: none; }
    #km-enrollments .km-col-inner .item .item-mid {
      margin: 15px 0;
      padding: 0 8px; }
      #km-enrollments .km-col-inner .item .item-mid .item-mid-header {
        font-weight: 600;
        margin-bottom: 4px; }
      #km-enrollments .km-col-inner .item .item-mid .item-mid-txt {
        line-height: 36px; }
        #km-enrollments .km-col-inner .item .item-mid .item-mid-txt i {
          width: 22px; }
        #km-enrollments .km-col-inner .item .item-mid .item-mid-txt a {
          color: #222; }
        @media (max-width: 768px) {
          #km-enrollments .km-col-inner .item .item-mid .item-mid-txt .mbreak {
            display: block; } }
        #km-enrollments .km-col-inner .item .item-mid .item-mid-txt .item-mid-lineheight {
          line-height: 26px; }
    #km-enrollments .km-col-inner .item .grid-wrapper {
      display: grid;
      grid-template-columns: var(--columns);
      align-items: center;
      gap: 0;
      margin-bottom: 25px; }
      #km-enrollments .km-col-inner .item .grid-wrapper .col {
        padding: 4px 8px;
        min-height: 30px; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.header {
          font-weight: bold;
          border-bottom: 1px solid #ccc;
          padding-bottom: 8px;
          margin-bottom: 8px; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.foot {
          font-weight: bold;
          padding-top: 8px;
          margin-top: 0.8px;
          border-top: 2px solid #aaa; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.auto {
          white-space: nowrap; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.fill {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.deleted {
          font-size: 0.9em;
          font-style: italic; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.flex {
          display: flex; }
        @media (max-width: 500px) {
          #km-enrollments .km-col-inner .item .grid-wrapper .col.short .month-short {
            display: inline; }
          #km-enrollments .km-col-inner .item .grid-wrapper .col.short .month-full {
            display: none; } }
        #km-enrollments .km-col-inner .item .grid-wrapper .col .show_mobile {
          display: none; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col i.fa-check {
          color: #28A745; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.img img {
          max-height: 40px;
          display: block;
          cursor: pointer; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col.img i {
          font-size: 24px;
          opacity: 0.5;
          line-height: 40px; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col .refund-info {
          font-size: 0.85em;
          color: #666; }
        #km-enrollments .km-col-inner .item .grid-wrapper .col .col-btn {
          padding: 5px 10px;
          border-radius: 9px;
          margin-right: 10px;
          white-space: nowrap;
          font-size: 0.85em;
          display: inline-block;
          text-decoration: none; }
          #km-enrollments .km-col-inner .item .grid-wrapper .col .col-btn i {
            margin-right: 3px; }
      @media (max-width: 600px) {
        #km-enrollments .km-col-inner .item .grid-wrapper {
          margin: 25px 0 20px 0;
          grid-template-columns: var(--mcolumns); }
          #km-enrollments .km-col-inner .item .grid-wrapper .col {
            margin-bottom: 7px;
            padding-bottom: 7px;
            border-bottom: 1px solid #aaa;
            align-self: stretch;
            align-items: center; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.total::before {
              content: ' Total '; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.header {
              display: none; }
              #km-enrollments .km-col-inner .item .grid-wrapper .col.header.mshow {
                display: block; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.noborder_mobile {
              border-bottom: 0px transparent solid; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.amount::after {
              content: ' stk. à '; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col .show_mobile {
              display: inline; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.hide_mobile {
              display: none; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.fill {
              white-space: normal; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.col-2 {
              grid-column: span 2; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col:nth-child(4n+3), #km-enrollments .km-col-inner .item .grid-wrapper .col:nth-child(4n+4) {
              margin-bottom: 7px;
              padding-bottom: 7px;
              border-bottom: 1px solid #aaa; }
            #km-enrollments .km-col-inner .item .grid-wrapper .col.foot {
              margin-top: -8px;
              border-bottom: 0px solid transparent; } }
  #km-enrollments .km-col-inner .refund-link i {
    transition: transform 0.2s ease-in-out; }
  #km-enrollments .km-col-inner .refund-link:hover i {
    transform: rotate(-45deg); }
  #km-enrollments.dark .list-item, #km-enrollments.dark a:not(.email-body a):not(.email-body * a), #km-enrollments.dark #user {
    color: #f0f0f0; }
  #km-enrollments.light .list-item, #km-enrollments.light a:not(.email-body a):not(.email-body * a), #km-enrollments.light #user {
    color: #222; }
  #km-enrollments .text-right {
    text-align: right; }
  #km-enrollments .text-center {
    text-align: center; }
  #km-enrollments .red {
    color: #eb5757; }
  #km-enrollments .bg-red {
    background-color: #eb5757 !important; }
  #km-enrollments .ico-border {
    text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.75), 1px -1px 0 rgba(255, 255, 255, 0.75), -1px 1px 0 rgba(255, 255, 255, 0.75), 1px 1px 0 rgba(255, 255, 255, 0.75);
    margin-left: 2px; }
  #km-enrollments .small {
    font-size: 0.8em; }
  #km-enrollments .nowrap {
    white-space: nowrap; }

.image-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 10002;
  display: flex;
  justify-content: center;
  align-items: center; }
  .image-modal-overlay .image-modal {
    background: white;
    padding: 20px;
    border-radius: 9px;
    max-width: 90vw;
    max-height: 90vh;
    overflow: auto;
    position: relative; }
    .image-modal-overlay .image-modal .image-modal-close {
      position: absolute;
      top: 4px;
      right: 4px;
      font-size: 20px;
      color: #333;
      cursor: pointer;
      color: #EB5757; }
    .image-modal-overlay .image-modal img {
      max-width: 100%;
      max-height: 80vh;
      display: block;
      margin: auto; }
