body{background-color:#38a4ef;color:#fff;font-size:16px;text-align:center;font-family:Arial,"Helvetica Neue",Helvetica,sans-serif}.clock{display:block;margin:0 auto;max-width:80%}.clock div{background-color:black;color:white;display:inline-block;padding:2rem;margin:0 1rem;font-size:2rem;width:calc(10% - 2rem);text-align:center;font-weight:bold;border-radius:5%}.clock div[data-value*=days]:after,.clock div[data-value*=hours]:after,.clock div[data-value*=minutes]:after,.clock div[data-value*=seconds]:after{display:block;font-size:.75rem;margin-top:.25rem;font-weight:300}.clock div[data-value*=days]:after{content:"Days"}.clock div[data-value*=hours]:after{content:"Hours"}.clock div[data-value*=minutes]:after{content:"Minutes"}.clock div[data-value*=seconds]:after{content:"Seconds"}@media screen and (max-width: 820px){.clock{max-width:90%}.clock div{width:calc(15% - 2rem)}}@media screen and (max-width: 767px){.clock{max-width:100%}.clock div{width:calc(30% - 4rem);margin:.5rem;padding:.5rem;font-size:1rem}.clock div[data-value*=days]:after,.clock div[data-value*=hours]:after,.clock div[data-value*=minutes]:after,.clock div[data-value*=seconds]:after{font-size:.5rem}}