diff --git a/2021.css b/2021.css
new file mode 100644
index 0000000..7eca762
--- /dev/null
+++ b/2021.css
@@ -0,0 +1,126 @@
+* {
+ font-family: sans-serif;
+
+}
+
+.grid-container {
+ display: grid;
+ grid-template-rows: repeat(3, 1fr);
+
+}
+
+.grid-item {
+ background-color: white;
+ padding: 1px;
+ font-size: 30px;
+ text-align: center;
+
+}
+
+.grid-item3 {
+ background-color: white;
+ padding: 2px;
+ font-size: 30px;
+ text-align: center;
+ padding-bottom: 150px;
+
+
+}
+
+#horizontal-list {
+ width: 1200px;
+ margin-left: 300px;
+ margin-top: 80px;
+
+
+}
+
+
+#horizontal-list {
+ font-size: 30px;
+ font-weight: bold;
+ padding-top: 20px;
+ display: inline;
+}
+
+.list1 {
+ position: relative;
+ padding-left: 550px;
+ float: left;
+}
+
+.list2 {
+ position: relative;
+ padding-left: 110px;
+ float: left;
+
+}
+
+.list3 {
+ position: relative;
+ padding-left: 100px;
+ float: left;
+
+}
+.list4 {
+ position: relative;
+ padding-left: 120px;
+ float: left;
+
+}
+
+input[type=number] {
+ width: 190px;
+ height: 60px;
+ text-align: center;
+ box-sizing: border-box;
+ border: 2px solid black;
+ border-radius: 1px;
+ font-size: 30px;
+ position: relative;
+ right: 285px;
+}
+
+button {
+ border-radius: 1px;
+ background-color: rgb(228, 248, 255);
+ font-size: 25px;
+ cursor: pointer;
+ width: 150px;
+ height: 60px;
+ position: relative;
+ right: 125px;
+
+ }
+
+
+.scale {
+ float: left;
+ padding-left: 550px;
+ font-weight: bold;
+
+}
+
+.value {
+ padding-right: 700px;
+ font-weight: bold;
+}
+
+.temp {
+ border: 10px;
+
+
+
+}
+
+select {
+ font-weight: bold;
+ float: left;
+ width: 170px;
+ height: 60px;
+ margin-left: 520px;
+ font-size: 27px;
+ text-align: center;
+
+
+}
\ No newline at end of file
diff --git a/2021.html b/2021.html
new file mode 100644
index 0000000..bbb1c4a
--- /dev/null
+++ b/2021.html
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+ Temp Converter Lab
+
+
+
+
+
Temperature Scale Convertor
+
+
+
Scale
+
Value
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/app.js b/app.js
new file mode 100644
index 0000000..f827e54
--- /dev/null
+++ b/app.js
@@ -0,0 +1,118 @@
+
+function convertToc() {
+ let fahrenheit = parseFloat(document.getElementById("inputKG").value);
+ let celsiusTemp = (fahrenheit - 32) * (5/9);
+ return document.getElementById("celsConverted").innerHTML = `${celsiusTemp.toFixed(2)} C`;
+}
+
+// Celsius Formulas
+function celsToF() {
+ let celsiusTemp = document.getElementById("inputKG").value;
+ let fahrenheit = (celsiusTemp * 9/5) + 32;
+ return document.getElementById("fahConverted").innerHTML = `${fahrenheit.toFixed(2)} F`;
+
+}
+function celsToK() {
+ let celsiusTemp = parseFloat(document.getElementById("inputKG").value);
+ let kelvinTemp = (celsiusTemp * 1) + 273.15;
+ return document.getElementById("kelConverted").innerHTML = `${kelvinTemp} K`;
+}
+
+function celsToR() {
+ let celsiusTemp = parseFloat(document.getElementById("inputKG").value);
+ let rankineTemp = (celsiusTemp + 273.15) * (9/5);
+ return document.getElementById("ranConverted").innerHTML = `${rankineTemp.toFixed(2)} R`;
+}
+
+function ConvertCelsToAll () {
+ celsToR() & celsToF() & celsToK();
+}
+
+// Rankine Formulas
+function rankToF() {
+ let rankTemp = parseFloat(document.getElementById("inputKG").value);
+ let fahrenheit = (rankTemp * 1) - 459.67;
+ document.getElementById("fahConverted").innerHTML = `${fahrenheit.toFixed(2)} F`;
+}
+
+function rankToC() {
+ let rankTemp = parseFloat(document.getElementById("inputKG").value);
+ let celsiusTemp = (rankTemp - 491.67) * 5/9;
+ document.getElementById("celsConverted").innerHTML = `${celsiusTemp.toFixed(2)} C`;
+}
+
+function rankToK() {
+ let rankTemp = parseFloat(document.getElementById("inputKG").value);
+ let kelvinTemp = rankTemp * 5/9;
+ document.getElementById("kelConverted").innerHTML = `${kelvinTemp.toFixed(2)} K`;
+}
+
+function ConvertRankToAll () {
+ rankToK() & rankToC() & rankToF();
+}
+
+// Kelvin Formulas
+function kelToF() {
+ let kelvinTemp = parseFloat(document.getElementById("inputKG").value);
+ let fahrenheit = (kelvinTemp * 9/5) - 459.67;
+ (document.getElementById("fahConverted").innerHTML = `${fahrenheit.toFixed(2)} F`);
+
+}
+
+function kelToC() {
+ let kelvinTemp = parseFloat(document.getElementById("inputKG").value);
+ let celsiusTemp = (kelvinTemp * 1) - 273.15;
+ return document.getElementById("celsConverted").innerHTML = `${celsiusTemp.toFixed(2)} C`;
+
+}
+
+function kelToR() {
+ let kelvinTemp = parseFloat(document.getElementById("inputKG").value);
+ let rankineTemp = kelvinTemp * 9/5;
+ return document.getElementById("ranConverted").innerHTML = `${rankineTemp.toFixed(2)} R`;
+
+}
+
+function ConvertKelToAll() {
+ kelToR() & kelToC() & kelToF();
+}
+
+function convertTof() {
+ let fahrenheit = parseFloat(document.getElementById("inputKG").value);
+ return document.getElementById("fahConverted").innerHTML = `${fahrenheit} F`;
+}
+
+// K=((℉-32)/1.8)+273.15
+function convertTok() {
+ let fahrenheit = parseFloat(document.getElementById("inputKG").value);
+ let kelvin = ((fahrenheit - 32)/1.8) + 273.15;
+ return document.getElementById("kelConverted").innerHTML = `${kelvin.toFixed(2)} K`;
+
+}
+
+function convertTor() {
+ let fahrenheit = parseFloat(document.getElementById("inputKG").value);
+ let rankine = (fahrenheit * 1) + 459.67;
+ return document.getElementById("ranConverted").innerHTML = `${rankine.toFixed(2)} R`;
+}
+
+function convertAll() {
+
+ var userChosenConversion = document.getElementById("temp").value;
+ console.log({userChosenConversion})
+ switch(userChosenConversion) {
+ case "Fahrenheit":
+
+ (convertTof() & convertToc() & convertTok()
+ & convertTor());
+ break;
+ case "Celsius":
+ (ConvertCelsToAll());
+ break;
+ case "Kelvin":
+ (ConvertKelToAll());
+ break;
+ case "Rankine":
+ (ConvertRankToAll ());
+ }
+}