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

/* COLOR */
.header-bcolor { background-color: #b5ece6; }
.header-color { color: #b5ece6; }
.sub-bcolor { background-color: rgb(0, 0, 46); }
.sub-color { color: rgb(0, 0, 46); }
/* COLOR */

.sub-header a:hover { background-color: rgb(14, 183, 165); }
.sub-header a.store { border:1px solid rgb(14, 183, 165); }

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

.sub-header { color: white; 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 }

.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; padding: 30px 0 }

b { font-weight: 700; }
.image-area img { width: 300px; }

@media(max-width: 500px) {
    .sub-header a { display: block }
    .sub-header { padding: 0; }
    .container .p { width: 95%; }
    .sub-header a.store { border-left: none; border-right: none;
        border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0 }
}