body * { font-family: 'Nunito', sans-serif; box-sizing: border-box; } body { background-color: #142F4C; } #countdown-wrap { width: 100%; height: 300px; //border: 1px solid black; padding: 20px; font-family: arial; max-width: 650px; margin: 150px auto 300px; } #goal { font-size: 48px; text-align: right; color: #FFF; @media only screen and (max-width : 640px) { text-align: center; } } #glass { width: 100%; height: 20px; background: #c7c7c7; border-radius: 10px; float: left; overflow: hidden; } #progress { float: left; width: 16%; height: 20px; background: #FF5D50; z-index: 333; //border-radius: 5px; } .goal-stat { width: 25%; //height: 30px; padding: 10px; float: left; margin: 0; color: #FFF; @media only screen and (max-width : 640px) { width: 50%; text-align: center; } } .goal-number, .goal-label { display: block; } .goal-number { font-weight: bold; } CountDownTimer('12/20/2020 10:1 AM', 'countdown'); CountDownTimer('12/20/2020 10:1 AM', 'newcountdown'); function CountDownTimer(dt, id) { var end = new Date(dt); var _second = 1000; var _minute = _second * 60; var _hour = _minute * 60; var _day = _hour * 24; var timer; function showRemaining() { var now = new Date(); var distance = end - now; if (distance < 0) { clearInterval(timer); document.getElementById(id).innerHTML = '0'; return; } var days = Math.floor(distance / _day); var hours = Math.floor((distance % _day) / _hour); var minutes = Math.floor((distance % _hour) / _minute); var seconds = Math.floor((distance % _minute) / _second); document.getElementById(id).innerHTML = days /*+ ' days'*/; //document.getElementById(id).innerHTML += hours + 'hrs '; //document.getElementById(id).innerHTML += minutes + 'mins '; //document.getElementById(id).innerHTML += seconds + 'secs'; } timer = setInterval(showRemaining, 1000); }

top of page