html {
  margin-top: 2%;
  background-image:url('src/bg.webp');
  background-repeat: repeat;
  margin-bottom: 2%;
}

html.darkmode {
  background-image:url('src/bg_dm.webp');
  background-color: #0D3019;
}

.click.darkmode {
  border: 1px solid #080d13;
  padding: 4px;
  background-color: #080d13;
}

.click.darkmode:hover {
  border: 1px solid #C5E594;
  background-color: #080d13;
}
.t.darkmode {
  background-color: #080d13;
  color: #C5E594;
}

.t.darkmode:hover{
  background-color: #C5E594;
  color: #080d13;
}

body.darkmode {
  border: 1px solid #FFF7BD;
  background-color: #080d13 ;
  color: #FFF7BD;
}

main.darkmode {
  background-color: #080d13;
  color: #FFF7BD ;
}

footer.darkmode {
  background-color: #080d13;
}

header.darkmode {
  background-color: #080d13;
}

h1 {
  font-family: "Maiden Orange", serif;
  font-weight: 400;
  font-style: normal;
}

header {
  background-color: #0D3019;
  color: #FFF7BD;
  padding: 8px;
}

.click {
  border: 1px solid #0D3019;
  padding: 4px;
  background-color: white;
}

.click:hover {
  border: 1px solid #C5E594;
  background-color: #C5E594;
}

a.t {
  background-color: #C5E594;
  color: #0D3019;
  padding: 2px;
  max-height: 100%;
  width: auto;
  object-fit: cover;
  overflow: hidden;
}

a.t:hover {
  background-color: white;
}

/*header a.t
{
    border-radius: 3px;
}*/

header h1
{
  font-size: 6em;
}

h2, h3, h4, h5 {
  font-family: "Fuzzy Bubbles", sans-serif;
  font-weight: 700;
  font-style: normal;
}

main {
  background-color: #FFF7BD;
  color: #0D3019;
  padding: 12px;
}

p {
  font-family: "Fuzzy Bubbles", sans-serif;
  font-weight: 400;
  font-style: normal;
}

body {
  max-width: 80%;
  margin: auto;
  border: 1px solid #0D3019;
}

@media only screen and (max-width: 500px)  {
    body {
      max-width: 100%;
    }
    header h1 {
      font-size: 2em;
    }
    html{
      margin: 0%;
    }
}

img{
  max-width: 100%;
  height: auto;
  margin: auto;
  padding: 1%;
  object-fit: scale-down;
  overflow: hidden;
}

footer {
  height: 10%;
  background-color: white;
  padding: 12px;
}
