styles.css

@font-face {
  font-family: "comic";
  src: url("fonts/comic.ttf");
} 

body {  
  background-color: rgb(40, 40, 40); 
  background-image: url('misc/background_night.png'); 
}

h1, h2, h3, h4, h5, h6 {
    color: rgb(197, 197, 197);
    font-family: "comic";
    font-size: 250%;
    /* border: 2px solid rgb(131, 131, 131); */
}

p  {
    font-family: Helvetica;
}

.links {
  display: flex;
  justify-content: center;
  gap: 1%;
}

.link {
  background-image: url('misc/empty.gif');
  background-size: cover;
  text-align: center; 
  margin-top: 8px;
  /* background-color: rgb(60, 131, 131); 
  border: 1px solid rgb(131, 131, 131);*/
  color: rgb(10, 10, 10);
  width: 100px;
}

.blog1, .blog2 {
  color: rgb(173, 173, 173);
  background-color: rgb(80,80,80); 
  padding: 5px
}

.iframe-parent {
  display: flex;
  height: 70%;
  justify-content: space-around;
  gap: 5%;
  /* border: 1px solid rgb(255, 0, 0); */
}

.top {
  /* background-image: url('misc/bannertop_test.png'); */
  display: flex;
  /* border:1px solid rgb(131, 131, 131); */
  max-height: 100%;
  justify-content: center;
  height: 150px;
  flex-direction: column;
  padding: 0px;
  margin: 0px;
  color: rgb(173, 173, 173);
}

.topbar {
  display: flex;
  justify-content: center;
}

.iframe-main {
  flex-grow: 4;
  max-width: 1000px;
  max-height: 100%;
}

.iframe-button {
  flex-shrink: 1;
  max-width: 270x;
  max-height: 100%;
}

.spaceleft {
  /* background-image: url('misc/bannerleft.png'); 
  border:1px solid rgb(131, 131, 131); */
  flex-grow: 1;
  max-height: 100%;
}

.spaceright {
  /* background-image: url('misc/bannerright.png');
  border:1px solid rgb(131, 131, 131); */
  flex-grow: 1;
  max-height: 100%;
}