/* SET GLOBAL VARS */

/* base colors */
:root {
    --bg-color:#0d0f14;
    --link-color: #3b6ff5;
    --hover-link-color: #00d4a8;
    --disabled-color: hsla(223, 90%, 59%, 0.5);

    --light-color: #64748b;

    --lighter-color: #cbd5e1;

    --warning: #FFBE0B;
    --alert: #fb923c; /* #FB5607; */
    --error: #FF006E;/*#FF006E;*/
    --success:#6da717;

    --on-color:#f59e0b;
    --off-color:#9ca3af;
    --warn-color:#dc2626;
}

/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat_XDV36TGcro9o45zyRbg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2rp2ywxg089UriCZaSExd86J3t9jz86Mvy4qCRAL19DksVat_XDV30TGcro9o45zw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu6-K6z9mXgjU0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu0-K6z9mXg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu6-K6z9mXgjU0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu0-K6z9mXg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu6-K6z9mXgjU0.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu0-K6z9mXg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAIptRSW32RmYJp8I5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAC5tRR232RmYJp8I5zzw.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2tp2ywxg089UriI5-g4vlH9VoD8CmcqZG40F9JadbnoEwAC5tRSW32RmYJp8I5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Wp2ywxg089UriCZaSExdy3sGt9zz86Mr3yKK58UfivUw4aw.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dmsans/v17/rP2Wp2ywxg089UriCZaSExdy3sGt9zz86Mr3yKy58UfivUw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2NL9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm25L9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2BL9G78HEY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2NL9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm25L9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2BL9G78HEY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2NL9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm25L9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2BL9G78HEY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2NL9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm25L9G78HEZnMg.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/syne/v24/8vIH7w4qzmVxm2BL9G78HEY.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* for tailwind */
[x-cloak] { display: none; }

/* global */
html {height:100%;}
body {color:var(--bg-color);background:var(--bg-color);font-family:'DM Sans', sans-serif;font-size:1rem}

h1 {font-size:2rem !important;font-weight:700 !important;line-height:2.3rem;font-family:'Syne', sans-serif;}
h1.large {font-size:2.5rem !important;line-height:2.8rem !important;}
h1.hero {font-size: clamp(2.5rem, 5.5vw, 4.5rem) !important;line-height: clamp(2.8rem, 6vw, 5rem) !important;}
h1.hero em {font-style:normal;color:var(--link-color) !important;}

h2 {font-size: 1.5rem !important;font-family:'Syne', sans-serif;font-weight: 700 !important;letter-spacing: 0.5px;line-height: 2rem !important;margin:0.5em 0 0.5em !important;}
h2.hero {font-size: clamp(1.5rem, 5vw, 3.5rem) !important;line-height: clamp(2.3rem, 6vw, 4.5rem) !important;}
h3 {font-size: 1.3rem !important;font-family:'Syne', sans-serif;font-weight: 700 !important;letter-spacing: 0.3px;line-height: 1.8rem !important;margin:0.5em 0 0.5em !important;}
h3.hero {font-size: clamp(1.3rem, 5vw, 3rem) !important;line-height: clamp(2rem, 5vw, 4rem) !important;}
h4 {font-family: 'Syne', sans-serif;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    line-height:1.4rem;margin:1em 0 0.5em !important;}

h4 em {font-size: 1.2rem !important;font-family:'DM Sans', sans-serif;font-weight:900 !important;}
h5 {font-size:1em !important;line-height:1.2em !important;}
h6 {font-size:0.9em !important;line-height:1em !important;}

h1 + h2 {font-size:2em;line-height:1.3em;font-weight:300;margin:.3em 0;font-style:italic;}
h2 + h3 {font-weight:300;}

h1 + p, h2 + p, h3 + p, p + p, ul + p, ol + p {margin-top:1em;}
p + h3, ul + h3, p + h4, ul + h4 {margin-top:2em !important;}
p > b, p > strong {font-weight:700;}

.mpt0 {margin-top:0 !important;margin-bottom:0 !important;padding-top:0 !important;}

article + h2, article + h3 {margin-top:0.5em !important}

