some adjustmetns to styles and template

css/media-queries.css

@@ -432,7 +432,6 @@ div#nav-logo {
    }
 
    .goals-item {
-      max-width: 80%;
       width: 80% !important;
    }
 

css/style.css

@@ -779,54 +779,6 @@ ul#nav li a:hover .ul#nav li ul {
 }
 
 
-/* Goals
-------------------------------------*/
-
-.goals {
-  position: relative;
-  display: flex;
-	display: -webkit-flex;
-	-webkit-flex: 1;
-	flex: 1;
-	-webkit-flex-direction: row;
-	flex-direction: row;
-	-webkit-flex-wrap: wrap;
-	flex-wrap: wrap;
-	-webkit-justify-content: space-between;
-	justify-content: left;
-	-webkit-align-items: flex-start;
-	align-items: flex-start;
-}
-
-.goals-item {
-  position: relative;
-  width: 20% !important;
-  min-width: 300px;
-  min-height: 180px;
-  border: none;
-  box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25);
-  margin: 2% !important;
-  background-color: #ffffff;
-  text-align: center;
-  padding: 1%;
-}
-
-.goals-item-lock {
-  background-color: #e6e6e6;
-}
-
-.goals-item h3 {
-  line-height: 1.2;
-  text-align: center;
-}
-
-.goals h6 {
-  display: inline-block;
-  margin: 0 0 0 2%;
-  padding: 0;
-  font-size: 60%;
-}
-
 /* Mission statement
 --------------------------------------*/
 
@@ -950,40 +902,85 @@ img.transparent {
 /* Goals
 ------------------------------------*/
 
-.goal {
-    color: #555;
-    background-color: #FFF;
-    /*border: 5px double #8EB726;*/
-    border: none;
-    border-radius: 10px;
-    padding: 20px;
-    padding-bottom: 5px;
-    box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25);
-    margin-bottom: 20%;
+#.goal {
+#    color: #555;
+#    background-color: #FFF;
+#    /*border: 5px double #8EB726;*/
+#    border: none;
+#    border-radius: 10px;
+#    padding-bottom: 5px;
+#    box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25);
+#    margin-bottom: 20%;
+#}
+
+.goals {
+  position: relative;
+  display: flex;
+	display: -webkit-flex;
+	-webkit-flex: 1;
+	flex: 1;
+	-webkit-flex-direction: row;
+	flex-direction: row;
+	-webkit-flex-wrap: wrap;
+	flex-wrap: wrap;
+	-webkit-justify-content: space-between;
+	justify-content: left;
+	-webkit-align-items: flex-start;
+	align-items: flex-start;
 }
 
-.goal .center {
+.goals-item {
+  position: relative;
+  width: 28% !important;
+  min-width: 200px;
+  min-height: 180px;
+  border: none;
+  box-shadow: 10px 10px 38px 0px rgba(0, 0, 0, 0.25);
+  margin: 2% !important;
+  color: #555;
+  background-color: #ffffff;
+  padding: 3%;
+}
+
+.goals-item-lock {
+  background-color: #e6e6e6;
+}
+
+.goals-item h3 {
+  line-height: 1.2;
+}
+
+.goals .center {
     text-align: center;
     margin: -1em 0 3em;
 }
 
-.goal .right {
+.goals .right {
     text-align: right;
 }
 
-.goal img {
+.goals img {
     position: relative;
     left: -80px;
-
 }
 
-.goal h2, .goal h4 {
-    line-height: 95%;
+.goals h2 {
+    line-height: 110%;
     margin-bottom: 4%;
+    color:#8EB726;
 }
 
-.goal h6 {
-   font-size: 10px;
+.goals h4 {
+    line-height: 110%;
+    color:#555;
+    font-size: 90%;
+}
+
+.goals h6 {
+  display: inline-block;
+  margin: 0 0 0 2%;
+  padding: 0;
+  font-size: 60%;
 }
 
 .popper {

templates/modular/goals.html.twig

@@ -7,12 +7,12 @@
                    {% for item in page.header.goals %}
                    {% if item.unlock == 'yes' %}
                        <div class="goals-item two columns">
-                       <div class=center style="padding:5%"><span class="popper2">&#127881;</span> UNLOCKED <span class="popper2">&#x1f389;</span> </div>
+                       <div class=center><span class="popper2">&#127881;</span> UNLOCKED <span class="popper2">&#x1f389;</span> </div>
                    {% else %}
                       <div class="goals-item goals-item-lock two columns">
-                      <div class=center>HELP US UNLOCK</div>
+                      <h4 class=center>HELP US UNLOCK<br>THIS GOAL</h4>
                    {% endif %}
-                   <h2 style="color:#8EB726; padding:5%"> {{ item.title }} </h2>
+                   <h2> {{ item.title }} </h2>
                    <p> {{ item.text }} </p>
                    {% if item.option %}
                    {{ item.option }}