@media screen,projection,tv,handheld {
  /* Changed CUE from 25/75 to 20/80 - also updated in agency-ie.css (.05% less for the smaller width) */
  #nav-section {
    width: 20%;
  }
  #content-container {
    width: 80%;
  }

  /* Changed CUE from 67/33 to 75/25 - also updated in agency-ie.css  */
  .article,
  #document-properties,
  #post-page-options,
  #page-feedback {
    width: 75%;
  }
  .aside {
    width: 25%;
    /* accomodate pages where more in asides than article */
    float: right;
    clear: right;
  }

  /* Global alerts - heading and details side-by-side */
  #global-alert .head,
  #global-alert .details {
    display: inline-block;
    vertical-align: top;
    margin: 0 2% 0 0;
  }
  #global-alert .head {
    margin-left: 2%;
  }
  #global-alert .head h2,
  #global-alert .details p {
    margin: 12px 0;
    margin: .75rem 0;
  }
  #global-alert .head {
    width: 20%;
    min-width: 120px;
  }
  #global-alert .details {
    width: 70%;
  }


  /* Masthead banner */
  #header .max-width {
    background-image: url(https://www.stateoftheenvironment.des.qld.gov.au/__data/assets/image/0009/1260198/masthead-bg.png);
    background-position: center bottom;
    background-repeat: no-repeat;
  }

  /* Float topic boxes */
  #topics div {
    width:48%;
    vertical-align: top;
  }
  #topics div.container {
    border-left: 0;
    border-right: 0;
    padding-left: 0;
    padding-right: 0;
    margin-right: 3%;
  }
  #topics div.container.even {
    margin-right: 0;
  }
  /* Add the margins within the div content instead of padding the div. Easier to calc the layout */
  #topics div h3 {
    margin-left: 1.3em;
    margin-right: 1.3em;
  }
  #topics div ul,
  #topics div p {
    margin-left: 1.6em;
    margin-right: 1.6em;
  }
  #topics div h3,
  #topics div ul,
  #topics div p {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
  }

  /* Display panoramas */
  #content p.panorama {
    display: inline;
  }

  /* Footer customisations */
  #fat-footer .section {
    width: 12%; /* Same as CUE, just have to reset after changing in small CSS */
  }
  #fat-footer .box-sizing {
    padding: 2em;
  }

  /* Definition lists table-ified - adjusted widths */
  #content dl.table dt, #content div.dl.table div.dt {
    width: 29%;
    padding: .5em 1%;
  }
  #content dl.table dd, #content div.dl.table div.dd {
    width: 65%;
    border-top-width: 1px;
    padding: .5em 1%;
  }

  /* DL table-ified - allows more text in dds */
  #content dl.verbose dt, #content div.dl.verbose div.dt {
    width: 19%;
    padding: .7em 1%;
  }
  #content dl.verbose dd, #content div.dl.verbose div.dd {
    width: 75%;
    padding: .7em 1%;
  }


}