a {cursor:pointer;text-decoration:none;}
a.light {color:#e2e8f0 !important}
a.light:hover {color:#f1f5f9 !important}

ul {margin:1em 0;list-style:disc !important;list-style-position:outside !important;margin-left:1.2em !important;}
ol {margin:.5em 0;list-style:decimal !important;list-style-position:outside !important;margin-left:1.2em !important;}
ol.none {list-style:none !important;}
li {margin:.3em 0}

blockquote {margin:1rem 0 !important;padding:1rem;border-left:5px solid var(--hover-link-color);}

hr {border:none;border-top:1px solid rgba(0,0,0,0.08);margin:2em 0 !important;}

/* form */
label {cursor:pointer;display:block;font-size:0.9em;line-height:1em;margin:1em 0 .3em 0;}
label.inline {display:inline !important}
label span {font-weight:normal;color:#666;}
label.error {font-weight:700;color:var(--link-color) !important}
.suggestion {display:block;font-size: 0.75rem;line-height: 1rem;margin-top:.3em}

input:not([type="image"]), select, textarea {width: 100%;font-size:100%;vertical-align:baseline;vertical-align:middle;padding:.5em .5em !important;margin:0;border-radius:0.125rem;color:#444 !important;border:1px solid #ccc;--moz-border-sizing:border-box;box-sizing:border-box;}
select {padding:.5em .6em !important;}
select:not([multiple]) {max-height: calc(1.2em + 22) !important;height: calc(1.2em + 22px) !important;}
input:focus, textarea:focus, select:focus {outline: 2px solid transparent;outline-offset: 2px;border:.1em solid var(--link-color) !important;}
textarea {width:100%;overflow:auto;display:inline-block;vertical-align:top;resize:vertical;height:6em;margin-bottom:.2em}

input[disabled], textarea[disabled], select[disabled] {background:#ddd;}
input[readonly], select[readonly], textarea[readonly] {background:#f8fafc;}
input[type="checkbox"], input[type="radio"] {box-sizing:border-box;width:1.5em;height:1.5em;padding:.75em;border:none;margin:.2em .5em .5em 0;}
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
/*input[type='password'] {font-family: sans-serif !important;letter-spacing: 0.1em;}*/

.checkbox {margin-top:.5em !important}
.checkbox label {margin:0;}
.checkbox label input[type="checkbox"] {margin:0 .5em 0 0}

input[type=range] {
	width: 100%;
	margin: 3px 0;
	background-color: transparent;
	-webkit-appearance: none;
	border:none !important;
  }
input[type=range]:focus {
	outline: none;
  }
input[type=range]::-webkit-slider-runnable-track {
	background: #cccccc;
	border: none;
	border: 0;
	border-radius: 1.3px;
	width: 100%;
	height: 18px;
	cursor: pointer;
  }
  input[type=range]::-webkit-slider-thumb {
	margin-top: -3px;
	width: 24px;
	height: 24px;
	background: var(--link-color);
	border: none;
	border-radius: 1px;
	cursor: pointer;
	-webkit-appearance: none;
  }
  input[type=range]:focus::-webkit-slider-runnable-track {
	background: #d9d9d9;
  }
  input[type=range]::-moz-range-track {
	background: #cccccc;
	border: none;
	border: 0;
	border-radius: 1.3px;
	width: 100%;
	height: 18px;
	cursor: pointer;
  }
  input[type=range]::-moz-range-thumb {
	width: 24px;
	height: 24px;
	background: var(--link-color);
	border: none;
	border-radius: 1px;
	cursor: pointer;
  }


.suggestion {display:block;font-size: 0.75rem;line-height: 1rem;margin-top:.3em}
.suggestion_inline {font-size: 0.75rem;line-height:0.9rem !important}

input[type="checkbox"] {
    appearance: none;
    position: relative;
    display: inline-block;
    background: lightgrey;
    height: 1.65rem;
    width: 2.75rem;
    vertical-align: middle;
    border-radius: 2rem;
    box-shadow: 0px 1px 3px #0003 inset;
    transition: 0.25s linear background;
}
input[type="checkbox"]::before {
    content: "";
    display: block;
    width: 1.25rem;
    height: 1.25rem;
    background: #fff;
    border-radius: 1.2rem;
    position: absolute;
    top: 0.2rem;
    left: 0.2rem;
    box-shadow: 0px 1px 3px #0003;
    transition: 0.25s linear transform;
    transform: translateX(0rem);
}
input[type="checkbox"]:checked {
    background: var(--link-color);
}
input[type="checkbox"]:checked::before {
    transform: translateX(1rem);
}

input:focus {
    outline:none !important;
    outline-style:none !important;
}

input:focus-visible {
    outline-style:none !important;
}


/* BUTTONS */

.buttons, .buttons_warn {padding:1em;margin-top:1em;display:flex;justify-content: center;gap:1rem;}

.buttons button, .buttons_warn button, button.btn, a.btn {border-radius: 1.5rem;--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);align-items: center;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    font-weight:normal;line-height: 1.25rem;padding:0.8rem 1.5rem 0.8rem;transition: 0.4s;
}
.buttons button[type="submit"], .buttons button[type="button"], button.btn.link, a.btn.link {background-color:var(--link-color) !important;color:#fff !important;}
.buttons button[type="submit"]:hover, .buttons button[type="button"]:hover, button.btn.link:hover, a.btn.link:hover {background-color:var(--hover-link-color) !important;}
.buttons button[type="reset"], button.btn.gray, a.btn.gray {background-color:#d1d5db;color:#374151}

.buttons_warn button[type="submit"], .buttons_warn button[type="button"] {background-color:var(--warn-color) !important;color:#fff !important;}

button.btn.blink, a.btn.blink {border:1px solid var(--link-color);color:var(--link-color);}
button.btn.blink:hover, a.btn.blink:hover {background-color:var(--hover-link-color) !important;}

button.small {line-height:1rem;padding:0.7rem 0.7rem 0.5rem !important;}
a.link {color:var(--link-color) !important}


a.abtn {cursor:pointer;display:block;text-transform:uppercase;text-align:center;border-width:2px;border-radius: 1.5rem;padding:0.5rem 1.25rem;transition: 0.4s;}
/*a.abtn:hover {filter: grayscale(80%);}*/

button.btn, div.fake_btn {transition: 0.4s;}
div.fake_btn {background-color:var(--link-color);color:#fff !important;text-align:center;}
div.fake_btn a {font-weight:normal !important}
div.fake_btn:hover {background-color:#14b8a6 !important;}

.buttons button[disabled], input[disabled], button.btn.link[disabled] {cursor: default;background-color:var(--disabled-color) !important;}

.accent {color:var(--hover-link-color) !important}
.light {color:var(--light-color) !important}

.success {color:var(--success)}
.alert {color:var(--error)}

.on {color:var(--on-color) !important}
.off {color:var(--off-color) !important}
.warn {color:var(--warn-color) !important}
.main_color {color:var(--link-color)}
.ok {background-color:var(--success) !important;color:#fff}
.main_bg {background:var(--bg-color);color:white !important}
.bg2 {background-color:#64748b;color:#fff}
.failed {background-color:var(--alert) !important;color:#fff}
.warning {background-color:var(--warn-color) !important;color:#fff}

.border-accent {border:1px solid var(--link-color) !important;border-radius: 0.375rem;padding:1.5rem;transition: 0.4s;}
.border-accent:hover {border-color:var(--hover-link-color) !important;border-radius: 0.275rem;}

td.black {color:black}
td.white {color:white}
/* TABLES */

table {border-collapse:collapse;border-spacing:0;width:100%;font-size:inherit;font-size:0.95em;margin:1em 0;}

tr {border-bottom:1px solid #d1d5db;}
tr.no_border {border:none;}

tr.first, thead tr:first-child {border-bottom:1px solid #d1d5db;}
tr:not(.no_hover):hover td {background:#64748b;color:#fff;}
tr:not(.no_hover):hover td a {color:var(--hover-link-color) !important;}
th {text-align:center;background:#cbd5e1;line-height:2.2em;}
th:first-child {border-top-left-radius: 0.125rem;}
th:last-child {border-top-right-radius: 0.125rem;}
td {vertical-align:top;line-height:2em;padding:.3em 1em .1em;}
tr:not(.no_border) td:not(:first-child) {border-left:1px solid #d1d5db;}

tr:not(.no_border):nth-child(even) {background-color: #e2e8f0;}
td.marked, div.marked {background-color:var(--bg-color);color:#fff}

div.marked.softwarn, .softwarn {background-color:var(--warning) !important;color:#fff}
div.selected, div.marked.selected {background-color:var(--success) !important;color:#fff}

/* transparent backgrounds */
.overlay1 {background:rgba(0, 0, 0, .1)}
.overlay2 {background:rgba(0, 0, 0, .2)}
.overlay3 {background:rgba(0, 0, 0, .3)}

/* containers */
.container {max-width: 1200px;}
.small_container {max-width: 1024px;}
.tiny_container {max-width: 800px;}


/* SPINNER */
#working {position:absolute;top:0;left:0;right:0;margin-left:auto;margin-right:auto;width:6em;z-index:100}


#navbar {
    background-color:#fff;
    color:var (--light-color);
    font-size:.9rem;
    font-family:'DM Sans', sans-serif;
    background: rgba(255, 255, 255, 0.90);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(0,0,0,0.06);
    padding-bottom:0.5em
}

#navbar .menu_item {
    text-transform: capitalize;
    color: #6b7280;;
}

#navbar .menu_item:hover, #navbar .menu_item.active {
    color: var(--link-color) !important;
}

#navbar a.btn.link {
    padding:0.6rem 1.5rem 0.6rem;
    font-weight:normal !important;
    border-radius: 2rem !important;
}

#navbar .mobile button, #navbar .mobile button:hover {font-size:1.6em;color:var(--link-color) !important;}
#navbar .screen button {background-color:var(--link-color) !important;color:#fff !important;border-radius:1.5rem;padding:0.5rem 0.75rem;}
#navbar .screen button:hover {color:var(--link-color) !important;background-color:#cbd5e1 !important;}
#navbar .sub {padding: 0.5rem;background-color:#fff;}

#logo {font-family:"Syne", sans-serif;font-weight:800;font-size:1.5em;color:var(--bg-color) !important;}
#logo span {color:var(--link-color) !important}
#logo img {display:inline-flex;}
#print_logo {display:none}

#navbar img.flag {display:inline-block !important;}

/* TABS */
.tabs {margin-top:1em;background:#f3f4f6;padding: 0.5rem 0.5rem 0 0.5rem;border-bottom:1px solid var(--link-color);border-top-left-radius: 0.3rem;border-top-right-radius: 0.3rem;}
button.tab {border-top-left-radius: 0.125rem;border-top-right-radius: 0.125rem;line-height: 1.25rem;padding:0.5rem 1.5rem;background-color:#d1d5db;color:#374151;}
button.tab.link {background-color:var(--link-color) !important;color:#fff !important}

#breadcrumb {padding:5em 1em 3em;}
#topic {background:#fff;padding:0 0 3em;margin:0 !important;}
#topic section {position:relative;padding:2em 0;}
#topic section.bold_intro {padding-top:8rem;padding-bottom:8rem;margin-top:-6rem;}

#topic section.short {padding-top:0}
#topic section a:not(.btn) {color:var(--link-color);font-weight:bold}
#topic section button.btn_as_link {color:var(--link-color) !important;font-weight:normal}

#sidebar a > span {display: inline-flex;}
.sidebar {background-color:#f9fafb;padding:1rem 0.75rem;box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);}

footer, #menu {color:white}
#menu h1 {font-weight:800 !important;font-size:1.5em !important;}
#menu h1 em {font-style:normal;color:var(--link-color) !important;}
#menu .menu_col {font-size:1rem}
#menu .menu_item {padding-bottom:0.5rem;}
#menu .menu_item a {color:var(--light-color) !important}
#menu .menu_item a:hover {color:var(--lighter-color) !important}

/* fix min-width */
#navbar, #breadcrumb, #topic, footer, .xmodal, #working {min-width:320px !important;}


/* modal */
#modal .modal_head h3, .modal_head h3 {font-weight:bold;letter-spacing: -0.025em;line-height:1rem;margin:0.5rem 0 !important}
#modal .modal_head h2 {font-size:1.5rem !important;font-weight:bold;margin:0.25em 0 !important}

.xmodal {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-height:100%
}

.modal_buttons {text-align:center;margin:2rem 0 1.5rem;}
.modal_buttons > button + button {margin: 0.5rem 0 0 0.5rem;}

.btn_shadow {box-shadow: 0px 5px 12px rgba(0, 0, 0, 0.4), 6px 5px 20px rgba(0, 0, 0, 0.5);}
.txt_shadow {text-shadow: 1px 1px 3px #333;}

/* youtube ratio */
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;margin:6px 0}
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* iframe */
iframe, iframe[style] {
    display: block;
    background: #fff;
    border: none;
    height: 100vh;
    width: 100%;
}

/* fix vertical align*/
.va0 {vertical-align:middle !important}

/* scrollbars */
* {scrollbar-width: thin;scrollbar-color: #6b7280 white;}

/* Works on Chrome, Edge, and Safari */
::-webkit-scrollbar {width: 4px;}
::-webkit-scrollbar-track {background-color: white;}
::-webkit-scrollbar-thumb {background-color: #6b7280;border-radius: 4px;}

/* plugins */

/* x4get_by_key */
.gbkey_box {padding: 2rem;--tw-border-opacity: 1;border-color: rgb(229 229 229 / var(--tw-border-opacity));border-width: 2px;border-radius: 1rem;}
.gbkey_tags {--tw-border-opacity: 1;border-color: rgb(229 229 229 / var(--tw-border-opacity));border-top-width: 1px;}

@media (min-width: 320px) {
    .sidebar {border-radius:none;border-top-right-radius: 1rem;border-bottom-right-radius: 1rem;}
}

@media (max-width: 640px) {
    label {margin:0.5em 0 0;}
}

@media (min-width: 700px) {
    .sidebar {border-radius: 1rem;}
}

@media (max-width: 768px) {
    #topic section {padding:2em 0.6em;}
    #navbar .menu_item:hover, #navbar .menu_item.active {border:none;}
}
@media (max-width: 820px) {
    .btn_info {display: none;}
}

@media (min-width: 1024px) {
    .sidebar {background-color:#fff !important;border-radius: none;padding:1rem 0;box-shadow: 0 0 #0000;}
}

@media (max-width: 1024px) {
    #navbar a.menu_item > span:not(.btn_info):not(.no_hide) {display:none}
    #topic section.bold_intro {margin:-5rem -0.8rem}
    #banner_top {margin-top:1em;}
    h1 {font-size:1.5rem !important;}
    #sidebar a > span {display:none}
}

@media print {
    /* All your print styles go here */
    body {margin: 0;color: #000;background-color: #fff;}
    nav, #breadcrumb, footer, .no_print {display: none !important;}

    #topic, section, .container, .small_container {width:100% !important;padding:0;margin:0}
    table {border-collapse: collapse;}
    tr, tr.no_border {border:1px solid #000;}

    tr.first, thead tr:first-child {border-bottom:2px solid #000;}
    tr:not(.no_hover):hover td {background:#fff;color:#000;}
    th {text-align:center;background:#fff;line-height:2.2em;}
    th:first-child {border-top-left-radius: 0;}
    th:last-child {border-top-right-radius: 0;}
    td {background:#fff !important;color:#000 !important;vertical-align:top;line-height:2em;padding:.3em 0.8em .1em;font-size:0.9em}
    tr:not(.no_border) td:not(:first-child) {border:1px solid #000;}
    #print_logo {display:block;text-align:right;
        position:absolute;
        top:-10px;
        left:0;
        right:20px;
        padding:10px;
        font-family:"Syne", sans-serif;font-weight:800;font-size:1em;color:#999 !important;}
    #print_logo span {color:#aaa !important}
    .pagebreak { page-break-before: always; }
}