.container-fluid{
	padding: 0;
}
.placeholder {
	margin-top: 20px;
	/* this is the only relevant part for the example */
}
.bg-image-blur, .bg-image, .content, .placeholder{
	bottom: 0;
	width: 20vw;
	height: 12vw;
	position: fixed;
}
.bg-image-blur, .bg-image, .content{
	margin-right: auto;
	margin-left: auto;
}
.bg-image {
	mix-blend-mode: lighten;
}
/* both DIVs have the same image */
.bg-image-blur, .bg-image {
	background-image: url('/img/logo-thepowertoserve_big.png');
	background-size: 20vw;
	background-repeat: no-repeat;
	border-radius: 3vw 3vw 0 0;
}
/* blur the background, to make blurred edges that overflow the unblurred image that is on top */
.bg-image-blur {
	-webkit-filter: blur(1vw);
	-moz-filter: blur(1vw);
	-o-filter: blur(1vw);
	-ms-filter: blur(1vw);
	filter: blur(1vw);
	width: 22vw !important;
	background-size: 22vw !important;
	margin: 0 -1vw -3vw -1vw;
	height: 16vw !important;
}
/* I added this DIV in case you need to place content inside */
.content {
	color: #fff;
	text-shadow: 0 0 3px #000;
	text-align: center;
	font-size: 30px;
}
.container-fluid body .lead .content .bg-image-blur .bg-image-blur .bg-image {
	align-content: center;
	align-items: center;
	align-self: center;
	display: block;
}
.placeholder{
	align-content: center;
	align-items: center;
	align-self: center;
	text-align: center;
	margin-left: 40vw;
	margin-right: 40vw;
 }
body{
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
	background-image: url('/img/bg.jpg');
	background-repeat: no-repeat;
	background-size: 100vw 100vh;
}