@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-cyrillic-ext.ef54216e.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-cyrillic.969ea6a3.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-greek-ext.04782fd5.woff2) format("woff2");unicode-range:u+1f??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-greek.9e4a3805.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-symbols.f5851590.woff2) format("woff2");unicode-range:u+0001-000c,u+000e-001f,u+007f-009f,u+20dd-20e0,u+20e2-20e4,u+2150-218f,u+2190,u+2192,u+2194-2199,u+21af,u+21e6-21f0,u+21f3,u+2218-2219,u+2299,u+22c4-22c6,u+2300-243f,u+2440-244a,u+2460-24ff,u+25a0-27bf,u+28??,u+2921-2922,u+2981,u+29bf,u+29eb,u+2b??,u+4dc0-4dff,u+fff9-fffb,u+10140-1018e,u+10190-1019c,u+101a0,u+101d0-101fd,u+102e0-102fb,u+10e60-10e7e,u+1d2c0-1d2d3,u+1d2e0-1d37f,u+1f0??,u+1f100-1f1ad,u+1f1e6-1f1ff,u+1f30d-1f30f,u+1f315,u+1f31c,u+1f31e,u+1f320-1f32c,u+1f336,u+1f378,u+1f37d,u+1f382,u+1f393-1f39f,u+1f3a7-1f3a8,u+1f3ac-1f3af,u+1f3c2,u+1f3c4-1f3c6,u+1f3ca-1f3ce,u+1f3d4-1f3e0,u+1f3ed,u+1f3f1-1f3f3,u+1f3f5-1f3f7,u+1f408,u+1f415,u+1f41f,u+1f426,u+1f43f,u+1f441-1f442,u+1f444,u+1f446-1f449,u+1f44c-1f44e,u+1f453,u+1f46a,u+1f47d,u+1f4a3,u+1f4b0,u+1f4b3,u+1f4b9,u+1f4bb,u+1f4bf,u+1f4c8-1f4cb,u+1f4d6,u+1f4da,u+1f4df,u+1f4e3-1f4e6,u+1f4ea-1f4ed,u+1f4f7,u+1f4f9-1f4fb,u+1f4fd-1f4fe,u+1f503,u+1f507-1f50b,u+1f50d,u+1f512-1f513,u+1f53e-1f54a,u+1f54f-1f5fa,u+1f610,u+1f650-1f67f,u+1f687,u+1f68d,u+1f691,u+1f694,u+1f698,u+1f6ad,u+1f6b2,u+1f6b9-1f6ba,u+1f6bc,u+1f6c6-1f6cf,u+1f6d3-1f6d7,u+1f6e0-1f6ea,u+1f6f0-1f6f3,u+1f6f7-1f6fc,u+1f7??,u+1f800-1f80b,u+1f810-1f847,u+1f850-1f859,u+1f860-1f887,u+1f890-1f8ad,u+1f8b0-1f8bb,u+1f8c0-1f8c1,u+1f900-1f90b,u+1f93b,u+1f946,u+1f984,u+1f996,u+1f9e9,u+1fa00-1fa6f,u+1fa70-1fa7c,u+1fa80-1fa89,u+1fa8f-1fac6,u+1face-1fadc,u+1fadf-1fae9,u+1faf0-1faf8,u+1fb??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-vietnamese.b13ae75f.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-latin-ext.6d1ff22c.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:400;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-400-latin.75e6c243.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-cyrillic-ext.ef54216e.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-cyrillic.969ea6a3.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-greek-ext.04782fd5.woff2) format("woff2");unicode-range:u+1f??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-greek.9e4a3805.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-symbols.f5851590.woff2) format("woff2");unicode-range:u+0001-000c,u+000e-001f,u+007f-009f,u+20dd-20e0,u+20e2-20e4,u+2150-218f,u+2190,u+2192,u+2194-2199,u+21af,u+21e6-21f0,u+21f3,u+2218-2219,u+2299,u+22c4-22c6,u+2300-243f,u+2440-244a,u+2460-24ff,u+25a0-27bf,u+28??,u+2921-2922,u+2981,u+29bf,u+29eb,u+2b??,u+4dc0-4dff,u+fff9-fffb,u+10140-1018e,u+10190-1019c,u+101a0,u+101d0-101fd,u+102e0-102fb,u+10e60-10e7e,u+1d2c0-1d2d3,u+1d2e0-1d37f,u+1f0??,u+1f100-1f1ad,u+1f1e6-1f1ff,u+1f30d-1f30f,u+1f315,u+1f31c,u+1f31e,u+1f320-1f32c,u+1f336,u+1f378,u+1f37d,u+1f382,u+1f393-1f39f,u+1f3a7-1f3a8,u+1f3ac-1f3af,u+1f3c2,u+1f3c4-1f3c6,u+1f3ca-1f3ce,u+1f3d4-1f3e0,u+1f3ed,u+1f3f1-1f3f3,u+1f3f5-1f3f7,u+1f408,u+1f415,u+1f41f,u+1f426,u+1f43f,u+1f441-1f442,u+1f444,u+1f446-1f449,u+1f44c-1f44e,u+1f453,u+1f46a,u+1f47d,u+1f4a3,u+1f4b0,u+1f4b3,u+1f4b9,u+1f4bb,u+1f4bf,u+1f4c8-1f4cb,u+1f4d6,u+1f4da,u+1f4df,u+1f4e3-1f4e6,u+1f4ea-1f4ed,u+1f4f7,u+1f4f9-1f4fb,u+1f4fd-1f4fe,u+1f503,u+1f507-1f50b,u+1f50d,u+1f512-1f513,u+1f53e-1f54a,u+1f54f-1f5fa,u+1f610,u+1f650-1f67f,u+1f687,u+1f68d,u+1f691,u+1f694,u+1f698,u+1f6ad,u+1f6b2,u+1f6b9-1f6ba,u+1f6bc,u+1f6c6-1f6cf,u+1f6d3-1f6d7,u+1f6e0-1f6ea,u+1f6f0-1f6f3,u+1f6f7-1f6fc,u+1f7??,u+1f800-1f80b,u+1f810-1f847,u+1f850-1f859,u+1f860-1f887,u+1f890-1f8ad,u+1f8b0-1f8bb,u+1f8c0-1f8c1,u+1f900-1f90b,u+1f93b,u+1f946,u+1f984,u+1f996,u+1f9e9,u+1fa00-1fa6f,u+1fa70-1fa7c,u+1fa80-1fa89,u+1fa8f-1fac6,u+1face-1fadc,u+1fadf-1fae9,u+1faf0-1faf8,u+1fb??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-vietnamese.b13ae75f.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-latin-ext.6d1ff22c.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:500;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-500-latin.75e6c243.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-cyrillic-ext.ef54216e.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-cyrillic.969ea6a3.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-greek-ext.04782fd5.woff2) format("woff2");unicode-range:u+1f??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-greek.9e4a3805.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-symbols.f5851590.woff2) format("woff2");unicode-range:u+0001-000c,u+000e-001f,u+007f-009f,u+20dd-20e0,u+20e2-20e4,u+2150-218f,u+2190,u+2192,u+2194-2199,u+21af,u+21e6-21f0,u+21f3,u+2218-2219,u+2299,u+22c4-22c6,u+2300-243f,u+2440-244a,u+2460-24ff,u+25a0-27bf,u+28??,u+2921-2922,u+2981,u+29bf,u+29eb,u+2b??,u+4dc0-4dff,u+fff9-fffb,u+10140-1018e,u+10190-1019c,u+101a0,u+101d0-101fd,u+102e0-102fb,u+10e60-10e7e,u+1d2c0-1d2d3,u+1d2e0-1d37f,u+1f0??,u+1f100-1f1ad,u+1f1e6-1f1ff,u+1f30d-1f30f,u+1f315,u+1f31c,u+1f31e,u+1f320-1f32c,u+1f336,u+1f378,u+1f37d,u+1f382,u+1f393-1f39f,u+1f3a7-1f3a8,u+1f3ac-1f3af,u+1f3c2,u+1f3c4-1f3c6,u+1f3ca-1f3ce,u+1f3d4-1f3e0,u+1f3ed,u+1f3f1-1f3f3,u+1f3f5-1f3f7,u+1f408,u+1f415,u+1f41f,u+1f426,u+1f43f,u+1f441-1f442,u+1f444,u+1f446-1f449,u+1f44c-1f44e,u+1f453,u+1f46a,u+1f47d,u+1f4a3,u+1f4b0,u+1f4b3,u+1f4b9,u+1f4bb,u+1f4bf,u+1f4c8-1f4cb,u+1f4d6,u+1f4da,u+1f4df,u+1f4e3-1f4e6,u+1f4ea-1f4ed,u+1f4f7,u+1f4f9-1f4fb,u+1f4fd-1f4fe,u+1f503,u+1f507-1f50b,u+1f50d,u+1f512-1f513,u+1f53e-1f54a,u+1f54f-1f5fa,u+1f610,u+1f650-1f67f,u+1f687,u+1f68d,u+1f691,u+1f694,u+1f698,u+1f6ad,u+1f6b2,u+1f6b9-1f6ba,u+1f6bc,u+1f6c6-1f6cf,u+1f6d3-1f6d7,u+1f6e0-1f6ea,u+1f6f0-1f6f3,u+1f6f7-1f6fc,u+1f7??,u+1f800-1f80b,u+1f810-1f847,u+1f850-1f859,u+1f860-1f887,u+1f890-1f8ad,u+1f8b0-1f8bb,u+1f8c0-1f8c1,u+1f900-1f90b,u+1f93b,u+1f946,u+1f984,u+1f996,u+1f9e9,u+1fa00-1fa6f,u+1fa70-1fa7c,u+1fa80-1fa89,u+1fa8f-1fac6,u+1face-1fadc,u+1fadf-1fae9,u+1faf0-1faf8,u+1fb??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-vietnamese.b13ae75f.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-latin-ext.6d1ff22c.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:600;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-600-latin.75e6c243.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-cyrillic-ext.ef54216e.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-cyrillic.969ea6a3.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-greek-ext.04782fd5.woff2) format("woff2");unicode-range:u+1f??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-greek.9e4a3805.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-symbols.f5851590.woff2) format("woff2");unicode-range:u+0001-000c,u+000e-001f,u+007f-009f,u+20dd-20e0,u+20e2-20e4,u+2150-218f,u+2190,u+2192,u+2194-2199,u+21af,u+21e6-21f0,u+21f3,u+2218-2219,u+2299,u+22c4-22c6,u+2300-243f,u+2440-244a,u+2460-24ff,u+25a0-27bf,u+28??,u+2921-2922,u+2981,u+29bf,u+29eb,u+2b??,u+4dc0-4dff,u+fff9-fffb,u+10140-1018e,u+10190-1019c,u+101a0,u+101d0-101fd,u+102e0-102fb,u+10e60-10e7e,u+1d2c0-1d2d3,u+1d2e0-1d37f,u+1f0??,u+1f100-1f1ad,u+1f1e6-1f1ff,u+1f30d-1f30f,u+1f315,u+1f31c,u+1f31e,u+1f320-1f32c,u+1f336,u+1f378,u+1f37d,u+1f382,u+1f393-1f39f,u+1f3a7-1f3a8,u+1f3ac-1f3af,u+1f3c2,u+1f3c4-1f3c6,u+1f3ca-1f3ce,u+1f3d4-1f3e0,u+1f3ed,u+1f3f1-1f3f3,u+1f3f5-1f3f7,u+1f408,u+1f415,u+1f41f,u+1f426,u+1f43f,u+1f441-1f442,u+1f444,u+1f446-1f449,u+1f44c-1f44e,u+1f453,u+1f46a,u+1f47d,u+1f4a3,u+1f4b0,u+1f4b3,u+1f4b9,u+1f4bb,u+1f4bf,u+1f4c8-1f4cb,u+1f4d6,u+1f4da,u+1f4df,u+1f4e3-1f4e6,u+1f4ea-1f4ed,u+1f4f7,u+1f4f9-1f4fb,u+1f4fd-1f4fe,u+1f503,u+1f507-1f50b,u+1f50d,u+1f512-1f513,u+1f53e-1f54a,u+1f54f-1f5fa,u+1f610,u+1f650-1f67f,u+1f687,u+1f68d,u+1f691,u+1f694,u+1f698,u+1f6ad,u+1f6b2,u+1f6b9-1f6ba,u+1f6bc,u+1f6c6-1f6cf,u+1f6d3-1f6d7,u+1f6e0-1f6ea,u+1f6f0-1f6f3,u+1f6f7-1f6fc,u+1f7??,u+1f800-1f80b,u+1f810-1f847,u+1f850-1f859,u+1f860-1f887,u+1f890-1f8ad,u+1f8b0-1f8bb,u+1f8c0-1f8c1,u+1f900-1f90b,u+1f93b,u+1f946,u+1f984,u+1f996,u+1f9e9,u+1fa00-1fa6f,u+1fa70-1fa7c,u+1fa80-1fa89,u+1fa8f-1fac6,u+1face-1fadc,u+1fadf-1fae9,u+1faf0-1faf8,u+1fb??}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-vietnamese.b13ae75f.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-latin-ext.6d1ff22c.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-display:swap;font-family:Roboto;font-stretch:100%;font-style:normal;font-weight:700;src:url(//www.sitemakerslab.com/wp-content/plugins/pojo-accessibility/assets/build/fonts/Roboto-700-latin.75e6c243.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}.ea11y-skip-to-content-link{clip:rect(1px,1px,1px,1px);align-items:center;background-color:#fff;border:1px solid #2563eb;border-radius:12px;clip-path:inset(50%);color:#0c0d0e;display:flex;gap:8px;height:1px;margin:-1px;overflow:hidden;padding:0;pointer-events:none;position:fixed;text-decoration:none;width:1px;word-wrap:normal!important}.ea11y-skip-to-content-link:focus{clip:auto!important;clip-path:none;height:auto;inset-block-start:30px;inset-inline-start:30px;padding:16px 24px;pointer-events:auto;width:auto;z-index:100000}.ea11y-skip-to-content-link:focus+.ea11y-skip-to-content-backdrop{background-color:rgba(0,0,0,.5);inset:0;position:fixed;z-index:9999}:where(.wp-block-button__link){border-radius:9999px}.spectra-background-video{position:relative;--spectra-background-gradient:initial;--spectra-background-color:transparent;--spectra-background-gradient-hover:initial;--spectra-background-color-hover:transparent}.spectra-background-video__wrapper{border-radius:unset;inset:0;overflow:hidden;position:absolute;z-index:0}.spectra-background-video__wrapper video{height:auto;left:50%;min-block-size:inherit;min-height:100%;min-width:100%;-o-object-fit:cover;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:auto}.spectra-background-video__wrapper~*{position:relative;z-index:2}.spectra-background-video>.spectra-background-video__wrapper--overlay:after{background:var(--spectra-background-gradient,var(--spectra-background-color));content:"";inset:0;opacity:var(--spectra-overlay-opacity,1);pointer-events:none;position:absolute}.spectra-background-video:hover>.spectra-background-video__wrapper--overlay:after{background:var(--spectra-background-gradient-hover,var(--spectra-background-color-hover,var(--spectra-background-gradient,var(--spectra-background-color))));opacity:var(--spectra-overlay-opacity)}body .wp-block-spectra-container:not(.alignfull):where([class*=gs-]){width:auto}body .spectra-is-root-container.alignfull{max-width:none}body .spectra-is-root-container.alignwide{margin-left:auto!important;margin-right:auto!important}body .spectra-is-root-container.alignwide,body .spectra-is-root-container.alignwide>*{max-width:var(--wp--style--global--wide-size,1164px)}body .wp-block-spectra-container.spectra-is-root-container:where(:not(.alignwide):not(.alignfull)){margin-left:auto!important;margin-right:auto!important;max-width:var(--wp--style--global--content-size)}body .entry-content{max-width:unset}body .wp-block-spectra-container.spectra-no-padding{padding:0}body .wp-block-spectra-container.spectra-no-width{width:auto}body .spectra-no-nav-container>.wp-block-navigation__container{display:contents}body .spectra-no-nav-container .wp-block-navigation-item{display:revert}body .wp-block-navigation.spectra-no-nav-container{align-items:revert;flex-wrap:revert;gap:revert}body .wp-block-spectra-container.spectra-no-block-gap,body .wp-block-spectra-counter-child-wrapper.spectra-no-block-gap{-moz-column-gap:0;column-gap:0;row-gap:0}body .wp-block-spectra-container.spectra-no-block-gap>:where(.block-editor-inner-blocks)>:where(.block-editor-block-list__layout)>:where(:not(h4,h5,h6)){margin-block-start:0}[hidden]{display:none!important}header.zipai-imported-header{display:contents}
body.spectra-page-zip-builder :where(.entry-content) :where(figure.wp-block-image){border:0;border-radius:0;margin:0}body.spectra-page-zip-builder :where(.entry-content) :where(.wp-block-image img){border-radius:0}body.spectra-page-zip-builder :where(.entry-content) :where(.wp-block-image img[width]){height:auto}:where(body.spectra-page-zip-builder) .wp-block-template-part>.wp-block-group,:where(body.spectra-page-zip-builder) footer.wp-block-template-part,:where(body.spectra-page-zip-builder) header.wp-block-template-part{display:contents}:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header{display:block;max-width:none;width:100%}:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header>.wp-block-group,:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header>.wp-block-group>[class*=-hdr]{background:transparent;border-color:transparent}:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header [class*=-hdr] a:not([class*=btn]),:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header [class*=-nav] a:not([class*=btn]),:where(body.spectra-page-zip-builder) header.wp-block-template-part.swt-transparent-header [class*=-wordmark]{color:var(--background,#fff)}body.spectra-page-zip-builder :where(.is-layout-flow,.is-layout-constrained)>:where(:not(h4,h5,h6)){margin-block-end:0;margin-block-start:0}:where(body.spectra-page-zip-builder) .entry-content.wp-block-post-content{margin-top:0}:where(body.spectra-page-zip-builder) :where(.wp-block-group){padding-left:0;padding-right:0}body.spectra-page-zip-builder :where(.wp-block-template-part,.entry-content) :where(.wp-block-navigation){font-size:revert;font-weight:revert;letter-spacing:revert;line-height:revert}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-form:is([class^=gs-],[class*=" gs-"]) .srfm-block-wrap),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-form:is([class^=gs-],[class*=" gs-"]) .srfm-input-content),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-form:is([class^=gs-],[class*=" gs-"]) .srfm-submit-container .wp-block-button),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-form:is([class^=gs-],[class*=" gs-"]) .srfm-submit-container){display:contents}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-form:not([class^=gs-]):not([class*=" gs-"])){display:flex;flex-direction:column;row-gap:16px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-email-block),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-email-confirm-block){display:flex;flex-direction:column;gap:inherit;min-width:0}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-description){order:1}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-error-wrap){order:2}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-block:not(.srfm-error):not(.srfm-valid-email-error) .srfm-error-wrap:not(:has(.srfm-char-counter-wrap))){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none) :where(.srfm-email-confirm-block.srfm-error) .srfm-error-wrap{display:block}body.spectra-page-zip-builder :where(.srfm-styling-none *),body.spectra-page-zip-builder :where(.srfm-styling-none){box-sizing:border-box}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-input-common:not(.srfm-input-checkbox):not(.srfm-input-gdpr)){max-width:100%;width:100%}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-input-checkbox),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-input-gdpr){height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border:0;clip-path:inset(50%);white-space:nowrap}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-block){min-width:0}body.spectra-page-zip-builder :where(.srfm-styling-none fieldset){border:none;display:flex;flex-direction:column;gap:inherit;margin:0;min-width:0;padding:0}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-block-label){display:block}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-block-legend){display:block;margin-block-end:8px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-inline-svg){height:0;pointer-events:none;position:absolute;width:0}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-cbx){align-items:flex-start;cursor:pointer;display:flex;gap:8px;width:100%}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-cbx .srfm-span-wrap:first-child){border:1px solid;border-radius:4px;flex:0 0 auto;height:18px;position:relative;width:18px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-cbx .srfm-span-wrap:first-child svg){fill:none;height:10px;left:50%;opacity:0;position:absolute;stroke:currentcolor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;top:50%;transform:translate(-50%,-50%);width:12px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-input-common:checked+.srfm-cbx .srfm-span-wrap:first-child svg){opacity:1}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-cbx .srfm-span-wrap:last-child){flex:1;max-width:calc(100% - 30px);min-width:0}body.spectra-page-zip-builder :where(.srfm-styling-none) :where(.srfm-multi-choice-block) .srfm-block-wrap{display:flex;flex-wrap:wrap;gap:8px 16px}body.spectra-page-zip-builder :where(.srfm-styling-none) :where(.srfm-multi-choice-block) .srfm-vertical-layout{flex-direction:column}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-multi-choice-single .srfm-block-content-wrap),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-multi-choice-single .srfm-option-container),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-multi-choice-single){align-items:center;display:flex;gap:8px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-multi-choice-single .srfm-icon-container){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-input-multi-choice-single){flex:0 0 auto;height:16px;margin:0;width:16px}body.spectra-page-zip-builder :where(.srfm-styling-none .ts-wrapper:is([class^=gs-],[class*=" gs-"]) .ts-control){background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;min-height:0!important;padding-bottom:0!important;padding-left:0!important;padding-top:0!important}body.spectra-page-zip-builder :where(.srfm-styling-none .ts-wrapper:is([class^=gs-],[class*=" gs-"]) .ts-control):after,body.spectra-page-zip-builder :where(.srfm-styling-none .ts-wrapper:is([class^=gs-],[class*=" gs-"]) .ts-dropdown-icon){display:none!important}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common.single .item .remove){display:none!important}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common.single.has-items .ts-control input[id^=tomselect-]){flex:0 0 0!important;height:0;min-width:0!important;padding:0;width:0}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .clear-button){height:16px;left:auto!important;position:absolute;right:2.25em!important;top:50%;transform:translateY(-50%);visibility:hidden;width:16px}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common.has-items .clear-button){visibility:visible}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .ts-control){align-items:center;color:inherit;flex-wrap:nowrap;font-size:inherit;gap:0;line-height:inherit;--ts-pr-caret:2.25em}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .item),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .ts-control input){color:inherit!important;font-size:inherit!important;line-height:inherit!important}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .ts-control input)::-moz-placeholder{color:inherit;opacity:1}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .ts-control input)::placeholder{color:inherit;opacity:1}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .item){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-dropdown-common .ts-dropdown-icon){position:absolute;right:.75em}body.spectra-page-zip-builder :where(.srfm-styling-none) .ts-wrapper.dropdown-active{position:relative;z-index:20}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-required){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-error-message){color:var(--srfm-imported-error-color,var(--error,#dc2626));display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-error) :where(.srfm-error-message),body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-valid-email-error) :where(.srfm-error-message){display:block}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-success-box){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-success-box.srfm-active){align-items:center;display:flex;flex-direction:column;justify-content:center;white-space:pre-wrap}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-success-box-description){align-items:center;display:flex;flex-direction:column;gap:8px;text-align:center}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-loader){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-hidden-block){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none .srfm-display-none){display:none}body.spectra-page-zip-builder :where(.srfm-styling-none) .srfm-hide{display:none}body.spectra-page-zip-builder :where(.entry-content,.wp-block-template-part) :where(.wp-block-spectra-content){overflow-wrap:revert;word-break:revert}body.spectra-page-zip-builder :where(.entry-content,.wp-block-template-part) :where(.wp-element-button,.wp-block-button__link){background-color:revert;border:revert;border-radius:revert;line-height:revert;padding:revert}body.spectra-page-zip-builder :where(.entry-content,.wp-block-template-part) :where(.wp-element-button,.wp-block-button__link):hover{background-color:revert;border:revert}body.spectra-page-zip-builder :where(.entry-content,.wp-block-template-part) :where(.wp-block-spectra-icon:not([class*=is-content-justification])){justify-content:flex-start}body.spectra-page-zip-builder .wp-block-spectra-countdown :where(span),body.spectra-page-zip-builder .wp-block-spectra-counter :where(.spectra-counter-value,.spectra-counter-number,.spectra-counter-prefix,.spectra-counter-suffix){color:inherit}body.spectra-page-zip-builder :where(.entry-content,.wp-block-template-part) :where(.wp-block-spectra-counter-child-wrapper){align-items:stretch}body.spectra-page-zip-builder .wp-block-spectra-countdown{text-transform:revert}body.spectra-page-zip-builder :where(.entry-content) .wp-block-navigation :where(a){text-decoration:none}
.editor-styles-wrapper .block-editor-block-list__block .block-list-appender:is(.wp-block):has(.spectra-editor__block-appender--full-width){align-items:center;display:flex;height:100%;justify-content:stretch;min-block-size:inherit;width:100%}.editor-styles-wrapper .block-editor-block-list__block .block-list-appender:is(.wp-block):has(.spectra-editor__block-appender--full-width)>.block-editor-inserter{flex:1}.editor-styles-wrapper .block-editor-block-list__block .block-list-appender:is(.wp-block) button.spectra-editor__block-appender{background-color:transparent;border-radius:0;border-width:0;box-shadow:none;box-sizing:border-box;color:inherit;cursor:pointer;font:inherit;letter-spacing:inherit;line-height:normal;margin:0;outline:0;padding:0;text-decoration:none;text-transform:none;word-spacing:inherit}.editor-styles-wrapper .block-editor-block-list__block .block-list-appender:is(.wp-block) button.spectra-editor__block-appender--full-width{align-items:center;border:1px dashed #d5dadf;border-radius:4px;color:#757575;display:flex;height:100%;justify-content:center;padding:1rem;transition:all .2s;width:100%}.editor-styles-wrapper .block-editor-block-list__block .block-list-appender:is(.wp-block) button.spectra-editor__block-appender--full-width:hover{border:1px dashed var(--wp-components-color-accent,var(--wp-admin-theme-color,#2563eb));color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#2563eb))}
.spectra-icon-picker{aspect-ratio:16/9;border:1px solid #ddd;border-radius:2px;overflow:hidden;padding:3px;position:relative;transition:border-color .1s;width:100%}.spectra-icon-picker:hover{border-color:#1e1e1e}.spectra-icon-picker:hover .spectra-icon-picker__button--select{transform:translateY(0)}.spectra-icon-picker:hover .spectra-icon-picker__control--value{color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba))}.spectra-icon-picker button.spectra-icon-picker__button--remove{background:transparent;border:none;box-shadow:none;color:#1e1e1e;cursor:pointer;height:20px;outline:none;position:absolute;right:3px;top:3px;transition-duration:.1s;transition-property:color,background-color;width:20px}.spectra-icon-picker button.spectra-icon-picker__button--remove:focus,.spectra-icon-picker button.spectra-icon-picker__button--remove:focus-visible,.spectra-icon-picker button.spectra-icon-picker__button--remove:hover{background:#1e1e1e;border:none;box-shadow:none;color:#fff;outline:none}.spectra-icon-picker button.spectra-icon-picker__button--remove svg{fill:currentcolor;max-height:100%;max-width:100%}.spectra-icon-picker button.spectra-icon-picker__button--select{background:#1e1e1e;border:none;bottom:3px;box-shadow:none;color:#fff;cursor:pointer;height:2em;left:3px;outline:none;position:absolute;transform:translateY(calc(100% + 3px));transition:transform .1s;width:calc(100% - 6px)}.spectra-icon-picker button.spectra-icon-picker__button--select:focus,.spectra-icon-picker button.spectra-icon-picker__button--select:focus-visible,.spectra-icon-picker button.spectra-icon-picker__button--select:hover{background:#1e1e1e;border:none;box-shadow:none;color:#fff;outline:none;transform:translateY(0)}.spectra-icon-picker button.spectra-icon-picker__button--select svg{fill:currentcolor;max-height:100%;max-width:100%}.spectra-icon-picker__control{cursor:pointer;height:100%;width:100%}.spectra-icon-picker__control--value{align-items:center;color:#7e7e7e;display:flex;height:100%;justify-content:center;transition:color .1s;width:100%}.spectra-icon-picker__control--value svg{max-height:32px;max-width:32px}.spectra-icon-picker__control--empty{align-items:center;color:#ddd;display:flex;height:100%;justify-content:center;width:100%}.spectra-icon-picker__control--empty svg{fill:currentcolor;max-height:32px;max-width:32px}.components-modal__screen-overlay.uagb-ip-modal-wrapper-overlay{background-color:rgba(0,0,0,.7)}.components-modal__frame.uagb-ip-modal-wrapper{box-sizing:border-box;height:796px;max-height:80%;max-width:80%;overflow:unset;width:1080px}.components-modal__frame.uagb-ip-modal-wrapper *{box-sizing:border-box}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content{background-color:#fff;border-radius:2px;margin:0;overflow:unset;padding:30px 24px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content>div:not(.components-modal__header){height:100%}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .components-modal__header{height:0}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .components-modal__header .components-modal__header-heading-container{display:none!important}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .components-modal__header .components-button{color:#aaa;height:12px;left:auto;position:absolute;right:-32px;top:4px;transition:color .2s linear;width:12px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .components-modal__header .components-button svg{height:20px;width:20px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .components-modal__header .components-button:hover{color:#fff}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .uagb-ip-header{align-items:baseline;display:flex;height:64px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .uagb-ip-header>h2{color:#1e1e1e;font-size:20px;font-weight:400;margin:0;width:156px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .uagb-ip-footer{align-items:flex-end;display:flex;height:68px;justify-content:flex-end;text-align:right}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .uagb-ip-footer>button{background-color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba));border:none;border-radius:2px;color:#fff;cursor:pointer;font-size:13px;height:36px;width:89px}.components-modal__frame.uagb-ip-modal-wrapper .components-modal__content .uagb-ip-footer>button.disable{cursor:not-allowed;opacity:.7}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-lr-container{display:flex;height:calc(100% - 134px);grid-gap:24px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-lr-container .uagb-ip-left{overflow:auto;width:156px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-lr-container .uagb-ip-right{border:1px solid #e6e7e9;border-radius:2px;flex:1;padding:14px 0 14px 14px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-lr-container .uagb-ip-right .uagb-ip-modal-container{height:100%}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-lr-container .uagb-ip-right .uagb-ip-modal-container .ReactVirtualized__Grid__innerScrollContainer>div{align-items:center;display:flex;justify-content:center}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-categories-list>div{border-radius:2px;color:#1d2327;cursor:pointer;display:flex;font-size:13px;justify-content:space-between;padding:9px 10px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-categories-list>div.selected{background-color:#dcf2ff;color:#0063a1}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container{flex:1;padding-left:24px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar{position:relative}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar>span,.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar>svg{color:#555d66;fill:#555d66;height:14px;left:12px;position:absolute;top:11px;transform:rotate(90deg);width:14px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar>span{cursor:pointer;width:unset}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar input{border:1px solid #e6e7e9;border-radius:2px;color:#1d2327;height:36px;margin:0;padding:7px 12px 7px 38px;width:100%}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar input::-moz-placeholder{color:#50575e}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar input::placeholder{color:#50575e}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-search-container .uagb-ip-search-bar input:focus{border:1.5px solid var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba))}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .ReactVirtualized__Grid__innerScrollContainer{max-width:inherit!important;overflow-x:hidden!important}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons.icon-not-found{align-items:center;display:flex;justify-content:center}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item{align-items:center;background-color:#fff;border:1px solid #e6e7e9;cursor:pointer;display:flex;flex-direction:column;height:80px;justify-content:center;transition:transform .2s ease;width:80px;grid-gap:6px;max-height:90%;max-width:90%}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item.default{border-color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba));box-shadow:0 0 0 2px var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba));pointer-events:none}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item.selected{border-color:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba));box-shadow:0 0 0 2px #dcf2ff;pointer-events:none}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item>svg{height:20.27px;width:20.9px}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item>span{font-size:11px;text-align:center}.components-modal__frame.uagb-ip-modal-wrapper .uagb-ip-icons .uagb-icon-item:hover{border-color:#e6e7e9;box-shadow:0 0 0 4px #f0f0f1}
.spectra-variation-picker--close{align-self:flex-end;background:none;border:none;box-shadow:none;color:#d5dadf;cursor:pointer;display:flex;font-size:35px;outline:none;position:absolute;top:3px;z-index:999999}.spectra-variation-picker--small-icons.spectra-variation-picker .block-editor-block-variation-picker__variations>li{max-width:120px}.spectra-variation-picker--big-icons.spectra-variation-picker .block-editor-block-variation-picker__variations>li{max-width:160px}.spectra-variation-picker .block-editor-block-variation-picker__variations{gap:0;justify-content:center;width:75%}.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button.is-secondary,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button.is-tertiary,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button:hover:not(:disabled){box-shadow:none;color:#d5dadf!important;margin-bottom:0;outline:none;padding:0}.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button svg,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button.is-secondary svg,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button.is-tertiary svg,.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button:hover:not(:disabled) svg{fill:#d5dadf!important;height:50px;width:100px}.spectra-variation-picker .block-editor-block-variation-picker__variations .components-button:hover:not(:disabled) svg{color:#bcc0c4!important}.spectra-variation-picker .block-editor-block-variation-picker__variations>li{flex-basis:content;margin:20px 16px 0 0;max-width:140px}.spectra-variation-picker .block-editor-block-variation-picker__skip .components-button{color:#1e1e1e}.spectra-variation-picker .components-placeholder{align-items:center;border:1px dashed #c8d0d7;border-radius:4px;box-shadow:none;gap:0}.spectra-variation-picker .components-placeholder .components-placeholder__label,.spectra-variation-picker .components-placeholder.is-large .components-placeholder__label{color:#1d2327;font-size:24px;font-weight:400;line-height:29px;margin-bottom:4px}.spectra-variation-picker .components-placeholder .components-placeholder__label svg,.spectra-variation-picker .components-placeholder.is-large .components-placeholder__label svg{color:#1e1e1e;margin-right:12px}.spectra-variation-picker .block-editor-block-variation-picker__variation{height:auto}.spectra-variation-picker .block-editor-block-variation-picker__variation:before{padding-bottom:0}.spectra-variation-picker .components-placeholder__fieldset{align-items:center;flex-direction:column;max-width:90%;text-align:center}.spectra-variation-picker .components-placeholder__fieldset .components-placeholder__instructions{color:#50575e;font-size:13px;line-height:20px;width:100%}
.spectra-display-condition-active{background:repeating-linear-gradient(125deg,rgba(0,0,0,.05),rgba(0,0,0,.05) 1px,transparent 2px,transparent 9px);opacity:.4}
.wp-block-image.spectra-mask img{mask-image:var(--spectra-mask-image);-webkit-mask-image:var(--spectra-mask-image);mask-position:var(--spectra-mask-position,center center);-webkit-mask-position:var(--spectra-mask-position,center center);mask-repeat:var(--spectra-mask-repeat,no-repeat);-webkit-mask-repeat:var(--spectra-mask-repeat,no-repeat);mask-size:var(--spectra-mask-size,contain);-webkit-mask-size:var(--spectra-mask-size,contain)}
.spectra-responsive-hidden{background:repeating-linear-gradient(125deg,rgba(0,0,0,.05),rgba(0,0,0,.05) 1px,transparent 2px,transparent 9px);opacity:.4}
.spectra-responsive-icons{align-items:last baseline;display:inline-flex;gap:.4rem;margin:0 0 0 .4rem;padding:0}.spectra-responsive-icons button.spectra-responsive-icon{backface-visibility:hidden;background:none;border:none;cursor:pointer;height:.825rem;line-height:1;margin:0;padding:0;transition:opacity .15s ease,transform .15s ease;width:.825rem}.spectra-responsive-icons button.spectra-responsive-icon svg{display:block;fill:none;height:100%;shape-rendering:geometricprecision;width:100%;will-change:transform}.spectra-responsive-icons button.spectra-responsive-icon.is-active svg,.spectra-responsive-icons button.spectra-responsive-icon:hover svg{stroke:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba))}.spectra-responsive-icons button.spectra-responsive-icon:focus{box-shadow:none;outline:none}.components-tools-panel.spectra-enhanced-panel .components-tools-panel-header h2{display:inline-flex;width:100%}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice{grid-column:span 2;position:relative;z-index:1}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice.components-notice.is-info{display:block!important}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice+.components-tools-panel__item:first-of-type{margin-top:0}.components-panel__body.spectra-enhanced-panel .components-base-control__label,.components-panel__body.spectra-enhanced-panel .components-input-control__label,.components-panel__body.spectra-enhanced-panel .components-toggle-control__label,.components-panel__body.spectra-enhanced-panel .spacing-sizes-control__label,.components-panel__body.spectra-enhanced-panel label,.spectra-enhanced-panel .spectra-enhanced-control .components-base-control__label,.spectra-enhanced-panel .spectra-enhanced-control .components-input-control__label,.spectra-enhanced-panel .spectra-enhanced-control .components-toggle-control__label,.spectra-enhanced-panel .spectra-enhanced-control .spacing-sizes-control__label,.spectra-enhanced-panel .spectra-enhanced-control label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-base-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-input-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-toggle-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .spacing-sizes-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item label{align-items:center;display:inline-flex;position:relative}.components-panel__body.spectra-enhanced-panel .components-base-control__label:after,.components-panel__body.spectra-enhanced-panel .components-input-control__label:after,.components-panel__body.spectra-enhanced-panel .components-toggle-control__label:after,.components-panel__body.spectra-enhanced-panel .spacing-sizes-control__label:after,.components-panel__body.spectra-enhanced-panel label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-base-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-input-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-toggle-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .spacing-sizes-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-base-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-input-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-toggle-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .spacing-sizes-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item label:after{backface-visibility:hidden;background-image:url("data:image/svg+xml;utf8,");background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:inline-block;height:.825rem;image-rendering:crisp-edges;margin-left:.4rem;transform:translateZ(0);transition:background-image .1s ease-out;vertical-align:middle;width:.825rem;will-change:transform}.spectra-enhanced-control[aria-label="Slider Settings"] .components-flex .components-base-control:not(:first-child):not(:nth-child(2)) .components-toggle-control__label:after,.spectra-enhanced-control[aria-label="Slider Settings"] .components-flex .components-base-control:not(:first-child):not(:nth-child(2)) label:after,.spectra-enhanced-panel .spectra-not-per-device-control.spectra-not-per-device-control .components-base-control__label:after,.spectra-enhanced-panel .spectra-not-per-device-control.spectra-not-per-device-control .components-input-control__label:after,.spectra-enhanced-panel .spectra-not-per-device-control.spectra-not-per-device-control .components-toggle-control__label:after,.spectra-enhanced-panel .spectra-not-per-device-control.spectra-not-per-device-control .spacing-sizes-control__label:after,.spectra-enhanced-panel .spectra-not-per-device-control.spectra-not-per-device-control label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item[aria-label="Drop cap"] .components-toggle-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item[aria-label="Drop cap"] label:after{display:none}.spectra-gradient-responsive-control .components-base-control__label,.spectra-gradient-responsive-control label{align-items:center;display:inline-flex;position:relative}.spectra-gradient-responsive-control .components-base-control__label:after,.spectra-gradient-responsive-control label:after{backface-visibility:hidden;background-image:url("data:image/svg+xml;utf8,");background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:inline-block;height:.825rem;image-rendering:crisp-edges;margin-left:.4rem;transform:translateZ(0);vertical-align:middle;width:.825rem;will-change:transform}.spectra-updating{transition:none!important;visibility:hidden!important}.spectra-responsive-icons.spectra-injecting{opacity:0;transition:none}
.has-z-index.has-z-index{position:relative;z-index:var(--spectra-z-index,auto)!important}
/* ==========================================================================
SureCookie Shared Styles - Consolidated CSS for both Frontend and Admin Areas
========================================================================== */
/* Global Font CSS */
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Light.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 200;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Light.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Light.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Regular.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Medium.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-SemiBold.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Bold.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-ExtraBold.woff2) format("woff2");
}
@font-face {
font-family: Figtree;
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(//www.sitemakerslab.com/wp-content/plugins/surecookie/assets/font/Figtree/Figtree-Black.woff2) format("woff2");
}
.surecookie-styles,
.surecookie-styles *,
#surecookie-admin-root,
#surecookie-admin-root *,
#surecookie-public-root,
#surecookie-preferences-root,
:is(#surecookie-public-root, #surecookie-preferences-root) * {
font-family: Figtree, sans-serif !important;
box-sizing: border-box;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
}
/* Global Focus Styling for Accessibility */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-btn-outline:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-btn-primary:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-modal-close-btn:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) button:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) a:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) input:focus-visible {
outline: 2px solid var(--surecookie-banner-primary-color, #2563eb);
box-shadow: none;
}
/* Category trigger + cookie table toggle - use box-shadow so the ring follows border-radius */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal button.surecookie-category-trigger:focus-visible,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal button.surecookie-cookie-table-toggle:focus-visible {
outline: none;
box-shadow: 0 0 0 2px var(--surecookie-banner-primary-color, #2563eb);
}
/* Toggle switch pill - ring must follow the pill shape, not form a box */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-toggle-btn:focus-visible {
outline: none;
box-shadow:
0 0 0 2px #fff,
0 0 0 4px var(--surecookie-banner-primary-color, #2563eb);
}
/* Admin-chrome green focus outline. Scoped with :not(.surecookie-public-banner-wrapper)
so it does NOT reach the front-end banner (whose wrapper also carries
.surecookie-styles); the banner keeps its palette primary-color focus instead. */
.surecookie-styles:not(.surecookie-public-banner-wrapper) button:focus-visible,
#surecookie-admin-root button:focus-visible,
.surecookie-styles:not(.surecookie-public-banner-wrapper) a:focus-visible,
#surecookie-admin-root a:focus-visible,
.surecookie-styles:not(.surecookie-public-banner-wrapper) input:focus-visible,
#surecookie-admin-root input:focus-visible {
outline: 2px solid #377a00 !important;
box-shadow: none !important;
}
.surecookie-styles:not(.surecookie-public-banner-wrapper) a:focus-visible {
color: #377a00;
}
.surecookie-styles button:focus,
#surecookie-admin-root button:focus,
:is(#surecookie-public-root, #surecookie-preferences-root) button:focus,
.surecookie-styles button:focus:not(:focus-visible),
#surecookie-admin-root button:focus:not(:focus-visible),
:is(#surecookie-public-root, #surecookie-preferences-root) button:focus:not(:focus-visible) {
outline: none;
}
/* Keyframe Animations */
@keyframes surecookie-slide-up-preview {
from {
transform: translateY(100px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes surecookie-slide-up {
from {
transform: translateY(20px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/* Keyframe Animations */
@keyframes surecookieFadeIn {
from {
opacity: 0;
backdrop-filter: blur(0);
}
to {
opacity: 1;
backdrop-filter: blur(2px);
}
}
@keyframes surecookieSlideIn {
from {
transform: translateY(30px) scale(0.95);
opacity: 0;
}
to {
transform: translateY(0) scale(1);
opacity: 1;
}
}
/* Banner Animation Classes */
.surecookie-banner-animation-fade,
.surecookie-banner-animation-slide {
will-change: opacity, transform;
}
.surecookie-banner-animation-fade {
animation: surecookieBannerFadeIn 0.5s ease-out;
}
.surecookie-banner-animation-slide {
animation: surecookieBannerSlideIn 0.5s ease-out;
}
@keyframes surecookieBannerFadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes surecookieBannerSlideIn {
from {
transform: translateY(20px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/* ==========================================================================
Cookie Banner Styles
========================================================================== */
:is(#surecookie-public-root, #surecookie-preferences-root) {
all: initial;
display: block;
position: relative;
pointer-events: none;
/* Z-index layering - consent UI must sit above all third-party widgets.
2147483647 = max signed 32-bit int, industry standard for consent tools.
Modal must be above banner so it overlays correctly regardless of DOM order. */
--surecookie-z-overlay: 2147483645;
--surecookie-z-banner: 2147483646;
--surecookie-z-modal: 2147483647;
}
/* Admin preview: the values above outrank every drawer, so stay below Force
UI's z-50 drawer context. */
:is(#surecookie-public-root, #surecookie-preferences-root).surecookie-preview-admin {
--surecookie-z-overlay: 20;
--surecookie-z-banner: 30;
--surecookie-z-modal: 40;
}
/* Full-screen dim behind the banner (opt-in). Sits just below the banner so
the banner stays interactive while the rest of the page is blocked. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-overlay {
position: fixed;
inset: 0;
background-color: var(--surecookie-banner-overlay-color, rgba(0, 0, 0, 0.6));
z-index: var(--surecookie-z-overlay);
pointer-events: auto;
animation: surecookieFadeIn 0.2s ease-out;
}
/* Banner Position Styles */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-top,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom {
position: fixed;
left: 0;
right: 0;
margin: 0;
pointer-events: auto;
z-index: var(--surecookie-z-banner);
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-top {
top: 0;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom {
bottom: 0;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-box-base {
position: fixed;
max-width: 90vw;
pointer-events: auto;
z-index: var(--surecookie-z-banner);
outline-color: var(--surecookie-banner-primary-color, #2563eb);
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-top-left {
top: 20px;
left: 20px;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-top-right {
top: 20px;
right: 20px;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom-left {
bottom: 20px;
left: 20px;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom-right {
bottom: 20px;
right: 20px;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom-center,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-middle {
position: fixed;
max-width: 90vw;
pointer-events: auto;
z-index: var(--surecookie-z-banner);
}
/* Centering uses margin:auto instead of transform so slide animations
(which set transform) don't override the centering and cause a jerk. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-bottom-center {
bottom: 20px;
left: 0;
right: 0;
margin-inline: auto;
width: fit-content;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-position-middle {
inset: 0;
margin: auto;
width: fit-content;
height: fit-content;
}
/* Banner Container Styles */
.surecookie-banner-container {
box-shadow: 0 0 50px -12px rgba(0, 0, 0, 0.4);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
display: block;
visibility: visible;
opacity: 1;
}
.surecookie-banner-container-banner {
padding: 24px;
border-radius: 0;
}
.surecookie-banner-container-box-with-logo {
padding: 20px 16px;
border-radius: 12px;
}
.surecookie-banner-container-box {
padding: 16px;
border-radius: 12px;
}
/* Banner Inner Container */
.surecookie-banner-inner {
display: flex;
flex-direction: column;
}
.surecookie-banner-inner-banner {
margin: 0 auto;
}
.surecookie-banner-inner-box {
margin: 0;
}
/* Banner Logo */
.surecookie-banner-logo-wrapper {
width: 100%;
display: block;
flex-shrink: 0;
}
.surecookie-banner-logo {
height: 24px;
width: auto;
margin-bottom: 20px;
display: block;
max-width: 100%;
}
/* Banner Content */
.surecookie-banner-content {
display: flex;
width: 100%;
justify-content: space-between;
}
.surecookie-banner-content-banner {
flex-direction: row;
align-items: center;
gap: 16px;
}
.surecookie-banner-content-box {
flex-direction: column;
align-items: flex-start;
gap: 24px;
}
/* Banner Text */
.surecookie-banner-text-wrapper {
flex: 1;
}
/* Override base reset for banner headings */
.surecookie-banner-heading {
font-size: 16px;
font-weight: 600;
margin: 0 0 6px 0;
line-height: 1.5;
}
.surecookie-banner-heading-white {
color: #fff;
}
.surecookie-banner-description {
font-size: 14px;
margin: 0;
line-height: 1.6;
color: var(--surecookie-banner-text-color);
}
.surecookie-banner-description,
.surecookie-modal-description {
overflow-wrap: anywhere;
}
.surecookie-banner-description p,
.surecookie-modal-description p {
margin-bottom: 0;
}
/*
* Restore the browser-default heading scale inside the Jodit editor and the
* banner description (the admin preflight resets h1–h6 to inherit). Plain CSS
* file: selectors stay flat - native CSS nesting breaks parsing in browsers
* without CSS Nesting support.
*/
.jodit-wysiwyg h1,
.surecookie-banner-description h1 {
font-size: 2em;
font-weight: 700;
}
.jodit-wysiwyg h2,
.surecookie-banner-description h2 {
font-size: 1.5em;
font-weight: 700;
}
.jodit-wysiwyg h3,
.surecookie-banner-description h3 {
font-size: 1.17em;
font-weight: 700;
}
.jodit-wysiwyg h4,
.surecookie-banner-description h4 {
font-size: 1em;
font-weight: 700;
}
.jodit-wysiwyg h5,
.surecookie-banner-description h5 {
font-size: 0.83em;
font-weight: 700;
}
.jodit-wysiwyg h6,
.surecookie-banner-description h6 {
font-size: 0.67em;
font-weight: 700;
}
.jodit-wysiwyg a,
.surecookie-banner-description a {
color: var(--surecookie-banner-primary-color, #2563eb);
text-decoration: none;
}
/*
* Restore browser-default list rendering for rich-text lists. The admin
* preflight and wp-admin's common.css strip list-style/margin/padding, which
* hides the bullets/numbers inside the Jodit editor and the banner/modal
* previews; on the frontend, themes with global list resets do the same.
*/
.jodit-wysiwyg ul,
.jodit-wysiwyg ol,
.surecookie-banner-description ul,
.surecookie-banner-description ol,
.surecookie-modal-description ul,
.surecookie-modal-description ol,
.surecookie-forwarding-description ul,
.surecookie-forwarding-description ol {
list-style: revert;
margin: revert;
padding: revert;
}
/* Banner Buttons */
.surecookie-banner-buttons {
display: flex;
gap: 8px;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
}
.surecookie-banner-buttons-banner {
width: auto;
}
.surecookie-banner-buttons-box {
width: 100%;
}
/* Button Base Styles */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-base {
padding: 8px 16px;
border-radius: 4px;
cursor: pointer;
font-weight: 500;
font-size: 14px;
border: none;
min-width: fit-content;
white-space: nowrap;
text-decoration: none;
display: inline-block;
text-align: center;
vertical-align: middle;
user-select: none;
background-image: none;
text-transform: none;
letter-spacing: 0;
line-height: 1.5;
}
/* Accessible focus indicator for banner buttons */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-base:focus-visible {
outline: 2px solid var(--surecookie-banner-primary-color, #2563eb);
outline-offset: 2px;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-transparent {
background-color: transparent;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-with-border {
border: 1px solid;
}
.surecookie-btn-font-semibold {
font-weight: 600;
}
/* Button background colors */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-accept-btn,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-accept-all-btn {
background-color: var(--surecookie-banner-primary-color, #2563eb);
color: var(--surecookie-banner-primary-text-color, #fff);
}
/* Decline button uses the secondary palette role. Falls back to primary so
existing palettes that did not define a separate decline color keep
their previous appearance. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-decline-btn {
background-color: var(--surecookie-banner-secondary-color, var(--surecookie-banner-primary-color, #2563eb));
color: var(--surecookie-banner-secondary-text-color, #fff);
}
/* Button hover styles - accept/accept-all darken via primary-hover. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-accept-btn:hover,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-accept-all-btn:hover,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-primary:hover {
background-color: var(--surecookie-banner-primary-hover-color, #1d4ed8);
border-color: var(--surecookie-banner-primary-hover-color, #1d4ed8);
}
/* Decline hover: subtle darken via filter so we don't need a separate
secondary-hover variable. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-decline-btn:hover {
filter: brightness(0.92);
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-btn {
background-color: transparent;
border: 1px solid currentcolor;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-btn:hover {
opacity: 0.8;
}
/* Preferences button always carries a primary-colored border so the button
is discoverable on both light and dark banners. Both the public root and
the preview root are listed because the rule needs to fire in both. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-btn,
.surecookie-preview-root-container .surecookie-preferences-btn {
border: 1px solid var(--surecookie-banner-primary-color, #2563eb);
}
/* On dark banners use the accent colour instead of the white text colour */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner[data-dark-mode="true"] .surecookie-preferences-btn {
border-color: var(--surecookie-banner-primary-color, #2563eb);
}
/* Public Banner Specific Styles */
.surecookie-public-banner {
position: fixed;
display: block;
visibility: visible;
opacity: 1;
pointer-events: auto;
box-sizing: border-box;
z-index: var(--surecookie-z-banner);
}
.surecookie-public-banner[data-banner="true"] {
box-sizing: border-box;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-public-banner-wrapper {
position: absolute;
width: 0;
height: 0;
overflow: visible;
pointer-events: auto;
}
/* Branding */
.surecookie-branding {
display: flex;
align-items: center;
gap: 4px;
color: var(--surecookie-banner-text-color, #374151);
font-size: 12px;
font-weight: 400;
margin-left: auto;
opacity: 0.8;
}
.surecookie-branding span:last-child {
font-weight: 600;
}
/* Branding in banner notice type needs top margin */
.surecookie-banner-content-banner .surecookie-branding-mobile {
margin-top: 10px;
}
/* ==========================================================================
Preferences Modal Styles
========================================================================== */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-modal-backdrop {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.6);
z-index: var(--surecookie-z-modal);
overflow-x: hidden;
overflow-y: auto;
animation: surecookieFadeIn 0.2s ease-out;
pointer-events: auto;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-modal-wrapper {
display: flex;
align-items: center;
justify-content: center;
min-height: 100%;
padding: 16px 5px;
}
.surecookie-preferences-modal {
width: 90vw;
max-width: 640px;
height: auto;
border-radius: 16px;
box-shadow: 0 25px 50px -12px #00000040;
overflow: hidden;
display: flex;
flex-direction: column;
animation: surecookieSlideIn 0.3s ease-out;
position: relative;
outline-color: var(--surecookie-banner-primary-color);
}
.surecookie-preferences-modal .surecookie-modal-header {
padding: 24px 24px 20px 24px;
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 16px;
}
.surecookie-preferences-modal .surecookie-modal-header-text {
flex: 1;
min-width: 0;
}
.surecookie-preferences-modal .surecookie-modal-title {
margin: 0 0 8px 0;
font-size: 16px;
font-weight: 600;
line-height: 1.3;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-modal-description {
margin: 0;
font-size: 14px;
line-height: 1.5;
opacity: 0.85;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-modal-close-btn {
flex-shrink: 0;
align-self: flex-start;
background: none;
border: none;
cursor: pointer;
padding: 4px;
margin: 0;
margin-top: -4px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0.6;
transition: opacity 0.2s;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-modal-close-btn:hover {
opacity: 1;
}
.surecookie-preferences-modal .surecookie-modal-tabs {
display: flex;
border-bottom: 1px solid #37415126;
margin: 0 24px;
gap: 0;
}
.surecookie-preferences-modal .surecookie-modal-tab {
background: none;
border: none;
cursor: pointer;
padding: 10px 16px;
font-size: 13px;
font-weight: 500;
color: var(--surecookie-banner-text-color);
opacity: 0.6;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
transition:
opacity 0.15s,
border-color 0.15s;
}
.surecookie-preferences-modal .surecookie-modal-tab:hover {
opacity: 0.85;
}
.surecookie-preferences-modal .surecookie-modal-tab.active {
opacity: 1;
border-bottom-color: var(--surecookie-banner-primary-color, #2563eb);
}
.surecookie-preferences-modal .surecookie-forwarding-panel {
padding: 16px 24px;
overflow-y: auto;
max-height: 280px;
}
.surecookie-preferences-modal .surecookie-forwarding-description {
margin: 0 0 12px 0;
font-size: 13px;
line-height: 1.5;
opacity: 0.85;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-forwarding-note {
margin: 0;
font-size: 13px;
line-height: 1.5;
opacity: 0.7;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-forwarding-accordion {
display: flex;
flex-direction: column;
gap: 0;
}
.surecookie-preferences-modal .surecookie-forwarding-toggle {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
background: none;
border: none;
cursor: pointer;
padding: 10px 0 8px;
width: 100%;
text-align: left;
}
.surecookie-preferences-modal .surecookie-forwarding-count {
font-size: 13px;
font-weight: 500;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-forwarding-chevron {
display: flex;
align-items: center;
color: var(--surecookie-banner-text-color);
opacity: 0.6;
transition: transform 0.2s;
flex-shrink: 0;
}
.surecookie-preferences-modal .surecookie-forwarding-chevron.expanded {
transform: rotate(90deg);
}
.surecookie-preferences-modal .surecookie-forwarding-sites {
list-style: none;
margin: 10px 0 0 0;
padding: 0;
display: flex;
flex-direction: column;
border: 1px solid;
border-color: rgba(55, 65, 81, 0.15);
border-radius: 8px;
overflow: hidden;
}
.surecookie-preferences-modal .surecookie-forwarding-site {
display: flex;
align-items: center;
border-bottom: 1px solid rgba(55, 65, 81, 0.1);
}
.surecookie-preferences-modal .surecookie-forwarding-site:last-child {
border-bottom: none;
}
.surecookie-preferences-modal .surecookie-forwarding-site-link {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
padding: 10px 12px;
font-size: 13px;
color: var(--surecookie-banner-text-color);
text-decoration: none;
opacity: 0.85;
transition:
opacity 0.15s ease,
background-color 0.15s ease;
}
.surecookie-preferences-modal .surecookie-forwarding-site-link:hover {
opacity: 1;
background-color: rgba(55, 65, 81, 0.06);
text-decoration: none;
}
.surecookie-preferences-modal .surecookie-forwarding-site-globe {
flex-shrink: 0;
opacity: 0.6;
}
.surecookie-preferences-modal .surecookie-forwarding-site-url {
flex: 1;
min-width: 0;
overflow-wrap: anywhere;
line-height: 1.4;
}
.surecookie-preferences-modal .surecookie-forwarding-site-ext {
flex-shrink: 0;
opacity: 0.4;
margin-left: auto;
}
.surecookie-preferences-modal .surecookie-categories-wrapper {
position: relative;
margin: 0 24px;
overflow: visible;
}
.surecookie-preferences-modal .surecookie-categories-scroll {
-ms-overflow-style: none;
scrollbar-width: none;
overflow-y: auto;
max-height: 280px;
padding: 0 8px;
margin: 0 -8px;
}
.surecookie-preferences-modal .surecookie-categories-scroll::-webkit-scrollbar {
display: none;
}
.surecookie-preferences-modal .surecookie-categories-list {
padding: 0;
display: flex;
flex-direction: column;
}
.surecookie-preferences-modal .surecookie-category-item {
padding: 16px 0;
border-bottom: 1px solid #37415126;
}
.surecookie-preferences-modal .surecookie-category-item:last-child {
border-bottom: none;
}
.surecookie-preferences-modal .surecookie-category-header,
.surecookie-preferences-modal .surecookie-category-trigger,
.surecookie-preferences-modal .surecookie-expand-icon {
display: flex;
align-items: center;
}
.surecookie-preferences-modal .surecookie-category-header {
justify-content: space-between;
gap: 12px;
}
.surecookie-preferences-modal .surecookie-category-trigger {
flex: 1;
cursor: pointer;
gap: 12px;
background: transparent;
border: none;
padding: 4px;
margin: -4px;
border-radius: 4px;
text-align: inherit;
}
.surecookie-preferences-modal .surecookie-expand-icon {
justify-content: center;
transition: transform 0.2s;
opacity: 0.5;
color: var(--surecookie-banner-text-color);
width: 20px;
}
.surecookie-preferences-modal .surecookie-expand-icon.expanded {
transform: rotate(90deg);
}
.surecookie-preferences-modal .surecookie-category-name {
margin: 0;
font-size: 16px;
font-weight: 600;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-category-controls {
display: flex;
align-items: center;
gap: 12px;
}
.surecookie-preferences-modal .surecookie-always-active {
font-size: 12px;
color: var(--surecookie-banner-text-color, #6b7280);
opacity: 0.65;
font-weight: 500;
}
.surecookie-preferences-modal .surecookie-toggle-btn {
width: 40px;
height: 20px;
border-radius: 10px;
border: none;
cursor: pointer;
position: relative;
transition: background-color 0.3s ease;
flex-shrink: 0;
padding: 0;
}
.surecookie-preferences-modal .surecookie-toggle-btn:disabled,
.surecookie-preferences-modal .surecookie-toggle-btn[aria-disabled="true"] {
cursor: not-allowed;
}
.surecookie-preferences-modal .surecookie-toggle-knob {
position: absolute;
top: 4px;
left: 4px;
width: 12px;
height: 12px;
border-radius: 50%;
background-color: #fff;
transition: left 0.3s ease;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.surecookie-preferences-modal .surecookie-toggle-knob.checked {
left: 24px;
}
.surecookie-preferences-modal .surecookie-category-details {
margin-top: 12px;
padding-left: 32px;
}
.surecookie-preferences-modal .surecookie-category-desc {
margin: 0;
font-size: 14px;
line-height: 1.6;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-cookie-table-wrapper {
overflow-x: auto;
margin-bottom: 10px;
}
.surecookie-preferences-modal .surecookie-cookie-table {
width: 100%;
border-collapse: collapse;
font-size: 12px;
margin-bottom: 0;
text-align: left;
border: none;
color: var(--surecookie-banner-text-color);
}
.surecookie-preferences-modal .surecookie-cookie-table td,
.surecookie-preferences-modal .surecookie-cookie-table th {
padding: 8px 4px;
border: none;
background: none;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-cookie-table th,
.surecookie-modal-branding-content span:last-child {
font-weight: 600;
}
.surecookie-preferences-modal .surecookie-cookie-table tr {
border: none;
border-bottom: 1px solid rgba(156, 163, 175, 0.15);
}
.surecookie-preferences-modal .surecookie-modal-footer {
padding: 20px 24px;
display: flex;
gap: 12px;
align-items: center;
justify-content: flex-start;
}
.surecookie-preferences-modal .surecookie-footer-actions {
display: flex;
gap: 12px;
flex: 1;
}
/* Outline buttons share base sizing/typography. Border color comes from the
relevant palette role; the label uses the banner's text color so it stays
readable on any palette and doesn't compete with the brand color. */
.surecookie-preferences-modal .surecookie-btn-outline,
.surecookie-preferences-modal .surecookie-btn-outline-secondary {
min-width: 82px;
height: 40px;
padding: 0 12px;
font-size: 14px;
font-weight: 500;
border-radius: 8px;
background-color: transparent;
cursor: pointer;
white-space: nowrap;
color: var(--surecookie-banner-text-color, #374151);
text-transform: none;
letter-spacing: 0;
}
/* Modal Reject All shares Accept All's border so the paired action group reads as one. */
.surecookie-preferences-modal .surecookie-btn-outline,
.surecookie-preferences-modal .surecookie-btn-outline-secondary {
border: 1px solid var(--surecookie-banner-primary-color);
}
.surecookie-preferences-modal .surecookie-btn-primary {
min-width: 136px;
height: 40px;
padding: 0 12px;
font-size: 14px;
font-weight: 500;
border: none;
border-radius: 8px;
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
background-color: var(--surecookie-banner-primary-color);
color: var(--surecookie-banner-primary-text-color, #fff);
text-transform: none;
letter-spacing: 0;
}
.surecookie-preferences-modal .surecookie-btn-primary:hover {
background-color: var(--surecookie-banner-primary-hover-color);
}
.surecookie-modal-footer-branding {
/* Border + container text derive from the banner text color so the
footer aligns with whatever palette (preset or custom) is active. */
border-top: 1px solid color-mix(in srgb, var(--surecookie-banner-text-color, #1f2937) 15%, transparent);
display: flex;
align-items: center;
gap: 4px;
justify-content: flex-end;
padding: 12px 20px;
color: var(--surecookie-banner-text-color, #9ca3af);
font-size: 12px;
font-weight: 400;
}
/* Fallback for browsers without color-mix() support - keeps the original
binary light/dark border colors so old browsers still render correctly. */
@supports not (border-top-color: color-mix(in srgb, red 50%, blue)) {
.surecookie-modal-footer-branding {
border-top: 1px solid #1f2937;
}
.surecookie-preferences-modal[style*="backgroundColor: #fff"] .surecookie-modal-footer-branding,
.surecookie-preferences-modal[style*="backgroundColor: rgb(255"] .surecookie-modal-footer-branding {
border-top-color: #37415115;
}
}
/* Branding content wrapper - keeps the three branding elements together on
the right. Uses the banner text color (muted) so the "Powered by SureCookie"
line reads as branding, not as a CTA, regardless of the active palette. */
.surecookie-modal-branding-content {
display: flex;
align-items: center;
gap: 4px;
color: var(--surecookie-banner-text-color, #6b7280);
opacity: 0.75;
}
.surecookie-modal-branding-content:hover {
opacity: 1;
}
/* Cookie policy page link in preferences modal footer */
.surecookie-modal-policy-link {
color: var(--surecookie-banner-primary-color);
text-decoration: none;
font-size: inherit;
}
.surecookie-modal-policy-link:hover {
text-decoration: underline;
}
/* Skeleton loading placeholders for category cards */
@keyframes surecookie-pulse {
0%,
100% {
opacity: 0.4;
}
50% {
opacity: 0.15;
}
}
.surecookie-preferences-modal .surecookie-skeleton {
display: block;
border-radius: 4px;
background-color: currentcolor;
opacity: 0.15;
animation: surecookie-pulse 1.5s ease-in-out infinite;
}
.surecookie-preferences-modal .surecookie-skeleton-icon {
width: 18px;
height: 18px;
border-radius: 4px;
flex-shrink: 0;
}
.surecookie-preferences-modal .surecookie-skeleton-title {
width: 120px;
height: 16px;
border-radius: 4px;
}
.surecookie-preferences-modal .surecookie-skeleton-toggle {
width: 40px;
height: 20px;
border-radius: 10px;
flex-shrink: 0;
}
.surecookie-preferences-modal .surecookie-skeleton-badge {
width: 80px;
height: 16px;
border-radius: 4px;
flex-shrink: 0;
}
/* Cookie Table Toggle Styles */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-cookie-table-toggle {
display: flex;
align-items: center;
gap: 2px;
margin-top: 12px;
cursor: pointer;
user-select: none;
width: fit-content;
transition: opacity 0.2s ease;
background: transparent;
border: none;
padding: 4px;
margin-left: -4px;
border-radius: 4px;
box-shadow: none;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-cookie-table-toggle:hover {
opacity: 0.7;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-cookie-table-label {
font-size: 13px;
font-weight: 600;
color: var(--surecookie-banner-text-color);
opacity: 0.9;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-table-chevron {
display: flex;
align-items: center;
transition: transform 0.2s ease;
opacity: 0.6;
color: var(--surecookie-banner-text-color);
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-table-chevron.expanded {
transform: rotate(90deg);
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-cookie-table-wrapper {
margin-top: 8px;
}
/* Content Blocking Placeholder Styles */
/* Content blocker placeholder - doubled selectors (0,2,0 specificity) to beat theme styles without !important */
.surecookie-placeholder.surecookie-placeholder {
position: relative;
display: block;
width: 100%;
max-width: 100%;
border: 0;
font-family: Figtree, sans-serif;
}
/*
* WordPress responsive embeds (.wp-has-aspect-ratio) reserve their height with a
* ::before aspect-ratio spacer and absolutely position the iframe to fill it. A
* blocked placeholder must overlay that spacer the same way. Left in flow, its
* own height stacks on top of the spacer and roughly doubles the embed height,
* leaving a large empty gap around Vimeo/YouTube/etc. embeds. `!important` is
* required here to beat the inline `height` the blocker (and JS sizing) sets on
* the placeholder - specificity alone cannot override an inline style.
*/
.wp-has-aspect-ratio .wp-block-embed__wrapper > .surecookie-placeholder {
position: absolute;
inset: 0;
height: auto !important;
}
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-content {
position: absolute;
inset: 0;
text-align: center;
padding: 24px;
z-index: 10;
background-color: var(--surecookie-banner-background-color, #1f2937);
border-radius: 12px;
box-shadow:
0 4px 18px 0 rgb(0 0 0 / 0.1),
0 2px 4px -2px rgb(0 0 0 / 0.1);
-webkit-backdrop-filter: blur(10px);
width: 100%;
height: 100%;
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
}
/* Show placeholder overlay only when consent is pending */
.surecookie-placeholder.surecookie-pending .surecookie-placeholder-content {
display: flex;
}
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text {
color: var(--surecookie-banner-text-color, #e5e7eb);
font-size: 14px;
margin: 0 0 16px 0;
line-height: 1.5;
padding: 0;
text-transform: none;
letter-spacing: normal;
}
/* Rich-text (Jodit) content inside the placeholder description. wp_kses_post, not
the toolbar, is the element ceiling, and the overlay sits on an arbitrary theme -
so strip theme chrome off every descendant, never the author's own formatting
(font-weight/style/decoration are deliberately absent). */
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text * {
margin: 0;
padding: 0;
border: 0;
background: transparent;
box-shadow: none;
color: inherit;
font-size: inherit;
line-height: inherit;
text-align: inherit;
list-style-position: inside;
}
/* An
is nothing but the border the reset above just removed. */
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text hr {
border-top: 1px solid;
opacity: 0.3;
}
/* Both selectors: the child one spaces blockquote/heading/list/pre now that their
margins are gone, the descendant one keeps paragraphs inside a wrapper spaced. */
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text > *:not(:last-child),
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text p:not(:last-child) {
margin-bottom: 8px;
}
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text a {
color: inherit;
text-decoration: underline;
}
/* When there is no Accept & Load button (e.g. quarantined trackers held by the
Compliance Guard), the text is the last child - drop its bottom margin so the
overlay content stays vertically centered. */
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-text:last-child {
margin-bottom: 0;
}
.surecookie-placeholder.surecookie-placeholder button.surecookie-placeholder-button {
background-color: var(--surecookie-banner-primary-color, #2563eb);
color: var(--surecookie-banner-primary-text-color, #fff);
border: none;
padding: 8px 16px;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
font-weight: 500;
font-family: Figtree, sans-serif;
transition: background-color 0.2s ease;
box-shadow: none;
text-decoration: none;
text-transform: none;
letter-spacing: normal;
line-height: 1.5;
display: inline-block;
margin: 0;
}
.surecookie-placeholder.surecookie-placeholder button.surecookie-placeholder-button:hover {
background-color: var(--surecookie-banner-primary-hover-color, #1d4ed8);
}
.surecookie-placeholder.surecookie-placeholder button.surecookie-placeholder-button:focus {
outline: 2px solid var(--surecookie-banner-primary-color, #60a5fa);
outline-offset: 2px;
}
/* Optional preview image shown behind the overlay while consent is pending */
.surecookie-placeholder.surecookie-placeholder .surecookie-placeholder-image {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
border: 0;
margin: 0;
padding: 0;
display: none;
z-index: 1;
}
.surecookie-placeholder.surecookie-pending .surecookie-placeholder-image {
display: block;
}
.surecookie-placeholder.surecookie-loaded .surecookie-placeholder-image {
display: none;
}
/* With an image, the overlay sits over a dark scrim instead of a solid card so
the image stays visible while keeping the text/button legible. */
.surecookie-placeholder.surecookie-placeholder-has-image .surecookie-placeholder-content {
background-color: rgb(0 0 0 / 0.55);
box-shadow: none;
border-radius: 0;
}
/* The scrim is always dark, so light text over it. The blocker sets #fff inline
for the image case, so theme styles can't override; a text-shadow keeps it
readable over busy images. */
.surecookie-placeholder.surecookie-placeholder-has-image .surecookie-placeholder-text,
.surecookie-placeholder.surecookie-placeholder-has-image .surecookie-placeholder-text p,
.surecookie-placeholder.surecookie-placeholder-has-image .surecookie-placeholder-text a {
color: #fff;
text-shadow: 0 1px 3px rgb(0 0 0 / 0.7);
}
/* Responsive styles */
@media (max-width: 768px) {
/* Small horizontal gutter so the rounded modal isn't flush with the screen edge. */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-modal-wrapper {
padding: 16px 8px;
}
.surecookie-preferences-modal {
width: 100%;
max-width: 100%;
border-radius: 16px;
}
.surecookie-preferences-modal .surecookie-modal-footer {
padding: 10px;
justify-content: space-between;
}
/* The three labels are translated, so the row's width is locale-dependent and
no breakpoint can be right for every language: wrap instead, and let each
line's items share its width so a wrapped action still reads as a button. */
.surecookie-preferences-modal .surecookie-modal-footer,
.surecookie-preferences-modal .surecookie-footer-actions {
flex-wrap: wrap;
gap: 8px;
}
.surecookie-preferences-modal .surecookie-footer-actions,
.surecookie-preferences-modal .surecookie-modal-footer > button {
flex: 1 1 auto;
}
.surecookie-preferences-modal .surecookie-modal-footer button {
height: 32px;
font-size: 13px;
min-width: 0;
}
/* Box / popup banners keep their rounded corners on mobile. */
.surecookie-banner-container-box,
.surecookie-banner-container-box-with-logo {
border-radius: 12px;
}
}
@media (max-width: 767px) {
.surecookie-container-mobile {
padding: 20px 18px;
}
.surecookie-content-mobile {
flex-direction: column;
align-items: flex-start;
gap: 24px;
}
.surecookie-buttons-mobile {
width: 100%;
justify-content: center;
}
.surecookie-button-mobile {
width: 100%;
text-align: center;
}
.surecookie-branding-mobile {
width: 100%;
justify-content: center;
margin-left: 0;
margin-top: 8px;
}
}
/* ==========================================================================
Accessibility Styles
========================================================================== */
/* Screen-reader-only utility - visually hidden but announced by screen readers */
.surecookie-sr-only {
clip-path: inset(50%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}
/* Category accordion trigger - button reset so it inherits container layout */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal button.surecookie-category-trigger {
background: none;
border: none;
padding: 0;
font: inherit;
color: inherit;
text-align: left;
justify-content: flex-start;
width: 100%;
box-shadow: none;
}
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-modal-close-btn:focus-visible {
opacity: 1;
}
/* ==========================================================================
Reduced Motion Support
========================================================================== */
@media (prefers-reduced-motion: reduce) {
/* Disable banner entrance animations */
.surecookie-banner-animation-fade,
.surecookie-banner-animation-slide {
animation: none;
will-change: auto;
}
/* Disable modal animations */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-modal-backdrop,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner-overlay,
.surecookie-preferences-modal {
animation: none;
}
/* Disable all UI transitions in preferences modal */
.surecookie-preferences-modal .surecookie-toggle-knob,
.surecookie-preferences-modal .surecookie-toggle-btn,
.surecookie-preferences-modal .surecookie-expand-icon,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-preferences-modal .surecookie-table-chevron,
.surecookie-preferences-modal .surecookie-modal-close-btn {
transition: none;
}
/* Disable skeleton pulse for users who prefer reduced motion */
.surecookie-preferences-modal .surecookie-skeleton {
animation: none;
opacity: 0.2;
}
}
/* ==========================================================================
High Contrast / Forced Colors Support
========================================================================== */
@media (forced-colors: active) {
/* Ensure banner and modal buttons have visible borders */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-base,
.surecookie-preferences-modal .surecookie-btn-outline,
.surecookie-preferences-modal .surecookie-btn-primary {
border: 1px solid buttontext;
}
/* Ensure focus indicators use system colors */
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-btn-base:focus-visible,
.surecookie-preferences-modal .surecookie-btn-outline:focus-visible,
.surecookie-preferences-modal .surecookie-btn-primary:focus-visible,
.surecookie-preferences-modal .surecookie-modal-close-btn:focus-visible {
outline: 2px solid highlight;
outline-offset: 2px;
}
/* Ensure toggle switches have visible borders */
.surecookie-preferences-modal .surecookie-toggle-btn {
border: 1px solid buttontext;
}
/* Ensure modal and banner have visible boundaries */
.surecookie-preferences-modal,
:is(#surecookie-public-root, #surecookie-preferences-root) .surecookie-banner {
border: 1px solid canvastext;
}
}
/* Compatibility CSS - Presto Player placeholder: Stands on its own (no hidden iframe sibling).
Wrapper stays transparent so the card's box-shadow renders against the page
background like the normal iframe-blocker placeholder. Aspect-ratio sizing
is applied inline from the block's `aspect_ratio` attribute. */
.surecookie-placeholder.surecookie-placeholder-presto {
position: relative;
width: 100%;
min-height: 80px;
}
.surecookie-placeholder.surecookie-placeholder-presto .surecookie-placeholder-content {
position: absolute;
inset: 0;
}
/* Audio variant - no aspect-ratio, fixed-ish height for the message + button card. */
.surecookie-placeholder.surecookie-placeholder-audio {
min-height: 96px;
}
/* Presto Player Compatibility CSS Complete. */