/*****************
 *    VARIABLES  *
 *****************/

/* space-grotesk-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/space-grotesk-v22-latin-regular.woff2') format('woff2');
}

/* space-grotesk-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/space-grotesk-v22-latin-700.woff2') format('woff2');
}

/* space-mono-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/space-mono-v17-latin-regular.woff2') format('woff2');
}

/* space-mono-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/space-mono-v17-latin-700.woff2') format('woff2');
}

body {
    background-color: var(--colorBodyBackground);
    color: var(--colorRightColumnText);
    font-family: 'Space Grotesk', 'Segoe UI', sans-serif;
}
[data-theme="dark"],
[data-theme="dark"] body,
[data-theme="dark"] .left-column,
[data-theme="dark"] .right-column,
[data-theme="dark"] main,
[data-theme="dark"] footer {
    background-color: #000000;
    color: #ffffff;
}
[data-theme="dark"] .left-column,
[data-theme="dark"] .left-column a,
[data-theme="dark"] .sidebar-toggle a,
[data-theme="dark"] .foldernav a,
[data-theme="dark"] .headerlinks a,
[data-theme="dark"] main a,
[data-theme="dark"] footer a,
[data-theme="dark"] #content-nav a {
    color: #ffffff;
}
[data-theme="dark"] .left-column,
[data-theme="dark"] .toolbar,
[data-theme="dark"] .langbar,
[data-theme="dark"] .headernavi {
    border-color: #ffffff;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Space Mono', Courier, monospace;
}
.left-column h1,
.left-column h2,
.left-column h3,
.left-column h4,
.left-column h5,
.left-column h6,
.left-column .folder-header,
.left-column .folder-header a,
.left-column .nav-list a {
    font-weight: 400;
}
.left-column{
    height: var(--leftColumnHeight);
}
.left-column, 
.post li {
    background-color: var(--colorLeftColumnBackground);
}
.left-column,
.left-column a,
.sidebar-toggle a,
.foldernav a{
    color: var(--colorLeftColumnLinks);
    font-size: 0.94rem;
    line-height: 1.45;
}
.left-column .nav-list,
.left-column .foldernav,
.left-column .headernavi {
    font-size: 0.9rem;
}
.left-column-inner > div:first-child {
    padding-left: 0;
}
.left-column .nav-list {
    margin-left: -1rem;
}
.left-column .nav-list a,
.left-column .foldernav a,
.left-column .folder-header a {
    font-size: 0.9rem;
    letter-spacing: 0.01em;
}
.left-column .nav-list li,
.left-column .foldernav li {
    margin-bottom: 0.15rem;
}
.left-column .nav-list ul {
    margin: 0;
}
.left-column .nav-list a:hover,
.foldernav a:hover{
    background-color: var(--colorLeftColumnHover);
}
.left-column .nav-list .active > a,
.left-column .nav-list .active > .folder-header > a{
    font-weight: 700;
}
.sidebar-toggle{
    background-color: var(--colorLeftColumnBackground);
}
.right-column{
    background-color: var(--colorRightColumnBackground);
    padding-left: 25px;
    min-width: 0;
    position: relative;
}
.site-title {
    padding: 55px 25px 0 0;
    font-family: 'Space Mono', Courier, monospace;
    font-weight: 700;
    font-size: 24pt;
    color: var(--colorRightColumnText);
    max-width: 100%;
    overflow-wrap: break-word;
    box-sizing: border-box;
}
.right-column main,
main {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
}
main > article,
article {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-inline: 0 !important;
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}
@media (min-width: 1000px) {
    .right-column > .flex.mb3{
        margin-bottom: 0;
    }
    main {
        padding-top: 26px !important;
    }
}
main {
    color: var(--colorRightColumnText);
    display: block;
    justify-content: flex-start;
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
}
main.flex-l {
    display: block;
}
main .content,
main .content.center,
main .content article,
main > article,
article {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-inline: 0 !important;
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 600px !important;
    left: auto !important;
    transform: none !important;
}
main .content,
main .content.center {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 600px !important;
    position: static !important;
    justify-content: flex-start !important;
    padding-left: 0 !important;
    padding-right: 25px !important;
}
main a {
    color: var(--colorRightColumnLinks);
}
footer {
    background-color: var(--colorFooterBackground);
    color: var(--colorFooterText);
    border-top-color: var(--colorLeftColumnHover);
    display: none;
}
footer a {
    color: var(--colorFooterLinks);
}
main #content-nav a{
    border-left-color: var(--colorLeftColumnHover);
    color: var(--colorRightColumnText);
}
.left-column{
    border-right:1px solid;
    border-color: #000000;
}
.toolbar{
    border-top:1px solid;
    border-bottom:1px solid;
    border-color: #000000;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    width: calc(100% + 2rem);
}
.langbar{
    border-top:1px solid;
    border-color: #000000;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    width: calc(100% + 2rem);
}
.headernavi{
    border-bottom:1px solid;
    border-color: #000000;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    width: calc(100% + 2rem);
}
.headerlinks a{
    color: var(--colorRightColumnText);
}
.foldernav li{
    border-top:1px solid;
    border-bottom:1px solid;
    margin-bottom: -1px;
    border-color: var(--colorLeftColumnHover);    
}
.editbox{
    border:1px solid;
    background-color: var(--colorLeftColumnHover);
    border-color: var(--colorLeftColumnHover);
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,.5);
}
.readmore{
    color: var(--colorLeftColumnHover);
    text-transform: uppercase;
}
#content-nav a:hover,
#content-nav a.visible {
    background-color: var(--colorLeftColumnHover);
}
#content-nav a.visible {
    border-color: var(--colorBrand);
}
/* Custom hover styles */
.hover-effect {
    background-color: var(--colorBrand);
}
.toolbar-icon .hidden{
    display: none;
}
.toggle-darkmode .icon{
    font-size: 1.4rem;
}
.expandButton{
    color: var(--colorRightColumnLinks);
    border-color: var(--colorRightColumnLinks);
    background-color: transparent;
}


