/* Set height to 100% for body and html to enable the background image to cover the whole page: */

body, html {

  height: 100%

}



.bgimg {

  background-blend-mode: lighten;
   background-color: rgba(255, 255, 255, 0.6);

  /* Background image */

  background-image: url('/CMP_Preview.png');

  /* Full-screen */

  height: 100%;

  /* Center the background image */

  background-position: center;

  /* Scale and zoom in the image */

  background-size: cover;

  /* Add position: relative to enable absolutely positioned elements inside the image (place text) */

  position: relative;

  /* Add a white text color to all elements inside the .bgimg container */

  color: white;

  /* Add a font */

  font-family: "Courier New", Courier, monospace;

  /* Set the font-size to 25 pixels */

  font-size: 25px;

}



/* Position text in the top-left corner */

.topleft {

  position: absolute;

  top: 0;

  left: 16px;

}



/* Position text in the bottom-left corner */

.bottomleft {

  position: absolute;

  bottom: 0;

  left: 16px;

}



/* Position text in the middle */

.middle {

  position: absolute;

  top: 40%;

  left: 50%;

  transform: translate(-50%, -50%) rotate(-30deg);

  text-align: center;

}




h1 {

  margin: auto;

  font-size: 5em;

  color: black;

  white-space: preserve nowrap;

}