|
- :root {
- scroll-behavior: smooth;
- --screen-size-small: 30em; /* breakpoint reference only */
- }
- @keyframes intro {
- 0% { opacity: 0 } 100% { opacity: 1 }
- }
- .blur-up {
- -webkit-filter: blur(5px);
- filter: blur(5px);
- transition: filter 400ms, -webkit-filter 400ms;
- }
- .blur-up.lazyloaded {
- -webkit-filter: blur(0);
- filter: blur(0);
- }
- .hack .readmore {
- margin-bottom: 2.2em;
- }
- .responsive-iframe {
- position: relative;
- padding-bottom: 56.25%; /* 16:9 */
- padding-top: 25px;
- height: 0;
- }
- .responsive-iframe iframe {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
- iframe {
- border: 0;
- }
- main, footer {
- animation: intro 0.3s both;
- animation-delay: 0.15s;
- }
- header:first-of-type + details {
- margin-top: 1rem;
- }
- footer time[datetime$="M"]:before {
- content: "\2013\0020";
- }
- body > footer p.muted {
- margin-bottom: 0;
- }
- @media only screen and (max-width: 768px) {
- footer time[datetime$="M"] {
- display: none;
- }
- }
- blockquote cite {
- display: block;
- }
- blockquote cite::before {
- content: "\2014\00A0";
- }
- :target {
- filter: brightness(1.2);
- }
- :disabled {
- cursor: not-allowed;
- }
- #search-app [v-cloak] {
- display: none;
- }
- /* hack.css overrides and enhancements */
- .hack li ul {
- margin: 0;
- }
- .hack ol li {
- padding-left: 27px;
- }
- .main {
- padding: 20px 10px;
- }
- input.form-control {
- border-radius: 0;
- background-color: transparent;
- -webkit-appearance: none;
- -moz-appearance: none;
- -ms-appearance: none;
- }
- input.form-control,
- textarea.form-control,
- select.form-control,
- .help-block {
- font-size: initial;
- }
- @media only screen and (max-width: 768px) {
- .help-block {
- font-size: unset;
- }
- }
- html {
- font-size: 13px;
- }
- .hack .form input,
- .hack .form textarea,
- .hack .form button,
- .hack .form label {
- font-size: 1rem;
- }
- .hack .alert .highlight:first-of-type .chroma,
- .hack .card .highlight:first-of-type .chroma {
- margin-top: unset;
- }
- .hack .alert .highlight:last-of-type .chroma,
- .hack .card .highlight:last-of-type .chroma {
- margin-bottom: unset;
- }
- .hack blockquote,
- .hack blockquote:after {
- line-height: 1.5;
- }
- .hack figure {
- margin: unset;
- }
- .hack figure a {
- border-bottom: none;
- }
- .hack figure a:hover {
- background-color: inherit;
- }
- article [itemprop="description"] {
- margin-bottom: 20px;
- margin-top: 20px;
- }
- article header img {
- width: 100%;
- border-radius: 3px;
- }
- table td, table th {
- line-height: inherit;
- }
- table a {
- border-bottom: unset;
- }
- img {
- max-width: 100%;
- }
- @media only screen and (min-width: 768px) {
- html {
- font-size: 16px;
- margin-left: calc(100vw - 100%);
- }
- .container {
- max-width: 50rem;
- }
- }
|