form input[type="submit"],
form button,
form .button{
    color: var(--colorRightColumnLinks);
    border-color: var(--colorRightColumnLinks);
    background: transparent;
}

code,pre{
    font-size:0.9em;
    background-color: var(--colorLeftColumnHover);    
}
pre{
    border-left: .25rem solid;
    border-color: var(--colorBrand);
}

.notice1{
    border-color-left: var(--colorNotice1Border);
    background-color: var(--colorNotice1Background);
    color: var(--colorNotice1Text);
}
.notice2{
    border-color-left: var(--colorNotice2Border);
    background-color: var(--colorNotice2Background);
    color: var(--colorNotice2Text);
}
.notice3{
    border-color-left: var(--colorNotice3Border);
    background-color: var(--colorNotice3Background);
    color: var(--colorNotice3Text);
}
.notice4{
    box-shadow: 0 -100px 80px 0px var(--colorBrand);
}

/*****************  
 *   SIDEBAR  *
 *****************/
.left-column {
    width: 0; /* Default to collapsed */
    min-width: 0;
    transition: width 0.3s ease, min-width 0.3s ease;
    overflow-x: hidden;
    position:absolute;
}
.left-column-inner{
    min-width:300px;
}
.left-column.collapsed {
    width: 0; /* Ensures no unnecessary changes */
    min-width: 0;
}
.left-column.expanded {
    width: 20%;
    min-width:300px;
    z-index:999;
}
.expand-icon {
    display: block; /* Ensure expand icon is visible in mobile view */
/*    position:absolute; */
}
.expand-icon-desktop{
    position: absolute;
    top: 32px;
    left: 25px;
    z-index: 998;
}

@media (min-width: 1000px) {
    .left-column, .left-column.expanded{
        width:20%;
        min-width:300px;
        position:sticky;
    }
    .expand-icon-desktop{
        display: none !important;
        pointer-events: none;
    }
    .expand-icon-desktop.show{
        display: block !important;
        pointer-events: auto !important;
    }
    .hidden-l{
        visibility: hidden;
    }
}


