body {
  background-image: url(1_1024.jpg);
  background-repeat: repeat;
  font-family: "Arial";
}
b {color:white;}
.wrapper a {
  text-decoration: none;
  color: white;
  font-weight: bold;
}
p, h1 {color: #ffffff;
  font-weight: bold;
  text-shadow: 5px 2px 5px #a86232;
}
a{color:white;font-weight:bold;text-decoration:none;}
header {
  border-width: 2px;
  border-color: black
}
progress {background-color: greenyellow}

.wrapper {
  position: sticky;
  display: grid;
  grid-template-columns: 0fr 1fr 0fr 0fr 0fr 0fr;
  grid-template-rows: 
}

.wrapper {
  background-color: #a8623260;
  border: 5px solid #a86232;
  border-radius: 5px;
}

.wrapper > a, b{
  color: #ffffff;
  padding: 1em;
  border-right: 5px solid #a86232;
}


.me {margin-top: 1em;
  border: 5px solid #a86232;
  border-radius: 5px;
  padding: 1em;
  padding-top: 0em;
  padding-bottom: 0em;
  background: repeating-linear-gradient(#a8623260, #00000000 15px);  
}
.nameme {background-image: url(reading.png)!important;}

.reading {vertical-align: middle;width: 3em}

.people{
  text-align: center;
  
}

.people > div > h1 {
  margin:0 auto;
  text-shadow: 5px 0px 20px #a86232, 0px 5px 20px #a86232, 5px 5px 20px #a86232, -5px -5px 20px #a86232, -5px 0px 20px #a86232, 0px -5px 20px #a86232;
  width:100px;
}

.o {
  position: relative;
  width: 150px;
  height: 150px;
  margin: 40px auto;
  margin-bottom: 10 auto;
  background-size: 180px;
  background-position: center;
  border: 5px solid #a86232;
  border-radius: 100px;
}
.q{background-image: url(tao.png);}
.w{background-image: url(ttk.png);}
.e{background-image: url(krulik.png);}
.r{background-image: url(crab.png);}
.t{background-image: url(pingwin.png);}
.y{background-image: url(mojo.png);}
.u{background-image: url(kaczka.png);}
.i{background-image: url(minia.png);}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}

.item img {
  width: 100%;
  height: auto;
  border: 5px solid #a86232;
  border-radius: 8px;
  margin: 10px;
}

.item p {
  text-align: center;
  font-size: 14px;
}

/*.o {
  position: relative;
  width: 150px;
  height: 150px;
  margin: 40px auto;
  margin-bottom: 10 auto;
  animation: 4s circle infinite linear;
}
.o::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
.o::after {
  content: "";
  position: absolute;
  inset: 0px;
  border-radius: 50%;
  background: #a86232;
  mask: radial-gradient(circle, transparent 65%, black 66%);
}
@keyframes circle {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}*/








}