• View layout

CSS Code

<style type="text/css">
      body {
        display: grid;
        grid-template-columns: 1fr 2fr;
        grid-template-areas:
          "header bird"
          "article bird";
        grid-gap: 2vw;
        font-family: "Merriweather", serif;
        align-self: center;
      }

      header {
        grid-area: header;
      }

      figure{
        grid-area: bird;
        align-self: center;  
      }

      article {
        grid-area: article;
      }

      h1 {
        color: #015087;
        font-size: var(--font-size-xxxx-large);
      }

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

      @supports (font-variant-caps: small-caps) {
        aricle p:first-of-type::first-line {
          font-feature-settings: normal;
          font-weight: 400;
          font-variant-caps: small-caps;
          
        }
      }

      article p:first-of-type::first-letter {
        -webkit-initial-letter: 3 2;
        
      }
    </style>