/*****************
 * NAVIGATION   *
 * ***************

/* Initially hide navigation to prevent flickering */
#navigation {
    opacity: 0;
    transition: opacity 0.2s ease;
}
/* Display navigation after processing */
#navigation.visible {
    opacity: 1;
}
/* Initially hide content without transition */
.folder ul {
    max-height: 0;
    transition: max-height 0.3s ease;
    overflow: hidden;
}
/* Apply smooth transition when opening */
.folder.open > ul {
    max-height: 3000px; /* Adjust to a large enough value */
    transition: max-height 0.3s ease;
}
/* Disable transition on initial load */
.no-transition ul {
    transition: none;
}
/* Base arrow style */
.folder-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s ease;
}
/* Arrow icon pointing right */
.folder-toggle::after {
    content: '\2192'; /* → */
    font-size: 20px; /* Adjust as needed */
    display: inline-block;
    transition: transform 0.2s ease;
}
/* Show down arrow when folder is open */
.folder.open > .folder-header > .folder-toggle::after {
    content: '\2193'; /* ↓ */
}
/*****************
 * CONTENT NAVI  *
 * ***************/

html {
    scroll-behavior: smooth;
}
#content-nav {
    display: none !important;
}
#content-nav a {
    border-left: 2px solid;
    display: block;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    text-decoration: none;
    transition: color 0.3s ease, background-color 0.3s ease;
}
/* Indentation for different heading levels */
#content-nav a.indent-h2 { padding-left: 1.5rem; }
#content-nav a.indent-h3 { padding-left: 2rem; }
#content-nav a.indent-h4 { padding-left: 2.5rem; }
#content-nav a.indent-h5 { padding-left: 3rem; }
#content-nav a.indent-h6 { padding-left: 3.5rem; }

/* fix TOC */

.TOC .h1, .TOC .h2, .TOC .h3, .TOC .h4, .TOC .h5, .TOC .h6{
    height: auto;
} 

/************************************
*       TACHYONS ADDITIONS          *
************************************/

.sticky {
    position: sticky;
}
.vh100{
  height: calc(100vh - 2rem);
}
.mw10{
    max-width: 116rem;
}


