diff --git a/src/015-flex/example/example.css b/src/015-flex/example/example.css
index 1e6ea79..37b194b 100644
--- a/src/015-flex/example/example.css
+++ b/src/015-flex/example/example.css
@@ -2,4 +2,208 @@
 
 .trash{
 	color: black;
+}
+
+.page-content {
+    padding: 0;
+}
+
+.main-content::before {
+    content: '';
+    display: block;
+    position: relative;
+    width: 100%;
+    height: 300px;
+    background: url(../solved/css/images/image.jpg) no-repeat center -50% fixed;
+    background-size: 100% 100%;
+    z-index: -1;
+}
+
+.card-wrapper {
+    display: flex;
+    justify-content: space-around;
+    flex-wrap: wrap;
+    max-width: 1200px;
+    width: 100%;
+    margin: -50px auto 0;
+}
+
+.card {
+    width: 350px;
+    border-radius: 5px;
+    border: 2px solid #DDDDDD;
+    margin-bottom: 50px;
+    cursor: pointer;
+}
+
+.card img {
+    transition: all 0.5s;
+}
+
+.card:hover img {
+    transform: scale(1.2);
+}
+
+.card p {
+    color: #787878;
+    padding: 10px;
+    line-height: 1.3em;
+}
+
+.img-frame {
+    width: 100%;
+    overflow: hidden;
+}
+
+.info {
+    border-top: 2px solid #DDDDDD;    
+    display: flex;
+    justify-content: space-between;
+    padding: 10px 10px 5px 10px;
+}
+
+.info ul, .info .button {
+    display: inline-block;
+}
+
+.info ul li {
+    display: inline-block;
+}
+
+.info ul li:not(:last-child):after {
+    content: ',';
+    color: #AAAAAA;
+}
+
+.info ul a {
+    text-decoration: none;
+    color: #AAAAAA;
+}
+
+.info ul a:hover {
+    color: #888888;
+}
+
+.info .button {
+    text-decoration: none;
+    display: inline-block;
+    padding: 10px 5px 0;
+    transition: all 1s;
+}
+
+.info .button:hover {
+    background-color: #eee;
+}
+
+.info > .button, .info > ul {
+    align-self: baseline;
+}
+
+footer {
+    padding-top: 30px;
+    padding-bottom: 30px;
+    background-color: #9370DB;
+    font-size: 0.8em;
+    font-family: sans-serif; 
+}
+
+footer .content {
+    display: none;
+}
+
+footer span.footer-title {
+    padding: 40px 50px;
+}
+
+footer .content {
+    padding-left: 50px;
+    padding-right: 80px;
+}
+
+footer span.footer-title {
+    cursor: pointer;
+    position: relative;
+    width: 100%;
+    display: block;
+    color: #FFFFFF;
+    box-sizing: border-box;
+    text-align: center;
+    font-size: 1.1em;
+}
+
+.content ul {
+    max-width: 350px;
+}
+
+.content .day {
+    width: 70%;
+}
+
+.content .hours {
+    width: 30%;
+    min-width: 110px;
+}
+
+.content p {
+    color: #FFFFFF;
+    line-height: 1.5em;
+}
+
+.content .icons, .content table {
+    color: #FFFFFF;
+    width: 100%;
+}
+
+.content td:first-child {
+    padding-right: 20px;
+}
+
+.content td {
+    padding-bottom: 10PX;
+    padding-top: 10PX;
+    font-weight: lighter;
+}
+
+.content tr {
+    border-bottom: 1px solid rgba(255,255,255,0.2);
+
+}
+
+.content li {
+    display: inline-block;
+    margin-bottom: 5px;
+}
+
+@media (min-width: 769px) {
+    footer {
+        display: flex;
+        flex-wrap: wrap;  
+        padding: 30px 10px;
+    }
+
+    footer span.footer-title {
+        padding: 0 0 40px;
+        text-align: left;
+    }
+
+    footer span.footer-title::after {
+        display: none;
+    }
+
+    footer .content {
+        display: block;
+        padding-left: 0;
+        padding-right: 40px;
+        margin-bottom: 50px;
+    }
+
+    footer .footer-block {
+        width: 50%;
+    }
+}
+
+@media (min-width: 1200px) { 
+    footer .footer-block {
+        width: 25%;
+    }
 }
\ No newline at end of file
diff --git a/src/015-flex/example/index.html b/src/015-flex/example/index.html
index 19e1974..37dc1cc 100644
--- a/src/015-flex/example/index.html
+++ b/src/015-flex/example/index.html
@@ -12,6 +12,7 @@
     <link href="../../app.css" rel="stylesheet" type="text/css">
 
     <!-- Import App Css file -->
