html {
background: url(img/background0.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

/* First we set the four elements of our vignette
to be on top no matter what and set their initial
width and height which we'll overwrite in the next declarations.
*/
#top, #bottom, #left, #right{
height: 100%;
position: absolute;
z-index: 999;
width: 100%; }

/* Overwriting the default 100% */
#top, #bottom{
height: 15%; }

#left, #right{
width: 15%; }

/* We set the gradient with CSS3 from a solid gray to
a 100% transparent color which should be the same as
the body background color, to have a nice, clean falloff.
And we're also setting the position of the vignette elements.
*/
#top{
background-image: -moz-linear-gradient(100% 100% 90deg, rgba(255, 255, 255, 0), #1b1b1b );
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1b1b1b), to(rgba(255, 255, 255, 0)));
top: 0; }

#bottom{
background-image: -moz-linear-gradient(100% 100% 90deg, #1b1b1b, rgba(255, 255, 255, 0) );
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0)), to(#1b1b1b));
bottom: 0; }

#left{
background-image: -moz-linear-gradient(100% 100% 180deg, rgba(255, 255, 255, 0), #1b1b1b );
background-image: -webkit-gradient(linear, left center, right center, from(#1b1b1b), to(rgba(255, 255, 255, 0)));
left: 0; }

#right{
background-image: -moz-linear-gradient(100% 100% 180deg, #1b1b1b, rgba(255, 255, 255, 0) );
background-image: -webkit-gradient(linear, right center, left center, from(#1b1b1b), to(rgba(255, 255, 255, 0)));
right: 0; }

#centered {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -153px;
  margin-left: -153px;
}