* {
    margin: 0;
    padding: 0;
  }
  html, body {
    width: 100%;
    height: 100%;
  }
  .fillParent {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }
  
  @media only screen and (orientation: portrait){
    .warning {
    display: block;
    z-index: 10000;
    background-color: crimson;
    }
  }
  @media only screen and (orientation: landscape){
    .warning {
      display: none;
    }
  }
  .warning {
    width: 100%;
    height: 100%;
    position: absolute;
  }
  .flex {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .landscape{
    width: 100%;
    height: 100%;
    position: relative;
    text-align: center;
    z-index: 1;
    background: #f7f7ef; 
  }
  .title{
    color: #f7f7ef;
    font-family: Arial;
    text-align: center;
  }



  body {
    background-color: #f7f7ef;
  }
  
  .container {
    margin: 20px auto 0;
    position: relative;
    width: 90%;
  }
  
  img[usemap] {
    border: none;
    height: auto;
    max-width: 100%;
    width: auto;
  }  
  
  p {
    margin: 0;  
  }