/* body { */
/*     margin: 1rem; */
/*     padding: 1rem; */
/* } */

html {
    padding: 4rem;
}
body{
    margin: 1rem auto;
    max-width: 60rem;
    line-height: 1.4;
    font-size: 1.1rem;
    color: #222;
    padding: 0 1rem;
    overflow: auto;
}

.title {
    margin-bottom: 2rem;
}

/* Table of contents */
nav#collapsed-table-of-contents {
    margin-bottom: 1rem;
}
nav#collapsed-table-of-contents details {
    background-color: #e8e8e8;
    border: none;
    margin: 0.5rem;
}
nav#collapsed-table-of-contents details summary {
    padding: 0.5rem;
}
nav#collapsed-table-of-contents > details > summary { /* bigger padding for main toc */
    padding: 1rem;
}
nav#collapsed-table-of-contents details ul {
    list-style: none;
    margin: 0.5rem;
    padding: 0;
}
nav#collapsed-table-of-contents details > ul > li {
    margin: 0.5rem;
}
nav#collapsed-table-of-contents details > ul > li > a {
    margin: 0.5rem 1rem;
}
nav#collapsed-table-of-contents details > ul > li.toc-open {
    background-color: #c0e8d0;
}
nav#collapsed-table-of-contents details > ul > li.toc-currentpage {
    background-color: #a0e0b0;
}
nav#collapsed-table-of-contents details[open] {
    border: 1px solid gray;
}
nav#collapsed-table-of-contents details[open] > summary {
    background-color: #d0d0d0;
}
nav#collapsed-table-of-contents details > summary:hover {
    background-color: #d8d8d8;
}
nav#collapsed-table-of-contents details > summary.toc-open {
    background-color: #d0e8d0;
}
nav#collapsed-table-of-contents details > summary.toc-currentpage {
    background-color: #a0e0b0;
}

div#text-table-of-contents ul {
    margin: 0;
    list-style: none;
}


/* DEPREC Navbar */
div.navbar {
    list-style: none;
}
div.navbar li {
    display: inline;
}


/* Breadcrumbs */
ul.breadcrumbs {
    font-size: 70%;
    list-style: none;
    margin: 0;
}
ul.breadcrumbs > li {
    display: inline;
    margin-right: 0.3rem;
}
ul.breadcrumbs > li+li:before {
    content: "/\00a0";
}

ul.navigation-links {
    list-style: none;
    margin: 0;
}
ul.navigation-links > li {
    font-size: 70%;
    display: inline-block;
    margin-right: 1rem;
}
ul.navigation-links > li {
    text-decoration: none;
}

table th, table td {
    padding: 0.5rem;
}

/* HTML5-specific tags */

aside {
    width: 40%;
    padding-left: .5rem;
    margin-left: .5rem;
    float: right;
    box-shadow: inset 5px 0 5px -5px #29627e;
    font-style: italic;
    color: #29627e;
}

aside > p {
    margin: .5rem;
}

details {
    border: 1px solid gray;
    margin: 1rem;
    padding: 0rem;
    clear: both;
}
summary {
    padding: 1rem;
}
details[open] > p, ul {
    margin-left: 1rem;
    margin-right: 1rem;
    margin: 1rem;
}


/* Preformatted code blocks */
pre {
    border-radius: .3rem;
    background-color: #f2efe4;
    padding: .5rem;
}


/* rank-based container classes */
.rant {
    opacity: 0.5;
}


/* Environment-specific styles */

.prereq {
    background-color: rgba(191, 0, 0, 0.2);
}
.objectives {
    background-color: rgba(191, 191, 255, 0.6);
}
.core {
    background-color: rgba(191, 255, 191, 0.4);
}
.main {
    background-color: rgba(191, 255, 191, 0.2);
}
.example {
    background-color: rgba(255, 255, 191, 0.6);
}
.info {
    background-color: rgba(159, 255, 255, 0.4);
}
.context {
    background-color: rgba(191, 223, 255, 0.6);
}

/* when details are open, darken summary */
details[open].prereq > summary {
    background-color: rgba(191, 0, 0, 0.1);
}
details[open].objectives > summary {
    background-color: rgba(191, 191, 255, 0.6);
}
details[open].core > summary {
    background-color: rgba(191, 255, 191, 0.4);
}
details[open].main > summary {
    background-color: rgba(191, 255, 191, 0.2);
}
details[open].example > summary {
    background-color: rgba(255, 255, 191, 0.6);
}
details[open].info > summary {
    background-color: rgba(159, 255, 255, 0.4);
}
details[open].context > summary {
    background-color: rgba(191, 223, 255, 0.6);
}


/* Permalinks to sections */
a.headline-permalink, span.headline-id {
    float: right;
    margin-right: 1rem;
    font-size: 70%;
    text-decoration: none;
}

/* when contextual colors are used for a div */
div.prereq, div.objectives, div.core, div.main, div.example, div.info, div.context {
    margin: 1rem;
    padding: 1rem;
    padding-bottom: 1.5rem;  /* to fit the alteqlabels inside colored box */
    overflow: auto;
}

/* Giving equation nrs from other sources: use aside element */
/* aside.alteqlabels { */
/*     box-shadow: none; /\* remove standard aside property *\/ */
/*     color: gray; */
/*     font-size: 50%; */
/*     width: 10%; */
/* } */
/* aside.alteqlabels > ul { */
/*     list-style: none; */
/* } */

ul.altsecnrs {
    color: gray;
    font-size: 60%;
    float: right;
    /* clear: both; */
    list-style: none;
    margin-top: -1rem;
    padding-top: 0;
}
ul.altsecnrs > li {
    display: inline-block;
}
ul.altsecnrs > li:not(:first-child)::before {
    content: '/';
    margin-right: 0.2rem;
}

div.eqlabel {
    float: right;
    clear: both;
    position: relative;
    z-index: 10;
}
div.eqlabel p {
    margin: 0;
    margin-left: 1rem;
}

div.alteqlabels {
    color: gray;
    font-size: 60%;
    float: right;
    clear: both;
}
div.alteqlabels > ul {
    list-style: none;
    margin-left: 1rem;
    padding: 0;
}
/* div.alteqlabels p { */
/*     float: right; */
/*     clear: both; */
/* } */


/* Equations */
/* .eq-permalink { */
/*     float: right; */
/* } */


div.license {
    font-size: 60%;
}