body {
overflow-x: hidden;
}
div#gallery.opened {
display: flex;
gap: 10px;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-evenly;
align-content: space-evenly;
position:absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
div#gallery.closed {
display: none; 
}
.photodiv {
background: white;
border: 1px solid black;
width: 200px;
height: fit-content;
text-align: center;
font-family: cursive;
box-shadow:2px 2px 3px black;
}
.photodiv img {
display: inline;
max-width: 90%;
margin: 10px;
max-height: 180px;
}
.photodiv a {
text-decoration: none;
color: black;
}
div#topbar {
font-family: 'Italianno', cursive;
font-size: 40px;
padding-left: 5px;
position: fixed;
width: 100%;
top:0;
left: 0;
color: White;
opacity: 0.75;
background: black;
background: linear-gradient(to bottom, rgb(70,70,70), black, rgb(70,70,70));
z-index: 998;
}
div#topbarbuttons {
position: fixed;
width: 100%;
top: 0;
left: 0;
z-index: 999;
opacity: 1.0;
background: transparent;
}
div#textbutton, div#homebutton {
height: 48px;
width: 48px;
position: relative;
float: right;
padding: 1px;
opacity: 0.5;
}
div#textbutton {
transform: scale(0,0);
transition: transform 0.5s linear;
}
div#closebutton {
width: 48px;
height: 48px;
position: absolute;
right: 0;
top: 0;
margin-right: 1.0em;
margin-top: 1.0em;
padding: 3px;
opacity: 0.5;
z-index: 2;
}
div#textbutton:hover, div#textbutton:focus, div#homebutton:hover, div#homebutton:focus, div#closebutton:hover, div#closebutton:focus {
opacity: 1;
}
div#homebutton img, div#closebutton img, div#textbutton img {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: auto;
margin-bottom: auto;
max-width: 100%;
}
div#hometext {
transform: scale(0,0);
transform-origin: top center;
transition: transform 0.5s ease-out;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 9999;
}
div#hometext.opened {
transform: scale(1,1);
}
div#hometextouter {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: black;
opacity: 0.5;

}
div#hometextinner {
font-family: sans-serif;
position: absolute;
left: 50px;
background: rgba(0,0,0,0.75);
color: white;
right: 50px;
border-radius: 5px;
padding: 5px;
box-shadow:0px 0px 5px white;
overflow: scroll;
top:50%;
translate: 0 -50%;
max-height: 90%;

}
