body {
    margin: 0;
    padding: 0;
    min-width: 500px;
    contain: content;
}
/* -----((( HEADER )))----- */
.header-container-for-background {
    background-color: black;
  }
  header {
    text-align: center;
    max-height: 250px;
    margin: 0 auto;
    padding: 0 auto;
    contain: content;
  }
  header img {
    max-height: 200px;
  }
/* ----- Nav ----- */
nav {
    display: block;
    margin: 0;
    padding: 10px 0;
}
nav ul {
display: flex;
    justify-content: space-around;
    list-style: none; 
    margin: auto;
    padding: 0%;
    width: 80%;
}
nav ul .li-first {
    padding-left: 10px;
}
nav ul li {
    font-weight: 550;
    text-align: center;
}
nav ul .li-last {
    padding-right: 20px;
}
nav ul li a {
    text-decoration: none;
    color: rgb(207, 204, 0);
    font-weight: 550;
    margin: 0;
}
/* -----((( ANOUNCEMENT )))----- */
.announcement {
    display: block;
    background-color: rgb(228, 0, 0);
    margin: 0;
    padding: 0.7em;
    max-height: 48px;
    font-size: 0.9em;
    font-weight: 600;
    text-align: center;
    color: rgb(238, 238, 238);
}
/* -----((( HERO IMAGES - scroll )))----- */
.home-page-scrolling-images-div {
    display: block;
    max-height: 600px;

    margin: 0;
    padding: 0;

    transition: all;
    transition-duration: 2ms;
}
.home-page-scrolling-images-all {
    max-height: 600px;
    max-width: 100%;
    height: auto;
    width: 100%;
    margin: 0px;
    padding: 0px;
}
/* -----((( MAIN )))----- */
main {
    max-width: 1400px;
    margin: 0 auto;
}
/* -----((( MARGIN L/R, w/o banner )))----- */
.margin-left-right-div {
    margin: 0 2%;
}
/* BOX ROWS/COLUMNS w/Background FOR SECTIONS */
.box-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: 0 auto;
    padding: 20px 0;
}
.box-row .box {
    text-align: center;
    padding: 0 4px;
    width: 30%;
    min-width: 350px;

}
.box-row img {
    width: 100%;
}
.box a {
    text-decoration: none;
    height: 100%;
    width: 100%;
    margin: 0;
    color: black;
}
.box-H {
    margin: 4px auto 0;
    padding: 0;
}
.box-p {
    margin: 0 auto;
    padding: 0;
}
/* -----((( FOOTER )))----- */
.footer-container-for-background-color-wide {
    background-color: black;
}
footer {
    margin: 0;
    padding: 10px 0;
    color: #eeeeee;
    text-align: center;
    align-content: center;
    height: 200px;
    background-color: black;
    width: 100%;
  }
  footer ul {
text-align: left;
    max-width: 800px;
    list-style-type: none;
  }
  footer li {
    background-color: black;
  }
  footer a {
    text-decoration: none;
    color: rgb(161, 161, 161);
    font-weight: 500;
    border-radius: 4px;
    padding: 5px;
    font-size: 1.3em;
  }
  footer a:hover {
    color: #f0f0f1;
    background-color: #a7a7a7;
    font-weight: 600;
  }