hugo-theme-relearn/static/css/theme.css
Sören Weber c81bf82ced
menu: allow empty ul
This simplyfies code, as of now it is only necessary to tag the ul with
classes and let the CSS do all the heavy lifting.

Care was taken, to not mess up layout when a ul ends up with all
its li hidden.
2021-08-26 22:19:52 +02:00

1126 lines
24 KiB
CSS

@charset "UTF-8";
/* Tags */
@import "tags.css";
#top-github-link, #body #breadcrumbs {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.button, .button-secondary {
display: inline-block;
padding: 7px 12px;
}
.button:active, .button-secondary:active {
margin: 2px 0 -2px 0;
}
@font-face {
font-family: 'Novacento Sans Wide';
src: url("../fonts/Novecentosanswide-UltraLight-webfont.eot");
src: url("../fonts/Novecentosanswide-UltraLight-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/Novecentosanswide-UltraLight-webfont.woff2") format("woff2"), url("../fonts/Novecentosanswide-UltraLight-webfont.woff") format("woff"), url("../fonts/Novecentosanswide-UltraLight-webfont.ttf") format("truetype"), url("../fonts/Novecentosanswide-UltraLight-webfont.svg#novecento_sans_wideultralight") format("svg");
font-style: normal;
font-weight: 200;
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 300;
src: url("../fonts/Work_Sans_300.eot?#iefix") format("embedded-opentype"), url("../fonts/Work_Sans_300.woff") format("woff"), url("../fonts/Work_Sans_300.woff2") format("woff2"), url("../fonts/Work_Sans_300.svg#WorkSans") format("svg"), url("../fonts/Work_Sans_300.ttf") format("truetype");
}
@font-face {
font-family: 'Work Sans';
font-style: normal;
font-weight: 500;
src: url("../fonts/Work_Sans_500.eot?#iefix") format("embedded-opentype"), url("../fonts/Work_Sans_500.woff") format("woff"), url("../fonts/Work_Sans_500.woff2") format("woff2"), url("../fonts/Work_Sans_500.svg#WorkSans") format("svg"), url("../fonts/Work_Sans_500.ttf") format("truetype");
}
body {
background: #fff;
color: #777;
}
body #chapter h1 {
font-size: 3.5rem;
}
@media only all and (min-width: 48em) and (max-width: 59.938em) {
body #chapter h1 {
font-size: 3rem;
}
}
@media only all and (max-width: 47.938em) {
body #chapter h1 {
font-size: 2rem;
}
}
a {
color: #00bdf3;
}
a:hover {
color: #0082a7;
}
pre {
position: relative;
}
.bg {
background: #fff;
border: 1px solid #eaeaea;
}
b, strong, label, th {
font-weight: 600;
}
.default-animation, #header #logo-svg, #header #logo-svg path, #sidebar, #sidebar ul, #body, #body .padding, #body .nav {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
transition: all 0.5s ease;
}
#sidebar {
font-weight: 300 !important;
}
fieldset {
border: 1px solid #ddd;
}
textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], select[multiple=multiple] {
background-color: white;
border: 1px solid #ddd;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06);
}
textarea:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="text"]:hover, input[type="url"]:hover, input[type="color"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="month"]:hover, input[type="time"]:hover, input[type="week"]:hover, select[multiple=multiple]:hover {
border-color: #c4c4c4;
}
textarea:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, select[multiple=multiple]:focus {
border-color: #00bdf3;
box-shadow: inset 0 1px 3px rgba(0,0,0,.06),0 0 5px rgba(0,169,218,.7)
}
#header-wrapper {
background: #8451a1;
color: #fff;
text-align: center;
border-bottom: 4px solid #9c6fb6;
padding: 1rem;
}
#header a {
display: inline-block;
}
#header #logo-svg {
width: 8rem;
height: 2rem;
}
#header #logo-svg path {
fill: #fff;
}
.searchbox {
margin-top: 1rem;
position: relative;
border: 1px solid #915eae;
background: #764890;
border-radius: 4px;
}
.searchbox label {
color: rgba(255, 255, 255, 0.8);
position: absolute;
left: 10px;
top: 3px;
}
.searchbox span {
color: rgba(255, 255, 255, 0.6);
position: absolute;
right: 10px;
top: 3px;
cursor: pointer;
}
.searchbox span:hover {
color: rgba(255, 255, 255, 0.9);
}
.searchbox input {
display: inline-block;
color: #fff;
width: 100%;
height: 30px;
background: transparent;
border: 0;
padding: 0 25px 0 30px;
margin: 0;
font-weight: 300;
}
.searchbox input::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
.searchbox input::-moz-placeholder {
color: rgba(255, 255, 255, 0.6);
}
.searchbox input:-moz-placeholder {
color: rgba(255, 255, 255, 0.6);
}
.searchbox input:-ms-input-placeholder {
color: rgba(255, 255, 255, 0.6);
}
#sidebar-toggle-span {
display: none;
}
@media only all and (max-width: 47.938em) {
#sidebar-toggle-span {
display: inline;
}
}
#sidebar {
background-color: #322A38;
position: fixed;
top: 0;
width: 300px;
bottom: 0;
left: 0;
font-weight: 400;
font-size: 15px;
}
#sidebar a {
color: #ccc;
}
#sidebar a:hover {
color: #e6e6e6;
}
#sidebar a.subtitle {
color: rgba(204, 204, 204, 0.6);
}
#sidebar hr {
border-bottom: 1px solid #2a232f;
}
#sidebar a.padding {
padding: 0 1rem;
}
#sidebar ul {
list-style: none;
padding: 0;
margin: 0;
}
#sidebar ul.searched a {
color: #999999;
}
#sidebar ul.searched .search-match a {
color: #e6e6e6;
}
#sidebar ul.searched .search-match a:hover {
color: white;
}
#sidebar ul.topics {
margin: 0 1rem;
}
#sidebar ul.topics.searched ul {
display: block;
}
#sidebar ul.topics ul {
display: none;
}
#sidebar ul.topics > li > ul > li:last-child {
padding-bottom: 1rem;
}
#sidebar ul.topics ul ul {
padding-bottom: 0;
}
#sidebar ul.topics li.parent > ul, #sidebar ul.topics li.active > ul, #sidebar ul.topics li.alwaysopen > ul {
display: block;
}
#sidebar ul.topics > li > a {
line-height: 2rem;
font-size: 1.1rem;
}
#sidebar ul.topics > li > a b {
opacity: 0.5;
font-weight: normal;
}
#sidebar ul.topics > li > a .fa {
margin-top: 9px;
}
#sidebar ul.topics > li.parent {
background: #251f29;
margin-left: -1rem;
margin-right: -1rem;
padding-left: 1rem;
padding-right: 1rem;
}
#sidebar ul li.active > a {
background: #fff;
color: #777 !important;
margin-left: -1rem;
margin-right: -1rem;
padding-left: 1rem;
padding-right: 1rem;
}
#sidebar ul li {
padding: 0;
}
#sidebar ul li.visited + span {
margin-right: 16px;
}
#sidebar ul li a {
display: block;
padding: 2px 0;
}
#sidebar ul li a span {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
#sidebar ul li > a {
padding: 4px 0;
}
#sidebar ul li.visited > a .read-icon {
color: #9c6fb6;
display: inline;
}
#sidebar ul li li {
padding-left: 1rem;
text-indent: 0.2rem;
}
#main {
background: #f7f7f7;
margin: 0 0 1.563rem 0;
}
#body {
position: relative;
margin-left: 300px;
min-height: 100%;
}
#body img, #body .video-container {
margin: 3rem auto;
display: block;
text-align: center;
}
#body img.border, #body .video-container.border {
border: 2px solid #e6e6e6 !important;
padding: 2px;
}
#body img.shadow, #body .video-container.shadow {
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
#body img.inline {
display: inline !important;
margin: 0 !important;
vertical-align: bottom;
}
#body .bordered {
border: 1px solid #ccc;
}
#body .padding {
padding: 3rem 6rem;
}
@media only all and (max-width: 59.938em) {
#body .padding {
position: static;
padding: 15px 3rem;
}
}
@media only all and (max-width: 47.938em) {
#body .padding {
padding: 5px 1rem;
}
}
#body h1 + hr {
margin-top: -1.7rem;
margin-bottom: 3rem;
}
@media only all and (max-width: 59.938em) {
#body #navigation {
position: static;
margin-right: 0 !important;
width: 100%;
display: table;
}
}
@media print {
#body #navigation {
display: none;
}
}
#body .nav {
position: fixed;
top: 0;
bottom: 0;
width: 4rem;
font-size: 50px;
height: 100%;
cursor: pointer;
display: table;
text-align: center;
}
#body .nav > i {
display: table-cell;
vertical-align: middle;
text-align: center;
}
@media only all and (max-width: 59.938em) {
#body .nav {
display: table-cell;
position: static;
top: auto;
width: 50%;
text-align: center;
height: 100px;
line-height: 100px;
padding-top: 0;
}
#body .nav > i {
display: inline-block;
}
}
#body .nav:hover {
background: #F6F6F6;
}
#body .nav.nav-pref {
left: 0;
}
#body .nav.nav-next {
right: 0;
}
#chapter {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
padding: 2rem 0;
}
#chapter #body-inner {
max-width: 80%;
}
#chapter h3 {
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
font-weight: 300;
text-align: center;
}
#chapter h1 {
font-size: 5rem;
border-bottom: 4px solid #F0F2F4;
}
#chapter p {
text-align: justify;
font-size: 1.2rem;
}
#footer {
padding: 3rem 1rem;
color: #b3b3b3;
font-size: 13px;
}
#footer p {
margin: 0;
}
body {
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
font-weight: 300;
line-height: 1.6;
font-size: 18px !important;
}
h2, h3, h4, h5, h6 {
font-family: "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
text-rendering: optimizeLegibility;
color: #5e5e5e;
font-weight: 400;
letter-spacing: -1px;
}
h1 {
font-family: "Novacento Sans Wide", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
text-align: center;
text-transform: uppercase;
color: #222;
font-weight: 200;
}
blockquote {
border-left: 10px solid rgba(0, 8, 16, 0.2);
}
blockquote p {
font-size: 1.1rem;
color: #56585d;
}
blockquote cite {
display: block;
text-align: right;
color: #222;
font-size: 1.2rem;
}
div.notices {
border-top-width: 2rem;
border-top-style: solid;
color: #505050;
margin: 2rem 0;
padding-bottom: .1px;
padding-left: 1rem;
padding-right: 1rem;
}
div.notices > * {
margin-top: 1rem;
margin-bottom: 1rem;
}
div.notices > div.label {
color: #fff;
font-weight: normal;
margin-bottom: 1rem;
margin-top: -1.75rem;
}
div.notices > div.label:first-child:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
margin-left: -.35rem;
margin-right: .35rem;
}
div.notices.info {
border-color: #4897CC;
background-color: #E9F5FD;
}
div.notices.info > div.label:first-child:before {
content: "\f05a";
}
div.notices.warning {
border-color: #D96A68;
background-color: #FFEBEB;
}
div.notices.warning > div.label:first-child:before {
content: "\f071";
}
div.notices.note {
border-color: #BF8B44;
background-color: #FFF2DB;
}
div.notices.note > div.label:first-child:before {
content: "\f06a";
}
div.notices.tip {
border-color: #5AA55A;
background-color: #E6F9E6;
}
div.notices.tip > div.label:first-child:before {
content: "\f0eb";
}
/* attachments shortcode */
section.attachments {
border-top-width: 2rem;
border-top-style: solid;
color: #505050;
margin: 2rem 0;
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: .1px;
}
section.attachments > div.label {
color: #fff;
font-weight: normal;
margin-bottom: 1rem;
margin-top: -1.75rem;
}
section.attachments > div.label:first-child:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
margin-left: -.35rem;
margin-right: .35rem;
content: "\f0c6";
}
section.attachments .attachments-files {
padding: 1rem;
display: block;
font-size: 1rem;
margin-top: -1rem;
margin-bottom: 0rem;
}
section.attachments.orange {
border-color: #BF8B44;
background-color: #FFF2DB;
}
section.attachments.green {
border-color: #5AA55A;
background-color: #E6F9E6;
}
section.attachments.red {
border-color: #D96A68;
background-color: #FFEBEB;
}
section.attachments.blue {
border-color: #4897CC;
background-color: #E9F5FD;
}
section.attachments.grey {
border-color: #505D65;
background-color: #F4F4F4;
}
section.attachments.neutral {
border-color: transparent;
background-color: transparent;
}
section.attachments.neutral > div.label {
color: #505050;
}
/* Children shortcode */
.children p {
font-size: small;
margin-top: 0px;
padding-top: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
}
.children-li p {
font-size: small;
font-style: italic;
}
.children-h2 p, .children-h3 p {
font-size: small;
margin-top: 0px;
padding-top: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
}
.children h3,.children h2 {
margin-bottom: 0px;
margin-top: 5px;
}
code, kbd, pre, samp {
font-family: "Consolas", menlo, monospace;
font-size: 92%;
vertical-align: baseline;
}
code {
background-color: #FFFAE9;
border: 1px solid #F8E8C8;
border-radius: 2px;
color: #5E5E5E;
padding-left: 2px;
padding-right: 2px;
white-space: nowrap;
}
code.copy-to-clipboard-inline {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
border-right-width: 0;
}
pre {
padding: 1rem;
margin: 2rem 0;
border: 0;
border-radius: 2px;
line-height: 1.15;
}
pre code {
background-color: inherit;
color: inherit;
border: 0;
font-size: 15px;
margin: 0;
padding: 0;
white-space: inherit;
}
hr {
border-bottom: 4px solid #F0F2F4;
}
.page-title {
margin-top: -25px;
padding: 25px;
float: left;
clear: both;
background: #9c6fb6;
color: #fff;
}
#body a.anchor-link {
color: #ccc;
}
#body a.anchor-link:hover {
color: #9c6fb6;
}
#body-inner .tabs-wrapper.ui-theme-badges {
background: #1d1f21;
}
#body-inner .tabs-wrapper.ui-theme-badges .tabs-nav li {
font-size: 0.9rem;
text-transform: uppercase;
}
#body-inner .tabs-wrapper.ui-theme-badges .tabs-nav li a {
background: #35393c;
}
#body-inner .tabs-wrapper.ui-theme-badges .tabs-nav li.current a {
background: #4d5257;
}
#body-inner pre {
white-space: pre-wrap;
}
.tabs-wrapper pre {
margin: 1rem 0;
border: 0;
padding: 0;
background: inherit;
}
table {
border: 1px solid #eaeaea;
table-layout: auto;
}
th {
background: #f7f7f7;
padding: 0.5rem;
}
td {
padding: 0.5rem;
border: 1px solid #eaeaea;
}
.button {
background: #9c6fb6;
color: #fff;
box-shadow: 0 3px 0 #00a5d4;
}
.button:hover {
background: #00a5d4;
box-shadow: 0 3px 0 #008db6;
color: #fff;
}
.button:active {
box-shadow: 0 1px 0 #008db6;
}
.button-secondary {
background: #F8B450;
color: #fff;
box-shadow: 0 3px 0 #f7a733;
}
.button-secondary:hover {
background: #f7a733;
box-shadow: 0 3px 0 #f69b15;
color: #fff;
}
.button-secondary:active {
box-shadow: 0 1px 0 #f69b15;
}
.bullets {
margin: 1.7rem 0;
margin-left: -0.85rem;
margin-right: -0.85rem;
overflow: auto;
}
.bullet {
float: left;
padding: 0 0.85rem;
}
.two-column-bullet {
width: 50%;
}
@media only all and (max-width: 47.938em) {
.two-column-bullet {
width: 100%;
}
}
.three-column-bullet {
width: 33.33333%;
}
@media only all and (max-width: 47.938em) {
.three-column-bullet {
width: 100%;
}
}
.four-column-bullet {
width: 25%;
}
@media only all and (max-width: 47.938em) {
.four-column-bullet {
width: 100%;
}
}
.bullet-icon {
float: left;
background: #9c6fb6;
padding: 0.875rem;
width: 3.5rem;
height: 3.5rem;
border-radius: 50%;
color: #fff;
font-size: 1.75rem;
text-align: center;
}
.bullet-icon-1 {
background: #9c6fb6;
}
.bullet-icon-2 {
background: #00f3d8;
}
.bullet-icon-3 {
background: #e6f300;
}
.bullet-content {
margin-left: 4.55rem;
}
.tooltipped {
position: relative;
}
.tooltipped:after {
border: 1px solid #777;
position: absolute;
z-index: 1000000;
display: none;
padding: 5px 8px;
font: normal normal 11px/1.5 "Work Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
color: #fff;
text-align: center;
text-decoration: none;
text-shadow: none;
text-transform: none;
letter-spacing: normal;
word-wrap: break-word;
white-space: pre;
pointer-events: none;
content: attr(aria-label);
background: rgba(0, 0, 0, 0.8);
border-radius: 3px;
-webkit-font-smoothing: subpixel-antialiased;
}
.tooltipped:before {
position: absolute;
z-index: 1000001;
display: none;
width: 0;
height: 0;
color: rgba(0, 0, 0, 0.8);
pointer-events: none;
content: "";
border: 5px solid transparent;
}
.tooltipped:hover:before, .tooltipped:hover:after, .tooltipped:active:before, .tooltipped:active:after, .tooltipped:focus:before, .tooltipped:focus:after {
display: inline-block;
text-decoration: none;
}
.tooltipped-s:after, .tooltipped-se:after, .tooltipped-sw:after {
top: 100%;
right: 50%;
margin-top: 5px;
}
.tooltipped-s:before, .tooltipped-se:before, .tooltipped-sw:before {
top: auto;
right: 50%;
bottom: -5px;
margin-right: -5px;
border-bottom-color: rgba(0, 0, 0, 0.8);
}
.tooltipped-se:after {
right: auto;
left: 50%;
margin-left: -15px;
}
.tooltipped-sw:after {
margin-right: -15px;
}
.tooltipped-n:after, .tooltipped-ne:after, .tooltipped-nw:after {
right: 50%;
bottom: 100%;
margin-bottom: 5px;
}
.tooltipped-n:before, .tooltipped-ne:before, .tooltipped-nw:before {
top: -5px;
right: 50%;
bottom: auto;
margin-right: -5px;
border-top-color: rgba(0, 0, 0, 0.8);
}
.tooltipped-ne:after {
right: auto;
left: 50%;
margin-left: -15px;
}
.tooltipped-nw:after {
margin-right: -15px;
}
.tooltipped-s:after, .tooltipped-n:after {
transform: translateX(50%);
}
.tooltipped-w:after {
right: 100%;
bottom: 50%;
margin-right: 5px;
transform: translateY(50%);
}
.tooltipped-w:before {
top: 50%;
bottom: 50%;
left: -5px;
margin-top: -5px;
border-left-color: rgba(0, 0, 0, 0.8);
}
.tooltipped-e:after {
bottom: 50%;
left: 100%;
margin-left: 5px;
transform: translateY(50%);
}
.tooltipped-e:before {
top: 50%;
right: -5px;
bottom: 50%;
margin-top: -5px;
border-right-color: rgba(0, 0, 0, 0.8);
}
.highlightable {
padding: 1rem 0 1rem;
overflow: auto;
position: relative;
}
.lightbox-active #body {
overflow: visible;
}
.lightbox-active #body .padding {
overflow: visible;
}
#github-contrib i {
vertical-align: middle;
}
.featherlight img {
margin: 0 !important;
}
.lifecycle #body-inner ul {
list-style: none;
margin: 0;
padding: 2rem 0 0;
position: relative;
}
.lifecycle #body-inner ol {
margin: 1rem 0 1rem 0;
padding: 2rem;
position: relative;
}
.lifecycle #body-inner ol li {
margin-left: 1rem;
}
.lifecycle #body-inner ol strong, .lifecycle #body-inner ol label, .lifecycle #body-inner ol th {
text-decoration: underline;
}
.lifecycle #body-inner ol ol {
margin-left: -1rem;
}
.lifecycle #body-inner h3[class*='level'] {
font-size: 20px;
position: absolute;
margin: 0;
padding: 4px 10px;
right: 0;
z-index: 1000;
color: #fff;
background: #1ABC9C;
}
.lifecycle #body-inner ol h3 {
margin-top: 1rem !important;
right: 2rem !important;
}
.lifecycle #body-inner .level-1 + ol {
background: #f6fefc;
border: 4px solid #1ABC9C;
color: #16A085;
}
.lifecycle #body-inner .level-1 + ol h3 {
background: #2ECC71;
}
.lifecycle #body-inner .level-2 + ol {
background: #f7fdf9;
border: 4px solid #2ECC71;
color: #27AE60;
}
.lifecycle #body-inner .level-2 + ol h3 {
background: #3498DB;
}
.lifecycle #body-inner .level-3 + ol {
background: #f3f9fd;
border: 4px solid #3498DB;
color: #2980B9;
}
.lifecycle #body-inner .level-3 + ol h3 {
background: #34495E;
}
.lifecycle #body-inner .level-4 + ol {
background: #e4eaf0;
border: 4px solid #34495E;
color: #2C3E50;
}
.lifecycle #body-inner .level-4 + ol h3 {
background: #34495E;
}
#top-bar {
background: #F6F6F6;
border-radius: 2px;
padding: 0 1rem;
height: 0;
min-height: 3rem;
}
@media print {
#body #top-bar{
background-color: #fff; /* avoid background bleeding*/
border-bottom: 1px solid #ddd;
border-radius: 0;
padding-left: 0; /* for print, we want to align with the footer to ease the layout */
color: #777;
}
}
#top-github-link {
position: relative;
z-index: 1;
float: right;
display: block;
}
@media print {
/* we don't need this while printing */
#top-github-link {
display: none;
}
}
#body #breadcrumbs {
height: auto;
margin-bottom: 0;
padding-left: 0;
line-height: 1.4;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 70%;
display: inline-block;
float: left;
}
#body #breadcrumbs span {
padding: 0 0.1rem;
}
@media only all and (max-width: 59.938em) {
#sidebar {
width: 230px;
}
#body {
margin-left: 230px;
}
}
@media only all and (max-width: 47.938em) {
#sidebar {
width: 230px;
left: -230px;
}
#body {
margin-left: 0;
width: 100%;
}
.sidebar-hidden {
overflow: hidden;
}
.sidebar-hidden #sidebar {
left: 0;
}
.sidebar-hidden #body {
margin-left: 230px;
overflow: hidden;
}
.sidebar-hidden #overlay {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 10;
background: rgba(255, 255, 255, 0.5);
cursor: pointer;
}
}
.copy-to-clipboard {
background-color: #FFFAE9;
background-image: url(../images/clippy.svg);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 14px 16px;
border: 1px solid #F8E8C8;
border-radius: 0 2px 2px 0;
color: #5E5E5E;
cursor: pointer;
font-family: "Consolas", menlo, monospace;
font-size: 92%;
padding-left: 22px;
}
.copy-to-clipboard:hover {
background-color: #FCEBB4;
border-color: #B19F7A;
}
pre .copy-to-clipboard {
background-color: rgba( 204, 204, 204, .666 );
border-color: #000;
border-radius: 2px;
padding: 10.5px 12.5px;
position: absolute;
right: 4px;
top: 4px;
}
pre .copy-to-clipboard:hover {
border-color: #505050;
background-color: rgba( 236, 236, 236, .9 );
}
#sidebar ul.topics > li > a .read-icon {
margin-top: 9px;
}
#sidebar ul {
list-style: none;
padding: 0;
margin: 0;
}
#sidebar #shortcuts li {
padding: 2px 0;
list-style: none;
}
#sidebar ul li .read-icon {
display: none;
float: right;
font-size: 13px;
min-width: 16px;
margin: 4px 0 0 0;
text-align: right;
}
#sidebar ul li.visited > a .read-icon {
color: #00bdf3;
display: inline;
}
#sidebar #shortcuts h3 {
font-family: "Novacento Sans Wide", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
color: white ;
margin-top:1rem;
padding-left: 1rem;
}
#homelinks {
background-color: #9c6fb6;
color: #fff;
padding: 7px 0;
border-bottom: 4px solid #9c6fb6;
}
option {
color: initial;
}
.expand-label {
cursor: pointer;
}
.expand-label i{
font-size: x-small;
width: 8px;
}
@media print {
/* in print mode show footer line to signal reader
the end of document */
.footline {
border-top: 1px solid #ddd;
color: #777;
margin-top: 1.5rem;
padding-top: .75rem;
}
}