:root{
    --bg: #d4ee99;
    --accent-bg: #B2C248;
    --text: #287910;
    --text-accent: # ;
    --border: #5539CC ;
}

* {
    box-sizing: border-box;
  }
  
  /* main */
   body, html {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    
   }

   body {
    width: 100%;
    height: 100%;
    align-items: stretch;
    border-style: solid;
    border-color: var(--border);
    background-image: url("https://file.garden/ZghUIuf9jVgn5aMB/assets/redox-01.png");
    margin: 0 auto;
    background-color: var(--bg);
    overflow:auto;
}

   header { 
    background-image: url("https://file.garden/ZghUIuf9jVgn5aMB/assets/arches.png");
    background-repeat: repeat;
    background-color: var(--accent-bg);
    width: 100%; 
    min-height: 100px;
    text-align: center;
    align-content: center;
    border-bottom: var(--border);
    border-bottom-style: dashed;
}

p, h2, h3 {
   color: var(--text);
   padding-left: 2%;
   padding-right: 2%;
}

p {
 text-align: left;
 font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 font-size: 18px;
}

h1, h2, h3 {
  text-align: center;
  font-family: "Cooper", serif;
}

#toptext {
  font-size: 30px;
  color: var(--border);
}

img {
    width: 50%; 
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5%;
    border: var(--border);
    border-style: outset;
}

@media screen and (max-width: 900px) {

img {
  width: 90%;
}

p, h2, h3 {
  margin-left: 4%;
  margin-right: 4%;
}

p {
  text-align: justify;
}

  }