body {
    background-image: url("https://t3.ftcdn.net/jpg/08/15/90/80/360_F_815908053_Mfy2DJfv1iFSdL6ET9pRD5R5VzOOEu5k.jpg");
    background-repeat: no-repeat;
    /* This scales the image to cover the entire area */
    background-size: cover;
    /* This keeps the image centered */
    background-position: center;
    /* This keeps the background fixed while scrolling */
    background-attachment: fixed;
    /* Ensures the body takes up the full height of the screen */
    min-height: 100vh;
    margin: 0;
 font-family: Trebuchet MS;
  color: white;
  text-align: center;
}
a.button {
    padding: 10px 60px;
    border: 1px outset buttonborder;
    border-radius: 3px;
    color: white;
    background-color: gray;
    text-decoration: none;
}
.my-custom-box {
  margin: 5px; 
  background-color: rgba(0, 0, 0, 0.3); 
  text-align: left !important; 
  padding: 20px; 
  border-radius: 8px;
  color: white;
}
/* This targets phones and small tablets */
@media screen and (max-width: 768px) {
  html, body {
    zoom: 150%;
    -moz-transform: scale(1.5); /* For Firefox */
    -moz-transform-origin: 0 0;
    width: 66.6%; /* Offsets the scale so you don't get a horizontal scrollbar */
  }
}