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

body {background-color: #badae5;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0;}

h1 {position: absolute;
    top: -1000px;}

header {background-color: #ffffff;}

img {display:block;
	width:100%;
	height:auto;
	margin:0 auto;
	padding:0;}

#logo {max-width: 280px;
        margin: 0;
        padding: 1.2rem;}

p {font-family: 'Poppins', sans-serif;
    max-width: 75ch;}

h2 {font-family:'Quicksand', sans-serif;
    padding-bottom: 1rem;}

h3 {font-family: 'Poppins', sans-serif;
    margin: 0 auto;}

h4 {font-family:'Quicksand', sans-serif;}

nav {width: 100%;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;}


nav ul {list-style-type: none;
        font-family: 'Quicksand', Arial, sans-serif;
        font-size: 2rem;
        max-width:390px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 0;
        display: flex;}

nav ul a:hover {color: #99c199;}

nav ul li { list-style: none;
            position: relative;
            z-index: 2;}

nav ul li a { display: block;
                color: #000000;
                font-size: 1.1rem;
                padding:30px 10px 14px;
                text-decoration: none;}

nav ul li ul {display: none;
                position: absolute;
                background-color: #ffffff;
                padding: 10px;
                border-radius: 0px 0px 2px 2px;}

nav ul li:hover ul {display: block;}

nav ul li ul li {width: 175px;
                border-radius: 4px;}

nav ul li ul li a {padding: 8px 10px;}

nav ul li ul li a:hover {background-color: #99c199;
                            color: #000000;}

.active {color: #99c199; }

.banner {max-width: 100%;
        height: 400px;
        margin: 0 auto;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 2rem;}

#infoblock1 {background-color: #ffffff;}

#infoblock2 {background-color:#ffffff;}

.infoblock3 {background-color: #ffffff;}

#infoblock4 {background-color: #F9F7EE;
                margin-bottom: -1rem;}

#infoblock5 {background-color:#F9F7EE;}

#maincontent {background-color: #F9F7EE;}

#maincontent h2 {text-align: center;
                    padding-top: 1.5rem;}


.mission h2 {max-width: 65ch;
                font-size: 1.2rem;
                font-weight: normal;
                margin: 0 auto;
                text-align: center;}

.mission {display: block;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 2rem;
            border: 1.5px solid #000000;
            border-radius: 25px;
            background-color: #BAD9B7;
            max-width: 800px;
            padding: 2.5rem;}

#maincontent p {max-width: 65ch;
                    margin: 0 auto;
                    padding-top: 2rem;}

#infoblock2 h3 {padding: 2rem;}

#infoblock2 h3 a {text-decoration: none;
                    color: #000000;}

#infoblock2 h3 a:hover {color: #20638E; }


.buttons {display:flex;
            align-items: flex-start;
            justify-content: center;
            padding: 1rem;}

.button {font-family: 'Poppins', sans-serif;
            align-content: center;
            background-color: #BAD9B7;
            border: .75px solid;
            border-radius: 25px;
            color: #000000;
            font-weight:500;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
                display: inline-block;
                font-size: 16px;
                margin: 10px 10px 10px;
                    cursor:pointer;}

.button:hover {box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);}

.about {max-width:1200px;
            margin: 0 auto;
            padding:3rem;
            margin-top: -2rem;
            display:flex;
            align-items:flex-start;
            background-color:#F9F7EE;}

.about img {max-width: 600px;
                margin-top:0;}

.abouttext h2 {color:#20638E;
                margin-top:0;
                font-size:1.5rem;
                text-align: left;
                padding-left: 3rem;}

.abouttext p {margin-top: 0;
                padding-left: 3rem;}

.statement {max-width:1200px;
            margin: 0 auto;
            padding:3rem;
            margin-top: -2rem;
            display:flex;
            align-items:flex-start;
            background-color: #F9F7EE;}

.statement img {max-width: 450px;
                margin-top:0;}

.statementtext h2 {color:#20638E;
                margin-top:0;
                font-size:1.5rem;
                padding-left: 0;}

.statementtext p {margin-top: 0;
                    max-width: 60ch;
                    padding-left: 0;}

.resources {max-width:1200px;
            margin: 0 auto;
            padding:3rem;
            display:flex;
            align-items:flex-start;
            background-color: #F9F7EE;}

#infoblock4 h2 {color:#20638E;}


#infoblock5 h2 {text-align: center;
                color:#20638E;
                padding: 0;
                margin: 0;}

#infoblock3 h2 {text-align: center;
                margin-top: 0;
                padding-bottom: .5rem;}

#infoblock4 h2 {text-align: center;
                margin: 0;
                padding-bottom: 1rem;}

#infoblock4 p {font-size: .80rem;
                font-style: italic;
                margin-left: 2rem;
                padding: 1rem;}

