body, html {
    height: 100vh;
    
    /* The image used */
    background-image: url("pics/background.jpg");
    
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    
    /* Half height */
    
    /* Center and scale the image nicely */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
}

a {color: #000000;}
a:hover {color: #1710ec;}

.whiteoverlay {
    height: 100vh;
    width: 75%;
    background-color: rgba(255, 255, 255, 0.4);
    overflow: auto;
    position: absolute;
    transform: translate(
    16.5%,
    0%
    );
    z-index: 2;
}

.blurred {
    background: inherit;
    height: 100vh; /* h */
    width: 75%;
    position: absolute;
    overflow: auto;
    transform: translate(
    16.5%,
    0%
    ); /* - [cl - (cw/2)] % ,  -[ct - (ch/2)] %*/
    filter: blur(10px);
    z-index: 1;
}

@media (max-width: 800px) {
    .whitish {
	width: 100%;
	transform: translate(
	    0%,
	    0%
	);
    }

    .blur {
	width: 100%;
	transform: translate(
	    0%,
	    0%
	); /* - [cl - (cw/2)] % ,  -[ct - (ch/2)] %*/
    }
}