.calendar{display:flex;flex-wrap:wrap;justify-content:space-between}.month{flex:1 0 30%;border:1px solid #ddd;margin:10px;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);background:#fff;overflow:hidden}.month-name{text-align:center;font-weight:700;margin:0;padding:15px;color:#fff}.month.january .month-name{background:#ff6f61}.month.february .month-name{background:#6b5b95}.month.march .month-name{background:#88b04b}.month.april .month-name{background:#f7cac9}.month.may .month-name{background:#92a8d1}.month.june .month-name{background:#955251}.month.july .month-name{background:#b565a7}.month.august .month-name{background:#009b77}.month.september .month-name{background:#dd4124}.month.october .month-name{background:#d65076}.month.november .month-name{background:#45b8ac}.month.december .month-name{background:#e94b3c}.days{display:grid;grid-template-columns:repeat(7,1fr);padding:10px;background:#f7f7f7}.day{width:100%;padding:10px 5px;text-align:center}.day-name{font-weight:700;background:#e9ecef;padding:10px 0}.day-number{height:40px;line-height:40px;border:1px solid #ddd;margin:2px;border-radius:4px;transition:background .3s,color .3s}.day-number:hover{background:#007bff;color:#fff}.empty-day{border:none;background:none}.container{max-width:1200px;margin:auto}form{background:#fff;padding:20px;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);margin-bottom:20px}