diff --git a/Countdown Timer [29-30]/index.html b/Countdown Timer [29-30]/index.html
new file mode 100644
index 0000000..cfddfaf
--- /dev/null
+++ b/Countdown Timer [29-30]/index.html
@@ -0,0 +1,30 @@
+
+
+
+
+ Countdown Timer
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Countdown Timer [29-30]/scripts.js b/Countdown Timer [29-30]/scripts.js
new file mode 100644
index 0000000..581cadb
--- /dev/null
+++ b/Countdown Timer [29-30]/scripts.js
@@ -0,0 +1,55 @@
+let countdown;
+const timerDisplay = document.querySelector('.display__time-left');
+const endTime = document.querySelector('.display__end-time');
+const buttons = document.querySelectorAll('[data-time]');
+
+function timer(seconds) {
+ // clear any existing timers
+ clearInterval(countdown);
+
+ const now = Date.now();
+ const then = now + seconds * 1000;
+ displayTimeLeft(seconds);
+ displayEndTime(then);
+
+ countdown = setInterval(() => {
+ const secondsLeft = Math.round((then - Date.now()) / 1000);
+ // check if we should stop it!
+ if(secondsLeft < 0) {
+ clearInterval(countdown);
+ return;
+ }
+ // display it
+ displayTimeLeft(secondsLeft);
+ }, 1000);
+}
+
+function displayTimeLeft(seconds) {
+ const minutes = Math.floor(seconds / 60);
+ const remainderSeconds = seconds % 60;
+ const display = `${minutes}:${remainderSeconds < 10 ? '0' : '' }${remainderSeconds}`;
+ document.title = display;
+ timerDisplay.textContent = display;
+}
+
+function displayEndTime(timestamp) {
+ const end = new Date(timestamp);
+ const hour = end.getHours();
+ const adjustedHour = hour > 12 ? hour - 12 : hour;
+ const minutes = end.getMinutes();
+ endTime.textContent = `Be Back At ${adjustedHour}:${minutes < 10 ? '0' : ''}${minutes}`;
+}
+
+function startTimer() {
+ const seconds = parseInt(this.dataset.time);
+ timer(seconds);
+}
+
+buttons.forEach(button => button.addEventListener('click', startTimer));
+document.customForm.addEventListener('submit', function(e) {
+ e.preventDefault();
+ const mins = this.minutes.value;
+ console.log(mins);
+ timer(mins * 60);
+ this.reset();
+});
diff --git a/Countdown Timer [29-30]/style.css b/Countdown Timer [29-30]/style.css
new file mode 100644
index 0000000..f8416c0
--- /dev/null
+++ b/Countdown Timer [29-30]/style.css
@@ -0,0 +1,82 @@
+html {
+ box-sizing: border-box;
+ font-size: 10px;
+ background: #8E24AA;
+ background: linear-gradient(45deg, #42a5f5 0%,#478ed1 50%,#0d47a1 100%);
+}
+
+*, *:before, *:after {
+ box-sizing: inherit;
+}
+
+body {
+ margin: 0;
+ text-align: center;
+ font-family: 'Inconsolata', monospace;
+}
+
+.display__time-left {
+ font-weight: 100;
+ font-size: 20rem;
+ margin: 0;
+ color: white;
+ text-shadow: 4px 4px 0 rgba(0,0,0,0.05);
+}
+
+.timer {
+ display: flex;
+ min-height: 100vh;
+ flex-direction: column;
+}
+
+.timer__controls {
+ display: flex;
+}
+
+.timer__controls > * {
+ flex: 1;
+}
+
+.timer__controls form {
+ flex: 1;
+ display: flex;
+}
+
+.timer__controls input {
+ flex: 1;
+ border: 0;
+ padding: 2rem;
+}
+
+.timer__button {
+ background: none;
+ border: 0;
+ cursor: pointer;
+ color: white;
+ font-size: 2rem;
+ text-transform: uppercase;
+ background: rgba(0,0,0,0.1);
+ border-bottom: 3px solid rgba(0,0,0,0.2);
+ border-right: 1px solid rgba(0,0,0,0.2);
+ padding: 1rem;
+ font-family: 'Inconsolata', monospace;
+}
+
+.timer__button:hover,
+.timer__button:focus {
+ background: rgba(0,0,0,0.2);
+ outline: 0;
+}
+
+.display {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+
+.display__end-time {
+ font-size: 4rem;
+ color: white;
+}