body { 
      margin: 2.5vw;
      min-height: calc(100vh - 10px);
      color: green;
      border-style: solid;
      border-color: black;
      background-color: black;
      font-family: 'terminus';
    }
    
 /* properties for parent flex container */   
    .container { 
      display: flex;
      margin: inherit;
      min-height: inherit;
      border-style: solid;
      border-color: black;
      background-color: black;
    }
/* column */
    .c1 {
      border-style: solid;
      border-color: black;
      max-width: 10em;
      flex-grow: 1;
      margin-left: .25em;
      margin-right: .25em;
    }
/* rectangle */
    .r1 { 
      border-style: solid;
      border-color: black;
      max-width: 75em;
      flex-grow: 2;
      margin-left: .25em;
      margin-right: .25em;
    }
    
/* blog entry */
    .entry {
      border-style: solid;
      border-color: black;
      background-color: black;
      position: relative;
      display: block;
      max-width: 100em;
      

    }
    
    @font-face {
      font-family: terminus;
      src: url(/fonts/TerminusTTF-4.49.3.ttf)
    }
    
	
	.text {
		 opacity: 0;
		 position: absolute;
		 top: 50%;
		 left: 50%;
		 transform: translate(-50%, -50%);
		 font-size: calc(1em + 1.75vw);
		 color: green;
		 filter: drop-shadow(1px 1px 0 black)
			drop-shadow(-1px 1px 0 black) 
			drop-shadow(1px -1px 0 black) 
			drop-shadow(-1px -1px 0 black);
		 text-transform: uppercase;
		 z-index: 99;
	}

	@media screen and (max-device-width : 800px){
		.room {
			 transform: scale(0.95);
		}
		.text {
			font-size: calc(0.5em + 1.7vw); }
		header { margin: 10px auto; }
	}
	
	@media (prefers-color-scheme: dark) {
		body { background: #1d3030 url(''); }
		header, h1 { color: white; }
		.link { color: #b2d7c1; }
		.link:hover, .link:focus { background-color: #b2d7c1; color: darkslategrey; }
	}