I'm using Materialize Framework and I want to put 2 logos on the navbar, one next the other.

I'm having trouble trying to accomodate these elements.

This is the [codepen](https://codepen.io/EttoDesune/pen/eXWOYN)

I've tried playing around with the display propertie, but I can't get it right.

```css
    body {
      background-color: gray; 
    }

    .brand-logo {

      display: flex;
      flex-wrap: wrap;
    }

    .brand-logo > #logoUnacar,#svgUnacar {
      line-height: 40px;
      text-align: center;
    }

        #logoUnacar {
          order: 1;
          width: 12%;
        }

        #svgUnacar {
          order: 2;
          width: 50%;
        }
```

```html
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </head>
    <body>
        <nav>
            <div class="nav-wrapper light-blue darken-4">
                <a href="#" class="brand-logo">
                    <img id="svgEscudo" src="https://svgshare.com/i/Bbx.svg">
                    <img id="svgUnacar" src="https://svgshare.com/i/BcX.svg">
                </a>
                <ul id="nav-mobile" class="right hide-on-med-and-down">
                    <li><a href="sass.html">Inicio </a>
                    </li>
                    <li><a href="badges.html">Registrar Proyecto</a>
                    </li>
                </ul>
            </div>
        </nav>
    </body>
    </html>
```