body {
    background-color: darkgreen;
}
#header {
    border: 4px white;
    border-top: solid;
    border-bottom: hidden;
    border-left: solid;
    border-right: hidden;
    border-radius: 20px;
    background-color: darkgreen;
    opacity: 80%;
    border-radius: 20px;
    padding: 0px 20px;
    text-align: center; 
    /* text-shadow: 4px 3px black;  */
    color: white;
}
#header a {
    color: white;
    text-decoration: none;
}#header a:hover {
    color: gray;
}

/* Create three unequal columns that floats next to each other */
.column {
    float: left;
    padding: 10px;
  }
  
  /* Left column */
  .column.left {
        width: 40%;
  }
    
  /* Middle column */
  .column.middle {
    width: 40%;
  }

  /* right column */
  .column.right {
    width: 20%;
    float: right;
}
  
  /* Clear floats after the columns */
  .row::after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .column.left, .column.right, .column.middle {
      width: 100%;
    }
}
#serving {
    width: 100%;
    border: solid 4px white;
    border-radius: 20px;
    border-top: solid;
    border-bottom: hidden;
    border-left: solid;
    border-right: hidden;
    background-image: url(assets/mowing.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding:10% 10%;
    color: white;
}
#services {
    /* column-count: 2; */
    border: solid 4px white;
    border-top: solid;
    border-bottom: hidden;
    border-left: solid;
    border-right: hidden;
    border-radius: 20px;
    color:white;
    text-align: center;
    list-style-type: none;
    padding: 0% 10%;

}
#services ul {
    padding: 0;
    list-style-type: none;
}
#about {
    color: white;
    border: solid 4px;
    border-top: solid;
    border-bottom: hidden;
    border-left: solid;
    border-right: hidden;
    border-radius: 20px;
    text-align: center;
}