@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&display=swap');


body { font-family: 'Poppins', sans-serif; text-align: center; background-color: black}
header { float: left; width: 100%; background-color: #1ec15a; margin-bottom: 30px }
h1 { font-weight: bold; margin-top: 10px; padding-bottom: 0; margin-bottom: 0; }
h4 { font-weight: normal; font-size: 20px; padding: 0; margin: 0; margin-bottom: 15px; }
img.logo { width: 100px; border-radius: 20px; margin-top: 25px; }

.sub-header { background-color: #1c1c1c; color: black; padding: 20px 0; }
.sub-header a { text-decoration: none; color:white; font-weight: normal; font-size: 15px; padding: 10px 15px;
    border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px }
.sub-header a:hover { background-color: rgb(17, 151, 67) }
.sub-header a.store { border:1px solid rgb(17, 151, 67); }

.container { text-align: center; padding-top: 30px }
.container .p { width: 60%; text-align: left; margin: 30px auto 30px auto; font-weight: 300; font-size: 15px; }

footer { text-align: center; margin-left: auto; margin-right: auto; background-color: #1c1c1c; padding: 30px 0; color:white }
footer a { color: white; text-decoration: underline }

b { font-weight: 400; }
.image-area img { width: 300px; }
p { color: white }

@media(max-width: 500px) {
    .sub-header a { display: block }
    .sub-header { padding: 0; }
    .container .p { width: 95%; }
}