﻿body {
  font-family: 'Open Sans', sans-serif;
}

#applicationForm, #confirmation-page {
  max-width: 990px;
  background-color: #ffffff;
  margin: 40px auto;
  padding: 40px;
  box-shadow: 0px 6px 18px rgb(0 0 0 / 9%);
  border-radius: 12px;
}

  #applicationForm .form-header {
    gap: 5px;
    text-align: center;
    font-size: .9em;
  }

    #applicationForm .form-header .stepIndicator {
      position: relative;
      flex: 1;
      padding-bottom: 30px;
    }

      #applicationForm .form-header .stepIndicator.active {
        font-weight: 600;
      }

      #applicationForm .form-header .stepIndicator.finish {
        font-weight: 600;
        color: #009688;
      }

      #applicationForm .form-header .stepIndicator::before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        transform: translateX(-50%);
        z-index: 9;
        width: 20px;
        height: 20px;
        background-color: #d5efed;
        border-radius: 50%;
        border: 3px solid #ecf5f4;
      }

      #applicationForm .form-header .stepIndicator.active::before {
        background-color: #a7ede8;
        border: 3px solid #d5f9f6;
      }

      #applicationForm .form-header .stepIndicator.finish::before {
        background-color: #009688;
        border: 3px solid #b7e1dd;
      }

      #applicationForm .form-header .stepIndicator::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 8px;
        width: 100%;
        height: 3px;
        background-color: #f3f3f3;
      }

      #applicationForm .form-header .stepIndicator.active::after {
        background-color: #a7ede8;
      }

      #applicationForm .form-header .stepIndicator.finish::after {
        background-color: #009688;
      }

      #applicationForm .form-header .stepIndicator:last-child:after {
        display: none;
      }

/*  #applicationForm input {
    padding: 15px 20px;
    width: 100%;
    font-size: 1em;
    border: 1px solid #e3e3e3;
    border-radius: 5px;
  }*/

    #applicationForm input:focus {
      border: 1px solid #009688;
      outline: 0;
    }

/*    #applicationForm input.invalid {
      border: 1px solid #ffaba5;
    }*/

  #applicationForm .form-floating label {
    /*margin-left: 0.9em;*/
  }

  #applicationForm .step {
    display: none;
  }

  #applicationForm .form-footer {
    overflow: auto;
    gap: 20px;
    justify-content:space-between;
    margin-top: 3em;
  }

    #applicationForm .form-footer button {
      background-color: #58b183;
      /*border: 1px solid #58b183 !important;*/
      color: #ffffff;
      border: none;
      padding: 6px 30px;
      font-size: 1em;
      cursor: pointer;
      border-radius: 5px;
      flex: 0;
      /*margin-top: 5px;*/
      white-space: nowrap;
    }

      #applicationForm .form-footer button:hover {
        opacity: 0.8;
      }

    #applicationForm .form-footer #prevBtn {
      background-color: #86b7fe;
      color: #fff;
    }

/*  #applicationForm .pls-underline {
    text-decoration: underline;
  }*/

input[type="checkbox"] {
  background-color: blue;
}

/*  input[type="checkbox"]:checked {
    background-color: #4CAF50;
    border: 1px solid #4CAF50;
  }
*/
/*    input[type="checkbox"]:checked::after {
      content: "";
      position: absolute;
      left: 5px;
      top: 1px;
      width: 6px;
      height: 12px;
      border-width: 0 3px 3px 0;
      transform: rotate(45deg);
    }*/