html, * {
  margin:0; padding:0;
  border:0 none; outline:0 none;
  box-sizing:border-box;
  font-family:'Trebuchet MS', Arial, sans-serif;
}
html, body {
   width:100%; height:100%;
}
body {
  background-color:#C9491A; color: #FFF;
}
#page {
  display:block; position:absolute;
  width:100%; height: 100%;
  font-size:0.75em;
  padding: 5%;
}
#main {
  display:block; position:relative;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100%; height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-origin: content-box;
  border:1px solid #EE7B00;
  padding: 5%;
}
@media screen and (min-width: 1024px) {
  #main {
    max-width: 1024px;
    background-image:url(../pix/prl-1024.png);
  }
}

@media screen and (max-width: 1024px) and (min-width: 800px) {
  #main {
    max-width: 912px;
    background-image:url(../pix/prl-1024.png);
  }
}
@media screen and (max-width: 800px) and (min-width: 640px) {
  #main {
    max-width: 720px;
    background-image:url(../pix/prl-800.png);
  }
}
@media screen and (max-width: 640px) {/*and (min-width: 320px)  {*/
  #main {
    max-width: 480px; min-width: 320px;
    background-image:url(../pix/prl-640.png);
  }
}