/*  Basic filter styles  */
.filter {
    position: relative !important;
}

.filter::before {
    content: "" !important;
    display: block !important;
    height: auto !important;
    width: 100% !important;
    top: 0 !important;
    left: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}

/***  Filters  ***/
/*  Nineties  */
.nineties {
    -webkit-filter: contrast(110%) brightness(110%) saturate(130%) !important;
    filter: contrast(110%) brightness(110%) saturate(130%) !important;
}

.nineties::before {
    mix-blend-mode: screen !important;
    background: rgba(243, 106, 188, 0.3) !important;
}


/*  Aden  */
.aden {
    -webkit-filter: contrast(90%) brightness(120%) saturate(85%) hue-rotate(20deg) !important;
    filter: contrast(90%) brightness(120%) saturate(85%) hue-rotate(20deg) !important;
}

.aden::before {
    mix-blend-mode: darken !important;
    background: -webkit-linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(66, 10, 14, 0)) !important;
    background: -webkit-gradient(linear, left top, right top, color-stop(1, rgba(66, 10, 14, 0.2)), to(rgba(66, 10, 14, 0))) !important;
    background: -webkit-linear-gradient(left, rgba(66, 10, 14, 0.2) 1, rgba(66, 10, 14, 0)) !important;
    background: -o-linear-gradient(left, rgba(66, 10, 14, 0.2) 1, rgba(66, 10, 14, 0)) !important;
    background: linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(66, 10, 14, 0)) !important;
}


/*  Brooklyn  */
.brooklyn {
    -webkit-filter: contrast(90%) brightness(110%) !important;
    filter: contrast(90%) brightness(110%) !important;
}

.brooklyn::before {
    mix-blend-mode: overlay !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(168, 223, 193, 0.4) 1, rgba(183, 196, 200, 0.2)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(168, 223, 193, 0.4) 1, rgba(183, 196, 200, 0.2)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(168, 223, 193, 0.4) 1, rgba(183, 196, 200, 0.2)) !important;
}


/*  Earlybird  */
.earlybird {
    -webkit-filter: contrast(90%) sepia(20%) !important;
    filter: contrast(90%) sepia(20%) !important;
}

.earlybird::before {
    mix-blend-mode: overlay !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(208, 186, 142, 1) 20, rgba(29, 2, 16, 0.2)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(208, 186, 142, 1) 20, rgba(29, 2, 16, 0.2)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(208, 186, 142, 1) 20, rgba(29, 2, 16, 0.2)) !important;
}


/*  Gingham  */
.gingham {
    -webkit-filter: brightness(105%) hue-rotate(350deg) !important;
    filter: brightness(105%) hue-rotate(350deg) !important;
}

.gingham::before {
    mix-blend-mode: darken !important;
    background: -webkit-linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0)) !important;
    background: -webkit-gradient(linear, left top, right top, color-stop(1, rgba(66, 10, 14, 0.2)), to(rgba(0, 0, 0, 0))) !important;
    background: -webkit-linear-gradient(left, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0)) !important;
    background: -o-linear-gradient(left, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0)) !important;
    background: linear-gradient(to right, rgba(66, 10, 14, 0.2) 1, rgba(0, 0, 0, 0)) !important;
}


/*  Hudson  */
.hudson {
    -webkit-filter: contrast(90%) brightness(120%) saturate(110%) !important;
    filter: contrast(90%) brightness(120%) saturate(110%) !important;
}

.hudson::before {
    mix-blend-mode: multiply !important;
    opacity: 0.5 !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(255, 177, 166, 1) 50, rgba(52, 33, 52, 1)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(255, 177, 166, 1) 50, rgba(52, 33, 52, 1)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(255, 177, 166, 1) 50, rgba(52, 33, 52, 1)) !important;
}


/*  Inkwell  */
.inkwell {
    -webkit-filter: contrast(110%) brightness(110%) sepia(30%) grayscale(100%) !important;
    filter: contrast(110%) brightness(110%) sepia(30%) grayscale(100%) !important;
}

.inkwell::before {
    background: rgba(0, 0, 0, 0) !important;
}


/*  Lofi  */
.lofi {
    -webkit-filter: contrast(150%) saturate(110%) !important;
    filter: contrast(150%) saturate(110%) !important;
}

.lofi::before {
    mix-blend-mode: multiply !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(0, 0, 0, 0) 70, rgba(34, 34, 34, 1)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(0, 0, 0, 0) 70, rgba(34, 34, 34, 1)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(0, 0, 0, 0) 70, rgba(34, 34, 34, 1)) !important;
}


/*  Perpetua  */
.perpetua::before {
    mix-blend-mode: soft-light !important;
    opacity: 0.5 !important;
    background: -webkit-linear-gradient(to bottom, rgba(0, 91, 154, 1) 1, rgba(61, 193, 230, 0)) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1, rgba(0, 91, 154, 1)), to(rgba(61, 193, 230, 0))) !important;
    background: -webkit-linear-gradient(top, rgba(0, 91, 154, 1) 1, rgba(61, 193, 230, 0)) !important;
    background: -o-linear-gradient(top, rgba(0, 91, 154, 1) 1, rgba(61, 193, 230, 0)) !important;
    background: linear-gradient(to bottom, rgba(0, 91, 154, 1) 1, rgba(61, 193, 230, 0)) !important;
}


/*  Reyes  */
.reyes {
    -webkit-filter: contrast(85%) brightness(110%) saturate(75%) sepia(22%) !important;
    filter: contrast(85%) brightness(110%) saturate(75%) sepia(22%) !important;
}

.reyes::before {
    mix-blend-mode: soft-light !important;
    opacity: 0.5 !important;
    background: rgba(173, 205, 239, 1) !important;
}


/*  Toaster  */
.toaster {
    -webkit-filter: contrast(150%) brightness(90%) !important;
    filter: contrast(150%) brightness(90%) !important;
}

.toaster::before {
    mix-blend-mode: screen !important;
    opacity: 0.5 !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(15, 78, 128, 1) 1, rgba(59, 0, 59, 1)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(15, 78, 128, 1) 1, rgba(59, 0, 59, 1)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(15, 78, 128, 1) 1, rgba(59, 0, 59, 1)) !important;
}


/*  Walden  */
.walden {
    -webkit-filter: brightness(110%) saturate(160%) sepia(30%) hue-rotate(350deg) !important;
    filter: brightness(110%) saturate(160%) sepia(30%) hue-rotate(350deg) !important;
}

.walden::before {
    mix-blend-mode: screen !important;
    opacity: 0.3 !important;
    background: rgba(204, 68, 0, 1) !important;
}


/*  Xpro  */
.xpro {
    -webkit-filter: sepia(30%) !important;
    filter: sepia(30%) !important;
}

.xpro::before {
    mix-blend-mode: color-burn !important;
    background: -webkit-radial-gradient(50% 50%, circle closest-corner, rgba(224, 231, 230, 1) 40, rgba(43, 42, 161, 0.6)) !important;
    background: -o-radial-gradient(50% 50%, circle closest-corner, rgba(224, 231, 230, 1) 40, rgba(43, 42, 161, 0.6)) !important;
    background: radial-gradient(50% 50%, circle closest-corner, rgba(224, 231, 230, 1) 40, rgba(43, 42, 161, 0.6)) !important;
}