.mainCont {
  position: relative;
  overflow: hidden;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  .tipCard {
    position: absolute;
    top: 20px;
    margin: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .searchCont {
    display: flex;
    justify-content: center;
    align-items: center;

    .googleButton {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background-color: white;
      padding: 1em;
      transition: box-shadow var(--transitionDuration);
      box-shadow: 0 0 8px #666;

      cursor: pointer;

      .googleLogo {
        margin-right: 5px;
      }
    }

    .commandIcon {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 40px;
      width: 40px;
      flex: 1;
      border-radius: 0.4rem;
      margin: 0 10px;
    }
    .searchBar {
      display: block;
      margin: 0;
      padding: var(--inputPaddingV) var(--inputPaddingH);
      padding-left: 10px;
      color: inherit;
      font-family: inherit;
      font-size: var(--inputFontSize);
      font-weight: inherit;
      line-height: var(--inputLineHeight);
      border: none;
      border-radius: 0.4rem;
      transition: box-shadow var(--transitionDuration);
      box-shadow: 0 0 8px #666;
      width: 400px;
      height: 40px;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
        Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;

      ::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        color: grey;
        opacity: 0.5;
      }
      ::-moz-placeholder {
        /* Firefox 19+ */
        color: grey;
        opacity: 0.5;
      }
      :-ms-input-placeholder {
        /* IE 10+ */
        color: grey;
        opacity: 0.5;
      }
      :-moz-placeholder {
        /* Firefox 18- */
        color: grey;
        opacity: 0.5;
      }
    }

    .submitButton {
      margin: 0 10px;
    }
  }

  .availableCommandsIconsCont {
    display: flex;

    position: fixed;
    bottom: 3em;

    .icon {
      height: 50px;
      width: 50px;
      margin: 1em;
    }
  }

  .backgroundImage {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3;

    z-index: -1;
  }
}

.notificationCont {
  background-color: #4bb543 !important;
  color: white;
  padding: 1em;
  position: fixed;
  top: 0;
  right: 0;
  margin: 1em;
}

.hidden {
  display: none !important;
}