body {
      margin: 0;
      font-family: "Courier New", monospace;
      background: var(--bg-color);
      color: var(--text-color);
      display: flex;
      flex-direction: column;
      height: 100vh;
    }

    header {
      text-align: center;
      padding: 1rem;
      background: var(--nav-bg);
      color: var(--nav-text);
    }

    nav {
      background: var(--sidebar-bg);
      display: flex;
      justify-content: center;
      gap: 1.5rem;
      padding: 0.75rem;
    }

    nav a {
      text-decoration: none;
      color: var(--text-color);
      font-weight: bold;
      transition: color 0.3s;
    }
    
  nav a:hover ,
    nav a.active {
      color: blue;
      border-radius: 4px;
      background-color: rgba(0,0,255,0.3);
      padding: 3px;
    }

   

    .main {
      display: flex;
      flex: 1;
      overflow: hidden;
    }

    .sidebar {
      width: 30%;
      background: var(--sidebar-bg);
      padding: 1rem;
      flex-shrink: 0;
    }

    .content {
      flex: 1;
        border: 3px dotted black;
      background: var(--sidebar-bg);
      color: var(--sidebar-bg);
      overflow-y: auto;
       margin: 3em ;
    
    }

    footer {
      text-align: center;
      padding: 0.75rem;
      background: var(--sidebar-bg);
      color: var(--text-color);
    }

    footer img {
      vertical-align: middle;
      height: 20px;
    }

    .theme-toggle {
      position: fixed;
      bottom: 1rem;
      right: 1rem;
      padding: 0.5rem 1rem;
      border: none;
      border-radius: 5px;
      background: var(--text-color);
      color: var(--bg-color);
      cursor: pointer;
      font-weight: bold;
    }
    .logo {
    height: 100px;
}
.bild {
    width: 40%;
}

  
/*from w3schhol*/

div.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

div.gallery-item {
  margin: 5px;
  border: 1px solid #ccc;
  width: 180px;
}

div.gallery-item:hover {
  border: 1px solid #777;
}

div.gallery-item img {
  width: 100%;
  height: auto;
}

div.gallery-item div.desc {
  padding: 15px;
  text-align: center;
}