window#overview .overview {
  background-color: $crust;
  border: 2px solid $overlay0;
  border-radius: 35px;
  padding: 15px;
  margin: 30px;
  box-shadow: rgba(0, 0, 0, 0.6) 0 0 10px 10px;


  &.horizontal>* {
    margin: 0 10px;

    &:first-child {
      margin-left: 0;
    }

    &:last-child {
      margin-right: 0;
    }
  }

  &.vertical>* {
    margin: 10px 0;

    &:first-child {
      margin-top: 0;
    }

    &:last-child {
      margin-bottom: 0;
    }
  }

  .workspace {

    &.active>widget {
      border-color: $blue;
    }

    >widget {
      border-radius: 20px;
      background-color: $base;
      margin: 10px;
      border: 2px solid rgba(0, 0, 0, 0);

      &:hover {
        background-color: $surface1;
      }

      &:drop(active) {
        background-color: $base;
      }
    }

    .client {
      background-color: rgba(0, 0, 0, .3);
      border: 2px solid $surface0;
      margin: 10px;
      border-radius: 10px;
      padding: 0px;

      &:active,
      &.on,
      &.active,
      &:checked,
      &:focus {
        border: 2px solid $blue;
        background-color: rgba(0, 0, 0, 0.5);
      }

      &:hover {
        background-color: rgba(0, 0, 0, 0.5);
      }
    }
  }
}