Question: My background image is not extending all the way down to the bottom of the window. 

I have set my background image in CSS along with a bunch of properties to make it transparent. This is my CSS:

```
body {    
    background-image: url("http://www.inc.com/uploaded_files/image/970x450/flatiron-school-1940x900_35912.jpg");    
    background-color: rgba(255, 255, 255, .3);    
    background-repeat: no-repeat;    
    background-size: 100% ;      
    background-blend-mode: color;       
}

```

Answer: 
Setting the height of `html, body` to 100% and using [`background-size: cover`](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size#Values) will make the background fill the page. 

Using `background-position: center center` will make it cut even amounts off of the image when it is a different aspect ratio than the window.

```css
html, body {
  height: 100%;
}
body {
  margin: 0;
  background-image: url("//placehold.it/1000x800");
  background-size: cover;
  background-position: center center;
  background-blend-mode: color;   
}
```
Thank you everyone for your help! I updated my code after looking through the answers, and I now have the following (for anyone who had a problem similar to mine):

```
  html, body{
   height: 100%;
 }

 body{
   background-image: url("MyImageURL");   
   background-color: rgba(255, 255, 255, 0.3);   
   background-blend-mode: color; 
   background-size: cover;

 }

```

Basically, adding background-size: cover; and setting the html and body height to 100% was the trick (I had to combine both pieces of code for it to work).