/* Licensed under Creative Commons Zero (CC0) */
/* Author: Henry Schynol */

.glass {
    --blur: blur(10px);
	background: linear-gradient(135deg, rgba(225,225,225,0.1), rgba(225,225,225,0));
	backdrop-filter: var(--blur);
	-webkit-backgrop-filter: var(--blur);
	border-radius: 20px;
	border: 1px solid rgba(225,225,225,0.2);
	box-shadow: 0 8px 32px 0 rgba(0,0,0,0.4);
	transition: .5s;
}

.glass:hover {
	--blur: blur(50px);
	box-shadow: 0 16px 64px 0 rgba(0,0,0,.5);
}

.light-glass {
    --blur: blur(10px);
	background: linear-gradient(135deg, rgba(225,225,225,0.5), rgba(225,225,225,0.2));
	backdrop-filter: var(--blur);
	-webkit-backgrop-filter: var(--blur);
	border-radius: 20px;
	border: 1px solid rgba(225,225,225,0.2);
	box-shadow: 0 8px 32px 0 rgba(0,0,0,0.4);
	transition: .5s;
}

.light-glass:hover {
	--blur: blur(50px);
	box-shadow: 0 16px 64px 0 rgba(0,0,0,.5);
}