<!DOCTYPE html> ForeverYoungBodyMind body { background: #FBC7F7; } button { background: #FB7AFC; border: 1px solid rgb(45, 95, 95); border-radius: 30px; box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.3); color: rgb(173, 233, 233); display: block; font-size: 18px; margin: 5px auto; padding: 10px 25px; transition: all 200ms ease-in-out; } button:hover { background: #FBC7F7; color: rgb(45, 95, 95); cursor: pointer; } h1 { display: block; background: #FE9898; background: linear-gradient(15deg, #4f97a4 0%, #FFF338 100%); box-shadow: Purple; color: #C400FF; margin: 20px auto 10px auto; padding: 15px 25px; text-decoration: solid; text-align: center; position: relative; } h2 { text-align: center; margin: 20px auto 5px; } h3 { margin: 10px 0 1px; padding: 0px; text-align: center; } h4 { text-align: center; } li { list-style: none; text-align: center; padding: 1px 0; border-radius: 10px; transition: all 200ms ease-in-out; max-width: 450px; margin: 0 auto; } li:hover { background: #4f97a4; color: rgb(201, 245, 245); } span:hover { background: #4f97a4; color: rgb(201, 245, 245); font-style: italic; } .img-top { background: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); border-radius: 4px; border: 0px solid rgb(45, 95, 95); color: #63d2c5; display: block; margin: 0 auto; padding: 10px 5px; width: 35%; } .img-center { background: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); border-radius: 4px; border: 0px solid rgb(45, 95, 95); color: #63d2c5; display: block; margin: 0 auto; padding: 5px 5px; width: 35%; filter: brightness(105%); filter: contrast(110%); filter: saturate(110%); } .img-down { background: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); border: 0px solid rgb(45, 95, 95); border-radius: 4px; color: #63d2c5; display: block; margin: 0 auto; padding: 0px 0 0px 10px; width: 45%; } .topic { background-color: rgba(70, 175, 175, 0.9); background: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); color: rgb(189, 247, 247); max-width: 50%; padding: 10px 10px; text-decoration: underline; text-align: center; } .me { background: linear-gradient(15deg, #13547a 0%, #80d0c7 100%); color: rgb(189, 247, 247); text-decoration: none; text-align: center; } .container { max-width: 75%; display: block; margin: 5px auto 10px; padding: 5px 50px; } .missions { background-color: rgba(70, 175, 175, 0.9); display: block; list-style: none; line-height: 1; text-align: center; padding: 10px 10px; border-radius: 10px; transition: all 200ms ease-in-out; max-width: 350px; margin: 5px auto; } .missionGreen { background-color: rgba(70, 175, 175, 0.9); display: block; list-style: none; line-height: 1; text-align: center; padding: 10px 10px; border-radius: 10px; transition: all 200ms ease-in-out; max-width: 350px; margin: 5px auto; color: #053b1e; } .check { margin: 30px auto 32px auto; padding: 15px 15px; } .alzheimercentrum { color: rgb(173, 233, 233); margin: 10px auto; text-decoration: none; } .contact { background-color: #FFF338; background: linear-gradient(15deg, #13547a 0%, #FFF338 100%); border: 1px solid #0CECDD; display: block; list-style: none; line-height: 1; text-align: center; font-size: 18px; padding: 10px 20px; border-radius: 10px; transition: all 200ms ease-in-out; max-width: 170px; margin: 20px auto; }
FOREVER YOUNG BODY & MIND
Check inCall me
<h2 class="topic">
How and why?
</h2>
<h3>Ways to slow down aging</h3>
<img
class="img-top"
src="https://alz.org.sg/wp-content/uploads/2017/11/ADA-Website-5-Ways.png"
/>
<h3>Different forms of dementia</h3>
<img
class="img-center"
src="https://pharmaceutical-journal.com/wp-content/uploads/2021/03/Figure-2-Proportions-of-people-with-different-forms-of-dementia.png"
/>
<h3>Importance to act NOW</h3>
<div class="container">
<img
class="img-down"
src="https://www.alzint.org/u/numbers-people-with-dementia.png"
/>
<button>
<a
href="https://www.alzint.org"
target="_blank"
>
More information HERE
</a>
</button>
</div>
<h2 class="topic">TOOLS</h2>
<span class="missionGreen">--> For ever young<strong>TEST</strong> <--
</span>
<button>
<a href="https://www.alzheimer-nederland.nl/geheugentest"
target="_blank">
Let's TALK
</a>
</button>
<span class="missions">---> Move your <strong>BODY</strong> <---
</span>
<button>
<a href="https://www.google.com/maps/place/Flevopark,+Amsterdam/@52.3598131,4.9476344,17z/data=!3m1!4b1!4m5!3m4!1s0x47c6094182b08d73:0x6a8ec11c25cdee02!8m2!3d52.3598131!4d4.9498231"
target="_blank">
Where do we meet? In FLEVOPARK near the RABBIT
</a>
</button>
<span class="missions">---> Check your <strong>HEART</strong> <---
</span>
<button>
<a href="https://www.hollandhealthclinic.com/health-check/?gclid=Cj0KCQjw3f6HBhDHARIsAD_i3D9uJzj0M5FFRpjiX51AlMOzqUffwtY6u9SU1wUv8mKV0EmVFhf-dUwaAmtGEALw_wcB"
target="_blank">
Check it HERE
</a>
</button>
<span class="missions">---> Mind <strong>FOOD</strong> <---
</span>
<button>
<a href="https://www.voedingscentrum.nl/Assets/Uploads/voedingscentrum/Documents/Professionals/Pers/Factsheets/English/Fact%20sheet%20The%20Wheel%20of%20Five.pdf"
target="_blank">
Food advises
</a>
</button>
<span class="missions">---> Let's <strong>TALK</strong> <---
</span>
<button>
<a href="https://replika.ai"
target="_blank">
Talk to me
</a>
</button>
<span class="missions">
---> For your <strong>MIND</strong> <---
</span>
<button>
<a href="https://www.azlyrics.com"
target="_blank">
Sing with me
</a>
</button>
<ul>
<li>
<h3>Listen to a poem</h3>
When You Are Old BY WILLIAM BUTLER YEATS</br>
</li>
<li>
<h3></h3>
When you are old and grey and full of sleep, </br>
And nodding by the fire, take down this book, </br>
And slowly read, and dream of the soft look, </br>
Your eyes had once, and of their shadows deep;
</li>
<li>
<h3></h3>
How many loved your moments of glad grace, </br>
And loved your beauty with love false or true, </br>
But one man loved the pilgrim soul in you, </br>
And loved the sorrows of your changing face;
</li>
<li>
<h3></h3>
And bending down beside the glowing bars, </br>
Murmur, a little sadly, how Love fled, </br>
And paced upon the mountains overhead, </br>
And hid his face amid a crowd of stars"
</li>
</ul>
<button>
<a
href="https://www.alzheimercentrum.nl/patienten/contact/"
target="_blank"
class="alzheimercentrum"
>
Get help
</a>
</button>
<script>
function contact() {
let feel = prompt("How are you today?");
let h4 = document.querySelector("h4");
if (feel = "good") {
h4.innerHTML = "<br/>Let's go out!";
} else {
h4.innerHTML = "<br/>Call my dearest one:" + " "
"06 49 54 09 15";
}
}
let checkButton = document.querySelector("button");
checkButton.addEventListener("click", contact);
</script>
Log in or sign up for Devpost to join the conversation.