@import"https://fonts.googleapis.com/css2?family=Kanit:wght@300;500&display=swap";:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .64)}:root{--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--section-gap: 160px}@media (prefers-color-scheme: dark){:root{--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2)}}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{max-width:1280px;margin:0 auto;padding:2rem;font-weight:400}a,.green{text-decoration:none;color:#00bd7e;transition:.4s}@media (hover: hover){a:hover{background-color:#00bd7e33}}@media (min-width: 1024px){body{display:flex;place-items:center}#app{display:grid;grid-template-columns:1fr 1fr;padding:0 2rem}}.red p{background-color:#fceced;color:#c78587;border-radius:5px;padding:0 3px;margin:3px;text-align:left;cursor:pointer}.yellow p{background-color:#f7ecd8;color:#cfaf7d;border-radius:5px;padding:0 3px;margin:3px;text-align:left;cursor:pointer}.green p{background-color:#eaf5ed;color:#a6d3b2;border-radius:5px;padding:0 3px;margin:3px;text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.green p:hover{position:absolute}div{display:inline-block;padding:2px 5px;border-radius:5px}.active{color:#95bd99;border:2px solid #9c9c9c;border-radius:10px;font-family:Kanit,sans-serif;font-weight:bolder;text-align:right;padding-right:6px}.passed{color:#a4a4a4;background-color:#e6e6e6}body{background-color:#d6d5d5}div{font-family:Tahoma,Verdana,Segoe,sans-serif}.title{padding:30px;font-size:3rem;text-align:center}#app{width:1200px;background-color:#fff;border-radius:25px;padding:0 25px 25px}.month{padding:20px 20px 5px 0;font-size:1.5rem;color:#373d7b;font-family:Kanit,sans-serif;font-weight:bolder}.weeks{display:flex}.week-day{width:100px;flex-grow:1;margin-top:5px;padding:5px;text-align:right;font-family:Kanit,sans-serif;font-weight:bolder}.week-day:nth-child(6),.week-day:nth-child(7){color:#a5a5a5}.days{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:1fr;gap:0px 0px;grid-template-areas:". . . . . . ."}.days div:not(.active){border:1px solid rgb(223,223,223);border-radius:10px;height:120px;width:155px;margin:1px;font-family:Kanit,sans-serif;font-weight:bolder;text-align:right;padding-right:6px}.days div:not(.active):nth-child(6),.days div:not(.active):nth-child(7),.days div:not(.active):nth-child(13),.days div:not(.active):nth-child(14),.days div:not(.active):nth-child(20),.days div:not(.active):nth-child(21),.days div:not(.active):nth-child(27),.days div:not(.active):nth-child(28),.days div:not(.active):nth-child(34),.days div:not(.active):nth-child(35),.days div:not(.active):nth-child(41),.days div:not(.active):nth-child(42){color:#a6aed1}.days div:not(.active) a{margin-right:4px}.day{height:120px;width:150px;flex:1 0 auto;margin:1px;border:1px solid rgb(214,213,213);border-radius:10px;text-align:right;padding-top:10px;padding-right:10px}a{text-decoration:none;color:#000;transition:all .5s ease-in-out}a:hover{color:red}