/************************************
*       STANDARD-ELEMENTS           *
************************************/
html{}
body{}
header{}
footer{}
nav{}
main{}
aside{}
article{}
article p{ text-align: left; }
article a, article a:link, article a:visited{ text-decoration: underline; }
/* article a:before{ content: '\203A'; margin-right: 5px; } */
abbr{}
blockquote{
  margin: 1.5em 1.5em;
  padding: 0.5em 0;
  quotes: "\201C""\201D""\2018""\2019";
  font-family: 'Space Grotesk', 'Segoe UI', sans-serif;
  font-weight: 700;
  font-size: 12pt;
  font-style: normal;
}
blockquote:before{
  color: #000000;
  content: open-quote;
  font-family: 'Space Mono', Courier, monospace;
  font-weight: 700;
  font-size: 2em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote:after{
  color: #000000;
  content: close-quote;
  font-family: 'Space Mono', Courier, monospace;
  font-weight: 700;
  font-size: 2em;
  line-height: 0.1em;
  margin-left: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}
article pre, article code{
    font-family: monospace;
}
article pre{
    white-space: pre;
    padding: 0em;
    display: block;
    max-width: 100%;
    overflow-x: auto;
}
article code{
    font-size: 0.9em;
    line-height: 1.4em;
    padding: 0 0.5em;
    word-break: break-word;
}
pre > code{
    font-size: 0.9em;
    padding: 1em;
    display: block;
}
pre > code.language-pagebreak{
    display: none;
}
dl{
    font-size: 10pt;
    border: 1px solid #000000;
    background-color: #a1c1c3;
    padding: 2em;
    margin: 1.5em 0;
}
dt{
    font-weight: 700;
}
dd{
    font-weight: 400;
    margin: 0 0 0.5em 0;
}
dd:last-child{
    margin-bottom: 0;
}
img{}
article h1, article h2, article h3, article h4, article h5, article h6{
    line-height: 1.15em;
    font-weight: 400;
    line-height: 1em;
}
h1,h2,h3,h4,h5,h6{ word-wrap: break-word; hyphens: auto; }
article h1{ font-size: 20pt; margin: 0 0 0.6em; z-index:1; }
article h2{ font-size: 16pt; margin: 1.8em 0 0.6em; }
article h3{ font-family: 'Space Grotesk', 'Segoe UI', sans-serif; font-weight: 700; font-size: 12pt; margin: 1.6em 0 0.6em; }
article h4{ font-size: 1.1em; margin: 1.4em 0 0.6em; }
article h5{ font-size: 1em; margin: 1.2em 0 0.6em; }
article h6{ font-size: 1em; font-style: italic; font-weight:300; margin: 1em 0 0.6em; }
article .h1, article .h2, article .h3, article .h4, article .h5, article .h6{
    height: auto; /* fix for tachyons */
}
/* Align blog-listing post entries with the normal page format */
.post-entry {
    margin: 0 0 3em 0 !important;
}
.post-entry > div {
    padding: 0 !important;
}
.post-entry header a.f-link {
    text-decoration: none;
    color: var(--colorRightColumnText);
}
.post-entry header a.f-link:hover {
    text-decoration: underline;
}
.post-entry h2 {
    font-family: 'Space Grotesk', 'Segoe UI', sans-serif;
    font-weight: 700;
    font-size: 1em;
    color: var(--colorRightColumnText);
    margin: 0 0 0.3em 0 !important;
}
.post-entry p {
    font-size: 8pt;
    color: var(--colorRightColumnText);
}
/* Single post view: match the listing's typography */
.post-article header h1 {
    font-family: 'Space Grotesk', 'Segoe UI', sans-serif;
    font-weight: 700;
    font-size: 1em;
}
.post-article p {
    font-size: 8pt;
}
.post-article figure {
    margin: 1.33em auto 1.33em 0 !important;
}
hr{
    border: none;
    border-top: 1px solid;
}
ol{}
footer ul{ padding-left:1em; }
li{}
article ul {
    list-style: none;
    padding-left: 1.2em;
}
article ul li {
    position: relative;
    font-weight: 400;
    margin-bottom: 1.5em;
}
article ul li::before {
    content: '\2013';
    position: absolute;
    left: -1.2em;
}
article ol {
    padding-left: 1.2em;
}
article ol li {
    font-weight: 400;
    margin-bottom: 1.5em;
}
sup{}
/* Make table look good */
.tm-table{
    overflow-x: auto;
    margin: 1.6em 0;
}
table{
    width: 100%;
    border-collapse: collapse;
    font-size: .8em;
    table-layout: fixed;
}
thead{
    text-align: left;
}
tr{
    border-top: 1px solid;
    border-bottom: 1px solid;
    margin-bottom: -1px;
}
th,td{
    padding: .5em 1em;
    border-left: 1px solid;
    border-right: 1px solid;
    vertical-align: top;
}
main b, main strong{
    font-weight: 600;
}

/************************************
*       STANDARD SUGGESTIONS        *
************************************/

/* Make links and buttons smooth */
.link, .link:active, .link:focus, .link:hover, .link:link, .link:visited{
    transition: none;
}
a, a:link, a:visited, a:focus, a:hover, a:active, button{
    transition: all .15s ease!important;
    transition-property: color, background-color, text-shadow, border;
}
article a:hover, article a:focus, article a:active,
footer a:hover, footer a:focus, footer a:active{ 
    text-decoration: none;
}

/* For definition list */
dt::after{
    content: ":";
}

/* Make images and image captions look good */
img, figure,figure img{
    max-width: 100%;
    height: auto;
    aspect-ratio: attr(width) / attr(height);
}
figure, video, audio{
    display: table;
    margin: 1.33em auto;
    padding: 0;
}
figure.right, figure.left {
    width: auto;
    float: none;
    margin: 1.33em auto;
}
figure.left {
    margin: 1.33em auto 1.33em 0;
}
figure.right {
    margin: 1.33em 0 1.33em auto;
}
figure img{
    display: block;
    margin: auto;
}
figcaption{
    display: table-caption;
    caption-side: bottom;
    font-size: 0.8em;
    margin-top: .5em;
    line-height: 1.2em;
}
.footnotes ol{
    font-size: .8em;
    line-height: 1em;
    margin: 0 0 0 0;
}



/************************************
*           TYPEMILL-ELEMENTS       *
************************************/

ul.TOC,.TOC ul{
    list-style: none;
}
.TOC{
    padding: 1em;
    border: 1px solid;
}
.TOC{
    border-color: lightgray;
}
.TOC li{
    position: relative;
}
.TOC li a{
    text-decoration: none;
    display: inline-block;
    width: 100%;
    border-bottom: 1px dashed;
    line-height: 1em;
    margin: .3em 0;
}
.TOC li a:hover,.TOC li a:focus,.TOC li a:active{
    border-bottom: 1px solid;
}
.TOC li a:after{
    content: '\203A'; 
    position: absolute;
    right: 5px;
    transition: all .2s;
}
.TOC li a:hover:after{
    right: 0px; 
}
.notice1 {
    margin: 1.5em 0;
    padding: 2em;
    border: 1px solid #000000;
}
.notice2 {
    margin: 1.5em 0;
    padding: 2em;
    border: 1px solid #000000;
}
.notice3{
    margin: 1.5em 0;
    padding: 2em;
    border: 1px solid #000000;
}

/* used for pro content box */
.notice4{
  position: relative;
  text-align: center;
  padding: 1em;
  border: 1px solid;
}
.notice1 p,
.notice2 p,
.notice3 p,
.notice4 p {
    margin: 0 0 0.5em 0;
}
.notice1 p:last-child,
.notice2 p:last-child,
.notice3 p:last-child,
.notice4 p:last-child {
    margin-bottom: 0;
}

/* Style the optional anchor-links for headlines */
a.tm-heading-anchor {
    display:  inline-block;
    margin-left:  -0.8em;
    width: 0.8em;
    font-weight: 300;
    opacity: 0;
    text-decoration: none;
    float: right;
}
a.tm-heading-anchor:hover,a.tm-heading-anchor:focus {
    opacity: 1;
    text-decoration: none;
}
h2:focus > .tm-heading-anchor,
h2:hover > .tm-heading-anchor,
h4:focus > .tm-heading-anchor,
h4:hover > .tm-heading-anchor,
h5:focus > .tm-heading-anchor,
h5:hover > .tm-heading-anchor,
h6:focus > .tm-heading-anchor,
h6:hover > .tm-heading-anchor{
    opacity: .5;
    text-decoration: none;
}

/* style the typemill download-button for files */
a.tm-download{}
a.tm-download::before{
    content: "\2193";
    -webkit-mask: url("data:image/svg+xml; utf8, <svg width='24' fill='currentColor' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM11 8v5.586l-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414l4 4c0.092 0.092 0.202 0.166 0.324 0.217 0.245 0.101 0.521 0.101 0.766 0 0.118-0.049 0.228-0.121 0.324-0.217l4-4c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293v-5.586c0-0.552-0.448-1-1-1s-1 0.448-1 1z'></path></svg>") no-repeat 50% 50%;
    mask: url("data:image/svg+xml; utf8, <svg width='24' fill='currentColor' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM11 8v5.586l-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414l4 4c0.092 0.092 0.202 0.166 0.324 0.217 0.245 0.101 0.521 0.101 0.766 0 0.118-0.049 0.228-0.121 0.324-0.217l4-4c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293v-5.586c0-0.552-0.448-1-1-1s-1 0.448-1 1z'></path></svg>") no-repeat 50% 50%;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: currentColor; 
    display: inline-block;
    margin-right: 5px;
    width:  24px;
    height: 24px;
    text-decoration: none;
    vertical-align: middle;
}
a.tm-download:hover::before{
    text-decoration: none;
}
.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
}
#logo-container {
    width: 80%;
}
.icon.logo-mark {
    width: 100%;
    height: auto;
    aspect-ratio: 835.09 / 222.08;
}

