html, body { display: block; height: 100%; width: 100%; padding: 0px; margin: 0px; font-family: 'input_mono_regular'; text-transform: uppercase; } section { position: relative; top: 50%; margin: 0px auto; user-select: none; -webkit-user-select: none; -ms-user-select: none; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); text-align: center; } .month { width:100px; margin: 10px; display: inline-block;} .header { margin: 0px 0px 40px 10px; text-align: left; align-content: flex-start;} p { margin: 0px; } .y { font-size: 40px; font-weight: bold; } .y a { text-align: center; color: #000; width: 30px; display: inline-block; margin-left: 10px;} .y a:hover { color: #ffffff; background: #000; cursor: pointer;} .p { font-size: 20px; color: #8b8b8b} .m { font-size: 20px; font-weight: bold; margin-bottom: 5px; text-align: left; } svg.graph { color:white; width: 100%; } svg.graph text {font-family: 'input_mono_regular'; stroke:none; fill:#8b8b8b; font-size:14px; text-anchor: middle; } svg.graph text.dayLabel { font-size: 10px; } svg.graph rect { stroke:none } svg.graph rect.null { fill: none; stroke: none;} svg.graph rect.today { fill:#ff1e00; } svg.graph rect.day { fill:#8b8b8b; } svg.graph rect.weekend { fill:#747474 } svg.graph rect.gone { fill:#000000 } svg.graph path { stroke-linecap: butt; stroke-dasharray: 1,1; fill:none; stroke:#333; stroke-width:13px } @media only screen and (min-width: 1440px) { section { width: 1440px; }} @media only screen and (max-width: 1440px) { section { width: 720px; }} @media only screen and (max-width: 720px) { section { width: 360px; }}