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

/* body of the page */
#css-zen-garden {
    background-color: rgb(80, 178, 211);
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    border-left: 10px solid rgb(20, 20, 97);
    border-right: 10px solid rgb(17, 85, 45);
    padding: 3em;
    margin:10px;
}




.page-wrapper {
    border-left: 4px solid rgb(221, 233, 48);
    border-right: 4px solid orange;
    padding: 0px 3em;
}

#zen-intro {
    background-color: rgb(71, 141, 71, 0.8);
    border-radius: 25px;
    padding: 3em;
}


header > h1 {
    background-color: lightgreen;
    border-radius: 25px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 500%;
    margin-bottom: 50px;
}

header > h2 {
    background-color: lightgreen;
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.summary {
    margin: 10px;
}

.preamble > h3 {
    background-color: lightgreen;
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.preamble > p {
    margin: 10px;
}


#zen-supporting {
    background-color: rgb(201, 119, 13, 0.8);
    border-radius: 25px;
    padding: 3em;
}

.explanation > h3 {
    background-color: rgb(243, 206, 106);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.explanation > p {
    margin: 10px;
}

#zen-participation > h3{
    background-color: rgb(243, 206, 106);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.participation > p {
    margin: 10px;
}

#zen-benefits > h3{
    background-color: rgb(243, 206, 106);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.benefits > p {
    margin: 10px;
}

#zen-requirements > h3{
    background-color: rgb(243, 206, 106);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 150%;
}

.requirements > p {
    margin: 10px;
}

footer {
    border: 4px solid rgb(247, 241, 241);
}

#design-selection {
    background-color: rgb(218, 198, 88, 0.8);
    border-radius: 25px;
    padding: 3em;
}

#design-selection > h3{
    background-color: rgb(238, 231, 177);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 200%;
}

nav > ul {
    margin: 10px;
}

#design-archives {
    background-color: rgb(122, 25, 126, 0.8);
    border-radius: 25px;
    padding: 3em;
}

#design-archives > h3{
    background-color: rgb(178, 103, 207);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 200%;
}

nav > ul {
    margin: 10px;
}

#zen-resources {
    background-color: rgb(226, 17, 45, 0.8);
    border-radius: 25px;
    padding: 3em;
}

#zen-resources > h3{
    background-color: rgba(241, 145, 158);
    border-radius: 10px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 200%;
}

nav > ul {
    margin: 10px;
}