/* Blur Glass effect1 */
.ct-blur-glass1 {
backdrop-filter: blur(40px) ;
-webkit-backdrop-filter: blur(40px);
}

Blur glass effect

/* Brighteness Glass effect1 */
.ct-bright-glass1 {
backdrop-filter: brightness(30%);
-webkit-backdrop-filter: brightness(30%);
}

Brightness glass effect

/* Blur + brightness effect1 */
.ct-blur-bright-effect1 {
backdrop-filter: blur(10px) brightness(90%);
-webkit-backdrop-filter: blur(10px) brightness(90%);
}

Blur + Bright effect

  • De standaard backdrop-filter wordt opgepikt door moderne browsers (zoals Firefox, Edge, nieuwere Chrome).

  • De -webkit- versie is nodig voor Safari en enkele oudere browsers.

Zonder die prefix zou het effect bijvoorbeeld op iPhones/Safari niet werken.

.parallax {
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

CSS Class: ct-hover-box

.ct-hover-box:hover {
transform: translateY(-10px) !important;
}

.ct-hover-box:hover p,
.ct-hover-box:hover, .elementor-counter span {
color: var(–theme-palette-color-1) !important
}

Lorum Ipsum

Duis et tellus

Donec vulputate

Quisque ace

Sed posuere

Aenean

Container opacity

CSS code

.blok1 {
opacity: 0.3;
}

.blok2 {
opacity: 0.8;
}

CSS Classes: blok1

CSS Classes: blok2