#calendar{background:#fff;margin:0 0 20px}.calendar-nav{display:flex;justify-content:space-between;align-items:center}.calendar-nav *{flex-basis:33.333%}.calendar-nav button{border-radius:0;padding:10px 0}.calendar-nav h2{margin:0;text-align:center;font-size:20px;text-transform:uppercase}#prev-month::before{content:'<';margin-right:10px}#next-month::after{content:'>';margin-left:10px}.calendar-grid{display:grid;border:1px solid #000;padding:10px;grid-template-columns:repeat(7,1fr);gap:8px;text-align:center}.calendar-grid div{padding:10px}.calendar-grid div.day{font-weight:600;background-color:#eee}.prev,.next{color:#bbb;font-style:italic}.today{border-radius:10px;background-color:#3d9888;color:#fff;font-weight:500}.date.event{background:#5199f6;font-weight:600;color:#fff;border-radius:10px}.date .hover-tip{display:none}.date.event a{color:#fff}.date a:focus .hover-tip,.date a:hover .hover-tip{display:block;position:absolute;background:#fff;color:#03173A;padding:5px;font-size:.9em;border:2px solid #00aeef;z-index:1}@media screen and (max-width:500px){.calendar-nav h2{font-size:14px}.calendar-grid div{padding:10px 5px}}