﻿.mainTableContainer {
  color: #383838;
  width: 100%;
  margin: auto;
  overflow-y: auto;
  /*    .tableHeader {
        &--right {
            float: right;
            margin-bottom: 8px;
        }
    }*/
  /*    .tableFooter {
        &--left {
            float: left;
        }

        &--right {
            float: right;
        }
    }*/ }
  .mainTableContainer table {
    background-color: white;
    font-size: 18px;
    width: 100%; }
    .mainTableContainer table.dataTable.no-footer {
      border-bottom: none; }
    .mainTableContainer table thead {
      font-size: 16px; }
      .mainTableContainer table thead th {
        font-weight: normal !important;
        text-align: center; }
        .mainTableContainer table thead th.twidth1 {
          width: 1%; }
        .mainTableContainer table thead th.twidth2 {
          width: 2%; }
        .mainTableContainer table thead th.twidth3 {
          width: 3%; }
        .mainTableContainer table thead th.twidth4 {
          width: 4%; }
        .mainTableContainer table thead th.twidth5 {
          width: 5%; }
        .mainTableContainer table thead th.twidth6 {
          width: 6%; }
        .mainTableContainer table thead th.twidth7 {
          width: 7%; }
        .mainTableContainer table thead th.twidth8 {
          width: 8%; }
        .mainTableContainer table thead th.twidth9 {
          width: 9%; }
        .mainTableContainer table thead th.twidth10 {
          width: 10%; }
        .mainTableContainer table thead th.twidth11 {
          width: 11%; }
        .mainTableContainer table thead th.twidth12 {
          width: 12%; }
        .mainTableContainer table thead th.twidth13 {
          width: 13%; }
        .mainTableContainer table thead th.twidth14 {
          width: 14%; }
        .mainTableContainer table thead th.twidth15 {
          width: 15%; }
        .mainTableContainer table thead th.twidth16 {
          width: 16%; }
        .mainTableContainer table thead th.twidth17 {
          width: 17%; }
        .mainTableContainer table thead th.twidth18 {
          width: 18%; }
        .mainTableContainer table thead th.twidth19 {
          width: 19%; }
        .mainTableContainer table thead th.twidth20 {
          width: 20%; }
        .mainTableContainer table thead th.twidth21 {
          width: 21%; }
        .mainTableContainer table thead th.twidth22 {
          width: 22%; }
        .mainTableContainer table thead th.twidth23 {
          width: 23%; }
        .mainTableContainer table thead th.twidth24 {
          width: 24%; }
        .mainTableContainer table thead th.twidth25 {
          width: 25%; }
        .mainTableContainer table thead th.twidth26 {
          width: 26%; }
        .mainTableContainer table thead th.twidth27 {
          width: 27%; }
        .mainTableContainer table thead th.twidth28 {
          width: 28%; }
        .mainTableContainer table thead th.twidth29 {
          width: 29%; }
        .mainTableContainer table thead th.twidth30 {
          width: 30%; }
        .mainTableContainer table thead th.twidth31 {
          width: 31%; }
        .mainTableContainer table thead th.twidth32 {
          width: 32%; }
        .mainTableContainer table thead th.twidth33 {
          width: 33%; }
        .mainTableContainer table thead th.twidth34 {
          width: 34%; }
        .mainTableContainer table thead th.twidth35 {
          width: 35%; }
        .mainTableContainer table thead th.twidth36 {
          width: 36%; }
        .mainTableContainer table thead th.twidth37 {
          width: 37%; }
        .mainTableContainer table thead th.twidth38 {
          width: 38%; }
        .mainTableContainer table thead th.twidth39 {
          width: 39%; }
        .mainTableContainer table thead th.twidth40 {
          width: 40%; }
        .mainTableContainer table thead th.twidth41 {
          width: 41%; }
        .mainTableContainer table thead th.twidth42 {
          width: 42%; }
        .mainTableContainer table thead th.twidth43 {
          width: 43%; }
        .mainTableContainer table thead th.twidth44 {
          width: 44%; }
        .mainTableContainer table thead th.twidth45 {
          width: 45%; }
        .mainTableContainer table thead th.twidth46 {
          width: 46%; }
        .mainTableContainer table thead th.twidth47 {
          width: 47%; }
        .mainTableContainer table thead th.twidth48 {
          width: 48%; }
        .mainTableContainer table thead th.twidth49 {
          width: 49%; }
        .mainTableContainer table thead th.twidth50 {
          width: 50%; }
    .mainTableContainer table tbody tr:nth-child(even) {
      background-color: #F5F9FF; }
    .mainTableContainer table tbody tr:hover {
      background-color: #C8DEFF; }
    .mainTableContainer table tbody tr td {
      text-align: center; }
      .mainTableContainer table tbody tr td .tButton {
        border-radius: 13px;
        border: 1px solid #005FAF;
        background-color: #005FAF;
        color: white;
        cursor: pointer;
        padding: 3px 11px;
        margin: 0px 2px; }
        .mainTableContainer table tbody tr td .tButton:hover {
          background-color: #00559D; }
        .mainTableContainer table tbody tr td .tButton--white {
          background-color: white;
          border-color: #2E85FC;
          color: #2E85FC; }
          .mainTableContainer table tbody tr td .tButton--white:hover {
            background-color: #F5F9FF; }
        .mainTableContainer table tbody tr td .tButton--red {
          background-color: #EA3D2F;
          border-color: #EA3D2F; }
          .mainTableContainer table tbody tr td .tButton--red:hover {
            background-color: #D91606;
            border-color: #D91606; }
        .mainTableContainer table tbody tr td .tButton--green {
          background-color: #07B882;
          border-color: #07B882; }
          .mainTableContainer table tbody tr td .tButton--green:hover {
            background-color: #00A472;
            border-color: #00A472; }
        .mainTableContainer table tbody tr td .tButton--grey {
          background-color: #A1A1A1;
          border-color: #A1A1A1; }
          .mainTableContainer table tbody tr td .tButton--grey:hover {
            background-color: #A1A1A1;
            color: #0F6EF1;
            border-color: #A1A1A1; }
        .mainTableContainer table tbody tr td .tButton--disabled {
          background-color: #A1A1A1;
          border-color: #A1A1A1;
          color: white;
          cursor: not-allowed; }
          .mainTableContainer table tbody tr td .tButton--disabled:hover {
            background-color: #A1A1A1;
            color: white;
            border-color: #A1A1A1; }
  .mainTableContainer .dataTables_length {
    font-size: 14px;
    margin-left: 30px;
    padding-top: 10px; }
    .mainTableContainer .dataTables_length select {
      width: 60px;
      height: 24px;
      text-align-last: center;
      background-color: white;
      border-radius: 2px;
      padding: 0px;
      border: #D4D4D4 1px solid; }
  .mainTableContainer .dataTables_info {
    font-size: 14px;
    padding-top: 10px; }
  .mainTableContainer .dataTables_wrapper {
    /*        .dataTables_paginate {
            font-size: 14px;
            padding-top: 8px;

            .paginate_button {
                background-color: white;
                margin: 0px 3px;
                width: 20px;
                height: 20px;
                line-height: 20px;
                color: #383838 !important;
                border: 0px;
                padding: 0px;

                &:hover {
                    background: white;
                    color: #383838 !important;
                }

                &.current, &.current:hover {
                    background: #1D7FE1;
                    color: white !important;
                    border: none;
                }

                &.previous, &.next {
                    color: #757575 !important;
                }
            }
        }*/ }
  .mainTableContainer .dataTables_paginate .paginate_button:not(.disabled, .current):hover {
    background: #d0d0d0;
    color: white !important;
    border: 0px; }
  .mainTableContainer .dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: none; }

.catalogContainer {
  width: 1088px;
  height: calc(100% - 114px);
  margin: 34px auto 28px auto; }
  .catalogContainer .lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center; }
    .catalogContainer .lightbox .previewPanel {
      width: 1200px;
      height: fit-content;
      overflow-y: auto;
      background-color: white; }
      .catalogContainer .lightbox .previewPanel__header {
        display: flex;
        justify-content: space-between;
        background-color: #83B8CC;
        color: white;
        padding: 2px 25px;
        align-items: center; }
      .catalogContainer .lightbox .previewPanel__name {
        font-size: 20px;
        display: inline-block;
        cursor: pointer;
        font-weight: bold; }
      .catalogContainer .lightbox .previewPanel__close {
        height: 30px;
        width: 30px;
        display: inline-block;
        cursor: pointer;
        background-image: url(../Image/cross--small.svg); }
      .catalogContainer .lightbox .previewPanel__content {
        width: 100%;
        height: fit-content;
        max-height: 675px;
        overflow-y: auto; }
      .catalogContainer .lightbox .previewPanel__img {
        margin: auto;
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain; }
  .catalogContainer__partial {
    width: 100%;
    height: 100%; }
    .catalogContainer__partial--apply {
      height: calc(100% - 78px);
      width: calc(100% + 6px);
      overflow-y: auto; }
      .catalogContainer__partial--apply #selectedThemeMapTable {
        border-collapse: collapse; }
      .catalogContainer__partial--apply::-webkit-scrollbar {
        width: 6px; }
      .catalogContainer__partial--apply::-webkit-scrollbar-track {
        margin-top: 40px; }
      .catalogContainer__partial--apply::-webkit-scrollbar-thumb {
        background: #D9D9D9;
        border-radius: 6px; }
      .catalogContainer__partial--apply::-webkit-scrollbar-thumb:hover {
        background: #7C7C7C; }
    .catalogContainer__partial .catalog__title {
      font-size: 20px;
      font-weight: bold;
      line-height: 27px; }
    .catalogContainer__partial .catalog__header {
      width: 100%;
      margin-bottom: 16px; }
      .catalogContainer__partial .catalog__header--catalog {
        height: 80px; }
      .catalogContainer__partial .catalog__header .catalog__query {
        font-size: 16px;
        margin-top: 16px;
        display: flex;
        justify-content: flex-end;
        align-items: center; }
        .catalogContainer__partial .catalog__header .catalog__query .queryItem {
          height: 36px;
          padding: 7px 20px 7px 20px;
          border-radius: 20px;
          border: 1px solid #EEEEEE; }
          .catalogContainer__partial .catalog__header .catalog__query .queryItem:focus {
            outline: none; }
        .catalogContainer__partial .catalog__header .catalog__query--date {
          width: 150px; }
        .catalogContainer__partial .catalog__header .catalog__query--keyword {
          width: 259px;
          margin-left: 36px;
          background-image: url(../Image/search.svg);
          background-size: 25px 25px;
          background-position-y: center;
          background-position-x: calc(100% - 10px);
          background-repeat: no-repeat; }
          .catalogContainer__partial .catalog__header .catalog__query--keyword:hover {
            background-image: url(../Image/search--hover.svg); }
          .catalogContainer__partial .catalog__header .catalog__query--keyword:focus {
            background-image: url(../Image/search--on.svg); }
        .catalogContainer__partial .catalog__header .catalog__query span {
          margin: 0 4px; }
    .catalogContainer__partial .catalog__table {
      height: calc(100% - 96px - 78px);
      overflow-y: auto; }
      .catalogContainer__partial .catalog__table #selectedThemeMapTable {
        border-collapse: collapse; }
      .catalogContainer__partial .catalog__table::-webkit-scrollbar {
        width: 6px; }
      .catalogContainer__partial .catalog__table::-webkit-scrollbar-track {
        margin-top: 40px; }
      .catalogContainer__partial .catalog__table::-webkit-scrollbar-thumb {
        background: #D9D9D9;
        border-radius: 6px; }
      .catalogContainer__partial .catalog__table::-webkit-scrollbar-thumb:hover {
        background: #7C7C7C; }
      .catalogContainer__partial .catalog__table .table__sortIcon {
        width: 16px;
        height: 16px;
        display: inline-block;
        background-image: url(../Image/sort.svg);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat; }
        .catalogContainer__partial .catalog__table .table__sortIcon.descending {
          background-image: url(../Image/sort--desc.svg); }
        .catalogContainer__partial .catalog__table .table__sortIcon.ascending {
          background-image: url(../Image/sort--asc.svg); }
      .catalogContainer__partial .catalog__table .table__checkbox {
        height: 30px;
        cursor: pointer;
        box-sizing: border-box;
        border-radius: 2px;
        margin-right: 8px;
        background-image: url(../Image/checkbox.svg);
        background-size: contain;
        background-repeat: no-repeat;
        display: flex;
        align-items: center; }
        .catalogContainer__partial .catalog__table .table__checkbox span {
          padding-left: 55px; }
        .catalogContainer__partial .catalog__table .table__checkbox:hover:not(.table__checkbox--checked) {
          background-image: url(../Image/checkbox--hover.svg); }
        .catalogContainer__partial .catalog__table .table__checkbox--checked {
          background-image: url(../Image/checkbox--on.svg); }
      .catalogContainer__partial .catalog__table .table__preview {
        width: 36px;
        height: 36px;
        display: inline-block;
        cursor: pointer;
        background-image: url(../Image/preview.svg);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat; }
        .catalogContainer__partial .catalog__table .table__preview:hover {
          background-image: url(../Image/preview--hover.svg); }
      .catalogContainer__partial .catalog__table thead {
        color: white;
        background-color: #83B8CC;
        height: 40px;
        position: sticky;
        top: 0; }
        .catalogContainer__partial .catalog__table thead .themeMapTableHead--name {
          width: 323px; }
        .catalogContainer__partial .catalog__table thead .themeMapTableHead--description {
          width: 411px; }
        .catalogContainer__partial .catalog__table thead .themeMapTableHead--modifiedDate, .catalogContainer__partial .catalog__table thead .themeMapTableHead--preview {
          width: 177px; }
        .catalogContainer__partial .catalog__table thead.table__head--selected {
          /*                       color: $black;
                        background-color: $extremLightGray;*/ }
          .catalogContainer__partial .catalog__table thead.table__head--selected th {
            border-right: 1px solid white; }
            .catalogContainer__partial .catalog__table thead.table__head--selected th:last-child {
              border: none; }
        .catalogContainer__partial .catalog__table thead .sortableColumn {
          margin-right: 7px;
          display: flex;
          justify-content: center;
          align-items: center; }
      .catalogContainer__partial .catalog__table tbody tr {
        height: 150px;
        min-height: 150px; }
      .catalogContainer__partial .catalog__table tbody td {
        padding: 25px 40px;
        line-height: 25px; }
      .catalogContainer__partial .catalog__table tbody.table__body--selected {
        font-weight: bold; }
        .catalogContainer__partial .catalog__table tbody.table__body--selected tr {
          height: 80px;
          min-height: 80px;
          border-bottom: 1px solid #F5F5F5;
          background-color: white; }
          .catalogContainer__partial .catalog__table tbody.table__body--selected tr:last-child {
            border: none; }
      .catalogContainer__partial .catalog__table .width30 {
        width: 30%; }
      .catalogContainer__partial .catalog__table .width38 {
        width: 38%; }
      .catalogContainer__partial .catalog__table .width14 {
        width: 14%; }
      .catalogContainer__partial .catalog__table .width18 {
        width: 18%; }
      .catalogContainer__partial .catalog__table .width250 {
        width: 250px; }
      .catalogContainer__partial .catalog__table .alignLeft {
        text-align: left; }
    .catalogContainer__partial .catalog__applyForm {
      margin-top: 60px; }
      .catalogContainer__partial .catalog__applyForm .catalog__form {
        background-color: white;
        width: 100%;
        height: 575px;
        padding: 43px 40px 30px 40px; }
        .catalogContainer__partial .catalog__applyForm .catalog__form__description {
          width: 356px;
          height: 313px;
          padding: 24px 36px;
          position: relative;
          background-color: #F5F9FF;
          color: #383838;
          line-height: 25px;
          float: right;
          display: flex;
          flex-direction: column;
          justify-content: space-between; }
          .catalogContainer__partial .catalog__applyForm .catalog__form__description--title {
            color: #1C97B4;
            font-weight: bold; }
          .catalogContainer__partial .catalog__applyForm .catalog__form__description--text {
            text-justify: distribute;
            text-align: justify; }
        .catalogContainer__partial .catalog__applyForm .catalog__form .formItem {
          display: flex;
          align-items: center;
          margin-bottom: 24px; }
          .catalogContainer__partial .catalog__applyForm .catalog__form .formItem:last-child {
            margin: none; }
          .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__title {
            width: 130px; }
            .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__title::after {
              content: '*';
              color: red;
              width: 14px;
              margin-left: 5px; }
          .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__input {
            height: 40px;
            width: 400px;
            padding: 8px 25px;
            border: 1px solid #EEEEEE; }
            .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__input--wider {
              width: 600px; }
            .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__input--higher {
              height: 95px;
              resize: none;
              vertical-align: middle;
              line-height: 24px; }
          .catalogContainer__partial .catalog__applyForm .catalog__form .formItem__errorMessage {
            width: 100px;
            font-size: 14px;
            color: red;
            margin-left: 10px; }
    .catalogContainer__partial .catalog__footer {
      border-top: 1px solid #EEEEEE;
      width: 1088px;
      position: fixed;
      height: 78px;
      bottom: 80px;
      font-size: 20px;
      padding-top: 28px; }
    .catalogContainer__partial .catalog__button--forward {
      color: #0276A4;
      font-weight: bold;
      float: left;
      line-height: 26px;
      height: 52px;
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center; }
      .catalogContainer__partial .catalog__button--forward span {
        width: 26px;
        height: 26px;
        display: inline-block;
        margin-right: 5px;
        background-image: url(../Image/previousStep.svg);
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat; }
    .catalogContainer__partial .catalog__button--next {
      width: 238px;
      height: 50px;
      background-color: #0276A4;
      border: none;
      color: white;
      float: right;
      font-weight: bold;
      cursor: pointer; }
      .catalogContainer__partial .catalog__button--next.disabledButton {
        cursor: not-allowed;
        background-color: #AAAAAA; }
      .catalogContainer__partial .catalog__button--next.loadingButton {
        cursor: not-allowed;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 30px;
        background-image: url(../Image/ajax-loader.gif); }
