.calendar {
    padding: 20px;
    
    .months {
      display: flex;
      flex-wrap: wrap;
      
      .month {
        flex: 1 1 20%;
        margin: 10px;
        
        .days {
          display: flex;
          flex-wrap: wrap;
          
          .day {
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 2px;
            cursor: pointer;
            border: 1px solid #ccc;
            border-radius: 5px;
            
            &.starred {
              background-color: yellow;
            }
          }
        }
      }
    }
    
    .event-details {
      margin-top: 20px;
      border: 1px solid #ccc;
      padding: 10px;
    }
  }