/* 
 * landing2026.css 
 * last updated: 09/01/2026
 */
h1 {
  margin: 30px;
  padding: 30px;
  border: 3px solid navy;
  border-radius: 7px;
  background-color: lightblue;
  color: navy;
}
h2,
h3,
h4 {
  margin: 30px;
}
img {
  max-inline-size: 100%;
}

li {
  list-style: none;
}
div {
  margin: auto;
}
h4 {
  color: red;
}
button {
  width: 50%;
}
button:hover {
  background-color: lightyellow;
  font-style: italic;
  border: 1px solid darkgreen;
}
.bigbutton {
  width: 100%;
  padding: 20px;
  font-size: larger;
  text-align: center;
}
.topics {
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	column-gap: 1em;
	row-gap: 1em;
	max-width: 90vw;
}
.box {
  width: 200px;
  height: 200px;
  font-size: large;
  font-style: bold;
  padding: 20px;
  margin: 15px;
  background-color: whitesmoke;
  border: 1px solid lightgray;
  text-align: center;
  flex: 1 1 auto;
}
.box:hover {
  background-color: lightyellow;
  color: black;
  font-style: italic;
  border: 5px dashed navy;
}
#religion {
  background-color: navy;
  color: white;
}
#food {
  background-color: orange;
  color: white;
}

#blog {
  background-color: lightblue;
  color: white;
}
#ai {
  background-color: greenyellow;
  color: darkgreen;
}

#critical {
  background-color: red;
  color: white;
}
#music {
  background-color: maroon;
  color: white;
}

#memoir {
  background-color: lightslategray;
  color: white;
}
#horatio {
  background-color: greenyellow;
  color: darkgreen;
}

#programming {
  background-color: black;
  color: white;
}

#chess {
  background-color: navy;
  color: white;
}

#art {
  background-color: lightblue;
  color: white;
}
#humor {
  background-color: whitesmoke;
  color: darkgreen;
}

#catmando {
  background-color: orange;
  color: white;
}
#politics {
  background-color: red;
  color: darkgreen;
}

#movies {
  background-color: maroon;
  color: white;
}

#reading {
  background-color: greenyellow;
  color: white;
}

#miscellaneous {
  background-color: plum;
  color: navy;
}

#health {
  background-color: darkgray;
  color: yellow;
}

#political {
  text-align: center;
}
#political button {
  color: navy;
  font-weight: bold;
}
.caution {
  color: darkgreen;
  font-size: 1.3em;
  font-weight: bold;
}
.highlight {
  background-color: yellow;
}
.jumbotron {
  background: url("../images/pexels-pixabay-248280.jpg") no-repeat center center;
  height: 550px;
  color: whitesmoke;
  text-shadow: #444 0 1px 1px;
}
.jumbotron a {
  color: whitesmoke;
  background-color: maroon;
}
.jumbotron a:hover {
  font-size: 1.3em;
  font-weight: bold;
}
.lead {
  font-size: 5em;
  font-weight: bold;
  color: whitesmoke;
  padding-bottom: 10px;
}
.lastupdated {
  text-align: center;
  color: lightgray;
}
.announcement {
  background-color: lightyellow;
  border: 2px dotted black;
  margin: 10px;
  padding: 15px;
}