.App {
    font-family: sans-serif;
    text-align: center;
  }
  button{ display:block;}
  .MuiListItem-container{
    background:#ac2020 !important;
    margin:10px; 
  }
  div.MuiListItem-root{
    background:#FFF !important;
    color:#333;
    margin:10px; height:100px;
    position:relative;
  }
  div.MuiListItem-root > div{
    position:relative; }
    .controlpanel{
      border-radius:3px;
      box-shadow:0 2px 3px 3px #413f3f;
      background:#e9e9e9;
      padding:2vmin;
      margin:10vh auto;
    }
    .webapp{
      border-radius:3px;
      box-shadow:0 2px 3px 3px #413f3f;
      background:#ecddb2;
      max-width:80vw;
      padding:2vmin;
      margin:10vh auto;
    }
.subtitle{ position:fixed; height:100%; width:100%; pointer-events: none; }
.subtitle .position{ margin:10vh auto; width:60%; text-align:center; background:rgba(255,255,255,0.6); color:#0c0755; pointer-events: none; }
.position span{ background:yellow; font-size:14px; pointer-events: none;    user-select: all;} 
    body {
      font-family: 'Roboto', sans-serif;
      background-color: #f4f4f4;
      color: #333;
      margin: 0;
      padding: 0;
    }
    
    .webapp {
      animation: fadeIn 0.5s ease-in-out;
    }
    
    @keyframes fadeIn {
      from {
        opacity: 0;
        transform: translateY(-20px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    
    table {
      width: 100%;
      border-collapse: collapse;
    }
    
    th, td {
      padding: 8px;
      text-align: left;
      border-bottom: 1px solid #ddd;
    }
    .item-original {
      background-color: white; /* Default background */
      color: black; /* Default text color */
      border: 1px solid gray; /* Default border */
  }
  
  .item-cloned {
      background-color: lightgray; /* Light gray background for cloned items */
      color: darkgray; /* Dark gray text color */
      opacity: 0.6; /* Slightly transparent */
      pointer-events: none; /* Disables interactions */
  }
  
  .item-exiting {
      background-color: #1f1d1d !important; /* Light red background for exiting items */
      color: #c41e2e !important; /* Dark red text color */
  }
    hr {
      margin-top: 20px;
      margin-bottom: 20px;
      border-color: #e0e0e0;
    }
    
    .webapp{
      position:absolute;
      margin:20px;
      width:50%;
      min-width:400px;
      min-height:400px;
      background:#f5ebb5;
      z-index:9999;
    }