.main-root{
    min-height:90vh;
}
#loader {
    animation: spinner 1s infinite linear;
    border: 3px solid #c4c4c4;
    border-left-color: #444;
    border-radius: 50%;
    content: "";
    display: inline-flex;
    height: 30px;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 30px;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: "loading";
  }
  
  @keyframes spinner {
    0% {
        transform: rotate(0deg);
    }
  
    100% {
        transform: rotate(360deg);
    }
  }
  
  .label {
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 2px;
    padding: 0;
  }
  
  @import url('https://rsms.me/inter/inter.css');
  
  li, ul {
      margin: 0;
      padding: 0;
  }
  
  /**
   * Main wrapper
   */
  .select-search-container {
      --select-search-background: #fff;
      --select-search-border: #dce0e8;
      --select-search-selected: #1e66f5;
      --select-search-text: #000;
      --select-search-subtle-text: #6c6f85;
      --select-search-inverted-text: var(--select-search-background);
      --select-search-highlight: #eff1f5;
      --select-search-font: 'Inter', sans-serif;
  
      width: 100%;
      position: relative;
      font-family: var(--select-search-font);
      color: var(--select-search-text);
      box-sizing: border-box;
  }
  
  @supports (font-variation-settings: normal) {
      .select-search-container {
          --select-search-font: 'Inter var', sans-serif;
      }
  }
  
  .select-search-container *,
  .select-search-container *::after,
  .select-search-container *::before {
      box-sizing: inherit;
  }
  
  .select-search-input {
      position: relative;
      z-index: 1;
      height: 38px;
      width: 100%;
      background: var(--select-search-background);
      color: var(--select-search-text);
      outline: none;
      font-family: var(--select-search-font);
      font-size: 14px;
      text-align: left;
      text-overflow: ellipsis;
      line-height: 38px;
      letter-spacing: 0.01rem;
      -webkit-appearance: none;
      -webkit-font-smoothing: antialiased;
      align-items: center;
      border: 1px solid #c4c4c4;
      border-radius: 4px;
      cursor: text;
      display: flex;
      flex-basis: 25%;
      flex-wrap: wrap;
      min-height: 38px;
      padding-right: 36px;
      padding-left: 5px;
  }
  
  .select-search-is-multiple .select-search-input {
      margin-bottom: -2px;
  }
  
  .select-search-is-multiple .select-search-input {
      border-radius: 3px 3px 0 0;
  }
  
  .select-search-input::-webkit-search-decoration,
  .select-search-input::-webkit-search-cancel-button,
  .select-search-input::-webkit-search-results-button,
  .select-search-input::-webkit-search-results-decoration {
      -webkit-appearance: none;
  }
  
  .select-search-input[readonly] {
      cursor: pointer;
  }
  
  .select-search-is-disabled .select-search-input {
      cursor: not-allowed;
  }
  
  .select-search-container:not(.select-search-is-disabled).select-search-has-focus .select-search-input,
  .select-search-container:not(.select-search-is-disabled) .select-search-input:hover {
      border-color: #0c7bab;
  }
  
  .select-search-select {
      background: var(--select-search-background);
      box-shadow: 0 .0625rem .125rem rgba(0, 0, 0, 0.15);
      border: 2px solid #c4c4c4;
      overflow: auto;
      max-height: 360px;
  }
  
  .select-search-container:not(.select-search-is-multiple) .select-search-select {
      position: absolute;
      z-index: 2;
      top: 37px;
      right: 0;
      left: 0;
      border-radius: 3px;
      display: none;
  }
  
  .select-search-container:not(.select-search-is-multiple).select-search-has-focus .select-search-select {
      display: block;
  }
  
  .select-search-has-focus .select-search-select {
      border-color: #c4c4c4;
      border: 1px solid #c4c4c4;
  }
  
  .select-search-options {
      list-style: none !important;
  }
  
  .select-search-option,
  .select-search-not-found {
      display: flex;
      height: 42px;
      width: 100%;
      padding: 6px 0px 6px 6px;
      background: #fff;
      border: none;
      outline: none;
      font-family: var(--select-search-font);
      color: var(--select-search-text);
      font-size: 14px;
      text-align: left;
      letter-spacing: 0.01rem;
      cursor: pointer;
      -webkit-font-smoothing: antialiased;
      margin: 6px;
  }
  
  .select-search-option:disabled {
      opacity: 0.5;
      cursor: not-allowed;
      background: transparent !important;
  }
  
  .select-search-is-highlighted,
  .select-search-option:not(.select-search-is-selected):hover {
      background: var(--select-search-highlight);
  }
  
  .select-search-is-selected {
    font-weight: bold;
    color: #333;
    border: 2px solid #c4c4c4;
    border-radius: 5px;
    background-color: #cfedfa;
   }
  
  .select-search-group-header {
      font-size: 12px;
      text-transform: uppercase;
      background: var(--select-search-border);
      color: var(--select-search-subtle-text);
      letter-spacing: 0.1rem;
      padding: 10px 16px;
  }
  
  .select-search-row:not(:first-child) .select-search-group-header {
      margin-top: 10px;
  }
  
  .select-search-row:not(:last-child) .select-search-group-header {
      margin-bottom: 10px;
  }
  
  .textArea {
    background-color: "#fff";
    border: 1px solid #c4c4c4;
    border-radius: 4px;
    color: #1a1a1a;
    display: block;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 14px;
    padding: 4px 6px;
    width: 99%;
  }
  
  .error {
    background-color: #fff0f0;
    border: 1px solid #c70000;
  }
  
  hr {
    border: solid #c4c4c4;
    border-width: 1px 0 0;
    height: 1px;
    margin: 12px auto;
  }
  
  .wrapper {
    display: flex;
    flex-flow: row wrap;
  }
  
  .wrapper>* {
    padding: 10px;
    flex: 1 100%;
  }
  
  .main {
    text-align: left;
  }
  
  .aside-2 {
  }
  
  @media all and (min-width: 600px) {
    .aside {
        flex: 1 0 0;
    }
  }
  
  @media all and (min-width: 800px) {
    .main {
        flex: 3 0px;
    }
  
    .main {
        order: 2;
    }
  
    .aside-2 {
        order: 3;
    }
  }
