.dialog{
    z-index: 10;
    border: 1px solid rgb( 200, 200, 200);
    padding: 0;
    width: 300px;
    border-radius: 10px;
  }
  .draggableArea:hover{
    cursor: pointer;
  }
  .dialogTitle{
    margin: 0;
    padding: 10px 0;
    text-align: center;
    font-size: 16px;
    letter-spacing: 1rem;
  }
  .dialogMessage{
    margin: 0;
    padding: 20px 10px;
    background-color: rgba(255, 255, 255, 0);
  }
  .dialogFooter{
    display: flex;
    justify-content: space-evenly;
    padding: 10px 0;
  }
  .dialogFooter button{
    border: 1px solid rgb( 200,200,200);
    border-radius: 10px;
    padding: 10px;
  }
  .dialogHeader.error,
  .dialogFooter.error{
    background-color: rgba(255, 200, 200, 0.4);
  }
  .dialogHeader.question,
  .dialogFooter.question{
    background-color: rgba(200, 255, 200, 0.4);
  }
  .dialogHeader.info,
  .dialogFooter.info{
    background-color:  rgba(210, 210, 255, 0.4);
  }