+    <link href="./reset.css" rel="stylesheet" type="text/css">
     <link href="./example.css" rel="stylesheet" type="text/css">
     
   </head>
@@ -32,6 +33,199 @@
       <main class="mdl-layout__content">
         <div class="page-content">
          <!-- Practice Content Goes Here -->
+         <section class="main-content">
+          <article class="card-wrapper">
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/animals">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/people">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/arch">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/nature">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/animals">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/people">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/nature">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+             <div class="card">
+               <div class="img-frame">
+                 <img src="https://placeimg.com/350/250/arch">
+               </div>
+               <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+               tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+               quis nostrud exercitation ullamco laboris.</p>
+               <div class="info">
+                 <ul>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                   <li><a href="#">Lorem</a></li>
+                 </ul>
+                 <a class="button" href="#">Lorem</a>
+               </div>
+             </div>
+          </article>
+         </div>
+         </section>
+          <footer>
+            <section class="footer-block">
+              <span class="footer-title">Lorem ipsum dolor sit amet</span>
+              <div class="content">
+                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ut nisl ullamcorper, consectetur lectus at, dignissim dolor. Quisque ultrices laoreet lacus non interdum. Donec ut dictum metus.</p>
+              </div>
+            </section>
+            <section class="footer-block">
+              <span class="footer-title">Lorem ipsum dolor sit amet</span>
+              <div class="content">
+                <table>
+                  <tr>
+                    <td class="day">Lorem</td>
+                    <td class="hours">9:00AM - 7:00PM</td>
+                  </tr>
+                  <tr>
+                    <td class="day">Ipsum</td>
+                    <td class="hours">9:00AM - 7:00PM</td>
+                  </tr>
+                  <tr>
+                    <td class="day">Dolor</td>
+                    <td class="hours">9:00AM - 7:00PM</td>
+                  </tr>
+                  <tr>
+                    <td class="day">Sit</td>
+                    <td class="hours">9:00AM - 7:00PM</td>
+                  </tr>
+                </table>
+              </div>
+            </section>
+            <section class="footer-block">
+              <span class="footer-title">Lorem ipsum dolor sit amet</span>
+              <div class="content">
+                <ul>
+                  <li><img src="https://placeimg.com/80/80/animals"></li>
+                  <li><img src="https://placeimg.com/80/80/nature"></li>
+                  <li><img src="https://placeimg.com/80/80/arc"></li>
+                  <li><img src="https://placeimg.com/80/80/people"></li>
+                  <li><img src="https://placeimg.com/80/80/tech"></li>
+                  <li><img src="https://placeimg.com/80/80/animals"></li>
+                  <li><img src="https://placeimg.com/80/80/nature"></li>
+                  <li><img src="https://placeimg.com/80/80/arc"></li>
+                  <li><img src="https://placeimg.com/80/80/people"></li>
+                  <li><img src="https://placeimg.com/80/80/tech"></li>
+                  <li><img src="https://placeimg.com/80/80/arc"></li>
+                  <li><img src="https://placeimg.com/80/80/animals"></li>
+                </ul>
+              </div>
+            </section>
+            <section class="footer-block">
+              <span class="footer-title">Lorem ipsum dolor sit amet</span>
+              <div class="content">
+                <p> Consectetur adipiscing elit. </p>
+                <p> Proin ut nisl ullamcorper </p>
+                <p> Consectetur lectus at, dignissim dolor. </p>
+                <p> Quisque ultrices laoreet lacus non interdum. </p>
+                <p> Donec ut dictum metus. </p>
+              </div>
+            </section>
+          </footer>
         </div>
       </main>
     </div>
diff --git a/src/015-flex/example/reset.css b/src/015-flex/example/reset.css
new file mode 100644
index 0000000..9ff51eb
--- /dev/null
+++ b/src/015-flex/example/reset.css
@@ -0,0 +1,48 @@
+/* http://meyerweb.com/eric/tools/css/reset/ 
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed, 
+figure, figcaption, footer, header, hgroup, 
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font: inherit;
+    vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure, 
+footer, header, hgroup, menu, nav, section {
+    display: block;
+}
+body {
+    line-height: 1;
+}
+ol, ul {
+    list-style: none;
+}
+blockquote, q {
+    quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+    content: '';
+    content: none;
+}
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
\ No newline at end of file