@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100;200;300;400;500;600;700;800;900&display=swap');

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: #302e2f;
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: 'Lexend', sans-serif;
}

header {
    background-color: #4d5285;
    width: 100%;
    text-align: center;
    color: whitesmoke;
    padding: 20px 20px 40px;
}


main {
    background-color: #0f0e0e;
    width: 100%;
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

footer {
    background-color: #4d5285;
    text-align: center;
    width: 100%;
    color: whitesmoke;
    padding: 10px 20px 30px;
}

h1 {
    color: whitesmoke;
    font-size: 2em;
}

nav {
    color: whitesmoke;
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    flex-flow: wrap;
}

/* main background image */
#greentrees1 {
    width: 100%;
    background: url("../images/forest-sunbeams-trees-sunlight-70365.jpeg") no-repeat center/cover;
    position: relative;
    background-attachment: fixed;
}

/*guide background*/
#med-guide {
    height: 600px;
    width: 100%;
    background: url("../images/pexels-engin-akyurt-3331574.jpg") no-repeat center/cover;
    position: relative;
    background-attachment: fixed;
}

/*practic background*/
#practice-guide {
    height: 600px;
    width: 100%;
    background: url("../images/trees.jpeg") no-repeat center/cover;
    position: relative;
    background-attachment: fixed;
}

#form2 {
    background-color: #4d5285c4;
    width: 50%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
    align-items: center;
    padding: 20px 20px 40px;
    margin: 10px;
    color: whitesmoke;
    max-width: 80rem;
}

.section-main {
    background-color: #4d5285c4;
    width: 70%;
    text-align: center;
    display: inline-block;
    padding: 20px 20px 40px;
    margin: 10px;
    color: whitesmoke;
}

.section-main-guide {
    background-color: #4d5285c4;
    width: 70%;
    text-align: left;
    display: inline-block;
    padding: 40px 40px 40px;
    margin: 10px;
    color: whitesmoke;
}

#box-calm {
    background-color: #4d5285c4;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px 20px 40px;
    margin: 10px;
    color: whitesmoke;
    max-width: 30rem;
}

#freeguide {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#freeguide fieldset {
    width: 100%;
    max-width: 30rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#freeguide fieldset a {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#freeguide fieldset a img {
    width: 100%;
    object-fit: contain;
    padding: 1em;
}

.footer-info {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 50px;
}

.links {
    color: whitesmoke;
    text-transform: uppercase;
}

a:hover {
    color: whitesmoke;
}

ul {
    list-style: none;
}


video {
    width: 100%;
}

#aside {
    background-color: #4d5285c4;
    width: 70%;
}