.div_QuarterCals{
  display:flex;
  gap:20px;
 // width:100%;
}
  .div_Quarter {
  // width: 100%;
    margin-top: 20px;
}
    .work-calendar * {
      box-sizing: border-box;
      font-family: Arial, sans-serif;
    }
    .work-calendar {
      max-width: 600px;
      margin: 40px auto;
      padding: 20px;
      border: 1px solid #ccc;
      border-radius: 12px;
      background-color: #f9f9f9;
      box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    }
    .work-calendar h2 {
      margin-bottom: 16px;
      text-align: center;
    }
    .work-calendar label {
      margin-right: 10px;
    }
    .work-calendar input[type="date"] {
      padding: 8px;
      margin-right: 10px;
    }
    .work-calendar .row {
      display: flex;
      align-items: center;
      gap: 15px;
      flex-wrap: wrap;
      margin-bottom: 15px;
    }
    .work-calendar .row label {
      display: flex;
      align-items: center;
    }
    .work-calendar .row input[type="radio"] {
      margin-right: 5px;
    }
    .work-calendar .row input[type="number"] {
      width: 70px;
      padding: 5px;
    }
    .work-calendar button {
      padding: 10px 20px;
      background-color: #2a81e6;
      color: white;
      border: none;
      border-radius: 6px;
      cursor: pointer;
    }
    .work-calendar table {
      width: 100%;
      margin-top: 20px;
      border-collapse: collapse;
    }
    .work-calendar th, .work-calendar td {
      padding: 10px;
      border: 1px solid #ccc;
      text-align: left;
    }