body {
  background: $color__background-body; // Fallback for when there is no custom background color defined.
  //background-image: url(./assets/img/background-colors-02.jpg);
  //background-size: cover;
  //background-position: center center;
  //background-repeat: no-repeat;
  position: relative;
}
.liquid-bubbles {
	overflow: hidden;
	float: left;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1000;
	width: 100vw;
	height: 100vh;

}
.bubbles {
	--size: 40vw;
	--position: -10vw;
	position:absolute;
	width: var(--size);
	height: var(--size);
	border-radius: 50%;
	filter: blur(10rem);
	&.bubble-01{
	  top: var(--position);
	  left: var(--position);
	  --bgcolor: var(--bubble-color-01);
		--bgangle: to bottom right;
	}
	&.bubble-02{
	  top: var(--position);
		right: var(--position);
	  --bgcolor: var(--bubble-color-02);
		--bgangle: to bottom left;
	}
	&.bubble-03{
		bottom: var(--position);
	  left: var(--position);
	  --bgcolor: var(--bubble-color-03);
		--bgangle: to top right;
	}
	&.bubble-04{
		bottom: var(--position);
		right: var(--position);
	  --bgcolor: var(--bubble-color-04);
		--bgangle: to top left;
	}
	background: linear-gradient(var(--bgangle),var(--bgcolor), transparent);
}