html {
     height: 100%;
 }

 body {
     background: linear-gradient(15deg, #fd0481 0%, #3d0245 99%, #ff719e 100%);
     margin: 1rem;
 }

 header {
     background-color: black;
     color: white;
     padding: 20px;
     text-align: center;
     border: 10px solid white;
     border-radius: 20px;
     display: flex;
     flex-direction: column;
     justify-content: space-around;
     align-items: center;
     margin-bottom: 16px;
     margin-top: 20px;
 }

 #DistortedGrynz {
     padding: 25px;
 }


 h1,
 h2,
 h3 {
     color: white;
     font-family: emilys candy, cursive;
     text-shadow: #fe5602 -6px -6px 6px, #fa00af 3px 3px 4px, rgb(202, 134, 250) 9px 9px 10px;
 }

 h1 {
     font-size: 48pt;
     align-items: center;
     margin: 10px;

 }

 h2 {
     font-size: 36pt;
     text-align: center;
     margin: 10px;
 }

 h3 {
     font-size: 24pt;
 }

 h4 {
     font-size: 20pt;
 }

 h5 {
     font-size: 16pt;
 }

 section {
     background-color: black;
     color: white;
     padding: 20px;
     border-radius: 20px;
     border: 10px solid rgb(247, 3, 105);
     font-family: emilys candy, cursive;
     font-weight: 900;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     height: fit-content;
     font-size: 36px;
     margin: 10px;
     outline: 6px solid rgb(113, 1, 131);

 }

 a{
        text-decoration: none;
        color: white;
          text-shadow: #fc7a00 -8px -8px 8px, #f3f702 7px 6px 4px, rgb(1, 149, 255) 9px 11px 7px;
 }

 /* Remove default bullets and use Font Awesome icons as bullets */
 ul {
     list-style: none;
     padding-left: 0;
 }

 /* Top-level list items: use gem icon */
 ul>li {
     position: relative;
     padding-left: 1.9rem;
     margin: 0.4rem 0;
     font-size: 16pt;
 }

 ul>li::before {
     font-family: "Font Awesome 6 Free";
     content: '\f3a5';
     /* gem */
     font-weight: 900;
     /* solid */
     position: absolute;
     left: 0;
     top: 0.05rem;
     color: #dafbff;
     font-size: 14pt;
     line-height: 1;
 }

 p {
     font-family: Happy Monkey, sans-serif;
     font-size: 16pt;
 }


 /*  em{
            font-family: underdog, sans-serif;
            font-size: 14pt;
            color:#ff35a1
        }*/

 .wrapper {
     display: flex;
     flex-direction: row;
     align-items: flex-start;
     gap: 1rem;
     flex-wrap: nowrap;

 }

 main {
     display: flex;
     flex-direction: row;
     justify-content: flex-start;
     /* place them at the start horizontally */
     align-items: flex-start;
     /* place them at the top vertically */
     gap: 1rem;
 }

 border: solid 16px black;
 }

 #about-img {
     justify-content: left;
     max-width: 33.3%;
 }

 img {
     max-width: 100%;
     height: auto;
     display: block;
     border-radius: 20px;
     border: 10px solid white;
 }


 /* Background for index page using GrynzCatLogo.jpg */
 .index-bg {
     background-image: url("../GrynzCatLogo.jpg");
     background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
     min-height: 100vh;
     margin: 0px 20px 0px 20px;

 }