diff --git a/css/media-queries.css b/css/media-queries.css index 3e7454a..467c934 100644 --- a/css/media-queries.css +++ b/css/media-queries.css @@ -432,7 +432,6 @@ div#nav-logo { } .goals-item { - max-width: 80%; width: 80% !important; } diff --git a/css/style.css b/css/style.css index dc0e827..2838323 100644 --- a/css/style.css +++ b/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 { diff --git a/templates/modular/goals.html.twig b/templates/modular/goals.html.twig index 62b2ecf..e73f0d4 100644 --- a/templates/modular/goals.html.twig +++ b/templates/modular/goals.html.twig @@ -7,12 +7,12 @@ {% for item in page.header.goals %} {% if item.unlock == 'yes' %}
-
🎉 UNLOCKED 🎉
+
🎉 UNLOCKED 🎉
{% else %}
-
HELP US UNLOCK
+

HELP US UNLOCK
THIS GOAL

{% endif %} -

{{ item.title }}

+

{{ item.title }}

{{ item.text }}

{% if item.option %} {{ item.option }}