header {
      background: #d3c6c2;
      padding: 1rem;
}
 
 body {
            font-family: Arial, sans-serif;
            margin: 0 auto;
            max-width: 1200px;
            background-image: url("/hoard/bg/misc082.gif");
        }
        .page-title {
            text-align: center;
        }
        .red-container {
            background-color: red;
            text-align: center;
            padding: 1rem 0;
        }
        
        .header {
          background-color: #d3c6c2; 
        }
        
        .nav-bar {
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            padding: 1rem 0;
        }
        
        a:link { 
		      color: #ad3b1b;
		      text-underline-offset: 2px;
		      text-decoration-thickness: 2px;
		      text-decoration-color: #ad3b1b;
	}
	      a:visited { 
		      color: #a03d9e;
		      text-decoration-color: #a03d9e;
	}
	      a:hover, a:focus { 
		      color: #8e803b;
		      text-decoration-style: wavy;
		      text-decoration-thickness: 1px;
	}
        

        .categories {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 1rem;
            padding: 1rem;
        }
        .category {
            border: 2px solid black;
            background: #d3c6c2;
            padding: 1rem;
        }
        .category h2 {
            text-align: center;
        }
      
              /* link style */
	
        
        @media (min-width: 768px) {
            .nav-bar {
                flex-direction: row;
                justify-content: space-between;
            }
        }