.light-theme {
                --header-image: url("new-theme/forest-beta.png");
                --body-bg-image: url("new-theme/overworld-background.png");
                
                --aside-bg: #789E79;
                --panel-bg: #A8C9F7;
                --heading-color: #2f4a35;
                --strong-color: #3a5f45;
                --navbar-bg: #79A3E2;
                --navbar-text: #2B4166;
                
                /* colors */
                --content: #b0b3e7;
                --accent-color: #6b8f71;
                
                background-image: var(--body-bg-image);
                background-repeat: no-repeat;
                background-attachment: fixed;
                background-size: cover;
                background-color: var(--bg-color, #91D681); /* color bg when charging */
                
                
            }

            .light-theme body {
                
                color: var(--text-color, #133957); /* color text info box and small text in body */
                transition: color 0.3s;
                background: none;
                
            }
            
            
.light-theme a {
    color: var(--accent-color, #4b82c4); /* no idea */
}

            .light-theme #container a {
                color: #073873; /* links */
                font-weight: bold;
                text-decoration:none;
                }

            .light-theme #header {
                width: 100%;
                background-color: #7ED6B4; /* color in front of image header */
                height: 30vh;
                max-height: 300px;
                min-height: 220px;
                background-image: var(--header-image);
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                margin: 0;
                padding: 0;
                margin-top: 0;
            }

            .light-theme #navbar {
                height: 40px;
                background-color: var(--navbar-bg); /* color bg where letters are in header */
                width: 100%;
                border-radius: 0px 0px 25px 25px;
                margin-top: 0;
            }

            .light-theme #navbar li a {
                color: var(--navbar-text); /* color letters header */
                font-weight: 800;
                text-decoration: none;
            }

            .light-theme #navbar li a:hover {
                color: #3A758A; /* color hovering letters header */
                text-decoration: underline;
            }

            .light-theme #navbar .dropdown-menu {
              background-color: #79A3E2; /* color bg hover */
              border: 2px solid #2B4166; /* color border hover */
              border-radius: 10px;
              min-width: 160px;
              padding: 5px 0;
            }

            .light-theme #navbar .dropdown-menu a {
              padding: 8px 12px;
              font-weight: normal;
              text-decoration: none;
              white-space: nowrap;
            }

            .light-theme #navbar .dropdown-menu a:hover {
              background-color: #B8EBFF; /* color bg hover dropdown */
              text-decoration: none;
            }

            .light-theme aside {
                background-color: var(--aside-bg, #789E79); /* color bg asides */
            }


            .light-theme main {
                background-color: var(--panel-bg, #A8C9F7); /* color bg center */
                border: 3px solid #384B70; /* color border center */
            }

            .light-theme footer {
                background-color: #B1CCF0; /* color bg footer */
                border-radius: 25px;
                width: 100%;
                height: 40px;
                padding: 10px;
                text-align: center;
                font-size: 12px;
            }

            .light-theme h1,
            .light-theme h2,
            .light-theme h3 {
                color: var(--heading-color, #2f4a35); /* color letters with bold asides */
            }

            .light-theme strong {
                color: var(--strong-color, #3a5f45); /* color letters smaller titles */
            }

            .light-theme .box {
                background-color: #A6B2E3; /* color bg boxes text asides */
                border: 2px solid #272838; /* color borders boxes text asides */
                margin: 0 auto;
            }
            

            /* CSS for extras */

            .light-theme #topBar {
                background-color: #272838; /* bg color for top bar (image) */
            }

.light-theme .comic-button {
  background-color: #4CAF4C;
  color: white;
}

.light-theme .comic-button:hover {
  background-color: #3C8C44;
}

.light-theme #fictionfolk iframe,
.light-theme #fictionfolk div {
  max-width: 100% !important;
}


.light-theme .theme-button {

  text-align: center;

  border: 1px solid currentColor;

  color: #052242; /* color button change colors */
  background: none;
}

.light-theme .theme-button:hover {
  opacity: 0.8;
}

.light-theme .eye-title {
  width: 105px;
  content: url("web-symbols/alt-eye-title.png");
}

.light-theme .eye1 {
  width: 100px;
  content: url("web-symbols/alt-eye1.png");
}

.light-theme .eye2 {
  width: 110px;
  content: url("web-symbols/alt-eye2.png");
}

.light-theme .eye3 {
  width: 350px;
  content: url("web-symbols/alt-eye3.png");
}

.light-theme .eye4 {
  width: 400px;
  content: url("web-symbols/alt-eye4.png");
}

.light-theme .eye5 {
  width: 450px;
  content: url("web-symbols/alt-eye5.png");
}