• View the layout
• view code

CSS Code

<style type="text/css">
      body {
        font-family: 'Noto Sans', sans-serif;
      }

      img {
        width: 100%;
      }

      @media (min-width: 48em) {
        body {
          display: grid;
          grid-template-columns: repeat(6, 1fr);
          grid-template-rows: 2fr 2f 1fr 2fr 2fr 4fr;
          grid-gap: 1vw;
        }

        img {
          width: initial;
        }
      }

      h1 {
        font-family: 'Courier New', Courier, monospace;
        font-weight: 700;
      }

      h1>span {
        color: #0096db;
      }

      header {
        grid-column: 4 / 5;
        grid-row: 2 / 3;
        align-self: end;
      }

      .standfirst {
        grid-column: 4 / 6;
      }

      img {
        grid-column: 3 / 4;
        grid-row: 1 / 3;
      }

      article {
        grid-column: 3 / 4;
        grid-row: 4 / 7;
      }

      article p:first-of-type::first-line {
        font-weight: 700;
        font-feature-settings: "smp"1;
        color: #015087;
      }

      article p:first-of-type::first-letter {
        -webkit-initial-letter: 3 2;
      }

    </style>