body,html{
  height: 100%;
  margin: 0;
}
h1   {
  color: #D3C6AA;
}
h2 {
  color: #D3C6AA;
  padding:20px; 
  background: rgba(30, 35, 30, 0.7); 
width:max-content;
  
}
      
p    {
  color: #D3C6AA;
  padding:20px; 
  background: rgba(30, 35, 30, 0.7); 
}

.navbar {
  display:flex;
  position:fixed;
  border:24px solid transparent; 
  overflow-x: hiddden;
  overflow-y: auto;
  margin-top: 10vh;
  padding:10px;
  border-image:url(dungeonborder.png) 48 round ; 
  background-image: url(dungeonbgg.png);
  height:50%;
}

.navbar ul{
  list-style-type:none ;
  flex-direction:column;
  display:flex;
  padding:0;
  margin:0;
}
.navbar ul li{
  padding:10px;
}


.navbar ul li a{
  display:block;
  text-decoration:none  ;
  color: #D3C6AA;
  padding:5px;
  white-space: nowrap;
  border: solid transparent 12px; 
  border-image: url(dungeonborderb.png) 48 round;
  background: rgba(30, 35, 30, 0.7); 
}

.navbar ul li a:hover{
  text-decoration:none;
  color: #ae66c9;
  display:block;
}

a:link {
  color:#D3C6AA;
}
      
a:visited {
  color:#D3C6AA;
}
        
img {
  height: auto; 
  margin: auto;
  max-width: 100%;
}
.container {
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap: wrap;
}
.content{
  display:flex;


}
.tbd {
  display:flex; 
  justify-content:center;
  align-items:center;
  border:24px solid transparent; 
  padding: 15px;
  margin:10px;
  margin-top:10vh;
  background-clip: padding-box;
  overflow-x: hiddden;
  overflow-y: auto;
  border-image:url(dungeonborder.png) 48 round ; 
  background-image: url(dungeonbgg.png);
  width:90vh;
  
}
.tbdpost {
  display:flex; 
  flex-direction:column;
  border:24px solid transparent; 
  padding: 15px;
  margin:10px;
  background-clip: padding-box;
  overflow-x: hiddden;
  overflow-y: auto;
  border-image:url(dungeonborder.png) 48 round ; 
  background-image: url(dungeonbgg.png);
  width:40%;
  
}

.bg-image {
  position: fixed;
  background-image: url("dungeonbgb.png");
  Background-position:center;
  filter: brightness(50%);
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
z-index: -1;
}
#dungeonbg {
  filter:blur(3px);
}
#canvas {
  display:flex;
  flex-direction: column;
   margin-left:10vh;
}
#canvas2 {
  display:flex;
  flex-direction: column;
   margin-left:25vh;
     justify-content:center;
  align-items:center;
}
}