Zipcoder · Ryan-Gross1993 · Jan 20, 2017
diff --git a/.DS_Store b/.DS_Store
diff --git a/Images/RyanG.jpg b/Images/RyanG.jpg
diff --git a/Index.html b/Index.html
@@ -0,0 +1,37 @@
+<html>
+  <head>
+
+  <title>
+  Ryan Gross: Personal Biography
+  </title>
+
+  <meta charsef="utf-8">
+  <meta name="viewport","content="width=device-width,initial-scale=1">
+
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
+  <link rel="stylesheet" type="text/css" href="./css/styles.css">
+
+  <script src="./js/scripts.js"> </script>
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
+  integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
+  crossorigin="anonymous">
+  </script>
+  </head>
+
+  <body>
+    <div class="page-header text-center">
+      <h1> Ryan Gross </h1>
+      <h4> Software Dev. </h4>
+    </div>
+
+    <div class="container text-center">
+      <div class="jumbotron">
+        <img src="./Images/RyanG.jpg" class="img-fluid">
+        <h3 class="text-center" id="favorite-things"> My Favorite Things! </h3>
+        <p class="text-center" id="answer"> </p>
+        <button onclick="newRandom()" class="favorite btn btn-primary btn-lg"> Click Me! </button>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/css/.DS_Store b/css/.DS_Store
diff --git a/css/styles.css b/css/styles.css
@@ -0,0 +1,81 @@
+body {
+  margin:0;
+  padding:0;
+}
+
+.jumbotron {
+  margin-top: -20px;
+}
+
+h4 {
+  font-size: 1.2em;
+}
+
+img {
+  border-radius: 240px;
+}
+
+#answer {
+  padding-top: 10px;
+  font-weight:400;
+  font-family: 'Noto Sans Kannada', sans-serif;
+}
+
+.page-header {
+  border-width: 0px;
+}
+
+@media only screen and (max-width:600px) {
+  .img-fluid {
+    max-width:60%;
+  }
+
+  #favorite-things {
+    padding-top:15px;
+  }
+
+  #answer {
+    font-size:1.7em;
+    padding-bottom:15px;
+  }
+
+  .favorite {
+    font-size: 1.5em;
+
+  }
+}
+
+
+@media only screen and (min-width:601px) {
+
+  .jumbotron {
+    max-width: 80%;
+    margin: 0 auto;
+  }
+
+  .img-fluid {
+    max-width:40%;
+  }
+
+  #skills {
+    font-size: 1.7em;
+  }
+
+  h3 {
+    font-size:2.3em;
+  }
+
+  .favorite {
+    border-radius: 10px;
+    padding: 15 px;
+    font-size: 1.9em;
+  }
+
+  #favorite-things {
+    padding-top: 20px;
+  }
+
+  #answer {
+    font-size: 2.1em;
+  }
+}
diff --git a/js/scripts.js b/js/scripts.js
@@ -0,0 +1,16 @@
+
+var favorite_stuff = [ "TV Show: South Park", "Food: Sushi", "Color: Cranberry Red",
+"Video Game: Grand Theft Auto", "Web Browser: Chrome", "Word: Gratituitous",
+"Pokemon: Blastoise", "Coffee: Pumpkin Spice Coffee","Movie: Step Brothers",
+"Eating Utensil: Spork", "Language : &#26085;&#26412;&#35486" ];
+
+function newRandom() {
+  var returnThis = document.getElementById("answer").innerHTML;
+  var random = Math.round(Math.random() * 10);
+    if(favorite_stuff[random] !==  returnThis) {
+      document.getElementById("answer").innerHTML = favorite_stuff[random];
+      console.log(random);
+    } else {
+      newRandom();
+    }
+  }