CSS background-image not loading, doesn't seem to find image
<p>I'm making a personal website and my CSS background-image doesn't seem to be working. Link to the site is <a href="http://distorts.me/new/" rel="nofollow">http://distorts.me/new/</a> it seems that it doesn't find the image because it doesn't load, it is just a white area.  (Sorry for the improper punctuation not very literate ) I'm using chrome. </p>

<p>style.css</p>

<pre><code>    body {
    background-image: url("http://distorts.me/new/includes/background.png");
    color: #C0C0C0;
}

.navbar {
  margin-bottom: 0;
  border-radius: 0;
}

.row.content {height: 450px}

.sidenav {
  padding-top: 20px;
  background-color: #808080;
  height: 100%;
  font-size: 20px;
}

a {
  color: #C0C0C0;
  text-decoration: none;
}

a:hover {
    text-decoration: none;
    color: #404040;
}

footer {
  background-color: #555;
  color: white;
  padding: 15px;
}

@media screen and (max-width: 767px) {
  .sidenav {
    height: auto;
    padding: 15px;
  }
  .row.content {height:auto;} 
}
</code></pre>

<p>index.php</p>

<pre><code>    &lt;html lang="en"&gt;
&lt;!-- George M. --&gt;
&lt;!-- 2/26/16 --&gt;
&lt;?php
include 'includes/head.php';
?&gt;
&lt;body oncontextmenu="return false" background="includes/background.png"&gt;
&lt;header class="container-fluid text-center" style="background-color: #404040;"&gt;
    &lt;h1&gt;George M. - Welcome&lt;/h1&gt;
&lt;/header&gt;
&lt;div class="container-fluid text-center"&gt;    
  &lt;div class="row content"&gt;
    &lt;div class="col-sm-2 sidenav" style="height: 183%"&gt;
      &lt;p&gt;&lt;a href="index-2.html"&gt;Home&lt;/a&gt;&lt;/p&gt;
      &lt;p&gt;&lt;a href="/about"&gt;About Me&lt;/a&gt;&lt;/p&gt;
      &lt;p&gt;&lt;a href="/services"&gt;Services&lt;/a&gt;&lt;/p&gt;
      &lt;p&gt;&lt;a href="/contact"&gt;Contact&lt;/a&gt;&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="col-sm-8 text-middle"&gt;
      &lt;h1&gt;Welcome&lt;/h1&gt;
      &lt;p&gt;test&lt;/p&gt;
      &lt;hr&gt; 
      &lt;h3&gt;Test&lt;/h3&gt;
      &lt;p&gt;test&lt;/p&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;footer id="foot" class="container-fluid text-center"&gt;
&lt;/footer&gt;
&lt;script type="text/javascript"&gt;
    document.getElementById('foot').innerHTML = 
    "&lt;p&gt;&amp;copy " + new Date().getFullYear() + " Distorts | George M. All rights reserved. &lt;span style='color: #808070;'&gt;Made by George M.&lt;/span&gt;"
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>head.php</p>

<pre><code>&lt;head&gt; 
    &lt;title&gt;George M | Home&lt;/title&gt;
    &lt;link rel="shortcut icon" href="/favicon.ico"&gt;
    &lt;meta name="author" content="Distorts"&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"&gt;
    &lt;link rel="stylesheet" type="text/css" href="style.css"&gt;
    &lt;script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;/head&gt;
</code></pre>