/************************************
*       TACHYONS ADDITIONS          *
************************************/

/* Keeps Footer at the bottom */
.body-footer-bottom { /* add this class to the body-tag */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.footer-bottom { /* add this class to the footer-tag */
  margin-top: auto;
}
/* Nice set of system fonts, add this to the body-tag */
.sans-serif-tm {
    font-family: 'Space Grotesk', 'Segoe UI', sans-serif;
}
.sans-serif-title{
    font-family: 'Space Mono', Courier, monospace;
}
/* optimize text, add this to the body-tag */
.optimize-text{
    /* Adjust font size */
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    /* Font varient */
    font-variant-ligatures: none;
    -webkit-font-variant-ligatures: none;
    /* Smoothing */
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
}
.f-large{
    font-size: 4rem;
}
.h4-5{
    height: 12rem;  
}
.margin-bottom-1{
    margin-bottom: -1px;
}
.arrow-after:after{
    content: '\203A'; position: absolute; right:5px;
}
.arrow-after-transition:after{
    content: '\203A'; position: absolute; right:5px;
    transition: all .2s;
}
.arrow-after-transition:hover:after{
    right:0px;
}
.indent-l-1{ padding-left:1rem; }
.indent-l-2{ padding-left:2rem; }
.indent-l-3{ padding-left:3rem; }
.indent-l-4{ padding-left:4rem; }
.indent-l-5{ padding-left:4.5rem; }
.indent-l-6{ padding-left:5rem; }
.indent-l-7{ padding-left:5.5rem; }
.indent-l-8{ padding-left:5.8rem; }
.indent-l-9{ padding-left:6.3rem; }
.indent-l-10{ padding-left:6.5rem; }

.b--solid-hover:hover,.b--solid-hover:focus,.b--solid-hover:active{
    border-style: solid;
}
.flex-grow{
    flex-grow: 1;
}

/**************
*   Forms     *
**************/

form{
    width: 100%;
    max-width:  800px;
    border: none;
    margin: 20px 0 20px 0;
    padding: 0 0 0 0;
}
form fieldset{
    width: 100%;
    border: none;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
form label{
    width: 100%;
    display: block;
    color: var(--colorRightColumnText);
    margin-top: 1.5em;
}
form input, form textarea{
    width: 100%;
    display: block;
    border: 1px solid #ddd;
    padding: 15px;
    margin: 0 0 20px 0;
    background: #f5f5f5;
}
form input:focus,form select:focus,form textarea:focus{
    outline: none;
    border: 1px solid rgba(229, 226, 211, 1);
    box-shadow: 0 0 2px #D73B00;;
}
form input[type="submit"],form button,form .button{
    cursor: pointer;
    font-size: 1em;
    margin-top: 1.5em;
    width: 100%;
    padding: 15px;
}
form input[type="submit"]:hover,form button:hover,.button:hover{
    opacity: .8;
}


@media print {
    nav, 
    .left-column,
    .headerlinks,
    #bottompager,
    .account,
    .editbox,
    footer{
        display:  none;
    }
    .sidebar-toggle #logo-container{
        display: block;
        visibility: visible;
    }
    .logo-image{
        max-width: 150px;
    }   
    main{
        padding-bottom: 0!important;
    }
    aside{
        padding-top: 0!important;
        padding-bottom: 0!important;
    }
    main,footer{
        border:  0px!important;
    }
    body, 
    .account, 
    main, 
    footer, 
    button.expander, 
    .notice4{
        background: #fff!important;
        color:  black!important;
    }
    article{
        font-size: .8em;
    }
    article a[href]{
        color: black;
        text-decoration: underline;
    }
    article a[href]:after {
        content: " (" attr(href) ")";
    }
    nav .mw6{
        width:  100%;
    }
    a.tm-heading-anchor {
        display: none;
    }
}