Header Image .css fix

Hopefully I'm not overstepping here by mentioning I've noticed a display issue with the GRAsim image header. 

The header image is currently set to repeat, my guess is to accommodate various screen resolutions. The issue is the image isn't exactly one that tiles very well so you end up with a clear mis-alignment behind the bumper of the car.

If you want to accommodate various screen resolutions and remove the clipping all together you could alter the .css from:


#banner {

 display: table-cell;

 height: 200px;

 background-color: #a00d0d;

 background-image: url('http://storage.proboards.com/6057162/i/nNCEhJSNZ2O8yGRxa3r_.jpg');

 background-position: left center;

 background-repeat: repeat;

 vertical-align: middle;

 padding: 0px 20px;

 text-align: left;
To the following:

#banner {

 display: table-cell;

 height: 200px;

 background-color: #a00d0d;

 background-image: url('http://storage.proboards.com/6057162/i/nNCEhJSNZ2O8yGRxa3r_.jpg');

 background-position: left center;

 background-repeat: no-repeat;

 vertical-align: middle;

 background-size: 100%;

 padding: 0px 20px;

 text-align: left;

 overflow: hidden;
...or you could simply add no-repeat behind the image url such as:

background-image: url('http://storage.proboards.com/6057162/i/nNCEhJSNZ2O8yGRxa3r_.jpg') no-repeat;
You must make sure to add background-size: 100%; for this to work properly and scale to all resolutions. 

If you're worried about the image stretching badly on resolutions beyond 1920 you could also remove the locked height value of height: 200px;