/* Colors */
/* Font sizes */
/* Line Heights */
/* Font weights */
/* Font Families */
/* Headings */
/* acceptable color contrast colors for timesheet status report */
/* mixins */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background: rgba(0, 0, 0, 0.3); }
  .modal.open {
    display: block; }

.modal-content {
  min-height: 100vh;
  overflow-y: auto;
  background-color: #FFFFFF;
  padding: 24px 40px;
  width: 100vw; }
  .modal-content .close-icon {
    float: right;
    font-size: 20px;
    color: #474747;
    font-weight: 400; }
  .modal-content .close {
    cursor: pointer; }
  .modal-content .view-header {
    text-align: center;
    margin-top: 48px; }
    .modal-content .view-header h4 {
      font-weight: 700;
      font-size: 22px;
      line-height: 25px;
      color: rgba(0, 0, 0, 0.9);
      margin: 24px 0; }
    .modal-content .view-header img {
      width: 48%; }
  .modal-content .modal-body {
    text-align: center;
    font-size: 14px;
    line-height: 21px; }
    .modal-content .modal-body ul {
      margin-top: 8px;
      margin-bottom: 32px;
      text-align: center;
      list-style-position: inside;
      list-style-type: disc; }
  .modal-content .bold-green {
    color: #008146;
    font-weight: 500; }
  .modal-content .modal-footer {
    text-align: center; }
    .modal-content .modal-footer .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background-color: #00815D;
      border-radius: 4px;
      font-size: 14px;
      height: 40px;
      padding: 0 24px;
      box-shadow: none;
      max-width: 220px;
      margin: 0 auto 16px auto;
      text-transform: unset; }
      .modal-content .modal-footer .btn:focus {
        background-color: #007e45;
        box-shadow: 0 0 0 3px #FFB500; }
      .modal-content .modal-footer .btn.secondary-button {
        background-color: transparent;
        border: 2px solid #007e45;
        color: #007e45; }
        .modal-content .modal-footer .btn.secondary-button:hover {
          border: 2px solid #006046;
          background-color: #006046;
          color: #FFFFFF; }
        .modal-content .modal-footer .btn.secondary-button:disabled {
          background: none !important;
          border: 2px solid #E6EBED;
          color: rgba(102, 133, 146, 0.1); }
        .modal-content .modal-footer .btn.secondary-button.is-white {
          border-color: #FFFFFF;
          color: #FFFFFF; }
          .modal-content .modal-footer .btn.secondary-button.is-white:hover {
            background-color: #FFFFFF;
            color: rgba(0, 0, 0, 0.9); }