.flow-diagram-container {
  display: flex;
  width: 100vw;
  height: 100vh;
  background-color: rgb(226, 226, 226);
  &-left {
    width: 6vw;
    height: 100vh;
    // background-color: #4e4;
    display: flex;
    flex-direction: column;
    // justify-content: space-evenly;
    #circle {
      width: 40px;
      height: 40px;
      border-radius: 40px;
      border: 1px solid black;
      margin: 10px;
      cursor: all-scroll;
    }
    #double-circle {
      width: 40px;
      height: 40px;
      border-radius: 40px;
      border: 1px solid black;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 10px;
      cursor: all-scroll;
      #normal-circle {
        width: 30px;
        height: 30px;
        border-radius: 30px;
        border: 1px solid black;
      }
    }
    #dark-circle {
      width: 40px;
      height: 40px;
      border-radius: 40px;
      border: 2px solid black;
      margin: 10px;
      cursor: all-scroll;
    }
    #rectangle {
      width: 40px;
      height: 30px;
      border-radius: 6px;
      margin: 10px;
      border: 1px solid black;
      cursor: all-scroll;
    }
  }
  &-right {
    width: 90vw;
    height: 100vh;
    background-color: rgb(255, 255, 255);
    overflow: scroll;
    padding: 20px;
    .dropzone {
      width: 100vw;
      height: 100vh;
      background-color: white;
      #circle {
        width: 60px;
        height: 60px;
        border-radius: 60px;
        border: 1px solid black;
        // margin: 20px;
        cursor: all-scroll;
      }
      #double-circle {
        width: 60px;
        height: 60px;
        border-radius: 60px;
        border: 1px solid black;
        display: flex;
        align-items: center;
        justify-content: center;
        // margin: 20px;
        cursor: all-scroll;
        #normal-circle {
          width: 50px;
          height: 50px;
          border-radius: 50px;
          border: 1px solid black;
        }
      }
      #dark-circle {
        width: 60px;
        height: 60px;
        border-radius: 60px;
        border: 2px solid black;
        // margin: 20px;
        cursor: all-scroll;
      }
      #rectangle {
        width: 140px;
        height: 80px;
        border-radius: 6px;
        margin: 10px;
        border: 1px solid black;
        cursor: all-scroll;
      }
      .addrect {
        border: none;
        border-radius: 8px;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    }
  }
}