body{
background: url(image/graphics/backgrounds/dot-07-90.gif); #fff;
}
.wrapper {
position:relative;
width:1500px;
height:800px;
margin-top:20px;
margin-right:auto;
margin-left:auto;
}
.container {
display:flex;
flex-direction: row;
flex-wrap: wrap;
gap:40px 20px;
justify-content: center;
-webkit-border-radius: 10px 10px 0px 0px;
border-radius: 10px 10px 0px 0px;
padding:40px;
}
.bg {
background:url(image/graphics/backgrounds/c010-2.gif);
width:420px;
height:fit-content;
padding:20px;
border: 3px ridge #2FAEFF;
outline: 3px solid #FFFFFF;
outline-offset: 0px;
margin-top:-4px;
border-radius: inherit;
-webkit-box-shadow: 1px 1px 8px 3px #F45D9A; 
box-shadow: 1px 1px 8px 3px #F45D9A;
text-align: center;
font-family: "Outfit", sans-serif;
}
.inner {
width: inherit;
box-sizing: border-box;
height:600px;
background: white;
border: 3px ridge #FFDC57;
border-radius:inherit;
overflow: auto;
font-family: "Outfit", sans-serif;
color:#57450f;
font-size:1.1em;
color: #47361f;
padding:20px;
text-align:left;
overflow-x: hidden;
}
.title {
color:#ff6ead;
text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
font-size:3.5em;
font-family: DDAFTT-L;
z-index:1;
position:absolute;
margin-top:-50px;
}
.title:first-letter  {
color:#f21628;
}
@font-face {
font-family: DDAFTT-L;
src: url(https://file.garden/Zq4JFSM4zCwoO303/material/fonts/DDAFTT-L.TTF);
}
a {
  color:white;
  padding: 5px;
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
text-shadow: 2px 0 #f759b5, -2px 0 #f759b5, 0 2px #f759b5, 0 -2px #f759b5, 1px 1px #f759b5, -1px -1px #f759b5, 1px -1px #f759b5, -1px 1px #f759b5;
}
a:hover {
  color:#d5f07f;
}
h1 {
  color:#57450f;
  padding: 4px;
  text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
  background:#ffc7d6;
  font-size: 0.9em;
-webkit-box-shadow: 1px 1px 0px 0px rgba(255,212,95,0.79); 
box-shadow: 1px 1px 0px 0px rgba(255,212,95,0.79);
-webkit-border-radius: 3px 3px 0px 0px;
border-radius: 3px 3px 0px 0px;
}
summary {
  color:#57450f;
  padding: 4px;
  text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
  background:#fff063;
  display: block;
  cursor: pointer;
}
details {
  font-size: 0.8em;
}
::selection {
  color: #ff4dbe;
  background: transparent;
  text-shadow: 2px 0 #fff, -2px 0 #fff, 0 2px #fff, 0 -2px #fff, 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
}
  * {
    scrollbar-width: none;
    scrollbar-color: #8f54a0 #ffffff;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 16px;
  }

  *::-webkit-scrollbar-track {
    background: #ffffff;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #8f54a0;
    border-radius: 10px;
    border: 3px solid #ffffff;
  }