From 6852fe8642d0c53362d075e92bf51b056788ebc8 Mon Sep 17 00:00:00 2001
From: Laura Alvarez <laura.alvare@talosdigital.com>
Date: Tue, 23 Oct 2018 16:45:27 -0500
Subject: [PATCH 1/2] bootstrap exercise completed

---
 src/016-bootstrap/example/example.css | 104 +++++++++++++++++++++++++-
 src/016-bootstrap/example/index.html  |   4 +-
 2 files changed, 105 insertions(+), 3 deletions(-)

diff --git a/src/016-bootstrap/example/example.css b/src/016-bootstrap/example/example.css
index 44f6d8d..3c4372e 100644
--- a/src/016-bootstrap/example/example.css
+++ b/src/016-bootstrap/example/example.css
@@ -1,5 +1,107 @@
 /*
  * Practice : Bootstrap and Material Column System
  * Version: 1
- * By: xxx
+ * By: Laura Alvarez
  */
+ .container {
+ 	padding: 0;
+ }
+
+ .display-3 {
+ 	font-size: 5.5rem;
+ }
+
+ .jumbotron.jumbotron-fluid .container {
+ 	padding: 0 15px;
+ }
+
+ .lead {
+ 	font-size: 1.5rem;
+ }
+
+ h3 {
+ 	font-size: 1.1rem;
+ 	line-height: 20px;
+ }
+
+ .bg-faded {
+ 	background-color: rgb(247, 247, 247);
+ }
+
+ .row {
+ 	display: flex;
+ 	justify-content: space-around;
+ }
+
+ .items {
+ 	width: 100%;
+ }
+
+ .float-left {
+ 	padding-left: 10px;
+ }
+
+ .float-left.block p {
+ 	margin-bottom: 0;
+ }
+
+ .float-left.block a, .card-block a{
+ 	color: rgb(247, 167, 82);
+ }
+
+ .sec-section .card:not(:first-child){
+ 	margin-top: 10px;
+ }
+
+ .list-group-item button {
+ 	border: transparent;
+ 	padding: 0;
+ }
+
+ .sec-section {
+ 	width: 100%;
+ }
+
+ .sec-section .card {
+ 	margin: 0 15px;
+ }
+
+ .card-block button, .card-footer button {
+ 	background-color: rgb(247, 167, 82);
+ 	color: white;
+ }
+
+ .card-group .card {
+ 	margin: 0 15px;
+ }
+
+ .card-group .card:first-child {
+ 	margin-top: 10px;
+ }
+
+ @media only screen and (min-width: 576px) {
+ 	.card-group .card:first-child {
+ 		margin-top: 0;
+ 	}
+
+ 	.card-group .card + .card {
+ 		margin-left: 15px;
+ 		border-left: 1px solid rgba(0,0,0,.125);
+ 	}
+ }
+
+ @media only screen and (min-width: 768px) {
+ 	.items {
+ 		width: 55%;
+ 	}
+
+ 	.sec-section {
+ 		width: 40%;
+ 	}
+ }
+
+ @media only screen and (min-width: 1200px) {
+ 	.card-group .card {
+ 		margin-bottom: 15px;
+ 	}
+ }
\ No newline at end of file
diff --git a/src/016-bootstrap/example/index.html b/src/016-bootstrap/example/index.html
index aef5148..5a0b0bb 100644
--- a/src/016-bootstrap/example/index.html
+++ b/src/016-bootstrap/example/index.html
@@ -72,7 +72,7 @@ <h1 class="display-3">Talos Travel</h1>
           </div>
         </nav>
         <div class="row">
-          <div>
+          <div class="sec-section">
             <div class="card">
               <div class="card-block">
                 <h3 class="card-title">What are you looking?</h3>
@@ -140,7 +140,7 @@ <h3 class="card-header">Searching for something in particular?</h3>
           </div>
 
 
-          <div>
+          <div class="items">
             <div class="card-group">
               <div class="card margin-left">
                 <img class="card-img-top" src="https://placeimg.com/250/350/arch" alt="Card image cap">

From 15e85c1e904147eceaac91d3e28a2cef3f5900e9 Mon Sep 17 00:00:00 2001
From: Laura Alvarez <laura.alvare@talosdigital.com>
Date: Tue, 23 Oct 2018 20:30:18 -0500
Subject: [PATCH 2/2] updating width for card-images

---
 src/016-bootstrap/example/example.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/016-bootstrap/example/example.css b/src/016-bootstrap/example/example.css
index 3c4372e..bd9f804 100644
--- a/src/016-bootstrap/example/example.css
+++ b/src/016-bootstrap/example/example.css
@@ -92,7 +92,7 @@
 
  @media only screen and (min-width: 768px) {
  	.items {
- 		width: 55%;
+ 		width: 60%;
  	}
 
  	.sec-section {