/* StreetLib CSS */
/*
* =========================================
* ACCESSIBLE COLOR PALETTE
* Based on streetlib-new-website variables
* WCAG AA compliant (contrast ratio 4.5:1+)
* =========================================
*
* COLOR MAPPING (old → new):
*
* Primary Colors:
* - #0A8EA0 → #128191 --sl-primary-color (main brand, darker for accessibility)
* - #0b8fa0 → #128191 --sl-primary-color
* - #148ea0 → #097988 --sl-contrast-text-color (links & text on white, WCAG AA)
* - #168ea0 → #097988 --sl-contrast-text-color
* - #008ea1 → #097988 --sl-contrast-text-color
*
* Interactive States:
* - #1cabbf → #19aabb --sl-primary-color-300 (hover state)
* - #71c0cc --sl-focus-color (focus rings)
*
* Dark Accent:
* - #094B54 (buttons, dark elements) - unchanged
*
* Neutral:
* - #0C0C0C --sl-text-color (body text, almost black)
* - #343e48 (secondary text)
*
*/
body {
font-family: 'Inter', 'Roboto', 'Open Sans', sans-serif;
-webkit-font-smoothing: antialiased;
}
/* ==========================================================================
NEW UI (TEMP) — v2 GLOBAL THEME (prototype-like)
Enabled when JS adds .sl-v2 to (?slv2=1 or ?view=modern). Page-specific
tweaks use .sl-v2-page-*.
========================================================================== */
html.sl-v2 * {
box-sizing: border-box;
}
html.sl-v2 body {
background: #f8fafb;
color: #0C0C0C;
overflow-x: hidden;
}
html.sl-v2 img {
max-width: 100%;
height: auto;
}
html.sl-v2 a {
color: #097988;
}
html.sl-v2 a:hover {
color: #128191;
}
html.sl-v2 .btn,
html.sl-v2 #fullArticle .admin-edit {
border-radius: 12px;
}
html.sl-v2 input[type="text"],
html.sl-v2 input[type="search"],
html.sl-v2 textarea,
html.sl-v2 select {
border-radius: 14px;
}
select:focus, a:focus, button:focus {
outline: none;
}
/* Keep focus visible for keyboard users (WCAG 2.4.7) — same treatment used
for the v2 footer/banner buttons elsewhere in this file. */
select:focus-visible, a:focus-visible, button:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 3px;
}
/*.lang-it::before,
.lang-en::before,
.lang-de::before,*/
.dropdown-toggle::after {
content: "";
display: inline-block;
width: 30px;
height: 20px;
vertical-align: bottom;
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
margin-right: 10px;
}
.lang-en::before {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='20px' height='14px' viewBox='0 0 20 14' enable-background='new 0 0 20 14' xml:space='preserve'%3E%3Cg id='Symbols'%3E%3Cg id='us-flag' transform='translate(-5.000000, -8.000000)'%3E%3Cg transform='translate(5.000000, 8.000000)'%3E%3Cg id='Mask'%3E%3Cpath id='path-1_3_' fill='%23D8D9D8' d='M3,0h14c1.656,0,3,1.343,3,3v8c0,1.656-1.344,3-3,3H3c-1.657,0-3-1.344-3-3V3 C0,1.343,1.343,0,3,0z'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='Adobe_OpacityMaskFilter' filterUnits='userSpaceOnUse' x='-3.241' y='0.068' width='26.717' height='14.008'%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3C/defs%3E%3Cmask maskUnits='userSpaceOnUse' x='-3.241' y='0.068' width='26.717' height='14.008' id='mask-2_1_'%3E%3Cg filter='url(%23Adobe_OpacityMaskFilter)'%3E%3Cpath id='path-1_2_' fill='%23FFFFFF' d='M3,0h14c1.656,0,3,1.343,3,3v8c0,1.656-1.344,3-3,3H3c-1.657,0-3-1.344-3-3V3 C0,1.343,1.343,0,3,0z'/%3E%3C/g%3E%3C/mask%3E%3Cg id='Flag_of_US' mask='url(%23mask-2_1_)'%3E%3Cg%3E%3Cpath fill='%23FFFFFF' d='M23.381,0.073c0.023,0,0.069-0.001,0.069,0c0.004,0.061,0.003,0.121,0.003,0.182 c0,4.545,0.001,9.09-0.005,13.635c0,0.055,0.094,0.177-0.067,0.183c-0.214-0.261-0.041-0.6-0.181-0.886 c-0.188-0.139-0.413-0.088-0.626-0.088c-6.596-0.003-13.19-0.003-19.786-0.003c-1.786,0-3.571,0.001-5.356-0.001 c-0.182,0-0.365,0.018-0.543-0.04c-0.044-0.02-0.085-0.045-0.123-0.076c0-0.365,0-0.729,0-1.094 c0.038-0.032,0.079-0.058,0.124-0.076c0.226-0.067,0.458-0.041,0.688-0.041c8.323-0.001,16.647-0.001,24.97-0.002 c0.215,0,0.437,0.031,0.643-0.068c0.096-0.22,0.097-0.428,0.005-0.637c-0.21-0.118-0.433-0.077-0.647-0.077 c-8.323-0.002-16.647-0.002-24.97-0.003c-0.23,0-0.462,0.026-0.689-0.04c-0.045-0.02-0.086-0.045-0.123-0.077 c0-0.364,0-0.729,0-1.094c0.038-0.031,0.079-0.057,0.124-0.076c0.226-0.066,0.458-0.04,0.688-0.04 c8.323-0.002,16.647-0.001,24.97-0.003c0.215,0,0.438,0.041,0.649-0.078c0.101-0.233,0.074-0.466,0.017-0.688 c-0.228-0.13-0.451-0.088-0.666-0.088C14.225,8.795,5.901,8.795-2.422,8.794c-0.23,0-0.462,0.026-0.689-0.04 c-0.045-0.02-0.086-0.045-0.124-0.077c0-0.364,0-0.729,0-1.094c0.038-0.031,0.079-0.057,0.124-0.076 c0.128-0.045,0.263-0.04,0.396-0.04c3.325-0.002,6.651,0,9.976-0.001c0.073,0,0.146,0.007,0.218,0.01 c0.267-0.018,0.534-0.009,0.801-0.009c4.761,0,9.523,0,14.284-0.002c0.204,0,0.413,0.032,0.63-0.073 c0.093-0.197,0.086-0.405,0.015-0.621c-0.187-0.133-0.399-0.088-0.602-0.088c-4.81-0.003-9.619-0.001-14.429-0.003 c-0.229,0-0.463,0.031-0.684-0.066C7.223,6.291,7.216,5.72,7.479,5.409c0.21-0.083,0.432-0.056,0.649-0.056 c4.811-0.001,9.623-0.001,14.434-0.002c0.203,0,0.413,0.031,0.631-0.07c0.106-0.22,0.082-0.454,0.021-0.691 c-0.188-0.14-0.4-0.094-0.602-0.094c-4.823-0.003-9.646-0.002-14.47-0.003c-0.217,0-0.438,0.025-0.651-0.049 C7.219,4.146,7.216,3.578,7.483,3.237c0.218-0.104,0.453-0.072,0.682-0.072c4.799-0.002,9.598-0.001,14.396-0.002 c0.203,0,0.413,0.031,0.628-0.069c0.111-0.196,0.073-0.406,0.035-0.61c-0.199-0.149-0.413-0.103-0.613-0.103 C17.8,2.377,12.989,2.378,8.178,2.376c-0.229,0-0.463,0.031-0.684-0.066C7.224,1.989,7.216,1.419,7.479,1.107 C7.688,1.024,7.909,1.05,8.126,1.05c4.817-0.001,9.634,0,14.451-0.002c0.203,0,0.413,0.035,0.609-0.071 C23.357,0.698,23.158,0.338,23.381,0.073z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%233D3C6F' d='M7.484,1.167C7.44,1.158,7.414,1.186,7.413,1.222 c-0.002,0.285,0.006,0.57-0.006,0.854C7.404,2.162,7.49,2.188,7.484,2.26c0.171,0.34,0.171,0.681,0,1.021 C7.49,3.354,7.404,3.38,7.407,3.465C7.419,3.75,7.411,4.035,7.413,4.32c0,0.036,0.027,0.063,0.071,0.055 c0.173,0.365,0.173,0.729,0,1.094C7.44,5.46,7.414,5.488,7.413,5.524c-0.002,0.285,0.006,0.57-0.006,0.855 C7.404,6.464,7.49,6.49,7.484,6.562c0.171,0.34,0.171,0.681,0,1.021c-3.548,0-7.097,0-10.646,0 C-3.219,7.495-3.196,7.395-3.196,7.3c-0.001-2.314-0.001-4.629,0-6.943c0-0.095-0.023-0.195,0.035-0.284 c3.548,0,7.097,0,10.646,0C7.658,0.438,7.658,0.802,7.484,1.167z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B22435' d='M-3.161,12.979c8.839,0,17.678,0,26.542,0 c0,0.371,0,0.732,0,1.094c-8.848,0-17.695,0-26.542,0C-3.219,13.708-3.219,13.344-3.161,12.979z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B22435' d='M7.484,1.167c0-0.364,0-0.729,0-1.094 c5.299,0,10.598,0,15.896,0c0,0.352,0,0.704,0,1.056c-0.009,0.009-0.016,0.019-0.025,0.026 c-0.009,0.006-0.021,0.011-0.031,0.011C18.044,1.167,12.765,1.167,7.484,1.167z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23BDB8CA' d='M-3.161,0.073c0,2.503,0,5.007,0,7.51 c-0.024,0-0.049,0-0.073,0c0-2.467,0-4.934,0.002-7.401C-3.232,0.138-3.278,0.048-3.161,0.073z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E4BFB6' d='M-3.161,9.771c-0.024,0-0.049,0-0.073,0 c0-0.364,0-0.729,0-1.094c0.024,0,0.049,0,0.073,0C-2.988,9.042-2.988,9.406-3.161,9.771z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E4BFB6' d='M-3.161,12.979c0,0.364,0,0.729,0,1.094 c-0.022-0.017-0.074,0.036-0.074-0.037c0.001-0.353,0-0.704,0-1.057C-3.21,12.979-3.186,12.979-3.161,12.979z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E4BEB5' d='M-3.234,10.864c0.024,0,0.049,0,0.073,0 c0.17,0.341,0.17,0.681,0,1.021c-0.024,0-0.049,0-0.073,0C-3.234,11.545-3.234,11.205-3.234,10.864z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B32435' d='M-3.161,9.771c0-0.364,0-0.729,0-1.094 c8.834,0,17.668,0,26.527,0c0.032,0.173,0.01,0.353,0.014,0.529c0.004,0.181,0.001,0.36,0.001,0.564 C14.524,9.771,5.682,9.771-3.161,9.771z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B22435' d='M-3.161,11.886c0-0.341,0-0.681,0-1.021 c8.834,0,17.668,0,26.524,0c0.036,0.161,0.012,0.328,0.016,0.492c0.005,0.169,0.002,0.337,0.002,0.529 C14.524,11.886,5.682,11.886-3.161,11.886z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B32435' d='M7.484,5.469c0-0.365,0-0.729,0-1.094 c5.285,0,10.571,0,15.882,0c0.032,0.173,0.01,0.352,0.014,0.529c0.004,0.18,0.001,0.361,0.001,0.565 C18.073,5.469,12.779,5.469,7.484,5.469z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B22435' d='M7.484,3.281c0-0.34,0-0.681,0-1.021 c5.285,0,10.571,0,15.879,0c0.036,0.161,0.012,0.328,0.016,0.492c0.005,0.168,0.002,0.337,0.002,0.529 C18.073,3.281,12.779,3.281,7.484,3.281z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B22435' d='M7.484,7.583c0-0.34,0-0.68,0-1.021 c5.285,0,10.571,0,15.879,0c0.036,0.161,0.012,0.328,0.016,0.492c0.005,0.168,0.002,0.337,0.002,0.528 C18.073,7.583,12.779,7.583,7.484,7.583z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DCDBE4' d='M4.128,3.053c0,0.117,0,0.198,0,0.267 C4.016,3.432,3.982,3.252,3.852,3.298C3.838,3.32,3.801,3.381,3.747,3.468C3.68,3.338,3.666,3.26,3.751,3.187 c0.006-0.143-0.212-0.081-0.209-0.221C3.618,2.862,3.729,2.954,3.877,2.86c0.005-0.004-0.08-0.096-0.015-0.15 c0.081,0.031,0.129,0.086,0.129,0.177c0.08,0.071,0.188-0.01,0.271,0.051C4.295,3.029,4.273,3.078,4.128,3.053z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23D9D8E1' d='M4.933,5.615C4.863,5.63,4.854,5.522,4.792,5.54 C4.699,5.558,4.667,5.646,4.596,5.688C4.543,5.583,4.556,5.5,4.668,5.405C4.592,5.332,4.519,5.26,4.448,5.191 c0.065-0.036,0.15-0.004,0.231-0.016c0.06-0.063,0.046-0.18,0.154-0.209C4.889,5.015,4.846,5.08,4.862,5.141 C4.937,5.237,5.071,5.121,5.15,5.212c0,0.024,0,0.048,0,0.071C5.125,5.336,5.067,5.313,5.021,5.34 c-0.04,0.085-0.003,0.182-0.016,0.275C4.981,5.642,4.957,5.642,4.933,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DDDCE4' d='M1.433,5.615C1.375,5.613,1.311,5.632,1.267,5.548 c-0.083,0.044-0.164,0.086-0.245,0.13C0.906,5.58,1.086,5.545,1.06,5.432c-0.038-0.043-0.098-0.11-0.15-0.169 c0.023-0.042,0.035-0.08,0.044-0.079C1.124,5.2,1.206,5.105,1.25,4.956c0.045,0.168,0.152,0.252,0.317,0.232 c0.05,0.17-0.202,0.195-0.134,0.354c0.02,0.017,0.027,0.033,0.02,0.049S1.439,5.615,1.433,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD9E2' d='M5.88,3.354c-0.087,0.014-0.158-0.02-0.208-0.105 C5.59,3.321,5.532,3.372,5.471,3.426C5.417,3.323,5.43,3.24,5.542,3.146C5.467,3.072,5.393,3.001,5.322,2.932 c0.065-0.037,0.151-0.005,0.231-0.016c0.06-0.063,0.047-0.18,0.153-0.21C5.764,2.754,5.715,2.82,5.761,2.912 c0.05,0.065,0.184-0.052,0.264,0.039c0,0.024,0,0.048,0,0.071c-0.024,0.053-0.082,0.03-0.122,0.052 C5.859,3.139,5.89,3.212,5.88,3.281C5.9,3.297,5.907,3.313,5.9,3.33C5.894,3.346,5.887,3.354,5.88,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DDDCE5' d='M6.755,1.094c-0.158-0.116-0.295-0.1-0.396,0.075 C6.231,1.061,6.405,1.025,6.382,0.903C6.331,0.852,6.251,0.772,6.17,0.69c0.086-0.062,0.171-0.022,0.25-0.034 c0.082-0.051,0.122-0.131,0.153-0.221C6.617,0.606,6.726,0.688,6.89,0.665c0.049,0.172-0.201,0.197-0.134,0.356 c0.02,0.016,0.027,0.032,0.02,0.048C6.769,1.085,6.762,1.094,6.755,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DEDEE6' d='M4.868,6.709c0.097,0,0.178,0,0.259,0 c0.01,0.013,0.02,0.026,0.029,0.039c-0.071,0.015-0.142,0.03-0.212,0.045C4.967,6.819,4.99,6.846,5.013,6.874 C5.008,6.955,5.004,7.036,5,7.126C4.922,7.13,4.87,7.056,4.787,7.068c-0.072,0.01-0.095,0.125-0.189,0.073 C4.533,7.073,4.583,6.985,4.562,6.878C4.524,6.85,4.466,6.807,4.408,6.764c0.092-0.1,0.196-0.027,0.279-0.065 c0.062-0.054-0.003-0.14,0.043-0.202c0.039,0,0.071,0,0.1,0C4.884,6.552,4.847,6.615,4.868,6.709z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E4E3EA' d='M6.755,5.615C6.663,5.647,6.613,5.55,6.533,5.542 c-0.089,0.01-0.109,0.113-0.188,0.137C6.229,5.58,6.409,5.545,6.382,5.432c-0.038-0.043-0.097-0.11-0.15-0.169 c0.023-0.042,0.036-0.08,0.044-0.079C6.446,5.2,6.529,5.105,6.572,4.957c0.104,0.195,0.104,0.195,0.324,0.251 c0.044,0.15-0.208,0.174-0.141,0.333c0.02,0.017,0.027,0.033,0.02,0.049C6.769,5.606,6.762,5.615,6.755,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DCDBE4' d='M1.433,1.094c-0.158-0.116-0.295-0.1-0.397,0.075 C0.908,1.061,1.083,1.025,1.059,0.903C1.008,0.852,0.929,0.772,0.847,0.69c0.086-0.062,0.172-0.022,0.251-0.034 c0.082-0.051,0.122-0.131,0.153-0.221c0.043,0.171,0.152,0.252,0.316,0.229c0.049,0.172-0.201,0.197-0.134,0.356 c0.02,0.016,0.027,0.032,0.02,0.048S1.439,1.094,1.433,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DFDEE6' d='M3.693,4.812c0.042-0.148-0.045-0.243-0.148-0.328 c0.09-0.079,0.198,0.003,0.279-0.059C3.875,4.37,3.782,4.25,3.912,4.224C4.042,4.25,3.949,4.37,3.999,4.426 c0.082,0.062,0.19-0.02,0.284,0.063C4.226,4.531,4.169,4.573,4.13,4.601c0,0.115,0,0.2,0,0.284 c-0.024,0.025-0.049,0.025-0.073,0C4.013,4.756,3.928,4.809,3.849,4.84C3.82,4.851,3.793,4.87,3.766,4.885 C3.692,4.91,3.668,4.886,3.693,4.812z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD9E3' d='M2.57,2.917C2.442,3.015,2.358,3.078,2.275,3.142 C2.258,3.27,2.437,3.296,2.359,3.422C2.284,3.407,2.262,3.307,2.238,3.301C2.101,3.239,2.07,3.406,1.973,3.347 c-0.067-0.073-0.001-0.164-0.01-0.181c-0.043-0.133-0.136-0.077-0.165-0.14c0-0.024,0-0.048,0-0.075 c0.077-0.08,0.185-0.001,0.271-0.049c0.061-0.053-0.022-0.145,0.049-0.196c0.07,0.043,0.131,0.093,0.128,0.211 C2.335,2.917,2.425,2.917,2.57,2.917z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD9E2' d='M0.558,3.354c-0.087,0.014-0.158-0.02-0.209-0.105 C0.267,3.321,0.209,3.372,0.152,3.423C0.044,3.32,0.198,3.28,0.209,3.188c-0.078-0.078-0.157-0.157-0.24-0.24 c0.095-0.054,0.18-0.021,0.261-0.032c0.061-0.063,0.047-0.18,0.154-0.21C0.44,2.754,0.398,2.819,0.414,2.879 c0.076,0.093,0.207-0.01,0.289,0.063c0,0.033,0,0.056,0,0.08c-0.025,0.053-0.082,0.03-0.122,0.052 C0.536,3.139,0.566,3.212,0.558,3.281c0.02,0.016,0.027,0.032,0.02,0.049C0.571,3.346,0.564,3.354,0.558,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E1E1E8' d='M5.005,2.625C4.912,2.659,4.862,2.559,4.782,2.552 c-0.071-0.003-0.096,0.12-0.186,0.065c-0.081-0.08-0.002-0.123,0.066-0.197c-0.073-0.071-0.147-0.144-0.22-0.214 c0.066-0.048,0.154,0.006,0.233-0.022c0.088-0.042-0.02-0.191,0.095-0.221C4.922,1.99,4.82,2.113,4.875,2.167 c0.082,0.059,0.189-0.021,0.278,0.057c-0.104,0.084-0.19,0.18-0.148,0.328c0.02,0.016,0.027,0.032,0.02,0.048 C5.019,2.617,5.012,2.625,5.005,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DBDAE3' d='M-2.318,3.441c0.176,0.25,0.176,0.25,0.395,0.316 c-0.034,0.034-0.064,0.074-0.104,0.101c-0.025,0.017-0.065,0.014-0.102,0.02c0.03,0.087,0.097,0.161,0.041,0.272 C-2.169,4.106-2.25,4.063-2.333,4.021c-0.041,0.041-0.083,0.083-0.139,0.139c-0.061-0.084-0.017-0.18-0.048-0.307 C-2.543,3.837-2.602,3.8-2.659,3.763C-2.461,3.756-2.364,3.659-2.318,3.441z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD9E2' d='M-1.63,3.354c0-0.024,0-0.048,0-0.073 c0.029-0.019,0.046-0.051,0.073-0.073c0.015-0.161-0.209-0.089-0.225-0.23C-1.717,2.851-1.583,2.965-1.504,2.9 c0.047-0.031-0.017-0.133,0.067-0.127c0.11-0.013,0.095,0.061,0.105,0.115c0.08,0.071,0.186-0.008,0.268,0.047 c0.046,0.072,0.032,0.091-0.111,0.147c-0.053,0.083,0.028,0.189-0.045,0.266C-1.308,3.386-1.345,3.3-1.39,3.266 c-0.069,0.036-0.118,0.062-0.167,0.088C-1.582,3.376-1.606,3.376-1.63,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E0DFE7' d='M-0.682,0.948C-0.707,0.824-0.851,0.793-0.89,0.68 c0.078-0.047,0.163-0.013,0.244-0.023c0.055-0.067,0.053-0.177,0.154-0.212c0.057,0.048,0.016,0.114,0.031,0.175 C-0.388,0.717-0.252,0.6-0.173,0.69c0,0.024,0,0.048,0,0.072C-0.198,0.814-0.254,0.795-0.3,0.814 c-0.042,0.089-0.005,0.187-0.018,0.279c-0.024,0.028-0.049,0.028-0.073,0c-0.048-0.026-0.095-0.052-0.146-0.079 c-0.05,0.027-0.098,0.053-0.146,0.079c-0.024,0.023-0.049,0.023-0.073,0c0-0.024,0-0.049,0-0.073 C-0.726,1.002-0.709,0.969-0.682,0.948z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DBDAE3' d='M3.255,1.021c0,0.024,0,0.048,0,0.073 c-0.024,0.022-0.049,0.022-0.073,0C3.12,1.107,3.114,1.032,3.086,1.029C2.976,0.98,2.944,1.146,2.844,1.084 C2.788,1.012,2.83,0.925,2.818,0.844C2.793,0.773,2.701,0.829,2.672,0.766c0-0.024,0-0.048,0-0.075 C2.75,0.611,2.857,0.689,2.95,0.638c0.009-0.061,0.019-0.128,0.03-0.199c0.082,0.05,0.144,0.098,0.14,0.193 c0.083,0.055,0.185,0.004,0.275,0.031C3.352,0.794,3.207,0.824,3.183,0.948C3.209,0.969,3.226,1.002,3.255,1.021z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DFDEE6' d='M4.641,0.948C4.616,0.824,4.472,0.793,4.433,0.68 C4.51,0.632,4.596,0.667,4.677,0.656C4.732,0.589,4.73,0.479,4.831,0.444c0.057,0.048,0.016,0.114,0.031,0.175 C4.935,0.717,5.07,0.6,5.15,0.69c0,0.024,0,0.048,0,0.072c-0.024,0.053-0.082,0.03-0.129,0.056 C4.981,0.904,5.018,1.001,5.005,1.094c-0.024,0.028-0.049,0.028-0.073,0C4.885,1.068,4.837,1.042,4.787,1.015 c-0.05,0.027-0.098,0.053-0.146,0.079c-0.024,0.022-0.048,0.022-0.073,0c0-0.024,0-0.049,0-0.073 C4.598,1.002,4.614,0.969,4.641,0.948z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DBDAE3' d='M2.823,7.12c0-0.071,0-0.143,0-0.233 C2.774,6.85,2.716,6.808,2.658,6.765c0.091-0.106,0.198-0.024,0.281-0.068C2.998,6.642,2.934,6.556,2.98,6.494 C3.061,6.54,3.13,6.581,3.108,6.672c0.09,0.077,0.198-0.003,0.268,0.05C3.304,6.792,3.23,6.864,3.159,6.933 C3.22,7.006,3.281,7.039,3.246,7.128C3.128,7.225,2.969,6.922,2.823,7.12z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E0DFE7' d='M-0.317,7.146c-0.134-0.133-0.271-0.06-0.391,0.01 c-0.1-0.096-0.023-0.14,0.024-0.19C-0.755,6.891-0.827,6.816-0.9,6.74c0.083-0.06,0.169-0.02,0.251-0.032 c0.038-0.08,0.067-0.167,0.153-0.214c0.071,0.05-0.001,0.139,0.07,0.22c0.069,0,0.16,0,0.308,0 c-0.104,0.079-0.16,0.122-0.2,0.152c0,0.086,0,0.146,0,0.207c0.02,0.017,0.027,0.033,0.02,0.049S-0.311,7.146-0.317,7.146z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD8E2' d='M3.255,5.542c0,0.024,0,0.049,0,0.073 c-0.024,0.022-0.049,0.022-0.073,0C3.122,5.625,3.11,5.559,3.084,5.549C2.976,5.502,2.944,5.667,2.843,5.604 C2.789,5.531,2.83,5.444,2.818,5.366C2.793,5.31,2.735,5.333,2.706,5.316C2.657,5.286,2.676,5.246,2.673,5.21 c0.079-0.078,0.187,0.002,0.271-0.049c0.058-0.056-0.021-0.146,0.05-0.198c0.094,0.041,0.108,0.139,0.154,0.212 c0.058,0.015,0.124-0.028,0.18,0.036C3.323,5.239,3.325,5.276,3.31,5.303C3.275,5.364,3.188,5.385,3.183,5.469 C3.209,5.49,3.226,5.522,3.255,5.542z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DCDBE4' d='M-2.505,2.593c0-0.078,0-0.15,0-0.255 C-2.538,2.306-2.587,2.257-2.636,2.21c0.073-0.064,0.182,0.018,0.267-0.048c0.006-0.054,0.012-0.111,0.019-0.168 c0.121,0,0.127,0.098,0.16,0.185c0.087,0.007,0.178,0.014,0.343,0.026C-1.982,2.31-2.064,2.374-2.146,2.438 c0.06,0.055,0.107,0.094,0.065,0.164c-0.101,0.106-0.135-0.05-0.214-0.058C-2.378,2.536-2.426,2.631-2.505,2.593z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DCDBE4' d='M-0.682,5.469c-0.051-0.075-0.103-0.15-0.149-0.217 c0.025-0.14,0.132-0.025,0.177-0.087c0.046-0.065,0.071-0.157,0.16-0.201c0.071,0.051-0.004,0.141,0.048,0.195 c0.084,0.057,0.193-0.028,0.271,0.05C-0.142,5.32-0.222,5.323-0.3,5.335c-0.042,0.089-0.005,0.186-0.018,0.279 c-0.024,0.028-0.049,0.028-0.073,0c-0.048-0.026-0.095-0.052-0.146-0.079c-0.05,0.027-0.098,0.053-0.146,0.079 c-0.024,0.022-0.049,0.022-0.073,0c0-0.024,0-0.049,0-0.073C-0.726,5.522-0.709,5.49-0.682,5.469z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E1E0E7' d='M5.88,4.885C5.71,4.804,5.71,4.804,5.474,4.88 C5.36,4.784,5.524,4.744,5.509,4.613C5.494,4.551,5.325,4.598,5.304,4.475c0.07-0.061,0.157-0.012,0.24-0.028 c0.079-0.05,0.038-0.189,0.158-0.201C5.75,4.383,5.832,4.5,6.032,4.49C5.977,4.533,5.921,4.575,5.88,4.606 c0,0.086,0,0.146,0,0.207C5.9,4.829,5.907,4.845,5.9,4.861C5.894,4.877,5.887,4.885,5.88,4.885z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DDDCE5' d='M1.899,4.878c0.064-0.21,0.064-0.21-0.095-0.401 c0.217-0.053,0.217-0.053,0.324-0.243c0.077,0.045,0.103,0.123,0.126,0.2c0.086,0.048,0.194-0.03,0.272,0.05 C2.475,4.552,2.411,4.6,2.326,4.61c-0.032,0.093-0.045,0.18,0.056,0.236C2.26,4.979,2.226,4.779,2.118,4.801 C2.037,4.818,1.997,4.937,1.899,4.878z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DDDCE5' d='M1.018,7.15C1.055,7.055,1.08,6.983,1.068,6.9 C1.02,6.814,0.935,6.78,0.848,6.744c0.081-0.081,0.189,0,0.329-0.085c0.021-0.012,0.022-0.105,0.072-0.168 C1.353,6.683,1.353,6.683,1.573,6.74c0.034,0.108-0.041,0.115-0.117,0.124c-0.049,0.05-0.024,0.115-0.02,0.17 c0.002,0.031,0.056,0.056,0.056,0.112C1.327,7.07,1.178,7.028,1.018,7.15z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E5E4EA' d='M-0.317,2.625c-0.134-0.134-0.271-0.057-0.391,0.009 c-0.116-0.109,0.014-0.156,0.042-0.207c-0.041-0.133-0.205-0.092-0.224-0.215c0.07-0.056,0.158-0.011,0.24-0.026 c0.068-0.058,0.046-0.183,0.166-0.207c0.059,0.042-0.005,0.129,0.03,0.182c0.09,0.064,0.197-0.015,0.287,0.063 c-0.104,0.084-0.19,0.18-0.148,0.328c0.02,0.016,0.027,0.032,0.02,0.048S-0.311,2.625-0.317,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E5E4EA' d='M3.391,2.213C3.348,2.3,3.288,2.362,3.198,2.344 C3.127,2.467,3.311,2.492,3.257,2.585C3.23,2.625,3.183,2.641,3.16,2.623C3.054,2.538,2.956,2.5,2.854,2.626 c-0.081-0.079-0.001-0.187-0.05-0.271c-0.043-0.043-0.086-0.086-0.13-0.13c0.076-0.087,0.184-0.003,0.27-0.052 C3.005,2.122,2.92,2.029,2.991,1.977C3.153,2.159,3.204,2.189,3.391,2.213z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E2E1E8' d='M-1.192,4.95C-1.349,4.7-1.477,4.886-1.589,4.89 c-0.112-0.104,0.021-0.151,0.047-0.203c-0.042-0.132-0.205-0.092-0.224-0.214c0.071-0.056,0.158-0.011,0.241-0.026 c0.042-0.076,0.067-0.167,0.153-0.215c0.073,0.051,0.002,0.139,0.05,0.196c0.082,0.059,0.189-0.021,0.283,0.062 c-0.058,0.043-0.113,0.085-0.153,0.115C-1.192,4.716-1.192,4.801-1.192,4.95z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E2E1E8' d='M3.464,3.719c-0.14,0.079-0.234,0.095-0.278,0.179 c0.079,0.071,0.095,0.153,0.045,0.25c-0.069-0.06-0.174-0.053-0.229-0.136C2.952,4.06,2.902,4.107,2.851,4.155 C2.785,4.078,2.833,3.99,2.816,3.903c-0.044-0.047-0.094-0.098-0.171-0.18c0.203,0.023,0.33-0.051,0.356-0.234 c0.164,0.028,0.078,0.146,0.138,0.229C3.211,3.719,3.301,3.719,3.464,3.719z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E7E6EC' d='M5.173,3.755C4.978,3.834,5,3.999,5.009,4.185 C4.916,4.102,4.858,4.05,4.81,4.007C4.699,4.019,4.672,4.116,4.598,4.152C4.536,4.057,4.55,3.975,4.638,3.904 C4.583,3.831,4.519,3.771,4.399,3.775C4.505,3.674,4.614,3.757,4.696,3.7c0.055-0.055-0.034-0.172,0.079-0.208 C4.945,3.699,4.945,3.699,5.173,3.755z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23EAE9EE' d='M2.308,1.661C2.282,1.744,2.442,1.779,2.355,1.885 C2.283,1.849,2.208,1.811,2.12,1.766C2.047,1.78,2.026,1.914,1.885,1.891c0.006-0.078,0.083-0.148,0.046-0.267 c-0.031-0.021-0.09-0.061-0.148-0.101c0.034-0.036,0.05-0.064,0.061-0.063c0.164,0.023,0.235-0.068,0.264-0.211 c0.083,0.036,0.134,0.087,0.132,0.18c0.08,0.069,0.184,0.004,0.298,0.048C2.455,1.553,2.331,1.553,2.308,1.661z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23EAE9EE' d='M3.768,6.167c-0.05-0.086-0.14-0.112-0.223-0.154 c0.086-0.062,0.173-0.022,0.254-0.034c0.1-0.041-0.036-0.205,0.116-0.221C4.048,5.781,3.942,5.907,4.001,5.96 c0.082,0.059,0.191-0.026,0.27,0.05C4.251,6.068,4.193,6.042,4.155,6.063c-0.07,0.106,0.021,0.236-0.05,0.344 c-0.065-0.062-0.181-0.039-0.22-0.141C3.827,6.32,3.776,6.367,3.725,6.415C3.664,6.314,3.665,6.229,3.768,6.167z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E6E5EB' d='M2.308,6.344C2.232,6.356,2.171,6.332,2.124,6.274 C2.047,6.318,2.022,6.447,1.897,6.409C1.965,6.2,1.965,6.2,1.805,6.008c0.245-0.06,0.245-0.06,0.323-0.324 c0.013,0.107,0.125,0.166,0.11,0.267c0.097,0.065,0.204-0.015,0.287,0.062C2.412,6.066,2.284,6.106,2.308,6.271 c0.02,0.016,0.026,0.032,0.02,0.048C2.321,6.335,2.314,6.344,2.308,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23D1CFDB' d='M-2.213,6.635c0.113,0.066,0.145,0.076,0.228,0.083 C-2.035,6.768-2.105,6.837-2.147,6.88c0.03,0.132,0.13,0.169,0.061,0.249C-2.108,7.134-2.14,7.152-2.15,7.144 C-2.259,7.05-2.369,7.051-2.496,7.14c0-0.09,0-0.171,0-0.283C-2.543,6.827-2.602,6.79-2.664,6.75 c0.089-0.063,0.163-0.032,0.232-0.042c0.023-0.025,0.05-0.047,0.073-0.073C-2.311,6.592-2.262,6.594-2.213,6.635z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E6E5EB' d='M-1.192,1.896c-0.092-0.012-0.117-0.112-0.202-0.147 c-0.102-0.017-0.122,0.118-0.211,0.135c-0.112-0.101,0.074-0.132,0.05-0.214c-0.034-0.103-0.194-0.063-0.21-0.185 c0.08-0.066,0.186,0.011,0.268-0.048c0.043-0.059-0.024-0.145,0.049-0.196c0.034,0.002,0.09-0.017,0.095,0.022 C-1.333,1.448-1.19,1.46-1.051,1.471c-0.033,0.122-0.148,0.11-0.213,0.168c0.06,0.047,0.083,0.109,0.071,0.184 c0.02,0.017,0.027,0.033,0.02,0.049S-1.186,1.896-1.192,1.896z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E1E0E7' d='M0.193,4.74c0-0.036,0-0.072,0-0.109 C0.118,4.586,0.021,4.571-0.021,4.477c0.074-0.061,0.161-0.014,0.245-0.03C0.269,4.373,0.29,4.279,0.375,4.23 c0.103,0.193,0.103,0.193,0.343,0.254c-0.064,0.049-0.119,0.091-0.16,0.123c0,0.085,0,0.146,0,0.206 c0.02,0.016,0.027,0.032,0.02,0.049c-0.007,0.016-0.014,0.024-0.02,0.024C0.472,4.816,0.371,4.804,0.266,4.812 C0.198,4.832,0.166,4.815,0.193,4.74z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E5E4EB' d='M6.683,2.552c-0.046,0.012-0.061-0.03-0.087-0.051 C6.587,2.495,6.574,2.481,6.57,2.483C6.496,2.528,6.47,2.656,6.34,2.616c-0.046-0.068,0.077-0.075,0.053-0.14 C6.381,2.444,6.391,2.405,6.391,2.37C6.324,2.312,6.212,2.319,6.179,2.214C6.253,2.158,6.34,2.201,6.42,2.187 c0.083-0.049,0.121-0.131,0.153-0.218C6.626,2.03,6.624,2.125,6.701,2.169C6.783,2.225,6.89,2.145,6.969,2.217 C6.926,2.31,6.832,2.328,6.755,2.37c0,0.037,0,0.073,0,0.109C6.733,2.505,6.729,2.549,6.683,2.552z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E3E3E9' d='M1.068,2.479C1.09,2.317,0.973,2.267,0.832,2.233 C0.93,2.157,1.017,2.201,1.098,2.187c0.082-0.049,0.121-0.13,0.153-0.218c0.05,0.065,0.053,0.158,0.129,0.203 C1.463,2.224,1.571,2.141,1.649,2.22C1.601,2.307,1.51,2.333,1.434,2.374C1.4,2.466,1.466,2.54,1.507,2.641 C1.358,2.612,1.263,2.519,1.141,2.552L1.114,2.545c-0.017-0.01-0.029-0.023-0.04-0.039C1.074,2.507,1.068,2.479,1.068,2.479z' /%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E7E5EB' d='M5.808,1.823c-0.046,0.013-0.06-0.031-0.105-0.06 C5.632,1.8,5.551,1.843,5.469,1.886c-0.116-0.099,0.067-0.132,0.046-0.21C5.495,1.557,5.381,1.543,5.299,1.489 c0.079-0.06,0.166-0.017,0.253-0.033c0.047-0.093,0.096-0.191,0.146-0.292C5.772,1.426,5.772,1.426,6.02,1.489 C5.974,1.576,5.842,1.617,5.88,1.75C5.863,1.767,5.85,1.788,5.842,1.811L5.808,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E7E6EC' d='M6.391,4.01c0.039-0.132-0.093-0.174-0.14-0.261 C6.298,3.69,6.364,3.736,6.432,3.706c0.041-0.082,0.09-0.18,0.14-0.28c0.076,0.262,0.076,0.262,0.34,0.326 C6.764,3.858,6.686,3.98,6.825,4.141C6.676,4.188,6.651,4.058,6.576,4.015C6.535,4.03,6.522,4.095,6.464,4.083 C6.391,4.108,6.366,4.083,6.391,4.01z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E8E7EC' d='M5.808,6.344c-0.046,0.012-0.061-0.03-0.1-0.06 C5.645,6.348,5.532,6.323,5.483,6.418c-0.13-0.11,0.053-0.144,0.033-0.222C5.495,6.078,5.381,6.064,5.299,6.01 c0.079-0.061,0.166-0.017,0.253-0.033c0.047-0.093,0.096-0.192,0.146-0.292C5.772,5.947,5.772,5.947,6.02,6.009 C5.974,6.097,5.842,6.138,5.88,6.271C5.863,6.288,5.85,6.309,5.842,6.332L5.808,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E7E6EC' d='M-1.557,6.198c-0.021-0.119-0.134-0.134-0.216-0.187 c0.081-0.075,0.188,0.004,0.27-0.049c0.066-0.051-0.048-0.176,0.082-0.203c0.181,0.204,0.181,0.204,0.361,0.242 C-1.06,6.01-1.055,6.021-1.059,6.026c-0.023,0.041-0.063,0.021-0.097,0.026c-0.06,0.043-0.033,0.107-0.037,0.164 c-0.003,0.058,0,0.117,0,0.212c-0.121-0.113-0.246-0.079-0.365-0.084C-1.598,6.295-1.599,6.247-1.557,6.198z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23ECEBF0' d='M0.484,1.823c-0.046,0.013-0.059-0.031-0.105-0.06 C0.309,1.8,0.228,1.843,0.146,1.886C0.047,1.792,0.191,1.749,0.2,1.717C0.171,1.558,0.059,1.543-0.024,1.489 c0.079-0.062,0.165-0.017,0.249-0.032C0.267,1.382,0.292,1.29,0.375,1.24C0.42,1.403,0.524,1.491,0.71,1.465 C0.651,1.576,0.519,1.618,0.558,1.75C0.54,1.767,0.527,1.788,0.519,1.811L0.484,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DAD9E2' d='M-2.213,5.542c-0.132-0.036-0.177,0.087-0.259,0.146 C-2.537,5.589-2.523,5.508-2.44,5.44c-0.022-0.118-0.183-0.078-0.216-0.178c0.014-0.033,0.017-0.061,0.032-0.073 c0.078-0.059,0.217,0.07,0.265-0.085c0.049-0.043,0.097-0.041,0.146,0c0.015,0.152,0.173,0.014,0.217,0.108 c0.03,0.129-0.137,0.148-0.144,0.257C-2.113,5.544-2.146,5.561-2.213,5.542z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23DBDAE3' d='M-2.213,0.583c0.046,0.169,0.217,0,0.287,0.105 c-0.057,0.098-0.182,0.141-0.214,0.259c0.027,0.076-0.005,0.092-0.073,0.073C-2.346,0.984-2.389,1.11-2.474,1.164 c-0.059-0.092-0.059-0.175,0.051-0.253c-0.084-0.07-0.165-0.136-0.239-0.198c0.082-0.131,0.255,0.04,0.303-0.129 C-2.311,0.54-2.262,0.543-2.213,0.583z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E0DFE7' d='M6.391,7c0-0.036,0-0.072,0-0.109 c-0.075-0.044-0.171-0.06-0.213-0.152C6.25,6.669,6.34,6.738,6.417,6.702c0.088-0.042,0.121-0.127,0.155-0.213 c0.104,0.195,0.104,0.195,0.323,0.25C6.85,6.826,6.717,6.867,6.755,7C6.733,7.026,6.729,7.07,6.683,7.073 C6.577,7.064,6.477,7.077,6.391,7.146C6.35,7.097,6.349,7.049,6.391,7z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23ECEBEF' d='M4.103,1.896C4.041,1.841,3.983,1.79,3.935,1.747 c-0.111,0.011-0.137,0.11-0.214,0.146c-0.054-0.095-0.06-0.181,0.044-0.245c-0.051-0.086-0.134-0.12-0.218-0.156 c0.084-0.075,0.19-0.004,0.262-0.039c0.062-0.071-0.01-0.16,0.062-0.211c0.185-0.029,0.076,0.131,0.132,0.199 c0.074,0.047,0.177-0.005,0.278,0.031C4.208,1.55,4.093,1.539,4.074,1.648C4.139,1.708,4.155,1.791,4.103,1.896z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23E4E3EA' d='M-0.391,4.083c-0.045,0.012-0.06-0.03-0.102-0.062 c-0.073,0.039-0.155,0.082-0.236,0.125c-0.116-0.098,0.066-0.132,0.047-0.209C-0.704,3.818-0.816,3.803-0.899,3.75 C-0.82,3.688-0.734,3.733-0.65,3.717C-0.608,3.643-0.583,3.55-0.5,3.501c0.044,0.163,0.148,0.25,0.334,0.225 C-0.224,3.836-0.356,3.878-0.317,4.01C-0.345,4.032-0.346,4.079-0.391,4.083z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23EBEAEF' d='M0.484,6.344c-0.045,0.012-0.06-0.03-0.102-0.062 C0.309,6.321,0.228,6.364,0.146,6.406C0.047,6.312,0.191,6.27,0.2,6.237C0.171,6.079,0.059,6.063-0.024,6.01 c0.079-0.061,0.165-0.017,0.249-0.032c0.042-0.075,0.067-0.167,0.151-0.217C0.42,5.924,0.524,6.012,0.71,5.986 C0.651,6.097,0.519,6.138,0.558,6.271C0.54,6.288,0.527,6.309,0.519,6.332L0.484,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23EAE9EE' d='M1.359,4.083C1.301,4.092,1.287,4.034,1.25,4.012 C1.213,4.034,1.2,4.092,1.141,4.083c-0.073,0.024-0.097,0-0.073-0.073c0.039-0.132-0.093-0.174-0.14-0.262 C0.975,3.691,1.04,3.731,1.1,3.717C1.143,3.643,1.167,3.55,1.25,3.5c0.045,0.163,0.148,0.252,0.335,0.224 C1.526,3.836,1.394,3.878,1.433,4.01C1.457,4.083,1.433,4.108,1.359,4.083z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23AFAEC3' d='M-2.213,1.021c0.05,0.001,0.075-0.022,0.073-0.073 c0.15,0.041,0.031,0.14,0.121,0.258C-2.15,1.125-2.203,1.092-2.213,1.021z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23AEAEC3' d='M-2.213,5.542c0.05,0.002,0.075-0.022,0.073-0.073 c0.136,0.043,0.059,0.134,0.055,0.217C-2.15,5.646-2.203,5.613-2.213,5.542z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239896B2' d='M0.193,4.74C0.191,4.79,0.215,4.814,0.266,4.812 c-0.01,0.071-0.063,0.104-0.127,0.144C0.134,4.873,0.057,4.783,0.193,4.74z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23BEBDCE' d='M-1.557,6.198c0,0.049,0,0.097,0,0.146 c0.004,0.035-0.007,0.06-0.056,0.064C-1.615,6.331-1.693,6.241-1.557,6.198z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23C3C3D3' d='M-2.213,6.635c-0.049,0-0.097,0-0.146,0 c0.008-0.043-0.02-0.093,0.025-0.135C-2.272,6.526-2.227,6.566-2.213,6.635z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239391AE' d='M6.391,7c0,0.049,0,0.097,0,0.146 c0.004,0.035-0.007,0.06-0.056,0.064C6.333,7.133,6.254,7.043,6.391,7z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M6.683,7.073C6.681,7.022,6.705,6.998,6.755,7 C6.743,7.061,6.812,7.068,6.822,7.115C6.763,7.161,6.706,7.183,6.683,7.073z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B4B3C7' d='M-2.213,0.583c-0.049,0-0.097,0-0.146,0 c0.008-0.044-0.02-0.094,0.025-0.135C-2.272,0.474-2.227,0.514-2.213,0.583z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B5B4C8' d='M-2.213,5.104c-0.049,0-0.097,0-0.146,0 c0.008-0.043-0.02-0.093,0.025-0.135C-2.272,4.995-2.227,5.035-2.213,5.104z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23A3A2BA' d='M6.391,4.01C6.389,4.061,6.413,4.085,6.464,4.083 c-0.02,0.103-0.086,0.098-0.136,0.039C6.296,4.084,6.305,4.012,6.391,4.01z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239D9CB6' d='M1.359,4.083C1.41,4.085,1.434,4.061,1.433,4.01 c0.103,0.02,0.098,0.086,0.039,0.136C1.433,4.178,1.361,4.169,1.359,4.083z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239796B1' d='M1.068,4.01C1.066,4.061,1.09,4.085,1.141,4.083 C1.122,4.187,1.054,4.182,1.005,4.123C0.974,4.084,0.982,4.012,1.068,4.01z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%235F5D88' d='M3.693,4.812c-0.002,0.05,0.022,0.075,0.073,0.073 C3.747,4.988,3.679,4.984,3.63,4.925C3.599,4.886,3.607,4.814,3.693,4.812z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M6.683,2.552C6.681,2.501,6.705,2.478,6.755,2.479 C6.743,2.54,6.812,2.547,6.822,2.595C6.763,2.64,6.706,2.662,6.683,2.552z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23727196' d='M4.933,1.094c0.024,0,0.048,0,0.073,0 C5.041,1.089,5.063,1.102,5.07,1.141C5.006,1.178,4.95,1.195,4.933,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%237B7A9D' d='M-0.317,7.146c0-0.024,0-0.049,0-0.073 C-0.216,7.09-0.233,7.146-0.271,7.21C-0.31,7.204-0.322,7.181-0.317,7.146z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238685A5' d='M-0.391,1.094c0.024,0,0.049,0,0.073,0 c0.035-0.004,0.058,0.008,0.064,0.047C-0.317,1.178-0.373,1.195-0.391,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238382A3' d='M0.558,3.354c0-0.024,0-0.048,0-0.073 c0.101,0.018,0.084,0.074,0.047,0.138C0.565,3.412,0.553,3.389,0.558,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238382A3' d='M5.88,3.354c0-0.024,0-0.048,0-0.073 c0.102,0.018,0.084,0.074,0.047,0.138C5.889,3.412,5.876,3.389,5.88,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%235A5984' d='M-1.192,1.896c0-0.024,0-0.049,0-0.073 C-1.091,1.84-1.108,1.896-1.146,1.96C-1.185,1.954-1.197,1.931-1.192,1.896z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23908FAC' d='M0.558,1.823C0.593,1.818,0.616,1.831,0.622,1.87 c-0.064,0.038-0.12,0.055-0.138-0.047C0.509,1.797,0.533,1.797,0.558,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238B8AA8' d='M5.88,6.344c0.035-0.004,0.058,0.008,0.064,0.047 c-0.064,0.038-0.12,0.055-0.137-0.047C5.832,6.318,5.856,6.318,5.88,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238B8AA8' d='M0.558,6.344c0.035-0.004,0.058,0.008,0.064,0.047 c-0.064,0.038-0.12,0.055-0.138-0.047C0.509,6.318,0.533,6.318,0.558,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B6B5C8' d='M2.308,6.344c0-0.024,0-0.049,0-0.073 c0.101,0.017,0.084,0.073,0.047,0.137C2.315,6.402,2.303,6.379,2.308,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23A7A6BD' d='M1.068,2.625C1,2.63,0.991,2.583,0.997,2.534 C1,2.498,1.023,2.471,1.068,2.479C1.086,2.5,1.097,2.524,1.101,2.552C1.097,2.58,1.086,2.604,1.068,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23F7F8FA' d='M-0.391,4.083C-0.392,4.033-0.368,4.009-0.317,4.01 c0,0.044,0,0.089,0,0.131C-0.387,4.147-0.393,4.119-0.391,4.083z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%2363628B' d='M5.005,2.625c0-0.024,0-0.049,0-0.073 C5.107,2.569,5.09,2.625,5.052,2.689C5.014,2.683,5.001,2.66,5.005,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23767499' d='M-0.317,2.625c0-0.024,0-0.049,0-0.073 c0.101,0.017,0.084,0.073,0.047,0.137C-0.31,2.683-0.322,2.66-0.317,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%2379799B' d='M5.88,4.885c0-0.024,0-0.048,0-0.073 C5.982,4.83,5.965,4.886,5.927,4.95C5.889,4.943,5.876,4.92,5.88,4.885z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%235A5985' d='M4.058,4.885c0.024,0,0.048,0,0.073,0 c0.035-0.004,0.058,0.008,0.064,0.047C4.131,4.97,4.075,4.987,4.058,4.885z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%2379799B' d='M0.558,4.885c0-0.024,0-0.048,0-0.073 C0.659,4.83,0.642,4.886,0.604,4.95C0.565,4.943,0.553,4.92,0.558,4.885z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23908FAC' d='M5.88,1.823C5.916,1.818,5.938,1.831,5.945,1.87 c-0.064,0.038-0.12,0.055-0.137-0.047C5.832,1.797,5.856,1.797,5.88,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238E8CAA' d='M1.433,1.094c0-0.024,0-0.049,0-0.073 c0.101,0.017,0.084,0.073,0.047,0.137C1.44,1.152,1.428,1.129,1.433,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%238E8CAA' d='M6.755,1.094c0-0.024,0-0.049,0-0.073 C6.857,1.038,6.84,1.094,6.802,1.158C6.764,1.152,6.751,1.129,6.755,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239392AE' d='M1.433,5.615c0-0.024,0-0.049,0-0.073 c0.101,0.018,0.084,0.074,0.047,0.138C1.44,5.673,1.428,5.65,1.433,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%2377769A' d='M4.933,5.615c0.024,0,0.048,0,0.073,0 C5.041,5.61,5.063,5.623,5.07,5.662C5.006,5.699,4.95,5.716,4.933,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239999B4' d='M-0.391,5.615c0.024,0,0.049,0,0.073,0 c0.035-0.005,0.058,0.008,0.064,0.047C-0.317,5.699-0.373,5.716-0.391,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%239392AE' d='M6.755,5.615c0-0.024,0-0.049,0-0.073 C6.857,5.559,6.84,5.615,6.802,5.679C6.764,5.673,6.751,5.65,6.755,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%236F6D93' d='M-1.192,4.886c0.035-0.006,0.057,0.01,0.065,0.043 c0.001,0.006-0.016,0.023-0.021,0.021C-1.182,4.943-1.198,4.921-1.192,4.886z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23CCCBD8' d='M1.068,2.625c0-0.024,0-0.049,0-0.073 c0.024-0.022,0.049-0.022,0.073,0C1.143,2.603,1.118,2.627,1.068,2.625z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B2B2C6' d='M3.183,5.615c0.024,0,0.048,0,0.073,0 C3.258,5.65,3.251,5.682,3.207,5.672C3.195,5.67,3.19,5.635,3.183,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M0.558,1.823c-0.024,0-0.049,0-0.073,0 C0.483,1.772,0.507,1.748,0.558,1.75C0.558,1.774,0.558,1.799,0.558,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B7B7C9' d='M4.568,1.094c0.024,0,0.049,0,0.073,0 c0.003,0.036-0.004,0.068-0.048,0.058C4.581,1.149,4.576,1.114,4.568,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B7B7C9' d='M4.641,0.948c0.002,0.051-0.022,0.075-0.073,0.073 C4.566,0.97,4.59,0.946,4.641,0.948z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B3B2C6' d='M3.183,1.094c0.024,0,0.048,0,0.073,0 c0.002,0.036-0.004,0.068-0.048,0.058C3.195,1.149,3.19,1.114,3.183,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B4B4C8' d='M-0.755,5.615c0.024,0,0.048,0,0.073,0 C-0.68,5.65-0.687,5.682-0.73,5.672C-0.742,5.67-0.747,5.635-0.755,5.615z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B2B1C5' d='M-1.557,3.208c0.002,0.05-0.022,0.075-0.073,0.073 C-1.632,3.231-1.607,3.207-1.557,3.208z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23C3C3D3' d='M-2.359,6.635c0.002,0.051-0.022,0.075-0.073,0.073 C-2.434,6.658-2.41,6.634-2.359,6.635z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B3B2C6' d='M3.255,1.021c-0.05,0.001-0.075-0.022-0.073-0.073 C3.233,0.946,3.257,0.97,3.255,1.021z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B7B6C9' d='M-0.682,0.948c0.002,0.051-0.022,0.075-0.073,0.073 C-0.757,0.97-0.732,0.946-0.682,0.948z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B2B1C5' d='M-1.63,3.354c0.024,0,0.048,0,0.073,0 c0.002,0.036-0.004,0.068-0.048,0.058C-1.617,3.409-1.622,3.375-1.63,3.354z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M5.88,1.823c-0.024,0-0.049,0-0.073,0 C5.806,1.772,5.83,1.748,5.88,1.75C5.88,1.774,5.88,1.799,5.88,1.823z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B7B6C9' d='M-0.755,1.094c0.024,0,0.048,0,0.073,0 C-0.68,1.129-0.687,1.162-0.73,1.151C-0.742,1.149-0.747,1.114-0.755,1.094z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B4B4C8' d='M-0.682,5.469c0.002,0.05-0.022,0.075-0.073,0.073 C-0.757,5.491-0.732,5.467-0.682,5.469z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23B2B2C6' d='M3.255,5.542c-0.05,0.002-0.075-0.022-0.073-0.073 C3.233,5.467,3.257,5.491,3.255,5.542z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M5.88,6.344c-0.024,0-0.049,0-0.073,0 C5.806,6.293,5.83,6.269,5.88,6.271C5.88,6.295,5.88,6.319,5.88,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M0.558,6.344c-0.024,0-0.049,0-0.073,0 c-0.001-0.05,0.022-0.075,0.073-0.073C0.558,6.295,0.558,6.319,0.558,6.344z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' fill='%23FFFFFF' d='M1.141,2.552c-0.024,0-0.048,0-0.073,0 c0-0.024,0-0.049,0-0.073C1.118,2.478,1.143,2.501,1.141,2.552z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.lang-it::before {
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIxNHB4IiB2aWV3Qm94PSIwIDAgMjAgMTQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDYwLjEgKDg4MTMzKSAtIGh0dHBzOi8vc2tldGNoLmNvbSAtLT4KICAgIDx0aXRsZT5pdC1mbGFnPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+CiAgICAgICAgPHJlY3QgaWQ9InBhdGgtMSIgeD0iMCIgeT0iMCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjE0IiByeD0iMyI+PC9yZWN0PgogICAgPC9kZWZzPgogICAgPGcgaWQ9IlN5bWJvbHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJpdC1mbGFnIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNS4wMDAwMDAsIC04LjAwMDAwMCkiPgogICAgICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSg1LjAwMDAwMCwgOC4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj4KICAgICAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPgogICAgICAgICAgICAgICAgPC9tYXNrPgogICAgICAgICAgICAgICAgPHVzZSBpZD0iTWFzayIgZmlsbD0iI0Q4RDhEOCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+CiAgICAgICAgICAgICAgICA8ZyBpZD0iRmxhZ19vZl9JdGFseSIgbWFzaz0idXJsKCNtYXNrLTIpIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIGZpbGw9IiMwMDkyNDYiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMCIgaGVpZ2h0PSIxNCI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIGZpbGw9IiNGRkZGRkYiIHg9IjYiIHk9IjAiIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIGZpbGw9IiNDRTJCMzciIHg9IjE0IiB5PSIwIiB3aWR0aD0iNiIgaGVpZ2h0PSIxNCI+PC9yZWN0PgogICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICA8L2c+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=");
}
.lang-de::before {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='20px' height='14px' viewBox='0 0 20 14' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Ede-flag%3C/title%3E%3Cdefs%3E%3Crect id='path-1' x='0' y='0' width='20' height='14' rx='3'%3E%3C/rect%3E%3C/defs%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-5.000000, -8.000000)'%3E%3Cg transform='translate(5.000000, 8.000000)'%3E%3Cmask id='mask-2' fill='white'%3E%3Cuse xlink:href='%23path-1'%3E%3C/use%3E%3C/mask%3E%3Cuse fill='%23D8D8D8' xlink:href='%23path-1'%3E%3C/use%3E%3Cg mask='url(%23mask-2)' fill-rule='nonzero'%3E%3Crect fill='%23000000' x='0' y='0' width='20' height='14'%3E%3C/rect%3E%3Crect fill='%23DD0000' x='0' y='4.67' width='20' height='9.33'%3E%3C/rect%3E%3Crect fill='%23FFCC00' x='0' y='9.33' width='20' height='4.67'%3E%3C/rect%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.navbar .nav {
padding-left: 150px;
}
.contentWrapper {
border: 0;
}
.brand img {
height: 48px;
width: auto;
}
.navbar .brand {
padding: 11px 20px 11px;
}
.navbar .btn-navbar {
display: block;
position: absolute;
top: 0;
right: 10px;
margin-top: 20px;
width: 38px;
height: 28px;
text-shadow: none;
border: 0;
background: 0 0;
-webkit-box-shadow: none;
box-shadow: none;
z-index: 1000;
outline: none;
}
.navbar .btn-navbar .icon-bar {
background: silver;
}
.nav-collapse,
.nav-collapse.collapse {
overflow: hidden;
height: 0;
}
.nav-collapse .nav {
float: none;
margin: 0 0 9px;
position: relative;
padding-top: 50px;
}
.navbar .nav li {
display: block;
float: none;
text-align: right;
}
.navbar .nav > li > a {
display: inline-block;
font-size: 16px;
font-weight: 400;
color: rgb(52, 61, 72);
padding: 4px 24px 4px 10px;
}
#docsSearch {
background: #128191; /* was #0A8EA0 → --sl-primary-color */
border-bottom: 0;
min-height: 360px;
color: #fff;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
#docsSearch h1 {
padding-top: 2.8em;
font-weight: 300;
}
html[lang="en-EN"] #docsSearch h1,
html[lang="en"] #docsSearch h1 {
text-transform: capitalize;
}
#searchBar {
text-align: center;
margin-bottom: 0;
padding: 2em 0;
position: relative;
max-width: 580px;
margin: 0 auto;
padding-left: 20px;
padding-right: 125px;
z-index: 1;
}
#docsSearch #searchBar button {
background-color: #094B54; /* unchanged - dark accent */
color: #fff;
border-radius: 5px;
min-width: 115px;
text-shadow: none;
font-weight: 500;
border: none;
height: 64px;
-webkit-transition: all 0.3s, color 0.3s;
transition: all 0.3s, color 0.3s;
}
#docsSearch #searchBar button:hover {
opacity: 0.6;
}
/* The generic button:focus-visible ring color (#0a8ea0) doesn't read
well against this button's dark teal background — reuse the same
lighter --sl-focus-color as the hero search input next to it. */
#docsSearch #searchBar button:focus-visible {
outline: 2px solid #71c0cc;
outline-offset: 2px;
}
#docsSearch section {
margin-top: 60px;
padding-bottom: 20px;
min-height: 120px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
/* The 60px margin-top above pushes .container-fluid (holding
#sl-hc-categories/community CTA) too far from the search bar in the v2
layout — scoped to .sl-v2 only, legacy (no flag) keeps the original
spacing untouched. */
html.sl-v2 #docsSearch section {
margin-top: 0;
}
#docsSearch::before,
#docsSearch::after {
content: '';
position: absolute;
width: 280px;
top: 60px;
bottom: 0;
max-height: 280px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
z-index: 0;
}
#docsSearch::before {
left: 50%;
-webkit-transform: translateX(-215%);
transform: translateX(-215%);
background-image: url(https://cdn-publish.streetlib.com/help/illustrations/donna-laptop.png);
}
#docsSearch::after {
right: 50%;
-webkit-transform: translateX(215%);
transform: translateX(215%);
background-image: url(https://cdn-publish.streetlib.com/help/illustrations/uomo-che-legge.png);
}
#searchBar .search-query {
font-weight: 300;
height: 64px;
border-radius: 4px;
border: none;
}
/* The default focus outline is too close in hue to the teal #docsSearch
background to read as a ring — use the palette's dedicated focus color
(--sl-focus-color, see color mapping notes at top of file) instead.
!important is required: Bootstrap's own `input:focus, input[type=text]
:focus, ... { outline: 0 !important }` in launch-*.css would otherwise
win regardless of our selector's specificity.
Note: unlike buttons/links, browsers always match :focus-visible on
text inputs regardless of how focus was set, so this rule alone can't
distinguish Help Scout's window.onload autofocus from a real keyboard
focus — see the .sl-suppress-initial-focus-ring override below and the
JS in script.streetlib.js that toggles it. */
#searchBar .search-query:focus {
outline: 2px solid #71c0cc !important;
outline-offset: 2px;
}
/* Set by script.streetlib.js only when the field was already focused at
page load (Help Scout's autofocus) — hides the ring for that one silent
focus, then the class is removed on first real interaction so the ring
above works normally afterward. */
#searchBar .search-query.sl-suppress-initial-focus-ring:focus {
outline: none !important;
}
input,
button,
textarea {
font-family: 'Inter', 'Roboto', 'Open Sans', sans-serif;
letter-spacing: 0.5px;
}
.btn,
#fullArticle .admin-edit {
border: 1px solid rgba(20, 142, 160, 1);
border-radius: 4px;
color: rgba(20, 142, 160, 1);
cursor: pointer;
display: inline-block;
font-size: 12px;
line-height: 2.34;
padding: 0 20px;
background-color: transparent;
-webkit-box-shadow: none;
box-shadow: none;
text-shadow: none;
background-image: none;
-webkit-transition: background-color .12s ease-in-out, border-color .12s ease-in-out, color .15s ease-in-out;
transition: background-color .12s ease-in-out, border-color .12s ease-in-out, color .15s ease-in-out;
}
.btn:hover,
#fullArticle .admin-edit:hover {
background-color: rgba(20, 142, 160, 1);
color: #fff;
}
#fullArticle h1,
#fullArticle h2,
#fullArticle h3,
#fullArticle h4,
#fullArticle h5 {
color: #333;
font-weight: 300;
}
#main-content {
background-image: none;
}
.collection-category h2 {
text-align: center;
font-weight: 300;
margin-bottom: 30px;
}
.collection-category h2 a {
color: #0C0C0C; /* --sl-text-color (WCAG AAA) */
text-decoration: none;
}
.collection-category {
padding-top: 40px;
padding-bottom: 40px;
}
.category-list .category {
background-color: #FFF;
border: none;
border-radius: 4px;
padding: 3em 1em;
-webkit-box-shadow: 0px 5px 27px rgba(0, 0, 0, 0.08);
box-shadow: 0px 5px 27px rgba(0, 0, 0, 0.08);
-webkit-transition: all 0.3s, color 0.3s;
transition: all 0.3s, color 0.3s;
}
.category-list .category:hover {
background-color: #FFF;
-webkit-box-shadow: 0px 10px 60px 0 rgba(0, 0, 0, 0.2);
box-shadow: 0px 10px 60px 0 rgba(0, 0, 0, 0.2);
}
/* Category link titles - accessible contrast */
.category-list .category h3 {
color: #0C0C0C; /* was default → --sl-text-color (WCAG AAA) */
/* font-weight: 600; */
margin-bottom: 0.5em;
}
.category-list .category:hover h3 {
color: #097988; /* --sl-contrast-text-color */
}
.category-list .category .article-count {
color: #097988; /* was default → --sl-contrast-text-color */
}
.collection-category .category-list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.collection-category h2 a:hover {
border: none;
color: #097988; /* was #168ea0 → --sl-contrast-text-color */
}
.category-list .category::before {
content: '';
display: block;
height: 48px;
width: 48px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
margin: 40px auto 20px;
}
/* "Ebook" subcategories */
.category-list #category-560::before,
.category-list #category-64::before,
.category-list #category-1459::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/preparazione-dei-file.png')
}
.category-list #category-561::before,
.category-list #category-95::before,
.category-list #category-587::before,
.category-list #category-1478::before,
.category-list #category-1460::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/pubblicare-un-ebook.png')
}
.category-list #category-562::before,
/*.category-list #category-108::before,*/
.category-list #category-613::before,
.category-list #category-1461::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/cosa-si-puo-e cosa-non-si-puo-pubblicare.png')
}
.category-list #category-563::before,
.category-list #category-654::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/il-prezzo-dell-ebook.png')
}
.category-list #category-564::before,
.category-list #category-653::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/modifiche-e-ritiro-dalla-vendita.png')
}
.category-list #category-565::before,
.category-list #category-121::before,
.category-list #category-595::before,
.category-list #category-1464::before,
.category-list #category-1477::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/da-sapere-sugli-store.png')
}
.category-list #category-566::before,
.category-list #category-578::before,
.category-list #category-108::before,
.category-list #category-682::before,
.category-list #category-1489::before,
.category-list #category-1488::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/modelli-di-vendita-e-guadagni.png')
}
/* "Audiobook" subcategories */
.category-list #category-573::before,
.category-list #category-586::before,
.category-list #category-1476::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/preparazione-dei-file-audio.png')
}
.category-list #category-574::before,
.category-list #category-689::before,
.category-list #category-1480::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/pubblicazione-e-modifiche.png')
}
/* Libri cartacei subcategories */
.category-list #category-576::before,
.category-list #category-593::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/preparazione-dei-file-2.png')
}
.category-list #category-577::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/da-sapere-sulla-stampa.png')
}
.category-list #category-579::before,
.category-list #category-594::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/pubblicare-un-libro-cartaceo.png')
}
.category-list #category-580::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/modifiche-e-ritiro-dalla-vendita.png')
}
.category-list #category-581::before,
.category-list #category-596::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/come-stampare-le-copie-del-proprio-libro.png')
}
/* "Crea i tuoi libri con Write" subcategories */
.category-list #category-82::before,
.category-list #category-68::before,
.category-list #category-1482::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/per-iniziare.png')
}
.category-list #category-101::before,
.category-list #category-96::before,
.category-list #category-1483::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/la-creazione-dell-ebook-reflowable-epub2.png')
}
.category-list #category-113::before,
.category-list #category-110::before,
.category-list #category-1484::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/la-creazione-dell-ebook-fixed-layout -epub3.png')
}
.category-list #category-122::before,
.category-list #category-123::before,
.category-list #category-1463::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/la-creazione-della-versione-cartacea.png')
}
.category-list #category-1507::before,
.category-list #category-1511::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/la-creazione-della-copertina-stand-alone.png');
}
/* "Gestisci il tuo account e i pagamenti" subcategories */
.category-list #category-76::before,
.category-list #category-72::before,
.category-list #category-1486::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/come-unirti-a-streetlib-e-cosa-puoi-fare.png')
}
.category-list #category-112::before,
.category-list #category-97::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/fatturazione-report-e-pagamenti.png')
}
.category-list #category-98::before,
.category-list #category-111::before,
.category-list #category-1487::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/i-guadagni-e-il-controllo-delle-vendite.png')
}
/* "StreetLib Store" subcategories */
.category-list #category-130::before,
.category-list #category-600::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/l-acquisto.png')
}
.category-list #category-124::before,
.category-list #category-601::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/la-lettura .png')
}
/* "StreetLib Direct" subcategories */
.category-list #category-647::before,
.category-list #category-650::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/sl-direct-icon.png')
}
/* "StreetLib Webinar" */
.category-list #category-713::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/webinar.png')
}
/* "BookRix" - Passaggio a StreetLib */
.category-list #category-1490::before,
.category-list #category-1499::before {
background-image: url('https://cdn-publish.streetlib.com/help/icons/passaggio-a-sl.png')
}
/* Footer */
footer p {
font-size: 1.2em;
text-align: center;
}
#sidebar form .search-query {
height: 40px;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
background-color: #f5f5f5;
border-radius: 8px;
}
#searchBar.sm button {
outline: none;
color: #444;
}
#searchBar.sm button i {
color: #444;
}
#sidebar form .search-query:focus,
#sidebar form .search-query:focus:invalid {
background-color: #f1fafc;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#sidebar h3 {
font-size: 1.6em;
text-transform: none;
font-weight: 400;
margin-bottom: 20px;
}
#sidebar .nav-list a {
font-size: 1.3em;
}
#sidebar .nav-list .active a,
#sidebar .nav-list .active a:hover,
#sidebar .nav-list .active a:focus {
font-weight: 600;
color: #097988; /* was #148ea0 → --sl-contrast-text-color */
}
#serp-dd .result a:hover,
#serp-dd .result > li.active,
#fullArticle strong a,
#fullArticle a strong,
.collection a,
.contentWrapper a,
.most-pop-articles .popArticles a,
.most-pop-articles .popArticles a:hover span,
.category-list .category .article-count,
.category-list .category:hover .article-count {
font-weight: 600;
}
.article-count span {
margin-right: 0.2em;
}
.contentWrapper h1 {
margin-bottom: 50px;
}
.articleList a {
font-size: 1.2em;
font-weight: 500;
}
.articleList i {
display: none;
}
.articleList li {
border-bottom: 2px solid #ececec;
padding-bottom: 15px;
padding-left: 0;
margin-bottom: 15px;
margin-top: 15px;
}
.articleList a {
margin-left: 0;
}
#categoryHead .sort select {
border: 2px solid #ddd;
font-size: 13px;
font-weight: 500;
height: 38px;
margin-top: -10px;
}
.navbar .btn-navbar .icon-bar {
background: #333;
width: 35px;
height: 3px;
margin-top: 6px;
-webkit-box-shadow: none;
box-shadow: none;
}
.navbar .btn-navbar {
height: 30px;
width: 35px;
padding: 0;
padding-bottom: 10px;
}
.navbar .btn-navbar:not(.collapsed) .icon-bar {
background-color: #128191; /* was #0b8fa0 → --sl-primary-color */
}
.navbar .btn-navbar:hover {
background-color: transparent;
opacity: 0.6;
}
#fullArticle,
#fullArticle p,
#fullArticle ul,
#fullArticle ol,
#fullArticle li,
#fullArticle div,
#fullArticle blockquote,
#fullArticle dd,
#fullArticle table {
color: #0f2137;
font-size: 16px;
}
#fullArticle .title {
margin-bottom: 50px;
}
.articleFoot p,
.articleFoot time {
font-family: 'Inter', 'Roboto', 'Open Sans', sans-serif;
font-size: 1.1em;
}
#sl-hc-categories {
list-style: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: 0;
}
#sl-hc-categories a {
color: #fff;
font-size: 15px;
font-weight: 500;
padding: 9px;
display: inline-block;
}
/* Same teal #docsSearch background as the search input/button above —
reuse --sl-focus-color instead of the generic a:focus-visible color.
Legacy (no .sl-v2) only: in the new hero layout the pills sit outside
the teal hero, see the .sl-v2-page-home override below. */
#sl-hc-categories a:focus-visible {
outline: 2px solid #71c0cc;
outline-offset: 2px;
}
/* New hero layout (2026-09-10, see new-hero.png): the quick category
pills now sit OUTSIDE the teal #docsSearch hero, on the page
background right below it (moved there in script.streetlib.js) —
restyled from underlined white text to white pill buttons.
Overrides Bootstrap's .container-fluid max-width:1080px so the pills
have the full page width to fit on one row where possible. */
html.sl-v2.sl-v2-page-home .sl-v2-hero-categories-wrap {
max-width: none;
}
html.sl-v2.sl-v2-page-home #sl-hc-categories {
margin: 32px 0 0;
padding: 0 24px;
gap: 10px;
}
html.sl-v2.sl-v2-page-home #sl-hc-categories a {
color: #121212;
font-weight: 600;
font-size: 14px;
padding: 10px 18px;
background: #ffffff;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 999px;
white-space: nowrap;
transition: all 0.3s ease;
}
html.sl-v2.sl-v2-page-home #sl-hc-categories a:hover {
border-color: rgba(10, 142, 160, 0.3);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
}
/* No longer on a teal background here — the default ring color reads
better against white pills than --sl-focus-color (tuned for teal). */
html.sl-v2.sl-v2-page-home #sl-hc-categories a:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
}
.language-switcher {
position: relative;
float: right;
margin-right: 70px;
height: 70px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.dropdown-toggle {
font-size: 16px;
font-weight: 400;
color: #343e48;
letter-spacing: 0.6px;
cursor: pointer;
background: none;
border: none;
padding: 0;
display: flex;
align-items: center;
}
.dropdown-menu {
background-color: rgb(255, 255, 255);
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
border: 1px solid rgba(0, 0, 0, 0.04);
margin-bottom: 8px;
margin-top: 8px;
z-index: 1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 16px 8px;
position: absolute;
width: 210px;
right: 0;
top: 55px;
display: none;
gap: 8px;
flex-direction: column;
-webkit-overflow-scrolling: touch;
}
.dropdown-menu.toggled {
display: flex;
}
.dropdown-menu > button {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
text-align: left;
color: rgb(52, 61, 72);
font-size: 18px;
font-weight: 500;
line-height: 1.66;
letter-spacing: 0;
padding: 6px 16px;
background: none;
border: none;
cursor: pointer;
border-radius: 8px;
}
.dropdown-menu > button:hover {
text-decoration: none;
background-color: rgba(18, 129, 145, 0.08) !important;
}
.dropdown-toggle::after {
width: 28px;
height: 28px;
margin-right: 0;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='rgb(18,18,18)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.nav-collapse, .nav-collapse.collapse {
overflow: hidden;
height: 0;
position: absolute;
right: 0;
background-color: #fff;
z-index: 100;
top: 78px;
width: 250px;
padding: 0;
max-height: calc(100vh - 70px);
overflow-y: auto !important;
border-radius: 4px;
}
.nav-collapse.in {
-webkit-box-shadow: rgb(0 0 0 / 10%) 0px 0px 0px 1px, rgb(0 0 0 / 10%) 0px 4px 11px;
box-shadow: rgb(0 0 0 / 10%) 0px 0px 0px 1px, rgb(0 0 0 / 10%) 0px 4px 11px;
}
@media (min-width: 769px) {
.nav-collapse.collapse:not(.in) {
overflow: hidden !important;
height: 0 !important;
}
}
.nav-collapse .nav {
padding-top: 20px;
padding-left: 0;
}
.navbar .btn-navbar:active,
.navbar .btn-navbar.active,
.navbar .btn-navbar {
background-color: transparent !important;
}
/* Bootstrap's `.navbar .btn-navbar:focus { outline: 0 }` (launch-*.css)
has higher specificity than the generic button:focus-visible rule
above, so it wins and hides the ring on this specific button — this
selector matches that specificity to take it back, without touching
the Bootstrap bundle. Often the first focusable control after the
logo, so it needs to be clearly perceivable. */
.navbar .btn-navbar:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
}
/* Same specificity problem as .btn-navbar above: Bootstrap's
`.navbar .nav li a:focus { outline: 0 }` (launch-*.css) outranks the
generic a:focus-visible rule. Matches its specificity to take it back. */
.navbar .nav li a:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
}
#sl-article-toc {
list-style: none;
margin-left: 0;
margin-bottom: 30px !important;
}
footer section {
border-top: 1px solid #B7B7B7;
border-bottom: 1px solid #B7B7B7;
padding-top: 75px;
padding-bottom: 35px;
margin-bottom: 75px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
[lang="en-EN"] footer section .footer-menu {
width: 25%;
}
[lang="it-IT"] footer section .footer-menu {
width: 20%;
}
/* Avoid :has() for embedded browser compatibility.
JS adds `.sl-footer-menu-section` to the generated footer menu container. */
[lang="de-DE"] footer section.sl-footer-menu-section {
justify-content: center;
}
[lang="de-DE"] footer section .footer-menu {
width: fit-content;
min-width: 200px;
}
footer section .footer-menu {
margin-bottom: 40px;
}
footer section .footer-menu h6 {
margin-bottom: 20px;
margin-top: 0px;
font-size: 18px;
color: rgb(15, 33, 55);
font-weight: 400;
}
footer section .footer-menu ul {
margin: 0;
list-style: none;
}
footer section .footer-menu a {
color: rgba(52, 61, 72, 0.8);
font-size: 16px;
line-height: 30px;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s
}
footer section .footer-menu a:hover {
color: rgba(52, 61, 72, 1);
text-decoration: none;
}
footer .sl-prefooter {
margin-bottom: 0;
border-bottom: 0;
display: block;
text-align: center;
padding-bottom: 70px;
}
footer .sl-prefooter p {
margin-bottom: 15px;
}
footer .sl-prefooter h3 + p {
font-size: 18px;
font-weight: 600;
color: #585858;
margin-bottom: 40px;
}
footer .sl-prefooter h3 + p a {
color: #585858;
}
footer .sl-prefooter p a {
text-decoration: underline;
}
footer .sl-prefooter p a:hover {
color: #097988; /* was #168ea0 → --sl-contrast-text-color */
}
footer .sl-prefooter .btn {
margin: 10px;
padding: 10px 30px;
font-size: 16px;
font-weight: 600;
min-width: 194px;
border-width: 2px;
}
footer .sl-prefooter .sl-contact-btn {
background-color: #097988; /* was #168ea0 → --sl-contrast-text-color */
color: #fff;
}
footer .sl-prefooter .btn:hover {
background-color: #19aabb; /* was #1cabbf → --sl-primary-color-300 (hover) */
border-color: #19aabb; /* was #1cabbf → --sl-primary-color-300 (hover) */
}
.sl-prefooter a.btn::before {
content: "";
display: inline-block;
margin-right: 0.5em;
margin-bottom: 3px;
background-position: center;
background-repeat: no-repeat;
vertical-align: middle;
}
.sl-prefooter a[href="mailto:support@streetlib.com"].btn::before,
.sl-prefooter a.sl-contact-btn.btn::before {
width: 25px;
height: 25px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3C!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --%3E%3Cpath fill='%23fff' d='M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM208 352c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.8 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z'/%3E%3C/svg%3E");
}
.sl-prefooter a[href="tel:0294750544"].btn::before,
.sl-prefooter a.sl-write-btn.btn::before {
width: 15px;
height: 15px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3C!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --%3E%3Cpath fill='%23148ea0' d='M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48H48zM0 176V384c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V176L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z'/%3E%3C/svg%3E");
}
.sl-has-community-icon::before {
content: "";
display: block;
width: 50px;
height: 50px;
opacity: 0.3;
margin: 10px auto 20px;
background-position: center;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3C!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --%3E%3Cpath fill='%23000' d='M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM208 352c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.8 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z'/%3E%3C/svg%3E");
}
#docsSearch {
margin-bottom: 0;
}
.sl-community-section {
background-color: #094B54; /* unchanged - dark accent */
padding: 35px 0;
text-align: center;
}
.sl-community-section .container-fluid * {
font-size: 19px;
color: #fff;
font-weight: 400;
}
.sl-community-section .container-fluid a span {
text-decoration: underline;
}
.sl-community-section .container-fluid a:hover::after {
opacity: 1;
}
.sl-community-section .container-fluid h2 a::after {
content: "";
height: 18px;
width: 18px;
display: inline-block;
vertical-align: middle;
opacity: 0.6;
margin-left: 0.5em;
background-position: center;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3C!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --%3E%3Cpath fill='%23fff' d='M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l82.7 0L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3l0 82.7c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160c0-17.7-14.3-32-32-32L320 0zM80 32C35.8 32 0 67.8 0 112L0 432c0 44.2 35.8 80 80 80l320 0c44.2 0 80-35.8 80-80l0-112c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 112c0 8.8-7.2 16-16 16L80 448c-8.8 0-16-7.2-16-16l0-320c0-8.8 7.2-16 16-16l112 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L80 32z'/%3E%3C/svg%3E");
}
@media (max-width: 480px) {
#searchBar button .icon-search {
line-height: 35px;
font-size: 22px;
}
#searchBar button {
min-width: 60px !important;
}
#searchBar .search-query {
margin-right: 0;
}
#sl-hc-categories {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/* !important: outranks the higher-specificity [lang="..."] footer-menu
width rules earlier in this file at every breakpoint. */
footer section .footer-menu {
width: 100% !important;
text-align: center;
}
}
@media (min-width: 481px) and (max-width: 768px) {
/* !important: outranks the higher-specificity [lang="..."] footer-menu
width rules earlier in this file at every breakpoint. */
footer section .footer-menu {
width: 50% !important;
}
}
@media (max-width: 768px) {
#searchBar {
max-width: 550px;
width: 80%;
padding-right: 20px;
padding-left: 20px;
}
#searchBar button {
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
top: 24px;
right: 20px;
}
#docsSearch section {
margin-top: 20px;
padding-left: 20px;
padding-right: 20px;
}
#docsSearch {
height: auto;
min-height: 360px;
}
#docsSearch::before,
#docsSearch::after {
display: none;
}
.category-list .category,
.category-list.two-col .category {
margin-bottom: 20px;
}
.sl-community-section {
margin: 0 -20px 3em;
padding: 20px;
}
.sl-community-section .container-fluid * {
font-size: 17px;
line-height: 24px;
}
}
@media (min-width: 769px) and (max-width: 1200px) {
footer section .footer-menu {
width: 33.333% !important;
}
#docsSearch::before,
#docsSearch::after {
width: 20%;
-webkit-transform: none;
transform: none;
}
#docsSearch::before {
left: 0;
}
#docsSearch::after {
right: 0;
}
#searchBar {
max-width: 420px;
}
}
/* ==========================================================================
NEW UI (TEMP) — v2 HOME (prototype-like, scoped to 1540-esplora-le-categorie)
========================================================================== */
html.sl-v2.sl-v2-page-home #docsSearch {
border-radius: 36px;
margin: 40px auto;
max-width: calc(1400px - 48px);
background: #0A8EA0;
padding: 100px 20px;
}
@media (min-width: 769px) and (max-width: 1400px) {
html.sl-v2.sl-v2-page-home #docsSearch {
max-width: calc(100% - 48px);
}
}
html.sl-v2.sl-v2-page-home #docsSearch::before,
html.sl-v2.sl-v2-page-home #docsSearch::after {
display: none;
}
html.sl-v2.sl-v2-page-home #docsSearch h1 {
font-size: 3rem;
font-weight: 600;
letter-spacing: -0.02em;
padding-top: 0;
text-transform: none;
}
html.sl-v2.sl-v2-page-home #searchBar {
width: 100%;
max-width: 680px;
padding-left: 0;
padding-right: 0;
margin-top: 24px;
}
html.sl-v2.sl-v2-page-home #searchBar::before {
content: '';
position: absolute;
transform: translateY(50%);
width: 24px;
height: 24px;
background-image: url('data:image/svg+xml;utf8,');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
font-size: 16px;
font-weight: 600;
background-color: transparent;
top: 30px;
left: 20px;
opacity: 0.5;
}
html.sl-v2.sl-v2-page-home #searchBar .search-query {
border-radius: 16px;
height: 60px;
padding: 8px 32px 8px 56px;
letter-spacing: 0;
font-family: 'Inter', 'Roboto', 'Open Sans', sans-serif;
font-size: 16px;
font-weight: 400;
}
html.sl-v2.sl-v2-page-home #searchBar .search-query::placeholder {
font-family: inherit;
font-weight: 400;
font-size: 16px;
}
html.sl-v2.sl-v2-page-home #docsSearch #searchBar button {
border-radius: 12px;
height: 44px;
min-width: 100px;
padding: 12px 32px;
font-size: 16px;
font-weight: 600;
background-color: #0E4B53;
right: 8px;
top: 32px;
opacity: 1;
}
html.sl-v2.sl-v2-page-home #docsSearch #searchBar button:hover {
background: #0A353A;
transform: translateY(-1px);
opacity: 1;
}
/* NEW UI (TEMP): popular topics + community CTA in hero (prototype) */
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-popular-topics {
margin-top: 24px;
font-size: 14px;
opacity: 0.95;
color: #ffffff;
text-align: center;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-popular-topics span {
font-weight: 500;
margin-right: 10px;
opacity: 0.95;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-popular-topics a {
color: #ffffff;
text-decoration: underline;
margin: 0 10px;
opacity: 0.85;
font-weight: 500;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-popular-topics a:hover {
opacity: 1;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-community-cta {
margin-top: 32px;
font-size: 15px;
font-weight: 500;
opacity: 0.95;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
color: #ffffff;
text-align: center;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-community-cta a {
color: #ffffff;
font-weight: 650;
text-decoration: none;
border-bottom: 2px solid rgba(255, 255, 255, 0.35);
padding-bottom: 2px;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-community-cta a:hover {
border-bottom-color: #ffffff;
}
/* Section header above the categories grid */
html.sl-v2.sl-v2-page-home .sl-v2-section-header {
max-width: 1400px;
margin: 0 auto;
padding: 0;
}
html.sl-v2.sl-v2-page-home .sl-v2-section-header h2 {
font-size: 2rem;
font-weight: 600;
margin: 0 0 32px;
color: #0C0C0C;
}
/* .sl-v2-home is only added by applyV2HomeUI() when contentEnabled is
true (?slv2=1). Two of these rules (title hide, native icon hide) only
make sense once the JS has actually replaced what they hide — our own
section header and injected SVG icons — so they stay gated. The grid
layout and card look, below, no longer need that gate: they're now
written to look right against the real, always-present markup too
(native h3/description/article-count, native ::before icon), so
?view=modern alone gets the v2 card grid with today's content and
icons, not the JS-built version. */
/* Hide the visible collection title only once our own section header
replaces it (content-enabled mode) — otherwise (theme-only) restyle it
in place instead, see the h2 rule below. */
html.sl-v2.sl-v2-page-home.sl-v2-home .collection-category.visible > h2 {
display: none;
}
/* Theme-only (no .sl-v2-home): keep the native title visible, but give it
the same look as .sl-v2-section-header h2 so it reads as a v2 section
header without waiting on the JS-built one. */
html.sl-v2.sl-v2-page-home:not(.sl-v2-home) .collection-category.visible > h2 {
text-align: left;
font-size: 2rem;
font-weight: 600;
margin: 0 0 32px;
color: #0C0C0C;
}
html.sl-v2.sl-v2-page-home:not(.sl-v2-home) .collection-category.visible > h2 a {
color: inherit;
}
/* Categories grid */
html.sl-v2.sl-v2-page-home .collection-category.visible .category-list {
max-width: 1400px;
margin: 0 auto;
padding: 0;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
}
/* Multiple .collection-category sections can be visible at once (legacy
per-language mapping, non-contentEnabled) — the 100px bottom padding
should only sit before the prefooter, not between every collection.
.sl-v2-last-visible is set by showCollections() in script.streetlib.js
on whichever visible collection is actually last (not :last-of-type:
hidden collections stay in the DOM too, so that alone wouldn't
reliably pick the last VISIBLE one). */
html.sl-v2.sl-v2-page-home .collection-category.visible.sl-v2-last-visible .category-list {
padding-bottom: 100px;
}
/* Keep the native icon (theme-only, no .sl-v2-home): only hide it once
the JS has actually injected the SVG replacement. */
html.sl-v2.sl-v2-page-home.sl-v2-home .category-list .category::before {
display: none !important;
content: none !important;
}
/* Card look for the real, always-present .category links — no
.sl-v2-category-card class or .sl-v2-home required, so this applies
under ?view=modern alone too. Deliberately placed before the
.sl-v2-category-card rules below: those share the same specificity and
come later in the file, so when contentEnabled has added that class
(and the animate-in-view reveal), they still win over this base look. */
html.sl-v2.sl-v2-page-home .category-list .category {
opacity: 1;
background: #ffffff;
text-align: left;
padding: 40px 40px;
border-radius: 32px;
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
width: 100%;
min-height: 260px;
position: relative;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
border: 1px solid rgba(0, 0, 0, 0.05);
overflow: hidden;
}
html.sl-v2.sl-v2-page-home .category-list .category:hover {
box-shadow: 0 30px 60px rgba(0, 75, 83, 0.08);
border-color: rgba(10, 142, 160, 0.2);
}
/* Hover arrow (::after, not a JS-injected element): mirrors
.sl-v2-card-arrow's position/motion without needing the DOM
restructuring that builds it — color is hardcoded in the data URI
since background-image SVGs don't pick up currentColor from CSS.
:not(.sl-v2-category-card) excludes contentEnabled-mode cards, which
already get a real .sl-v2-card-arrow element — without this, both
would render stacked on top of each other. */
html.sl-v2.sl-v2-page-home .category-list .category:not(.sl-v2-category-card)::after {
content: '';
position: absolute;
bottom: 40px;
right: 40px;
width: 24px;
height: 24px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23128191' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'%3E%3C/path%3E%3Cpath d='m12 5 7 7-7 7'%3E%3C/path%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
opacity: 0;
transform: translateX(-20px);
transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
html.sl-v2.sl-v2-page-home .category-list .category:not(.sl-v2-category-card):hover::after {
opacity: 1;
transform: translateX(0);
}
html.sl-v2.sl-v2-page-home .category-list .category::before {
/* Native icon: keep its own size/position, just fit the new padding */
margin: 0 0 24px;
transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
/* Scale the native icon up alongside the arrow on hover — mirrors
.sl-v2-card-icon's transform:scale(1.1), the closest equivalent since
the native icon is a plain image (no colored box to swap like the v2
icon does). :not(.sl-v2-category-card) matches the arrow rule above:
this element is display:none in contentEnabled mode anyway, but keep
the guard for consistency. */
html.sl-v2.sl-v2-page-home .category-list .category:not(.sl-v2-category-card):hover::before {
transform: scale(1.1);
}
html.sl-v2.sl-v2-page-home .category-list .category h3 {
font-size: 1.5rem;
font-weight: 600;
margin: 0 0 16px;
color: #000000;
line-height: 1.2;
}
html.sl-v2.sl-v2-page-home .category-list .category h3 + p {
font-size: 16px;
font-weight: 400;
color: #666666;
margin: 0;
line-height: 1.6;
}
/* Some native categories have no description (empty ) — the JS
card-building path strips these, but theme-only mode doesn't run it. */
html.sl-v2.sl-v2-page-home .category-list .category h3 + p:empty {
display: none;
}
html.sl-v2.sl-v2-page-home .category-list .category .article-count {
color: #666666;
font-size: 15px;
font-weight: 500;
margin: 8px 0 0;
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category {
opacity: 0;
transform: translateY(30px);
background: #ffffff;
text-align: left;
padding: 60px 40px;
border-radius: 32px;
text-decoration: none;
color: inherit;
display: flex;
flex-direction: column;
width: 100%;
min-height: 340px;
position: relative;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
border: 1px solid rgba(0, 0, 0, 0.05);
overflow: hidden;
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category.animate-in-view {
opacity: 1;
transform: translateY(0);
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category:hover {
box-shadow: 0 30px 60px rgba(0, 75, 83, 0.08);
border-color: rgba(10, 142, 160, 0.2);
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category h3 + p {
font-size: 16px;
font-weight: 400;
color: #666666;
margin: 0;
line-height: 1.6;
}
html.sl-v2.sl-v2-page-home .sl-v2-card-icon {
width: 72px;
height: 72px;
background: #f0f7f8;
/* match accessible palette used elsewhere in this stylesheet */
color: #128191;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 32px;
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card:hover .sl-v2-card-icon {
background: #128191;
color: #ffffff;
transform: scale(1.1);
}
html.sl-v2.sl-v2-page-home .sl-v2-card-icon svg {
width: 32px;
height: 32px;
stroke-width: 1.5;
}
html.sl-v2.sl-v2-page-home .sl-v2-card-content h3 {
font-size: 1.5rem;
font-weight: 600;
margin: 0 0 16px;
color: #000000;
line-height: 1.2;
}
/* reuse existing article count but make it look like subtle metadata */
html.sl-v2.sl-v2-page-home .sl-v2-card-content .article-count {
color: #666666;
font-size: 15px;
font-weight: 500;
margin: 0;
}
html.sl-v2.sl-v2-page-home .sl-v2-card-arrow {
position: absolute;
bottom: 40px;
right: 40px;
color: #128191;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: translateX(-20px);
transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card:hover .sl-v2-card-arrow {
opacity: 1;
transform: translateX(0);
}
html.sl-v2.sl-v2-page-home .sl-v2-card-arrow svg {
width: 24px;
height: 24px;
}
/* Prefooter */
/* Prefooter: v2 banner (applies to all v2 page types) */
html.sl-v2 footer .sl-prefooter {
border-top: 1px solid rgba(0, 0, 0, 0.05);
padding-top: 80px;
padding-bottom: 100px;
}
html.sl-v2 footer .sl-prefooter-content {
max-width: 800px;
margin: 0 auto;
text-align: center;
}
html.sl-v2 footer .sl-prefooter-icon {
width: 80px;
height: 80px;
background: #E0F2F3;
color: #0A8EA0;
border-radius: 24px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 32px;
box-shadow: 0 4px 12px rgba(10, 142, 160, 0.06);
}
html.sl-v2 footer .sl-prefooter-icon svg {
width: 36px;
height: 36px;
stroke-width: 1.5;
}
html.sl-v2 footer .sl-prefooter-content h2 {
font-size: 1.75rem;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
letter-spacing: -0.01em;
}
html.sl-v2 footer .sl-prefooter-content p {
font-size: 1.1rem;
color: #666666;
margin-bottom: 40px;
line-height: 1.6;
}
html.sl-v2 footer .sl-prefooter-actions {
display: flex;
justify-content: center;
gap: 16px;
flex-wrap: wrap;
}
html.sl-v2 footer .sl-prefooter-actions a {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 16px 32px;
border-radius: 12px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2 footer .sl-prefooter-actions a:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 3px;
}
html.sl-v2 footer .sl-prefooter-actions a.primary {
background-color: #0a8ea0;
color: #ffffff;
}
html.sl-v2 footer .sl-prefooter-actions a.primary:hover {
background: #0E4B53;
box-shadow: 0 10px 20px rgba(10, 142, 160, 0.2);
}
html.sl-v2 footer .sl-prefooter-actions a.secondary {
background-color: #ffffff;
color: #0a8ea0;
border: 1px solid rgba(10, 142, 160, 0.2);
}
html.sl-v2 footer .sl-prefooter-actions a.secondary:hover {
background: #f0f7f8;
border-color: #0A8EA0;
}
html.sl-v2 footer .sl-prefooter-actions a svg {
width: 24px;
height: 24px;
}
/* Shared internal spacing */
html.sl-v2.sl-v2-page-home #contentArea,
html.sl-v2.sl-v2-page-category #contentArea,
html.sl-v2.sl-v2-page-article #contentArea,
html.sl-v2.sl-v2-page-search #contentArea,
html.sl-v2.sl-v2-page-collection #contentArea {
max-width: 1400px;
margin: 0 auto;
padding: 32px 24px 100px;
}
/* Sidebar as card (search pages only — was also article until 2026-09-24,
removed there: the white card was too subtle against the page's light
gray background to read as intentional, user preferred dropping it). */
html.sl-v2.sl-v2-page-search #sidebar {
background: #ffffff;
border: 1px solid rgba(0,0,0,0.06);
border-radius: 24px;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
padding: 22px;
}
/* Sidebar transparent (category + collection pages — matches v2 prototype;
article joined this group 2026-09-24, see comment above) */
html.sl-v2.sl-v2-page-category #sidebar,
html.sl-v2.sl-v2-page-article #sidebar,
html.sl-v2.sl-v2-page-collection #sidebar {
background: transparent;
border: none;
box-shadow: none;
padding: 0;
}
html.sl-v2.sl-v2-page-category #sidebar h3,
html.sl-v2.sl-v2-page-article #sidebar h3,
html.sl-v2.sl-v2-page-search #sidebar h3,
html.sl-v2.sl-v2-page-collection #sidebar h3 {
font-size: 16px;
font-weight: 600;
margin: 0 0 14px;
color: #0C0C0C;
}
html.sl-v2.sl-v2-page-category #sidebar form .search-query,
html.sl-v2.sl-v2-page-article #sidebar form .search-query,
html.sl-v2.sl-v2-page-search #sidebar form .search-query,
html.sl-v2.sl-v2-page-collection #sidebar form .search-query {
height: 44px;
border-radius: 12px;
background-color: #ffffff;
border: 1px solid rgba(0, 0, 0, 0.1);
font-size: 15px;
letter-spacing: 0;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2.sl-v2-page-category #sidebar form .search-query:focus,
html.sl-v2.sl-v2-page-article #sidebar form .search-query:focus,
html.sl-v2.sl-v2-page-search #sidebar form .search-query:focus,
html.sl-v2.sl-v2-page-collection #sidebar form .search-query:focus {
border-color: #0A8EA0;
box-shadow: 0 0 0 4px rgba(10, 142, 160, 0.05);
outline: none;
}
/* Main content wrapper as card */
html.sl-v2.sl-v2-page-category .contentWrapper,
html.sl-v2.sl-v2-page-article .contentWrapper,
html.sl-v2.sl-v2-page-search .contentWrapper,
html.sl-v2.sl-v2-page-collection .contentWrapper {
background: #ffffff;
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: 32px;
box-shadow: 0 4px 20px rgba(0, 75, 83, 0.04);
padding: 60px;
}
/* Category header typography */
html.sl-v2.sl-v2-page-category #categoryHead h1,
html.sl-v2.sl-v2-page-search #serp > h1 {
font-size: 2rem;
font-weight: 600;
letter-spacing: -0.02em;
margin: 0;
color: #000000;
}
/* #fullArticle sits inside .contentWrapper, which already draws the card
(background/border/radius/shadow/padding, see "Main content wrapper as
card" above) — #fullArticle used to duplicate that treatment with its
own slightly different values, producing a visible nested box within
a box. Typography-only here now. */
html.sl-v2.sl-v2-page-article #fullArticle h1 {
font-size: 34px;
font-weight: 650;
letter-spacing: -0.02em;
margin: 0 0 14px;
color: #0C0C0C;
}
html.sl-v2.sl-v2-page-article #fullArticle p,
html.sl-v2.sl-v2-page-article #fullArticle li {
color: #343e48;
font-size: 16px;
line-height: 1.65;
}
/* ==========================================================================
NEW UI (TEMP) — v2 COLLECTION + CATEGORY page layout (sidebar-left + content-right)
Matches the v2 prototype's internal page design.
========================================================================== */
/* Two-column grid: sidebar (left, 320px) + content (right) */
html.sl-v2.sl-v2-page-collection #contentArea .row-fluid,
html.sl-v2.sl-v2-page-category #contentArea .row-fluid {
display: grid;
grid-template-columns: 320px 1fr;
gap: 60px;
padding-top: 0;
padding-bottom: 60px;
}
/* Help Scout's markup puts #main-content before #sidebar in source order;
`order` visually flips them to sidebar-left without touching the DOM. */
html.sl-v2.sl-v2-page-collection #sidebar,
html.sl-v2.sl-v2-page-category #sidebar {
order: -1;
width: 100%;
position: sticky;
top: 40px;
height: fit-content;
}
html.sl-v2.sl-v2-page-collection #main-content,
html.sl-v2.sl-v2-page-category #main-content {
order: 1;
width: 100%;
}
/* Override Bootstrap .span9/.span3 widths */
html.sl-v2.sl-v2-page-collection .row-fluid .span9,
html.sl-v2.sl-v2-page-collection .row-fluid .span3,
html.sl-v2.sl-v2-page-category .row-fluid .span9,
html.sl-v2.sl-v2-page-category .row-fluid .span3 {
width: 100%;
margin-left: 0;
}
/* Override Bootstrap clearfix pseudo-elements */
html.sl-v2.sl-v2-page-collection .row-fluid::before,
html.sl-v2.sl-v2-page-collection .row-fluid::after,
html.sl-v2.sl-v2-page-category .row-fluid::before,
html.sl-v2.sl-v2-page-category .row-fluid::after {
display: none;
}
/* Page h1 */
html.sl-v2.sl-v2-page-collection .contentWrapper h1,
html.sl-v2.sl-v2-page-category .contentWrapper h1 {
font-size: 2.5rem;
font-weight: 600;
letter-spacing: -0.02em;
margin: 0;
color: #000000;
}
/* Content header (h1 + sort dropdown) */
html.sl-v2.sl-v2-page-collection .sl-v2-content-header,
html.sl-v2.sl-v2-page-category .sl-v2-content-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 24px;
margin-bottom: 48px;
}
html.sl-v2.sl-v2-page-collection .sl-v2-content-header h1,
html.sl-v2.sl-v2-page-category .sl-v2-content-header h1 {
flex: 1 1 auto;
min-width: 0;
overflow-wrap: break-word;
}
html.sl-v2.sl-v2-page-collection .sl-v2-content-header .sort,
html.sl-v2.sl-v2-page-category .sl-v2-content-header .sort {
position: static;
flex: 0 0 auto;
}
html.sl-v2.sl-v2-page-collection #categoryHead,
html.sl-v2.sl-v2-page-category #categoryHead {
position: static;
}
html.sl-v2.sl-v2-page-collection #categoryHead h1,
html.sl-v2.sl-v2-page-category #categoryHead h1 {
margin-right: 0;
}
/* Article list: match v2 prototype article-item layout */
html.sl-v2.sl-v2-page-collection .articleList,
html.sl-v2.sl-v2-page-category .articleList {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
/*gap: 24px;*/
}
html.sl-v2.sl-v2-page-collection .articleList li,
html.sl-v2.sl-v2-page-category .articleList li {
padding: 0 0 15px 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
html.sl-v2.sl-v2-page-collection .articleList li:last-child,
html.sl-v2.sl-v2-page-category .articleList li:last-child {
border-bottom: none;
padding-bottom: 0;
}
/* Hide legacy icon-article-doc */
html.sl-v2.sl-v2-page-collection .articleList .icon-article-doc,
html.sl-v2.sl-v2-page-category .articleList .icon-article-doc {
display: none;
}
/* Article link title: teal color like v2 prototype */
html.sl-v2.sl-v2-page-collection .articleList a,
html.sl-v2.sl-v2-page-category .articleList a {
text-decoration: none;
display: block;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2.sl-v2-page-collection .articleList a span,
html.sl-v2.sl-v2-page-category .articleList a span {
font-size: 1.25rem;
font-weight: 500;
color: #0A8EA0;
display: block;
margin-bottom: 8px;
}
html.sl-v2.sl-v2-page-collection .articleList a:hover span,
html.sl-v2.sl-v2-page-category .articleList a:hover span {
color: #0E4B53;
}
/* Breadcrumbs */
html.sl-v2.sl-v2-page-collection .sl-v2-breadcrumbs,
html.sl-v2.sl-v2-page-category .sl-v2-breadcrumbs {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 24px;
font-size: 14px;
}
html.sl-v2.sl-v2-page-collection .sl-v2-breadcrumbs a,
html.sl-v2.sl-v2-page-category .sl-v2-breadcrumbs a {
text-decoration: none;
color: #666666;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2.sl-v2-page-collection .sl-v2-breadcrumbs a:hover,
html.sl-v2.sl-v2-page-category .sl-v2-breadcrumbs a:hover {
color: #0A8EA0;
}
html.sl-v2.sl-v2-page-collection .sl-v2-breadcrumb-sep,
html.sl-v2.sl-v2-page-category .sl-v2-breadcrumb-sep {
display: flex;
align-items: center;
color: #666666;
}
html.sl-v2.sl-v2-page-collection .sl-v2-breadcrumb-current,
html.sl-v2.sl-v2-page-category .sl-v2-breadcrumb-current {
color: #0A8EA0;
font-weight: 500;
}
/* Sidebar: nav links styled like v2 prototype.
.sl-v2-page-article added 2026-09-24 — this whole block only covered
collection/category before, so the article sidebar (search box icon
position, nav-list link color/hover/active state, heading size) never
got the v2 treatment and looked visibly different. */
html.sl-v2.sl-v2-page-collection #sidebar .nav-list,
html.sl-v2.sl-v2-page-category #sidebar .nav-list,
html.sl-v2.sl-v2-page-article #sidebar .nav-list {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
html.sl-v2.sl-v2-page-collection #sidebar .nav-list li,
html.sl-v2.sl-v2-page-category #sidebar .nav-list li,
html.sl-v2.sl-v2-page-article #sidebar .nav-list li {
margin: 0;
padding: 0;
list-style: none;
}
html.sl-v2.sl-v2-page-collection #sidebar .nav-list a,
html.sl-v2.sl-v2-page-category #sidebar .nav-list a,
html.sl-v2.sl-v2-page-article #sidebar .nav-list a {
display: block;
padding: 10px 16px;
text-decoration: none;
color: #666666;
font-size: 15px;
font-weight: 500;
border-radius: 10px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2.sl-v2-page-collection #sidebar .nav-list a:hover,
html.sl-v2.sl-v2-page-category #sidebar .nav-list a:hover,
html.sl-v2.sl-v2-page-article #sidebar .nav-list a:hover {
background: rgba(10, 142, 160, 0.05);
color: #0A8EA0;
}
/* Hide legacy arrow icon in sidebar links */
html.sl-v2.sl-v2-page-collection #sidebar .nav-list .icon-arrow,
html.sl-v2.sl-v2-page-category #sidebar .nav-list .icon-arrow,
html.sl-v2.sl-v2-page-article #sidebar .nav-list .icon-arrow {
display: none;
}
/* Sidebar search: extra bottom margin */
html.sl-v2.sl-v2-page-collection #sidebar #searchBar,
html.sl-v2.sl-v2-page-category #sidebar #searchBar,
html.sl-v2.sl-v2-page-article #sidebar #searchBar {
margin-bottom: 40px;
position: relative;
min-width: 100%;
}
html.sl-v2.sl-v2-page-collection #sidebar #searchBar .search-query,
html.sl-v2.sl-v2-page-category #sidebar #searchBar .search-query,
html.sl-v2.sl-v2-page-article #sidebar #searchBar .search-query {
padding-left: 40px;
}
html.sl-v2.sl-v2-page-collection #sidebar #searchBar.sm button,
html.sl-v2.sl-v2-page-category #sidebar #searchBar.sm button,
html.sl-v2.sl-v2-page-article #sidebar #searchBar.sm button {
position: absolute;
left: 13px;
right: auto;
top: 50%;
transform: translateY(-50%);
z-index: 1;
width: 20px;
height: 20px;
}
html.sl-v2.sl-v2-page-collection #sidebar #searchBar.sm button i,
html.sl-v2.sl-v2-page-category #sidebar #searchBar.sm button i,
html.sl-v2.sl-v2-page-article #sidebar #searchBar.sm button i {
display: none;
}
html.sl-v2.sl-v2-page-collection #sidebar #searchBar.sm button::before,
html.sl-v2.sl-v2-page-category #sidebar #searchBar.sm button::before,
html.sl-v2.sl-v2-page-article #sidebar #searchBar.sm button::before {
content: '';
display: block;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' aria-hidden='true' class='lucide lucide-search search-icon'%3E%3Cpath d='m21 21-4.34-4.34'%3E%3C/path%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
width: 20px;
height: 20px;
}
/* Sidebar heading */
html.sl-v2.sl-v2-page-collection #sidebar h3,
html.sl-v2.sl-v2-page-category #sidebar h3,
html.sl-v2.sl-v2-page-article #sidebar h3 {
font-size: 18px;
font-weight: 600;
margin-bottom: 24px;
color: #000000;
}
/* Active sidebar link */
html.sl-v2.sl-v2-page-collection #sidebar .nav-list li.active a,
html.sl-v2.sl-v2-page-category #sidebar .nav-list li.active a,
html.sl-v2.sl-v2-page-article #sidebar .nav-list li.active a {
background: #f0f7f8;
color: #0A8EA0;
}
/* Category page: hide legacy #categoryHead description */
html.sl-v2.sl-v2-page-category #categoryHead .descrip {
display: none;
}
/* Style the native sort select to match v2 prototype */
html.sl-v2.sl-v2-page-category #categoryHead .sort {
margin: 0;
position: static;
}
html.sl-v2.sl-v2-page-category #categoryHead .sort form {
margin: 0;
}
html.sl-v2.sl-v2-page-category #categoryHead #sortBy {
appearance: none;
-webkit-appearance: none;
font-family: inherit;
font-size: 14px;
color: #666666;
padding: 8px 36px 8px 16px;
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 8px;
cursor: pointer;
white-space: nowrap;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
background-color: #ffffff;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 12px center;
background-size: 16px;
}
html.sl-v2.sl-v2-page-category #categoryHead #sortBy:hover {
border-color: rgba(10, 142, 160, 0.3);
}
html.sl-v2.sl-v2-page-category #categoryHead #sortBy:focus {
outline: none;
border-color: #0A8EA0;
box-shadow: 0 0 0 4px rgba(10, 142, 160, 0.05);
}
/* Sticky header (2026-09-24), matching streetlib-new-website's .sl-header
(position: sticky, permanent subtle shadow — see src/styles/global.css
~line 182). z-index kept below the sidenav backdrop/panel (1000/1001,
see .sl-v2-side-nav-backdrop/.sl-v2-side-nav) so opening the sidenav
still dims the header along with the rest of the page. */
html.sl-v2 #mainNav {
position: sticky;
top: 0;
z-index: 900;
background: #ffffff;
/* Softer shadow (2026-09-24) — same delicate layering used for
category cards elsewhere in this file, instead of the heavier
single shadow it started with. */
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
transition: transform 0.3s ease;
}
/* Hide-on-scroll-down / reveal-on-scroll-up, toggled in script.streetlib.js */
html.sl-v2 #mainNav.sl-header--hidden {
transform: translateY(-100%);
}
/* Tablet range: tighter sidebar + content gap on internal pages */
.sl-v2 #mainNav .container-fluid {
max-width: 1400px;
margin: 0 auto;
padding: 5px 24px;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
}
.sl-v2 #mainNav .container-fluid:after,
.sl-v2 #mainNav .container-fluid:before {
display: none;
}
.sl-v2 .navbar .brand {
padding-left: 0;
padding-right: 0;
}
.sl-v2 .navbar .navbar-inner {
padding: 0;
}
html.sl-v2 .brand img {
height: 55px;
}
/* v2: hide legacy nav items (Help Scout top navigation), show only via right-side-buttons */
html.sl-v2 .nav-collapse {
display: none !important;
}
/* v2: page background */
html.sl-v2 body {
background: #f8fafb;
}
/* v2: hide legacy footer content that gets replaced */
html.sl-v2 footer .sl-prefooter.sl-centered {
display: none;
}
.dropdown-toggle::before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
fill: rgb(76, 173, 186);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
margin-right: 8px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 19 19' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.86524 0.32032C7.95469 0.0153324 9.09324-0.07252 10.2168 0.0595782C10.7257 0.101245 11.2299 0.194706 11.7197 0.338875C13.6731 0.877563 15.3968 2.04293 16.624 3.65528C17.8511 5.2675 18.5156 7.23761 18.5147 9.26368C18.5136 11.2899 17.8471 13.26 16.6182 14.8711C15.3892 16.4822 13.6658 17.646 11.7119 18.1826L11.7109 18.1816C10.9146 18.4047 10.0916 18.5173 9.26465 18.5166L9.26563 18.5176L9.2627 18.5166L9.26074 18.5176C9.17336 18.5199 9.08617 18.5127 9 18.4981C8.25937 18.4894 7.52326 18.3834 6.81055 18.1816C4.85528 17.6468 3.12979 16.485 1.89942 14.874C0.668924 13.2627 0.00105974 11.2911 1.04033e-06 9.26368C-0.000960641 7.23642 0.664835 5.26482 1.89356 3.65235C3.12201 2.04036 4.84555 0.875887 6.79981 0.338875L6.86426 0.321297L6.86524 0.32032ZM1.96875 12.6231C2.43973 13.6515 3.12106 14.5704 3.97363 15.3164C4.76995 16.0132 5.69516 16.5447 6.69531 16.8809L7.12891 17.0127L7.12988 17.0137C7.34923 17.076 7.57177 17.1258 7.7959 17.167C6.7329 15.8243 5.95455 14.2783 5.50781 12.6231H1.96875ZM12.9971 12.6231C12.551 14.2724 11.779 15.8141 10.7285 17.1592C10.9515 17.1165 11.1736 17.0693 11.3936 17.0127C12.5593 16.6916 13.6379 16.1117 14.5479 15.3154C15.4003 14.5695 16.0817 13.6509 16.5537 12.6231H12.9971ZM6.77734 12.6231C7.27391 14.2539 8.12125 15.7561 9.26074 17.0244C10.4008 15.7589 11.2442 14.2558 11.7285 12.6231H6.77734ZM1.51856 7.11427C1.31863 7.81346 1.21588 8.53806 1.21582 9.26563C1.21548 9.99035 1.31828 10.7111 1.51856 11.4072H5.25391C5.13407 10.6996 5.06978 9.98357 5.06836 9.26563C5.06927 8.54475 5.13361 7.82483 5.25391 7.11427H1.51856ZM6.49024 7.11427C6.35373 7.82293 6.28328 8.54277 6.28516 9.26466C6.28265 9.98366 6.35319 10.7016 6.49024 11.4072H12.0313C12.2905 9.98773 12.2905 8.53377 12.0313 7.11427H6.49024ZM13.2607 7.11427C13.5061 8.53506 13.5052 9.98645 13.2598 11.4072H17.0029C17.1992 10.7104 17.2988 9.98991 17.2969 9.26563L17.293 8.97755C17.2723 8.34661 17.1717 7.72081 16.9951 7.11427H13.2607ZM7.78906 1.36134C7.56677 1.40128 7.34622 1.45039 7.12793 1.5088L7.12695 1.50782L7.06543 1.52638L7.06445 1.5254C5.91536 1.85853 4.85473 2.44332 3.95801 3.23536C3.11854 3.97684 2.44514 4.88484 1.97461 5.89942H5.5166C5.95944 4.24753 6.7323 2.70355 7.78906 1.36134ZM9.26074 1.50587C8.11345 2.76503 7.26465 4.2658 6.77637 5.89747H11.7275C11.2376 4.27026 10.3953 2.77141 9.26074 1.50587ZM10.7305 1.35352C11.7812 2.70107 12.5525 4.2456 12.9971 5.89747H16.5527C16.0798 4.87075 15.3989 3.95256 14.5469 3.20704C13.637 2.41093 12.5588 1.83017 11.3936 1.50782C11.1754 1.44554 10.9534 1.39487 10.7305 1.35352' fill='rgb(76, 173, 186)'/%3E%3C/svg%3E");
}
/* v2: language switcher / dropdown (from updated production) */
html.sl-v2 .dropdown-toggle::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 19 19' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.86524 0.32032C7.95469 0.0153324 9.09324-0.07252 10.2168 0.0595782C10.7257 0.101245 11.2299 0.194706 11.7197 0.338875C13.6731 0.877563 15.3968 2.04293 16.624 3.65528C17.8511 5.2675 18.5156 7.23761 18.5147 9.26368C18.5136 11.2899 17.8471 13.26 16.6182 14.8711C15.3892 16.4822 13.6658 17.646 11.7119 18.1826L11.7109 18.1816C10.9146 18.4047 10.0916 18.5173 9.26465 18.5166L9.26563 18.5176L9.2627 18.5166L9.26074 18.5176C9.17336 18.5199 9.08617 18.5127 9 18.4981C8.25937 18.4894 7.52326 18.3834 6.81055 18.1816C4.85528 17.6468 3.12979 16.485 1.89942 14.874C0.668924 13.2627 0.00105974 11.2911 1.04033e-06 9.26368C-0.000960641 7.23642 0.664835 5.26482 1.89356 3.65235C3.12201 2.04036 4.84555 0.875887 6.79981 0.338875L6.86426 0.321297L6.86524 0.32032ZM1.96875 12.6231C2.43973 13.6515 3.12106 14.5704 3.97363 15.3164C4.76995 16.0132 5.69516 16.5447 6.69531 16.8809L7.12891 17.0127L7.12988 17.0137C7.34923 17.076 7.57177 17.1258 7.7959 17.167C6.7329 15.8243 5.95455 14.2783 5.50781 12.6231H1.96875ZM12.9971 12.6231C12.551 14.2724 11.779 15.8141 10.7285 17.1592C10.9515 17.1165 11.1736 17.0693 11.3936 17.0127C12.5593 16.6916 13.6379 16.1117 14.5479 15.3154C15.4003 14.5695 16.0817 13.6509 16.5537 12.6231H12.9971ZM6.77734 12.6231C7.27391 14.2539 8.12125 15.7561 9.26074 17.0244C10.4008 15.7589 11.2442 14.2558 11.7285 12.6231H6.77734ZM1.51856 7.11427C1.31863 7.81346 1.21588 8.53806 1.21582 9.26563C1.21548 9.99035 1.31828 10.7111 1.51856 11.4072H5.25391C5.13407 10.6996 5.06978 9.98357 5.06836 9.26563C5.06927 8.54475 5.13361 7.82483 5.25391 7.11427H1.51856ZM6.49024 7.11427C6.35373 7.82293 6.28328 8.54277 6.28516 9.26466C6.28265 9.98366 6.35319 10.7016 6.49024 11.4072H12.0313C12.2905 9.98773 12.2905 8.53377 12.0313 7.11427H6.49024ZM13.2607 7.11427C13.5061 8.53506 13.5052 9.98645 13.2598 11.4072H17.0029C17.1992 10.7104 17.2988 9.98991 17.2969 9.26563L17.293 8.97755C17.2723 8.34661 17.1717 7.72081 16.9951 7.11427H13.2607ZM7.78906 1.36134C7.56677 1.40128 7.34622 1.45039 7.12793 1.5088L7.12695 1.50782L7.06543 1.52638L7.06445 1.5254C5.91536 1.85853 4.85473 2.44332 3.95801 3.23536C3.11854 3.97684 2.44514 4.88484 1.97461 5.89942H5.5166C5.95944 4.24753 6.7323 2.70355 7.78906 1.36134ZM9.26074 1.50587C8.11345 2.76503 7.26465 4.2658 6.77637 5.89747H11.7275C11.2376 4.27026 10.3953 2.77141 9.26074 1.50587ZM10.7305 1.35352C11.7812 2.70107 12.5525 4.2456 12.9971 5.89747H16.5527C16.0798 4.87075 15.3989 3.95256 14.5469 3.20704C13.637 2.41093 12.5588 1.83017 11.3936 1.50782C11.1754 1.44554 10.9534 1.39487 10.7305 1.35352' fill='rgb(18, 18, 18)'/%3E%3C/svg%3E");
}
html.sl-v2 .dropdown-toggle:hover {
background-color: #f0f4f5;
}
html.sl-v2 .btn-navbar {
display: none;
}
html.sl-v2 .language-switcher {
margin-right: 0;
}
.dropdown-menu > button.toggled {
background-color: rgba(18, 129, 145, 0.1);
color: rgba(18, 129, 145, 1);
}
.dropdown-menu > button.toggled::after {
content: "";
display: inline-block;
width: 16px;
height: 16px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(18, 129, 145, 1)' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
}
html.sl-v2 .dropdown-toggle {
background: #f8fafb;
}
html.sl-v2 .dropdown-toggle {
color: #121212;
position: relative;
display: flex;
align-items: center;
gap: 8px;
padding: 8px 16px;
border-radius: 99px;
border: none;
font-size: 14px;
font-weight: 600;
letter-spacing: 0;
cursor: pointer;
transition: all 0.3s ease;
}
html.sl-v2 .dropdown-toggle:hover {
background-color: #f0f4f5;
}
/* Unscoped (not .sl-v2-gated): this is an accessibility fix and must apply
regardless of the v2 feature flag. Matches the v2 pill shape
(border-radius: 99px) where present; harmless on the legacy toggle too. */
.dropdown-toggle:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
border-radius: 99px;
}
html.sl-v2 .btn-navbar {
display: none;
}
html.sl-v2 .language-switcher {
margin-right: 0;
}
html.sl-v2 .right-side-buttons {
display: flex;
align-items: center;
gap: 8px;
}
/* Sidenav trigger (hamburger) + off-canvas panel (2026-09-24). Visual
spec copied from streetlib-new-website's Header/SideNav components —
see ../../streetlib-new-website/src/components/{Header,SideNav}.tsx
and src/styles/global.css (classes .sl-hamburger/.sl-side-nav/
.sl-close-btn) — replicated here in plain CSS since this project has
no MUI. Class names kept identical to that reference where the
element matches 1:1 (.sl-hamburger, .sl-close-btn*); panel-specific
classes are prefixed .sl-v2- since the panel content/behavior differs
(collection links + Contattaci, not the full site nav). */
html.sl-v2 .sl-hamburger {
border: 0;
background: transparent;
width: 44px;
height: 44px;
cursor: pointer;
padding: 4px 6px;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
}
html.sl-v2 .sl-hamburger > span {
display: block;
width: 100%;
height: 2px;
margin: 4px 0;
background-color: #0C0C0C;
transition: 0.3s;
}
html.sl-v2 .sl-hamburger > span:first-child {
margin-top: 0;
}
html.sl-v2 .sl-hamburger > span:nth-child(3) {
width: calc(100% - 10px);
margin-bottom: 0;
}
html.sl-v2 .sl-hamburger.active > span:first-child {
transform: rotate(45deg);
transform-origin: 8px 50%;
}
html.sl-v2 .sl-hamburger.active > span:nth-child(2) {
display: none;
}
html.sl-v2 .sl-hamburger.active > span:nth-child(3) {
width: 100%;
transform: rotate(-45deg);
transform-origin: 9px 50%;
}
html.sl-v2 .sl-hamburger:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
border-radius: 8px;
}
html.sl-v2 .sl-v2-side-nav-backdrop {
position: fixed;
inset: 0;
background: rgba(12, 12, 12, 0.4);
opacity: 0;
visibility: hidden;
transition: opacity 0.25s ease;
z-index: 1000;
}
html.sl-v2 .sl-v2-side-nav-backdrop.open {
opacity: 1;
visibility: visible;
}
html.sl-v2 .sl-v2-side-nav {
position: fixed;
top: 0;
right: 0;
bottom: 0;
width: 420px;
max-width: 86vw;
background: #ffffff;
border-left: 1px solid rgba(0, 0, 0, 0.08);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
transform: translateX(100%);
transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
z-index: 1001;
display: flex;
flex-direction: column;
overflow-y: auto;
}
html.sl-v2 .sl-v2-side-nav.open {
transform: translateX(0);
}
html.sl-v2 .sl-close-btn {
background: transparent;
border: none;
cursor: pointer;
width: 44px;
height: 44px;
margin: 12px 12px 0 auto;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
}
html.sl-v2 .sl-close-btn:hover {
background-color: #f0f4f5;
}
html.sl-v2 .sl-close-btn:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 2px;
}
html.sl-v2 .sl-close-btn-icon {
position: relative;
width: 20px;
height: 20px;
display: block;
}
html.sl-v2 .sl-close-btn-icon::before,
html.sl-v2 .sl-close-btn-icon::after {
content: '';
position: absolute;
top: 9px;
left: 0;
width: 20px;
height: 2px;
background-color: #0C0C0C;
}
html.sl-v2 .sl-close-btn-icon::before {
transform: rotate(45deg);
}
html.sl-v2 .sl-close-btn-icon::after {
transform: rotate(-45deg);
}
html.sl-v2 .sl-v2-side-nav-list {
list-style: none;
margin: 8px 0 0;
padding: 8px 16px 24px;
}
html.sl-v2 .sl-v2-side-nav-item {
margin: 4px 0;
}
html.sl-v2 .sl-v2-side-nav-link {
display: block;
padding: 12px 16px;
border-radius: 8px;
color: #0C0C0C;
font-size: 15px;
font-weight: 500;
text-decoration: none;
background: none;
border: none;
width: 100%;
text-align: left;
cursor: pointer;
transition: background-color 0.15s ease, color 0.15s ease;
}
html.sl-v2 .sl-v2-side-nav-link:hover {
background-color: #f0f3f4;
color: #128191;
}
html.sl-v2 .sl-v2-side-nav-link:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: -2px;
}
/* Dedicated separator (2026-09-24, matches the UI designer's
sidenav-menu.html prototype exactly) — a standalone , not a
border on "Contattaci" itself, so hover on that item stays a clean
rounded box with nothing crossing the corner. "Contattaci" is
otherwise a plain .sl-v2-side-nav-link like any other item — no
special color/weight (dropped 2026-09-24, was teal + bold). */
html.sl-v2 .sl-v2-side-nav-separator {
height: 1px;
background: #e3e7e8;
margin: 13px 16px 9px;
list-style: none;
}
/* v2 pre-footer: prototype bottom-banner (injected into .sl-pre-footer) */
html.sl-v2 .sl-pre-footer .bottom-banner {
padding: 80px 0 120px;
margin-top: 40px;
background: linear-gradient(
180deg,
transparent 0%,
rgba(10, 142, 160, 0.02) 100%
);
border-top: 1px solid rgba(0, 0, 0, 0.05);
}
html.sl-v2 .sl-pre-footer .banner-content {
max-width: 800px;
margin: 0 auto;
text-align: center;
}
html.sl-v2 .sl-pre-footer .banner-icon {
width: 80px;
height: 80px;
background: #e0f2f3;
color: #0a8ea0;
border-radius: 24px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 32px;
box-shadow: 0 4px 12px rgba(10, 142, 160, 0.06);
}
html.sl-v2 .sl-pre-footer .banner-icon svg {
width: 36px;
height: 36px;
stroke-width: 1.5;
}
html.sl-v2 .sl-pre-footer .banner-content h2 {
font-size: 1.75rem;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
letter-spacing: -0.01em;
}
html.sl-v2 .sl-pre-footer .banner-content p {
font-size: 1.1rem;
color: #666666;
margin-bottom: 40px;
line-height: 1.6;
}
html.sl-v2 .sl-pre-footer .banner-actions {
display: flex;
justify-content: center;
gap: 16px;
flex-wrap: wrap;
}
html.sl-v2 .sl-pre-footer .banner-btn {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 16px 32px;
border-radius: 12px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
html.sl-v2 .sl-pre-footer .banner-btn:focus-visible {
outline: 2px solid #0a8ea0;
outline-offset: 3px;
}
html.sl-v2 .sl-pre-footer .banner-btn.primary {
background: #0a8ea0;
color: #ffffff;
}
html.sl-v2 .sl-pre-footer .banner-btn.primary:hover {
background: #0e4b53;
box-shadow: 0 10px 20px rgba(10, 142, 160, 0.2);
}
html.sl-v2 .sl-pre-footer .banner-btn.secondary {
background: #ffffff;
color: #0a8ea0;
border: 1px solid rgba(10, 142, 160, 0.2);
}
html.sl-v2 .sl-pre-footer .banner-btn.secondary:hover {
background: #f0f7f8;
border-color: #0a8ea0;
}
html.sl-v2 footer section .footer-menu h6 {
color: #000;
font-weight: 500;
}
html.sl-v2 footer .sl-prefooter {
background-color: #fff;
border: none !important;
padding: 60px 40px;
border-radius: 32px;
}
html.sl-v2 footer .sl-footer-menu-section {
border-top: none !important;
}
html.sl-v2 footer.center p {
line-height: 24px;
}
/* ==========================================================================
NEW UI (TEMP) — v2 RESPONSIVE
All sl-v2 responsive overrides, grouped by breakpoint and by section.
========================================================================== */
/* --------------------------------------------------------------------------
Tablet (769px – 1100px)
-------------------------------------------------------------------------- */
@media (min-width: 769px) and (max-width: 1100px) {
/* Home — hero */
html.sl-v2.sl-v2-page-home #docsSearch {
padding: 80px 20px;
}
html.sl-v2.sl-v2-page-home #docsSearch h1 {
font-size: 2.4rem;
}
/* Home — categories grid (2 cols). No .sl-v2-home guard needed: the
grid + card look now apply to the real markup regardless of
contentEnabled, see the base rule above. */
html.sl-v2.sl-v2-page-home .collection-category.visible .category-list {
grid-template-columns: repeat(2, 1fr);
gap: 24px;
}
html.sl-v2.sl-v2-page-home .category-list .category {
padding: 40px 32px;
min-height: 240px;
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category {
padding: 40px 32px;
min-height: 300px;
}
/* Internal pages — sidebar + content layout */
html.sl-v2.sl-v2-page-collection #contentArea .row-fluid,
html.sl-v2.sl-v2-page-category #contentArea .row-fluid {
grid-template-columns: 260px 1fr;
gap: 32px;
}
html.sl-v2.sl-v2-page-collection .contentWrapper,
html.sl-v2.sl-v2-page-category .contentWrapper,
html.sl-v2.sl-v2-page-article .contentWrapper,
html.sl-v2.sl-v2-page-search .contentWrapper {
padding: 40px;
}
html.sl-v2.sl-v2-page-category #categoryHead h1,
html.sl-v2.sl-v2-page-search #serp > h1,
html.sl-v2.sl-v2-page-collection .contentWrapper h1,
html.sl-v2.sl-v2-page-category .contentWrapper h1 {
font-size: 1.75rem;
}
}
/* --------------------------------------------------------------------------
Mobile (≤ 768px)
-------------------------------------------------------------------------- */
@media (max-width: 768px) {
/* Global — nav, brand, dropdown */
html.sl-v2 #mainNav .container-fluid {
padding-top: 3px;
padding-bottom: 3px;
}
html.sl-v2 .brand img {
height: 42px;
}
html.sl-v2 .dropdown-toggle {
padding: 6px 12px;
}
html.sl-v2 .dropdown-toggle::after {
width: 24px;
height: 24px;
}
/* Global — shared content area paddings */
html.sl-v2 #contentArea,
html.sl-v2.sl-v2-page-home #contentArea,
html.sl-v2.sl-v2-page-category #contentArea,
html.sl-v2.sl-v2-page-article #contentArea,
html.sl-v2.sl-v2-page-search #contentArea,
html.sl-v2.sl-v2-page-collection #contentArea {
padding-left: 0;
padding-right: 0;
}
/* Home — hero */
html.sl-v2.sl-v2-page-home #docsSearch {
margin: 20px auto;
border-radius: 24px;
padding: 60px 16px;
}
html.sl-v2.sl-v2-page-home #docsSearch h1 {
font-size: 2.2rem;
margin-top: 8px;
padding: 0 10px;
}
html.sl-v2.sl-v2-page-home #searchBar {
padding-right: 0;
margin-top: 0;
}
html.sl-v2.sl-v2-page-home #searchBar .search-query {
height: 51px;
border-radius: 12px;
}
html.sl-v2.sl-v2-page-home #searchBar::before {
top: 26px;
}
html.sl-v2.sl-v2-page-home #docsSearch #searchBar button {
min-width: 0;
padding: 12px 18px;
display: block;
position: static;
border-radius: 12px !important;
margin-top: 15px;
width: 100%;
min-height: 51px;
}
/* Home — category pills become a horizontally scrollable slider
(see new-hero.png) instead of wrapping onto multiple lines.
flex-direction: row is required here, not just implied by the
default — the legacy #sl-hc-categories rule at the (max-width:
480px) breakpoint sets flex-direction: column, and since that's a
different property than the ones below, our higher specificity on
THIS rule doesn't automatically override it there too; without
restating row explicitly the pills stack vertically on narrow
phones instead of forming a scrollable row. */
html.sl-v2.sl-v2-page-home #sl-hc-categories {
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x proximity;
margin: 24px 0 0;
padding: 0 20px 4px;
scrollbar-width: none;
}
html.sl-v2.sl-v2-page-home #sl-hc-categories::-webkit-scrollbar {
display: none;
}
/* The actual flex items inside #sl-hc-categories are the
wrappers (createCategoriesList() builds ...), not
the itself — flex/scroll-snap must go on the , otherwise
it keeps its default flex-shrink:1 and squeezes down instead of
scrolling at full width. */
html.sl-v2.sl-v2-page-home #sl-hc-categories li {
flex: 0 0 auto;
scroll-snap-align: start;
}
/* Home — section header + categories grid */
html.sl-v2.sl-v2-page-home .sl-v2-section-header {
padding-left: 16px;
padding-right: 16px;
}
html.sl-v2.sl-v2-page-home .collection-category {
padding-top: 20px;
padding-bottom: 20px;
}
/* No .sl-v2-home guard needed, see the base rule above. */
html.sl-v2.sl-v2-page-home .collection-category .category-list,
html.sl-v2.sl-v2-page-home .collection-category.visible .category-list {
grid-template-columns: 1fr;
gap: 20px;
padding: 0;
}
/* Bottom padding only before the prefooter — see the base rule's
.sl-v2-last-visible comment. */
html.sl-v2.sl-v2-page-home .collection-category.visible.sl-v2-last-visible .category-list {
padding-bottom: 60px;
}
html.sl-v2.sl-v2-page-home .category-list .category {
padding: 40px 30px;
min-height: auto;
margin-left: 0;
margin-right: 0;
}
html.sl-v2.sl-v2-page-home .sl-v2-category-card.category {
padding: 40px 30px;
min-height: auto;
margin-left: 0;
margin-right: 0;
}
/* Internal pages — sidebar + content layout */
html.sl-v2.sl-v2-page-collection #contentArea .row-fluid,
html.sl-v2.sl-v2-page-category #contentArea .row-fluid {
grid-template-columns: 1fr;
gap: 40px;
}
html.sl-v2.sl-v2-page-collection #sidebar,
html.sl-v2.sl-v2-page-category #sidebar {
position: relative;
top: 0;
order: -1;
}
html.sl-v2.sl-v2-page-category #sidebar {
margin-top: 0;
}
html.sl-v2.sl-v2-page-collection #main-content,
html.sl-v2.sl-v2-page-category #main-content {
margin-left: 0;
margin-right: 0;
}
html.sl-v2.sl-v2-page-collection .contentWrapper,
html.sl-v2.sl-v2-page-category .contentWrapper {
padding: 30px 20px;
border-radius: 20px;
}
html.sl-v2.sl-v2-page-collection .contentWrapper h1,
html.sl-v2.sl-v2-page-category .contentWrapper h1 {
font-size: 1.8rem;
}
/* Internal pages — content header (h1 + sort) */
html.sl-v2.sl-v2-page-collection .sl-v2-content-header,
html.sl-v2.sl-v2-page-category .sl-v2-content-header {
flex-direction: column;
align-items: flex-start;
gap: 20px;
margin-bottom: 32px;
}
html.sl-v2.sl-v2-page-category #categoryHead h1 {
font-size: 1.8rem;
}
html.sl-v2.sl-v2-page-category #categoryHead .sort {
position: static;
margin-top: 20px;
}
/* Pre-footer */
html.sl-v2 .sl-pre-footer .bottom-banner {
padding: 60px 16px 80px;
}
html.sl-v2 .sl-pre-footer .banner-content h2 {
font-size: 1.5rem;
}
html.sl-v2 footer .sl-prefooter-actions a {
min-width: 280px;
text-align: center;
justify-content: center;
}
html.sl-v2.sl-v2-page-home #docsSearch .sl-v2-popular-topics span {
display: inline-block;
margin-bottom: 15px;
}
html.sl-v2.sl-v2-page-home .sl-v2-section-header h2 {
font-size: 1.75rem;
}
}
@media (max-width: 480px) {
html.sl-v2.sl-v2-page-home #searchBar button span {
text-indent: 0;
width: auto;
font-size: 16px;
}
html.sl-v2.sl-v2-page-home #searchBar button .icon-search {
display: none;
}
html.sl-v2.sl-v2-page-home #docsSearch h1 {
font-size: 1.85rem;
}
}