title: Removing a div using media queries
body: <p>I'm trying to remove <code>.navbar-brand&gt;img</code> when the screen size has increased more than 768px using media queries but i'm not getting any luck. The styling that I have applied to the <code>img</code> is removed however the image remains in the same place. 
  I'm using BS4 if that helps </p>
  
  <pre><code>&lt;body&gt;
      &lt;div class="container-fluid"&gt;
          &lt;nav class="navbar-expand-lg navbar navbar-light"&gt;
              &lt;!-- Image and text --&gt;
               &lt;a class="navbar-brand" href="#"&gt;&lt;img alt="" class="d-inline-block align-top" height="30" src="img/SpartanHead.png" width="30"&gt;&lt;/a&gt; &lt;button aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation" class="navbar-toggler" data-target="#navbarNav" data-toggle="collapse" type="button"&gt;&lt;span class="navbar-toggler-icon"&gt;&lt;i class="fas fa-bars"&gt;&lt;/i&gt;&lt;/span&gt;&lt;/button&gt;
  
              &lt;div class="collapse navbar-collapse justify-content-center" id="navbarNav"&gt;
                  &lt;ul class="navbar-nav"&gt;
                      &lt;li class="nav-item active"&gt;
                          &lt;a class="nav-link" href="about.html"&gt;ABOUT&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/nav&gt;
      &lt;/div&gt;
  &lt;/body&gt; 
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.navbar {
    background-color: #2A2F35;
    padding: 0 !important;
  }
  /*Navbar Links*/
  
  .navbar-nav a {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-size: 14px;
    font-weight: 100;
    letter-spacing: 1px;
    color: #ffffff !important;
    padding: 25px;
    margin: 0px 25px 0px 25px;
  }
  
  @media only screen and (max-width: 768px) {
    .navbar-brand&gt;img {
        width: auto;
        max-height: 90px;
        margin: 10px 0px 10px 30px;
    }
  }
  
  @media screen and (min-width: 768px) {
    .navbar-brand&gt;img {
      display: none;
    }
  }
  </code></pre>