.resources h3 {text-align: left;
                padding-left: 2rem;}

.resources img {max-width: 700px;
                margin-top:0;}

.resourcestext p {margin-top: 0;
                padding-left: 2rem;}

#plasticp ul {list-style: none;}

#plasticp li a {text-decoration: none;
                font-family: 'Poppins', sans-serif;}

#plasticp li a:hover {text-decoration: underline;}

#plasticp a:link {color: #000000;}
#plasticp a:visited {color: #20638E;}
#plasticp a:hover {color: #99c199;
                    text-decoration: underline;}

dl {font-family:'Quicksand', sans-serif;
    font-weight: 700;
    margin-left: 7rem;
    padding-bottom: 1rem;}

dd {font-family: 'Poppins', sans-serif;
    font-size: .90rem;
    margin-top: 1rem;
    max-width: 75ch;}

.productnav {margin: 0;
                padding: 0;
                font-family:'Poppins', Arial, sans-serif;}

.productnav ul {margin: 0;
                padding: 1rem;
                background-color:#20638E;
                display: flex;}

.productnav ul li {list-style: none;
                    text-align: center;
                    display: block;
                    border-right: 1px solid #ffffff;}

.productnav ul li:last-child {border-right: none;}

.productnav ul li a {text-decoration: none;
                    padding: 0 45px;
                    display: block;}

.productnav ul li a .icon {width: 40px;
                            height: 40px;
                            text-align: center;
                            margin: 0 auto 10px;}

.productnav ul li a .icon .fa {width: 100%;
                                height: 100%;
                                line-height: 45px;
                                font-size: 22px;
                                color: #ffffff;}

.productnav ul li a .icon .fa:hover {color:#99c199;}

.productnav ul li a .name {font-size: 15px;
                                    display: block;
                                    position: relative;
                                    color: #ffffff;}

.productnav ul li a .name:hover {color:#99c199;}

#rowofcontent{ max-width:1200px;
	           margin:0 auto;
                background-color: #F9F7EE;}

#rowofcontent h2 {margin: 0;
                    padding: 0;
                    text-align: center;
                    padding: 2rem;
                    color: #20638E;}

#content {display:flex;
	       flex-wrap:wrap;}

#infoblock2 h3 {text-align: center;}

.contentbucket { margin:1.5rem;
	               padding:1rem;
	               outline:1px solid #20638E;
	               background-color:white;
	               flex-grow: 1;
	               flex-shrink: 0;
	               flex-basis: 200px;
	               box-shadow: 5px 4px 4px silver;}

.contentbucketmain { margin: 3rem;
	               padding: 1rem;
	               outline:1px solid #20638E;
	               background-color:white;
	               flex-grow: 1;
	               flex-shrink: 0;
	               flex-basis: 200px;
	               box-shadow: 5px 4px 4px silver;}

.contentbucketmain img { width:100%;
	                   display:block;}

.contentbucket img { width:95%;
	                   display:block;}

.iteminfo h3 { font-size:1rem;
	           margin:0;}

.iteminfo p { margin-top:0;
                text-align: center;
                font-size: .85rem;}

.iteminfo p a:hover {color:#99c199;}

.itemInfo h3 { font-size:1rem;
	           margin:0;
	           padding-top:1rem;
                text-align: center;}

.itemInfo p { margin-top:0;
                text-align: center;
                font-size: .85rem;
                padding-top: 1rem;}

.itemInfo p a:hover {color:#99c199;}

.buy a:hover { color:#99c199;}

.buy a:visited {color: #20638E; }

#affiliate {font-style:italic;
            font-size: .80rem;
            max-width: 80ch;
            margin: 0 auto;
            padding: 2rem;}


footer {background-color: #20638E;
        padding: 1rem;
        font-family: 'Quicksand', Arial, sans-serif;
        font-weight: normal;
        color: #ffffff;}

.footer-container {display: flex;
                    max-width:700px;
                    margin: 0 auto;
                    flex-wrap: wrap;
                    justify-content: space-between;}

.footer h3 {margin-bottom: 1rem;
            margin-top: 1rem;}

.footer a {display:block;
            color: #ffffff;
            text-decoration: none;
            margin-bottom: 0.5rem;}

.footer a:hover {color:#99c199;
                    transition: 0.3s ease-out;
                    text-decoration: underline;}


footer p {  font-family: 'Poppins', Arial, sans-serif;
            font-style: italic;
            font-size: .80rem;
            text-align: center;
            padding-top: 3rem;
            margin: 0 auto;}