@import 'utf-8';

:root {
    --blured-header-55: blur(55px);
    --blured-div-1: blur(25px);
    --blured-div-2: blur(15px);
    --blured-div-3: blur(10px);
    --blured-div-4: blur(5px)
}

/* CLASS */

.header.blured {
    -webkit-backdrop-filter: var(--blured-header-55); /* Safari */
    backdrop-filter: var(--blured-header-55); /* Chrome, Firefox, Opera, Edge */
}

.div.blured-25 {
    -webkit-backdrop-filter: var(--blured-div-1); /* Safari */
    backdrop-filter: var(--blured-div-1); /* Chrome, Firefox, Opera, Edge */
}

.div.blured-15 {
    -webkit-backdrop-filter: var(--blured-div-2); /* Safari */
    backdrop-filter: var(--blured-div-2); /* Chrome, Firefox, Opera, Edge */
}

.div.blured-10 {
    -webkit-backdrop-filter: var(--blured-div-3); /* Safari */
    backdrop-filter: var(--blured-div-3); /* Chrome, Firefox, Opera, Edge */
}

.div.blured-5 {
    -webkit-backdrop-filter: var(--blured-div-4); /* Safari */
    backdrop-filter: var(--blured-div-4); /* Chrome, Firefox, Opera, Edge */
}

/* ID */

#header-blured {
    -webkit-backdrop-filter: var(--blured-header-55); /* Safari */
    backdrop-filter: var(--blured-header-55); /* Chrome, Firefox, Opera, Edge */
}

#div-blured-25 {
    -webkit-backdrop-filter: var(--blured-div-1); /* Safari */
    backdrop-filter: var(--blured-div-1); /* Chrome, Firefox, Opera, Edge */
}

#div-blured-15 {
    -webkit-backdrop-filter: var(--blured-div-2); /* Safari */
    backdrop-filter: var(--blured-div-2); /* Chrome, Firefox, Opera, Edge */
}

#div-blured-10 {
    -webkit-backdrop-filter: var(--blured-div-3); /* Safari */
    backdrop-filter: var(--blured-div-3); /* Chrome, Firefox, Opera, Edge */
}

#div-blured-5 {
    -webkit-backdrop-filter: var(--blured-div-4); /* Safari */
    backdrop-filter: var(--blured-div-4); /* Chrome, Firefox, Opera, Edge */
}