body {color: #00bf63;
    font-family: "Alumni Sans Pinstripe", sans-serif}

h1 {color: #000000;
    font-family: "Alfa Slab One", sans-serif;
    font-size: 50px}

header {background-image:url(images/headerbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 200px;
        width: 100%;
        display: flex;
        align-items: center;
        gap: 2em}

.header-text {display: flex;
                flex-direction: column;
                justify-content: center}

h2 {color: #00167a;
    font-family: "Alumni Sans Pinstripe", sans-serif;
    font-size: 40px;
    font-weight: 700;
    margin-left: 610px;
    padding-top: 60px}

h3 {font-family: "Story Script", sans-serif;
    font-weight: 300;
    font-size: 45px;
    color: #000000;
    margin-left: 260px;
    margin-top: 35px;
    z-index: 10}

h4 {font-family: "Oswald", sans-serif;
    font-weight: 200;
    font-size: 25px;
    color: #38b6ff;
    margin-left: 700px}

h5 {font-weight: 900;
    font-weight: bold;
    font-size: 25px;
    color: #017e41ff;
    text-shadow: 1px 1px 1px #017e41ff;
    font-family: "Alumni Sans Pinstripe"}

h6 {font-family: "Story Script", sans-serif;
    font-weight: 300;
    font-size: 30px;
    color: #000000}

p {color: #00bf63;
    font-weight: 200;
    font-size: 20px;
    font-family: "Oswald"}

nav {margin-left: 150px;
    margin-top: 25px;
    font-family: "Oswald", sans-serif;
    color: #ffffff;
    font-weight: 200}

nav a {text-decoration: none;
        color: #ffffff;
        text-shadow: 1px 1px 1px #00167a;
        font-family: "Alumni Sans Pinstripe", sans-serif;
        font-weight: 600;
        font-size: 30px;
        margin-right: 70px}

section {padding: 0 0.5em 0 0.5em}

img {float: left}

nav a:link {color: #ffffff}
nav a:visited {color: #00167a}
nav a:hover {color: #38b6ff}

main {background-image:url(images/fight2.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        height: 500px;
        width: 100%;
        color: #38b6ff;
        text-shadow: 1px 1px 1px black}

footer {text-align: center;
        font-weight: bold;
        font-size: 25px}

#wrapper {width: 95%;
            margin-left: auto;
            margin-right: auto;
            padding: 0.25em;
            margin-top: 1em;
            margin-bottom:1em}

.logo {color: #38b6ff;
        font-family: "Oswald";
        font-size: 25px;
        font-weight: 300;
        margin-left: 10em;
        margin-top: 10px;
        margin-bottom: 20px;
        text-shadow: 1px 1px 1px white}

button {background-color: #38b6ff;
        margin-left: auto;
        color: #1670f0;
        border-radius: 3px;
        font-family: "Oswald", sans-serif;
        font-weight: 200;
        font-size: 20px;
        margin-right: 35px;
        margin-top: 130px;
        box-shadow: 1px 1px 1px black}

button a {text-decoration: none}

.columns {display: flex;
        justify-content: space-between;
        gap: 20px;
        margin-top: 20px;
        margin-left: 50px;
        margin-right: 50px}

.thankyou {background-image: url(images/signupbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 200px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-items: center;
        gap: 0px;
        box-sizing: border-box;
        padding-top: 2em;
        padding-bottom: 5em}

.thankyou h2 {font-size: 40px;
            margin: 0px;
            padding-top: 1.5em;
            padding-bottom: 0em}

.thankyou h5 {font-size: 30px;
            margin:0}

.thankyou .columns {display: flex;
                    gap: 10em;
                    flex-wrap: wrap;
                    justify-content: center}

.columns section {flex: 1;
                padding: 20px;
                border-radius: 5px;
                text-align: center}

#glaciertext {background-image: url(images/glacier.jpg);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                height: 500px;
                width: 96.5%;
                position: relative;
                box-shadow: 1px 1px 25px #38b6ff;
                display: flex;
                justify-content: flex-end;
                align-items: flex-end;
                padding: 25px}

#glaciertext p {position: static;
                color: #000000;
                padding: 15px;
                max-width: 550px;
                border-radius: 8px;
                font-size: 25px;
                font-weight: 200}

.signup {background-image: url(images/signupbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 400px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 15px;
        box-sizing: border-box;
        padding: 20px;
        padding-bottom: 2em}

.signup h2 {font-size: 35px;
            color: #00167a;
            margin: 0 0 0 0;
            text-align: center}


.signup .field label{text-align: right;
                    width: 30%;
                    color: #000000}

.signup .field {display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 5px;
                width: 100%;
                margin-bottom: 20px;
                color: #000000}

.signupbutton {background-color: #38b6ff;
        margin-left: auto;
        color: #1670f0;
        border-radius: 3px;
        font-family: "Oswald", sans-serif;
        font-weight: 200;
        font-size: 20px;
        box-shadow: 1px 1px 1px black;
        text-decoration: none;
        margin-bottom: 20px}



.signup input[type="text"],
.signup input[type="email"] {padding: 5px;
                font-size: 20px;
                width: 300px;
                border-radius: 5px;
                border: 1px solid #ccc;
                box-sizing: border-box;
                text-align: center;
                margin-bottom: 20px}

.signup .consent input[type="checkbox"] {margin-left: 50px}

.signup .consent {display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 20px;
                    justify-content: center;
                    font-size: 20px;
                    padding-bottom: 1em;
                    color: #000000}

ul {list-style-type: square;
    margin-left: 350px;
    padding-top: 2em;
    padding-bottom: 5em}

li {color: #017e41ff;
    font-weight: 200;
    font-size: 20px;
    font-family: "Oswald";
    margin-bottom: 1em}

.contactwrapper {display:flex;
                align-items: flex-start;
                gap: 40px;
                width: 100%;
                justify-content: center;
                margin-top: 40px;
                background-color: #aadaf6ff}

.contact img {width: 300px;
                height: auto;
                border-radius: 10px}


.contact {width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-top: 80px}

.contact h3 {margin-left: 0;
                margin-bottom: 50px;
                font-size: 60px}

.contact form {display: flex;
                flex-direction: column;
                gap: 15px}
    
.contact .field {margin-bottom: 30px}

.contact .field p {display: flex;
                    align-items: center;
                    justify-content: flex-start;
                    gap: 15px;
                    margin: 0}

.contact .field label {width: 100px;
                        text-align: right;
                        color: #017e41ff;
                        font-size: 25px}

.contact .field input {padding: 5px;
                        width: 200px}

.contact .field textarea {width: 250px;
                            height: 150px;
                            padding: 6px;
                            resize: vertical}

.contactbutton {background-color: #38b6ff;
        margin-left: auto;
        color: #1670f0;
        border-radius: 3px;
        font-family: "Oswald", sans-serif;
        font-weight: 200;
        font-size: 20px;
        box-shadow: 1px 1px 1px black;
        text-decoration: none;
        margin-bottom: 20px}

#landingwrapper {display: flex;
                align-items: center;
                gap: 20px;
                width: 100%;
                padding: 20px}

.landing h3 {margin-left: 50px;
            margin-bottom: 30px}

.landing {display: flex;
            flex-direction: column;
            margin-left: 10px}

.landing p {margin-left: 100px}

.download {display: flex;
            align-items: center;
            gap: 40px;
            padding: 20px;
            margin-left: 150px;
            flex-direction: row-reverse}

.download img {margin-right: 80px}

.downloadright {display: flex;
                flex-direction: column;
                align-items: center;
                margin-left: 0;
                margin-right: 180px}

.downloadright h2 {font-size: 60px;
                    margin-bottom: 20px;
                    margin-left: 80px}

.downloadform {display: flex;
                align-items: center;
                gap: 15px;
                margin-left: 80px}

.downloadform label {font-weight: bold;
                    color: #017e41ff;
                    font-size: 30px}

.downloadform input[type="email"] {padding: 8px;
                                    font-size: 1rem;
                                    margin-left: 10px;
                                    margin-right: 10px}

.downloadbutton {background-color: #38b6ff;
        color: #1670f0;
        border-radius: 3px;
        font-family: "Oswald", sans-serif;
        font-weight: 400;
        font-size: 20px;
        box-shadow: 1px 1px 1px black;
        cursor: pointer}

#downloadwrapper {background: url(images/signupbackground.jpg);
                    background-size: cover;
                    background-repeat: no-repeat;
                    height: 450px;
                    width: 100%}

.newswrapper {background-image: url(images/signupbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 700px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 15px;
        box-sizing: border-box;
        padding: 10px;
        padding-bottom: 2em}

.newswrapper a {font-family: "Oswald", sans-serif;
                color: #00167a;
                text-decoration: underline;
                font-size: 20px;
                font-weight: 200}
.newswrapper a:visited {color: #38b6ff}
.newswrapper a:hover {font-weight: bold}
.newswrapper h6 {margin-top: 35px}

.everyday {background-image: url(images/signupbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 1100px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 15px;
        box-sizing: border-box;
        padding: 10px;
        padding-bottom: 2em;
        display: grid;
        grid-template-columns: repeat(2, 400px);
        gap: 15rem;
        justify-content: center;
        align-items: start;
        padding: 20px;
        box-sizing: border-box}

.everyday ol {list-style-type: decimal;
                margin-left: 30px}

.everyday li {font-family: "Oswald", sans-serif;
                color: #00167a;
                font-size: 20px;
                font-weight: 200}

.everyday h6 {margin-bottom: 20px;
                margin-top: 20px}
.everyday h5 {margin-left: 0;
                margin-bottom: 0.5rem}

.everydaycolumns {column-count: 1}

.everydaycolumns h5,
.everydaycolumns h6,
.everydaycolumns ol,
.everydaycolumns li {break-inside: avoid-column}

.productswrapper {background-image: url(images/signupbackground.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        height: 3100px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 15px;
        box-sizing: border-box;
        padding: 10px;
        padding-bottom: 2em}

.productswrapper a {font-family: "Oswald", sans-serif;
                color: #00167a;
                text-decoration: none;
                font-size: 20px;
                font-weight: 200}
.productswrapper a:visited {color: #38b6ff}
.productswrapper a:hover {font-weight: bold}
.productswrapper h6 {margin-top: 35px}

.brand {display: flex;
        align-items: center;
        gap: 6px}