##Responsive Giphy Grouper App

##Purpose The purpose of this day project is to practice manipulating HTML and CSS using Flex Box and Media Queries. The idea behind this project is to design for responsiveness and to organize large groups or divs in an orderly manner.

##Directions Fork and clone this repository. Complete all of the following steps. When you have finished, push your code into GitHub.

• Review the code that is already built in your folder. I have already setup the index.html file, some styles, and the JavaScript that is pulling in the Giphy data.

• In your terminal, use live-server to pull up the rendered page in your browser.

• Notice that a large list of giphy images have been populated in a linear order on the left hand side. Using the concepts that you have learned about Flex Box, rearrange the images so that they are centered on the view. Also as the browser view is shrunken down, make it so that continually less and less of the giphy's are listed per row. Make sure that there is space in between each of the giphy images on top and bottom, as well as left and right.

• Next, using media queries, make it so that the header image changes size to 100vw, once the view size falls below 1000px. Also, be aware of the header links. Make it so that they are reformatted once the view size starts to overflow them.

• Review your entire page in all browser shapes and sizes and verify that under all circumstances your site is responsive. If it is not, update it using everything you have learned thus far.

##Copyright

(c) Montana Code School, 2016.