
body {margin: 2vh 3vw}

.red {background-color: red}	
.pink {background-color: pink}
.ltpink {background-color: #ffe6ff}
.redvio{background-color: #ff99ff}
.fu{background-color: #FFfaFF}
.vlredvio{background-color: #c6cef5} /*#f5c6ed}*/
.yellow{background-color: yellow}
.ltyellow{background-color: #ffff80}
.vltyellow{background-color: #ffffa0}
.lchiff{background-color: #FFFACD}
.green {background-color: green}
.ltgreen{background-color: #ccffcc}
.blue{background-color: blue}
.ltblue{background-color: #99ccff}
.vltblue{background-color: #ADD8E6}
.orange {background-color: orange}
.ltorange{background-color: #ffe699}
.vltorange{background-color: #FFEDD5}
.vvltorange{background-color: #ffcccc}
.buttermilk{background-color: #FFF1B8}
.cream{background-color: #FFFDD0}
.vanilla{background-color: #F3E5AB}
.gray {background-color: #d3d3d3 }
.vltgray{background-color: #FAFAFA}
.vlmaroon{background-color: #F9EAEA}
.white {background-color: #ffffff}
.bigf { font : small}

.fred {color: #ff0000}
.fmar {color: maroon}
.fblue{color: blue}
.find{color: #002699}

h4 {
  font-size: 1em; /* Adjust this number up or down to find the perfect size */
  /*font-weight: normal;  Optional: Use this if you want to remove the default bolding */
}

.geo{font-family: georgia} 
.imp{font-family:impact}
.tnr{font-family: times new roman}
	
.normal	{
font-weight: normal;
}

.bold {
font-weight: bold;
}
	
.cent {          /* Turns on the Flexbox engine */
  justify-content: center; /* Pushes the menu items into the middle */
  align-items: center;     
  text-align: center;      
}

.lt { text-align : left ;}
.txttp {text-align : top;}
/*.lillt {text-align : left ; padding-left : 30px ;}*/
.lillt {margin-left: 5%;}
.biglt {text-align : left ; padding-left : 100px ;}
.ct{text-align : center;}

.page {
  width: 75%;
  padding: 3%;
}

.blbord {
  border: 1px solid black;
  border-radius: 8px;
}

.page ol {
  margin: 0;
  padding-left: 20px; /* Standard space for the numbers */
}

.page li {
  margin-bottom: .5rem; /* Creates clear vertical space between each entry */
  line-height: 1.1; /* Adds vertical space between lines of wrapping text */
  color: #333; /* Dark gray is often easier on the eyes than pure black */
}

        /* Modern CSS Grid Layout for the Page */
        .page-wrapper {
            display: grid;
            /* Creates a basic top-to-bottom layout: Nav, Content, Nav */
            grid-template-rows: auto 1fr auto; 
            min-height: 100vh; 
            gap: 20px;
        } /* Grid Layout specifically for the main content and images */
        .content-grid {
            display: grid;
            /* This gives the text twice as much space as the image */
            grid-template-columns: 2fr 1fr; 
            gap: 30px;
            align-items: start;
            padding: 0 20px;
        }


.menu2 ul {
  display: flex;
  list-style: none; /* Removes the bullet points */
  padding: 0;
  margin: 0 auto;
  width: 100%;
}

.menu2 li {
  flex: auto;
  white-space: nowrap;
  text-align: center;
  border: 1px solid #ccc;
  padding: 5px 10px;
}

.menu2 li a {
  font-size: 1.1rem; /* Put it here instead */
  text-decoration: none; /* Removes the underline from the links */
  color: black; /* Sets the link text color */
}

.flexo {display:flex;
margin:0 auto;
width: 90%;           /* The Ideal: Try to take up 90% of the screen */
  max-width: 1000px;    /* The Ceiling: Never grow wider than 1200px */
  min-width: 350px;
}

.boxo{align-items: stretch;
  border: 1px solid black;
  padding: 3px 6px 3px;
  background-color: #d3d3d3;}


.grido {display: grid;}

