@font-face {
  font-family: 'RA'; /*a name to be used later*/
  src: url('/fonts/RomanAntique.ttf'); /*URL to font*/
}

*{
  box-sizing:border-box;
  position:relative;
  filter:grayscale(100%);
  color:black;
  font-family:RA;
}
img{
  pointer-events: none;
}
body{
  background-image:url('/bgs/bg012.jpeg');
  background-size:100vw 100vh;
  width:100vw;
  height:100vh;
  background-color:black;
  overflow:hidden;
  text-align:center;
  padding:10vh;
}
main{
  background-image:url('/bgs/bg013.png');
  background-size:100% 100%;
  width:80vw;
  height:80vh;
  padding:8%;
  padding-bottom:9%;
  filter:drop-shadow(0 0 5px white);
  margin:0 auto;
}
header{
  
}
footer{
}
hr{
  border:0.5px solid white;
}
button{
  width:100%;
  height:fit-content;
  padding:8%;
  color:white;
  background:none;
  border:none;
}
button:nth-child(odd){
  background-image:url('/bgs/bg015.png');
  background-size:100% 100%;
  padding-left:17%;
}
button:nth-child(even){
  background-image:url('/bgs/bg016.png');
  background-size:100% 100%;
  padding-right:17%;
}
main > img{
  position:absolute;
  height:auto;
}

section > h1, section > h2, section > h3{
  height:fit-content;
  width:100%;
  background-image:url('/bgs/bg014.png');
  background-size:100% 100%;
  padding:12% 6% 8% 14%;
  color:white;
}
button :is(h1,h2,h3), .entry :is(h1,h2,h3,p){
  color:white;
}
.entry :is(h1){
  margin:2% 5% 4% 15%;
}

a, a:visited{
  color:black;
}

.entry{
  background-image:url('/bgs/bg017.png');
  background-size:100% 100%;
  width:100%;
  height:60%;
  padding:10%;
  margin-bottom:5%;
}

.row{
  display:flex;
  width:100%;
  height:100%;
  margin:auto;
  gap:-5%;
}
main > .row{
  gap:20%;
}
section{
  flex:50%;
  max-width:50%;
  height:100%;
  padding:3% 0;
  border-radius:15px;
}
.column1{
  flex:50%;
  max-width:50%;
  height:fit-content;
}

.scroll{
  overflow:auto;
  overflow-x:hidden;
  height:100%;
}
.scrollcontainer{
  height:70%;
  border:1px dotted white;
  margin-left:5%;
  padding:1% 2%;
}


.imgtxt{
  height:1em;
  width:auto;
  vertical-align: middle;
}

.divider{
  width:100%;
  height:auto;
}
.top{
  position:absolute;
  left:0;
  top:0;
}
.bottom{
  position:absolute;
  left:0;
  bottom:0;
  transform:rotate(180deg);
}
.top, .bottom{
  filter:brightness(0%);
  border-radius:15px
}
.frame{
  width:100%;
  height:100%;
  position:fixed;
  top:0;
  left:0;
  z-index:50;
}