diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..7d1fefa
Binary files /dev/null and b/.DS_Store differ
diff --git a/facebook.png b/facebook.png
new file mode 100644
index 0000000..ee2e3ae
Binary files /dev/null and b/facebook.png differ
diff --git a/responsivenewsreader.css b/responsivenewsreader.css
new file mode 100644
index 0000000..632062f
--- /dev/null
+++ b/responsivenewsreader.css
@@ -0,0 +1,160 @@
+/* Deafult appearance settings for mobile devices */
+body {
+ /* world image entered here: */
+ background-image: url("worldmap.png");
+ /* background-color: rgb(229, 232, 232); */
+ color: black;
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+ border: solid;
+ border-color: #2F4F4F;
+ border-radius: 20px;
+ border-width: 30px;
+}
+
+h1 {
+ color: #CD5C5C;
+ font-size: 100px;
+ background: rgba(169,169,169,0.5);
+ display: flex;
+ flex-direction: column;
+ text-align: center;
+ text-decoration: underline;
+ text-shadow: #FFFF00 1px 0 50px;
+ flex: 1;
+}
+
+img {
+ display: none;
+ width: 100%;
+}
+
+#searchText{
+ margin-bottom: 10px;
+}
+
+#goButton {
+ margin-top: 10px;
+}
+
+#goButton:hover {
+ text-decoration: overline underline;
+ background: #FAFAD2;
+
+}
+
+#articles {
+ /* display: flex;
+ flex: 2; */
+ /* border: 10px solid blue; */
+ font-size: 40px;
+ border: solid;
+ border-color: #2F4F4F;
+ border-radius: 20px;
+ border-width: 10px;
+ flex-direction: column;
+ align-self: center;
+ margin: 20px;
+ /* background: rgba(169,169,169,0.5); */
+ /* margin: 20 0 20 0px; */
+}
+
+li {
+ display: flex;
+ flex-direction: column;
+ align-content: center;
+ flex: 1;
+ /* background-color: rgba(148, 103, 193,0.6); */
+ background: rgba(175,238,238, 0.5);
+ /* background-color: rgba(169,169,169,0.5); */
+ padding: 50px;
+ margin: 10px;
+ margin-right: 50px;
+ border-radius: 20px;
+ list-style: none;
+}
+
+.ul {
+ background: rgba(169,169,169,0.5);
+ /* border-radius: 20px; */
+ margin-right: 0;
+ text-align: center;
+}
+
+.content{
+ /* background: rgba(169,169,169,0.5); */
+}
+
+.ul:hover {
+ color: #FFD700;
+}
+
+#footer {
+ /* background-color: rgba(255, 255, 0,0.3); */
+ background: rgba(175,238,238, 0.5);
+ height: 40px;
+ border-radius: 20px;
+ margin-bottom: 20px;
+ border: solid;
+ border-color: #2F4F4F;
+ text-align: center;
+
+ /* border-color: #2F4F4F;
+ border-width: 5px; */
+ /* border-color: #2F4F4F; */
+}
+
+#aside {
+ display: none;
+}
+
+
+
+/* Medium devices (tablets, 768px and up) */
+@media (min-width: 768px) {
+
+ img {
+ display: block;
+ width: 100%;
+ }
+
+}
+
+/* Large devices (desktops, 960px and up) */
+@media (min-width: 960px) {
+
+ .content{
+ display: flex;
+ flex-direction: row;
+ }
+
+ #articles {
+ flex: 2;
+ }
+
+ #aside{
+ display: block;
+ flex: 1;
+ background: rgba(175,238,238, 0.5);
+ border: solid;
+ border-color: #2F4F4F;
+ border-radius: 20px;
+ border-width: 10px;
+ margin-bottom: 16px;
+ margin-top: 15px;
+ }
+
+
+
+
+
+
+
+
+}
+
+/* Extra large devices (large desktops, 1200px and up) */
+@media (min-width: 1200px) {
+
+}
diff --git a/responsivenewsreader.html b/responsivenewsreader.html
new file mode 100644
index 0000000..fe23896
--- /dev/null
+++ b/responsivenewsreader.html
@@ -0,0 +1,46 @@
+
+
+
+
+
+
+ News Reader
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
${article.title}
+ 
+ ${article.description}
+ ${article.publishedAt}
+ CLICK here for story`
+ parent.appendChild(child);
+ })
+}
+
+
+function search( query, pageNumber ){
+ fetch(`https://newsapi.org/v2/everything?q=${query}&apiKey=41a785bcf660443c92ded19ad436a52c&page=${pageNumber}`)
+ // by default fetch makes a GET request
+ .then(function(response) {
+ return response.json();
+ })
+ .then(function(body){
+ displayDataOnPage(body.articles);
+ })
+ .catch(function(error) {
+ displayErrorToUser('Server failed to return data');
+ });
+}
+
+
+
+function searchForm(){
+const form = document.querySelector("form")
+
+ form.addEventListener("submit", function(event) {
+ event.preventDefault();
+ console.log(event.target["0"].value);
+ // get reference to text input
+ // submit its to search
+ search(event.target["0"].value, pageNumber)
+ })
+}
+
+searchForm();
+
+// let input = "";
+//
+// function textAreaInput(){
+// let textArea = document.querySelector(".searchText");
+// textArea.addEventListener("input", function(event) {
+// input = event.target.value;
+// return input;
+// })
+// }
+
+function displayErrorToUser(){
+
+}
+
+
+fetch("https://newsapi.org/v2/top-headlines?country=gb&apiKey=41a785bcf660443c92ded19ad436a52c")
+// by default fetch makes a GET request
+ .then(function(response) {
+ return response.json();
+ })
+ .then(function(body){
+ displayDataOnPage(body.articles);
+ })
+ .catch(function(error) {
+ displayErrorToUser('Server failed to return data');
+ });
diff --git a/skynews.png b/skynews.png
new file mode 100644
index 0000000..841c09e
Binary files /dev/null and b/skynews.png differ
diff --git a/twitter.png b/twitter.png
new file mode 100644
index 0000000..7e7ee01
Binary files /dev/null and b/twitter.png differ
diff --git a/worldmap.png b/worldmap.png
new file mode 100644
index 0000000..c1550fa
Binary files /dev/null and b/worldmap.png differ