add css sources
parent
d4e480d9b4
commit
5b76fe4841
@ -0,0 +1,644 @@
|
||||
/*
|
||||
universalize.css (v1.0.2) — by Alexander Sandberg (https://alexandersandberg.com)
|
||||
------------------------------------------------------------------------------
|
||||
|
||||
Based on Sanitize.css (https://github.com/csstools/sanitize.css).
|
||||
|
||||
(all) = Used for all browsers.
|
||||
x lines = Applies to x lines down, including current line.
|
||||
|
||||
------------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
/*
|
||||
Prevent padding and border from affecting width (all)
|
||||
*/
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Inherit text decoration (all)
|
||||
2. Inherit vertical alignment (all)
|
||||
*/
|
||||
::before,
|
||||
::after {
|
||||
text-decoration: inherit; /* 1 */
|
||||
vertical-align: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Use default UI font (all)
|
||||
2. Make font size more accessible to everyone (all)
|
||||
3. Make line height consistent (all)
|
||||
4. Prevent font size adjustment after orientation changes (IE, iOS)
|
||||
5. Prevent overflow from long words (all)
|
||||
*/
|
||||
html {
|
||||
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif; /* 1 */
|
||||
font-size: 125%; /* 2 */
|
||||
line-height: 1.6; /* 3 */
|
||||
-webkit-text-size-adjust: 100%; /* 4 */
|
||||
word-break: break-word; /* 5 */
|
||||
}
|
||||
|
||||
/*
|
||||
Whitespace between content and viewport edge (all)
|
||||
*/
|
||||
body {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove inconsistent and unnecessary margins
|
||||
*/
|
||||
body, /* (all) */
|
||||
dl dl, /* (Chrome, Edge, IE, Safari) 5 lines */
|
||||
dl ol,
|
||||
dl ul,
|
||||
ol dl,
|
||||
ul dl,
|
||||
ol ol, /* (Edge 18-, IE) 4 lines */
|
||||
ol ul,
|
||||
ul ol,
|
||||
ul ul,
|
||||
button, /* (Safari) 3 lines */
|
||||
input,
|
||||
select,
|
||||
textarea { /* (Firefox, Safari) */
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Show overflow (IE18-, IE)
|
||||
2. Correct sizing (Firefox)
|
||||
*/
|
||||
hr {
|
||||
overflow: visible;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Add correct display
|
||||
*/
|
||||
main, /* (IE11) */
|
||||
details { /* (Edge 18-, IE) */
|
||||
display: block;
|
||||
}
|
||||
|
||||
summary { /* (all) */
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove style on navigation lists (all)
|
||||
*/
|
||||
nav ol,
|
||||
nav ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Use default monospace UI font (all)
|
||||
2. Correct font sizing (all)
|
||||
*/
|
||||
pre,
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family:
|
||||
/* macOS 10.10+ */ "Menlo",
|
||||
/* Windows 6+ */ "Consolas",
|
||||
/* Android 4+ */ "Roboto Mono",
|
||||
/* Ubuntu 10.10+ */ "Ubuntu Monospace",
|
||||
/* KDE Plasma 5+ */ "Noto Mono",
|
||||
/* KDE Plasma 4+ */ "Oxygen Mono",
|
||||
/* Linux/OpenOffice fallback */ "Liberation Mono",
|
||||
/* fallback */ monospace,
|
||||
/* macOS emoji */ "Apple Color Emoji",
|
||||
/* Windows emoji */ "Segoe UI Emoji",
|
||||
/* Windows emoji */ "Segoe UI Symbol",
|
||||
/* Linux emoji */ "Noto Color Emoji"; /* 1 */
|
||||
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Change cursor for <abbr> elements (all)
|
||||
2. Add correct text decoration (Edge 18-, IE, Safari)
|
||||
*/
|
||||
abbr[title] {
|
||||
cursor: help; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
-webkit-text-decoration: underline dotted;
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Add correct font weight (Chrome, Edge, Safari)
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/*
|
||||
Add correct font size (all)
|
||||
*/
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/*
|
||||
Change alignment on media elements (all)
|
||||
*/
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove border on iframes (all)
|
||||
*/
|
||||
iframe {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Change fill color to match text (all)
|
||||
*/
|
||||
svg:not([fill]) {
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
/*
|
||||
Hide overflow (IE11)
|
||||
*/
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/*
|
||||
Show overflow (Edge 18-, IE)
|
||||
*/
|
||||
button,
|
||||
input {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove inheritance of text transform (Edge 18-, Firefox, IE)
|
||||
*/
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Correct inability to style buttons (iOS, Safari)
|
||||
*/
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Fix inconsistent appearance (all)
|
||||
2. Correct padding (Firefox)
|
||||
*/
|
||||
fieldset {
|
||||
border: 1px solid #666; /* 1 */
|
||||
padding: 0.35em 0.75em 0.625em; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Correct color inheritance from <fieldset> (IE)
|
||||
2. Correct text wrapping (Edge 18-, IE)
|
||||
*/
|
||||
legend {
|
||||
color: inherit; /* 1 */
|
||||
display: table; /* 2 */
|
||||
max-width: 100%; /* 2 */
|
||||
white-space: normal; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Add correct display (Edge 18-, IE)
|
||||
2. Add correct vertical alignment (Chrome, Edge, Firefox)
|
||||
*/
|
||||
progress {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Remove default vertical scrollbar (IE)
|
||||
2. Change resize direction (all)
|
||||
*/
|
||||
textarea {
|
||||
overflow: auto; /* 1 */
|
||||
resize: vertical; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
1. Correct outline style (Safari)
|
||||
2. Correct odd appearance (Chrome, Edge, Safari)
|
||||
*/
|
||||
[type="search"] {
|
||||
outline-offset: -2px; /* 1 */
|
||||
-webkit-appearance: textfield; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Correct cursor style of increment and decrement buttons (Safari)
|
||||
*/
|
||||
::-webkit-inner-spin-button,
|
||||
::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
Correct text style (Chrome, Edge, Safari)
|
||||
*/
|
||||
::-webkit-input-placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.54;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove inner padding (Chrome, Edge, Safari on macOS)
|
||||
*/
|
||||
::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/*
|
||||
1. Inherit font properties (Safari)
|
||||
2. Correct inability to style upload buttons (iOS, Safari)
|
||||
*/
|
||||
::-webkit-file-upload-button {
|
||||
font: inherit; /* 1 */
|
||||
-webkit-appearance: button; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Remove inner border and padding of focus outlines (Firefox)
|
||||
*/
|
||||
::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Restore focus outline style (Firefox)
|
||||
*/
|
||||
:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/*
|
||||
Remove :invalid styles (Firefox)
|
||||
*/
|
||||
:-moz-ui-invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Change cursor on busy elements (all)
|
||||
*/
|
||||
[aria-busy="true"] {
|
||||
cursor: progress;
|
||||
}
|
||||
|
||||
/*
|
||||
Change cursor on control elements (all)
|
||||
*/
|
||||
[aria-controls] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
Change cursor on disabled, non-editable, or inoperable elements (all)
|
||||
*/
|
||||
[aria-disabled="true"],
|
||||
[disabled] {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/*
|
||||
Change display on visually hidden accessible elements (all)
|
||||
*/
|
||||
[aria-hidden="false"][hidden] {
|
||||
display: inline;
|
||||
display: initial;
|
||||
}
|
||||
|
||||
[aria-hidden="false"][hidden]:not(:focus) {
|
||||
clip: rect(0, 0, 0, 0);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
/*
|
||||
Print out URLs after links (all)
|
||||
*/
|
||||
@media print {
|
||||
a[href^="http"]::after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
}
|
||||
/* ----- Variables ----- */
|
||||
|
||||
/* Light mode default, dark mode if recognized as preferred */
|
||||
:root {
|
||||
--background-main: #fefefe;
|
||||
--background-element: #eee;
|
||||
--background-inverted: #282a36;
|
||||
--text-main: #1f1f1f;
|
||||
--text-alt: #333;
|
||||
--text-inverted: #fefefe;
|
||||
--border-element: #282a36;
|
||||
--theme: #7a283a;
|
||||
--theme-light: hsl(0, 25%, 65%);
|
||||
--theme-dark: hsl(0, 25%, 45%);
|
||||
}
|
||||
|
||||
/* @media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--background-main: #282a36;
|
||||
--text-main: #fefefe;
|
||||
}
|
||||
} */
|
||||
/* ----- Base ----- */
|
||||
|
||||
body {
|
||||
margin: auto;
|
||||
max-width: 36rem;
|
||||
min-height: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
/* ----- Typography ----- */
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin: 3.2rem 0 0.8em;
|
||||
}
|
||||
|
||||
/*
|
||||
Heading sizes based on a modular scale of 1.25 (all)
|
||||
*/
|
||||
h1 {
|
||||
font-size: 2.441rem;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.953rem;
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.563rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1rem;
|
||||
line-height: 1.4;
|
||||
|
||||
/* differentiate from h5, somehow. color or style? */
|
||||
}
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol,
|
||||
figure {
|
||||
margin: 0.6rem 0 1.2rem;
|
||||
}
|
||||
|
||||
/*
|
||||
Subtitles
|
||||
- Change to header h* + span instead?
|
||||
- Add support for taglines (small title above main) as well? Needs <header>:
|
||||
header > span:first-child
|
||||
*/
|
||||
h1 span,
|
||||
h2 span,
|
||||
h3 span,
|
||||
h4 span,
|
||||
h5 span,
|
||||
h6 span {
|
||||
display: block;
|
||||
font-size: 1em;
|
||||
font-style: italic;
|
||||
font-weight: normal;
|
||||
line-height: 1.3;
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
|
||||
h1 span {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
h2 span {
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
h3 span {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
h4 span {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 1em;
|
||||
opacity: 0.8; /* or some other way of differentiating it from body text */
|
||||
}
|
||||
|
||||
mark {
|
||||
background: pink; /* change to proper color, based on theme */
|
||||
}
|
||||
|
||||
/*
|
||||
Define a custom tab-size in browsers that support it.
|
||||
*/
|
||||
pre {
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
}
|
||||
|
||||
/*
|
||||
Long underlined text can be hard to read for dyslexics. Replace with bold.
|
||||
*/
|
||||
ins {
|
||||
text-decoration: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 0.3rem solid #7a283a;
|
||||
border-left: 0.3rem solid var(--theme);
|
||||
margin: 0.6rem 0 1.2rem 0;
|
||||
padding-left: 2rem;
|
||||
}
|
||||
|
||||
blockquote p {
|
||||
font-size: 1.2em;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
}
|
||||
/* ----- Layout ----- */
|
||||
|
||||
body {
|
||||
background: #fefefe;
|
||||
background: var(--background-main);
|
||||
color: #1f1f1f;
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
a {
|
||||
color: #7a283a;
|
||||
color: var(--theme);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: hsl(0, 25%, 65%);
|
||||
color: var(--theme-light);
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: hsl(0, 25%, 45%);
|
||||
color: var(--theme-dark);
|
||||
}
|
||||
|
||||
:focus {
|
||||
outline: 3px solid hsl(0, 25%, 65%);
|
||||
outline: 3px solid var(--theme-light);
|
||||
outline-offset: 3px;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
background: hsl(0, 25%, 65%);
|
||||
background: var(--theme-light);
|
||||
color: #fefefe;
|
||||
color: var(--text-inverted);
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: hsl(0, 25%, 65%);
|
||||
background: var(--theme-light);
|
||||
color: #fefefe;
|
||||
color: var(--text-inverted);
|
||||
}
|
||||
|
||||
input {
|
||||
background: #eee;
|
||||
background: var(--background-element);
|
||||
padding: 0.5rem 0.65rem;
|
||||
border-radius: 0.5rem;
|
||||
border: 2px solid #282a36;
|
||||
border: 2px solid var(--border-element);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
mark {
|
||||
background: pink; /* change to proper color, based on theme */
|
||||
padding: 0.1em 0.15em;
|
||||
}
|
||||
|
||||
kbd, /* different style for kbd? */
|
||||
code {
|
||||
background: #eee;
|
||||
padding: 0.1em 0.25em;
|
||||
border-radius: 0.2rem;
|
||||
-webkit-box-decoration-break: clone;
|
||||
box-decoration-break: clone;
|
||||
}
|
||||
|
||||
kbd > kbd {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
}
|
||||
|
||||
pre code {
|
||||
display: block;
|
||||
padding: 0.3em 0.7em;
|
||||
word-break: normal;
|
||||
overflow-x: auto;
|
||||
}
|
||||
/* ----- Forms ----- */
|
||||
/* ----- Misc ----- */
|
||||
|
||||
[tabindex="-1"]:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[aria-disabled],
|
||||
[disabled] {
|
||||
cursor: not-allowed !important;
|
||||
pointer-events: none !important;
|
||||
}
|
||||
|
||||
/*
|
||||
Style anchor links only
|
||||
*/
|
||||
a[href^='#']::after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
/*
|
||||
Skip link
|
||||
*/
|
||||
body > a:first-child {
|
||||
background: #7a283a;
|
||||
background: var(--theme);
|
||||
border-radius: 0.2rem;
|
||||
color: #fefefe;
|
||||
color: var(--text-inverted);
|
||||
padding: 0.3em 0.5em;
|
||||
position: absolute;
|
||||
top: -10rem;
|
||||
}
|
||||
|
||||
body > a:first-child:focus {
|
||||
top: 1rem;
|
||||
}
|
@ -0,0 +1,3 @@
|
||||
/* Based on gazette.css for Asciidoctor-Skins */
|
||||
/* https://github.com/darshandsoni/asciidoctor-skins */
|
||||
@import "https://fonts.googleapis.com/css?family=Source+Serif+Pro|UnifrakturMaguntia|Source+Sans+Pro";@import "asciidoctor.css";:root{--maincolor:#FFFFFF;--primarycolor:#000000;--secondarycolor:#AAAAAA;--tertiarycolor:#CCCCCC;--sidebarbackground:#FFFFFF;--linkcolor:#0D47A1;--linkcoloralternate:#B71C1C}body{font-family:"Source Serif Pro", serif;color:black}h1,h2,h3,h4,h5,h6{}h1{font-family:"Source Serif Pro", serif;font-size:24px;text-transform:uppercase}header h1{font-size:39px;font-family:"UnifrakturMaguntia", serif;border-bottom:2px solid black !important;text-transform:none}h2{font-family:"Source Serif Pro", serif;font-style:italic;font-weight:bold;text-transform:uppercase}h3{font-family:"Source Serif Pro", serif;font-style:italic;font-weight:bold}h4{font-family:'Times New Roman',Times,serif;letter-spacing:-1px;text-transform:uppercase}h5{font-family:'Times New Roman',Times,serif;letter-spacing:-1px;text-transform:uppercase}h6{font-family:"Source Serif Pro", serif;font-weight:bold}hr{border-color:black}a{text-decoration:none;color:#5A5A5A !important}a:hover{text-decoration:underline}p{font-family:"Source Serif Pro", serif !important}blockquote{}code{}mark{}cite{}pre{}img{-webkit-filter:grayscale(100%);filter:grayscale(100%)}video,audio{-webkit-filter:grayscale(100%);filter:grayscale(100%)}svg,progress,meter{-webkit-filter:grayscale(100%);filter:grayscale(100%)}th{color:black !important}td{color:black !important}video{max-width:100%}@media all and (max-width: 600px){table{width:55vw !important;font-size:3vw}
|
@ -0,0 +1,3 @@
|
||||
/* Based on medium.css for Asciidoctor-Skins */
|
||||
/* https://github.com/darshandsoni/asciidoctor-skins */
|
||||
body{font-family:Georgia,Cambria,"Times New Roman",Times,serif;font-weight:400;font-size:21px !important;line-height:1.58;letter-spacing:-.003em;margin-top:29px;width:90vh;margin:0 auto;padding-left:5vw !important}h1{margin-top:0;font-family:"Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Arial,sans-serif;font-weight:700;font-style:normal;font-size:36px;margin-left:-2.25px;line-height:1.15;letter-spacing:-.02em;color:rgba(0,0,0,.8);word-wrap:break-word}h1{border-bottom:0 !important}h2,h3,h4,h5,h6{margin-top:39px;font-family:"Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Arial,sans-serif;font-weight:300;font-style:normal;margin-left:-1.75px;line-height:1.22;letter-spacing:-.022em;color:rgba(0,0,0,.44)}h2{font-size:28px}h3{font-size:26px}h4{font-size:24px}h5{font-size:22px}h6{font-size:20px}nav{display:none}blockquote{margin-top:55px;font-family:Georgia,Cambria,"Times New Roman",Times,serif;font-weight:400;font-style:italic;font-size:28px;margin-left:-1.75px;line-height:1.48;letter-spacing:-.014em;color:rgba(0,0,0,.6);border:none;padding:0;padding-left:50px;text-align:left}blockquote:before{color:rgba(0,0,0,.6) !important}hr{margin-top:52px;margin-bottom:42px;border:0;text-align:center}hr:before{font-family:Georgia,Cambria,"Times New Roman",Times,serif;font-weight:400;font-style:italic;font-size:28px;letter-spacing:.6em;content:'...';display:inline-block;margin-left:.6em;color:rgba(0,0,0,.6);position:relative;top:-30px}a{text-decoration:none;background-image:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,.6) 50%);background-repeat:repeat-x;background-size:2px 2px;background-position:0 22px;color:inherit;background-color:transparent}a:hover{outline:0;color:inherit}p{font-size:inherit}caption,figcaption{font-style:normal !important;font-family:"Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Arial,sans-serif !important;font-weight:300 !important;font-size:13px !important;line-height:1.4 !important;color:rgba(0,0,0,.6) !important;letter-spacing:0 !important;text-align:center !important;margin-top:10px !important}caption,figcaption a:hover{outline:0;color:inherit}td{padding:21px}tfoot{font-weight:bold}img{max-width:100%}video{max-width:85vw}@media all and (max-width: 600px){table{width:55vw !important;font-size:3vw}pre{font-size:large}
|
@ -0,0 +1,3 @@
|
||||
/* Based on notebook.css for Asciidoctor-Skins by Darshan Soni */
|
||||
/* https://github.com/darshandsoni/asciidoctor-skins */
|
||||
@import "https://fonts.googleapis.com/css?family=Cabin+Sketch|Architects+Daughter";body{font-family:"Architects Daughter", sans-serif;margin-left:10%;background-color:#fff;background-image:-webkit-linear-gradient(90deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px), -webkit-linear-gradient(#eee .15em, transparent .15em);background-size:1px, auto 20px;background-repeat:repeat-y, repeat;background-position:10% 0px, 0px 0px, 0px 0px}h1,h2,h3,h4,h5,h6{font-weight:300}h1{font-size:2.75em}h2{font-size:2.3125em}h3{font-size:1.6875em}h4{font-size:1.4375em}} h4,h5{font-size:1.125em}h6{font-size:1em}h1{color:#000 !important;font-family:"Cabin Sketch",sans-serif}h2,h3,h4,h5,h6{color:#1a237e !important;font-family:"Cabin Sketch",sans-serif}.title{color:#000000 !important;font-family:"Architects Daughter",sans-serif;font-style:normal;font-weight:normal}a:hover{text-decoration:none}p{font-family:"Architects Daughter",sans-serif ! important}blockquote{color:#1a237e !important}blockquote:before{color:#000000;font-style:italic;content:"\201c";float:left;font-size:2.75em;font-weight:bold;line-height:.6em;margin-left:-.6em;text-shadow:0 1px 2px rgba(0,0,0,.1)}cite{display:block;text-align:right;color:#000000;font-style:normal}cite:before{content:'\2014 \00A0'}code{color:#1a237e;background-color:#f9a825 !important}mark{background-color:#ffd600}pre{background-color:#f9a825 !important;color:#1a237e;font-family:monospace;margin:1.5em;padding:8px;max-width:80em;border-radius:4px}table{border-collapse:collapse}th{background-color:#fff;color:#000000 !important}td{background-color:#fff;color:#000000 !important}td,th,tfoot{border-width:0 1px 1px 0;border:1px solid #dedede;padding:10px}video{max-width:100%}@media all and (max-width: 600px){table{width:55vw !important;font-size:3vw}
|
File diff suppressed because one or more lines are too long
@ -0,0 +1,199 @@
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
background: transparent !important;
|
||||
color: #000 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.85;
|
||||
}
|
||||
|
||||
p,
|
||||
.air-p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
.air-h1,
|
||||
h2,
|
||||
.air-h2,
|
||||
h3,
|
||||
.air-h3,
|
||||
h4,
|
||||
.air-h4 {
|
||||
margin: 1.414rem 0 .5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42;
|
||||
}
|
||||
|
||||
h1,
|
||||
.air-h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
.air-h2 {
|
||||
font-size: 2.827rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
.air-h3 {
|
||||
font-size: 1.999rem;
|
||||
}
|
||||
|
||||
h4,
|
||||
.air-h4 {
|
||||
font-size: 1.414rem;
|
||||
}
|
||||
|
||||
h5,
|
||||
.air-h5 {
|
||||
font-size: 1.121rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
.air-h6 {
|
||||
font-size: .88rem;
|
||||
}
|
||||
|
||||
small,
|
||||
.air-small {
|
||||
font-size: .707em;
|
||||
}
|
||||
|
||||
/* https://github.com/mrmrs/fluidity */
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,300);
|
||||
|
||||
body {
|
||||
color: #444;
|
||||
font-family: 'Open Sans', Helvetica, sans-serif;
|
||||
font-weight: 300;
|
||||
margin: 6rem auto 1rem;
|
||||
max-width: 48rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
img {
|
||||
border-radius: 50%;
|
||||
height: 200px;
|
||||
margin: 0 auto;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #3498db;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2980b9;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #fafafa;
|
||||
padding: 1rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 0;
|
||||
border-left: 5px solid #7a7a7a;
|
||||
font-style: italic;
|
||||
padding: 1.33em;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol,
|
||||
li {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #777;
|
||||
}
|
@ -0,0 +1,695 @@
|
||||
@charset "UTF-8";
|
||||
/*!
|
||||
* awsm.css v3.0.6 (https://igoradamenko.github.io/awsm.css/)
|
||||
* Copyright 2015 Igor Adamenko <mail@igoradamenko.com> (https://igoradamenko.com)
|
||||
* Licensed under MIT (https://github.com/igoradamenko/awsm.css/blob/master/LICENSE.md)
|
||||
*/
|
||||
html{
|
||||
font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "PT Sans", "Open Sans", "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size:100%;
|
||||
line-height:1.4;
|
||||
background:white;
|
||||
color:black;
|
||||
-webkit-overflow-scrolling:touch;
|
||||
}
|
||||
|
||||
body{
|
||||
margin:1.2em;
|
||||
font-size:1rem;
|
||||
}
|
||||
@media (min-width: 20rem){
|
||||
body{
|
||||
font-size:calc(1rem + 0.00625 * (100vw - 20rem));
|
||||
}
|
||||
}
|
||||
@media (min-width: 40rem){
|
||||
body{
|
||||
font-size:1.125rem;
|
||||
}
|
||||
}
|
||||
body header,
|
||||
body main,
|
||||
body footer,
|
||||
body article{
|
||||
position:relative;
|
||||
max-width:40rem;
|
||||
margin:0 auto;
|
||||
}
|
||||
body > header{
|
||||
margin-bottom:3.5em;
|
||||
}
|
||||
body > header h1{
|
||||
margin:0;
|
||||
font-size:1.5em;
|
||||
}
|
||||
body > header p{
|
||||
margin:0;
|
||||
font-size:0.85em;
|
||||
}
|
||||
body > footer{
|
||||
margin-top:6em;
|
||||
padding-bottom:1.5em;
|
||||
text-align:center;
|
||||
font-size:0.8rem;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
|
||||
nav{
|
||||
margin:1em 0;
|
||||
}
|
||||
nav ul{
|
||||
list-style:none;
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
nav li{
|
||||
display:inline-block;
|
||||
margin-right:1em;
|
||||
margin-bottom:0.25em;
|
||||
}
|
||||
nav a:visited{
|
||||
color:#0064c1;
|
||||
}
|
||||
nav a:hover{
|
||||
color:#f00000;
|
||||
}
|
||||
|
||||
ul, ol{
|
||||
margin-top:0;
|
||||
padding-top:0;
|
||||
padding-left:2.5em;
|
||||
}
|
||||
ul li + li, ol li + li{
|
||||
margin-top:0.25em;
|
||||
}
|
||||
ul li > details, ol li > details{
|
||||
margin:0;
|
||||
}
|
||||
|
||||
p{
|
||||
margin:1em 0;
|
||||
-webkit-hyphens:auto;
|
||||
-ms-hyphens:auto;
|
||||
hyphens:auto;
|
||||
}
|
||||
p:first-child{
|
||||
margin-top:0;
|
||||
}
|
||||
p:last-child{
|
||||
margin-bottom:0;
|
||||
}
|
||||
p + ul, p + ol{
|
||||
margin-top:-0.75em;
|
||||
}
|
||||
p img, p picture{
|
||||
float:right;
|
||||
margin-bottom:0.5em;
|
||||
margin-left:0.5em;
|
||||
}
|
||||
p picture img{
|
||||
float:none;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
dd{
|
||||
margin-bottom:1em;
|
||||
margin-left:0;
|
||||
padding-left:2.5em;
|
||||
}
|
||||
|
||||
dt{
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
blockquote{
|
||||
margin:0;
|
||||
padding-left:2.5em;
|
||||
}
|
||||
|
||||
aside{
|
||||
margin:0.5em 0;
|
||||
font-style:italic;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
@media (min-width: 65rem){
|
||||
aside{
|
||||
position:absolute;
|
||||
right:-12.5rem;
|
||||
width:9.375rem;
|
||||
max-width:9.375rem;
|
||||
margin:0;
|
||||
padding-left:0.5em;
|
||||
font-size:0.8em;
|
||||
border-left:1px solid #f2f2f2;
|
||||
}
|
||||
}
|
||||
aside:first-child{
|
||||
margin-top:0;
|
||||
}
|
||||
aside:last-child{
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
section + section{
|
||||
margin-top:2em;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
margin:1.25em 0 0;
|
||||
line-height:1.2;
|
||||
}
|
||||
h1:hover > a[href^="#"][id]:empty, h1:focus > a[href^="#"][id]:empty, h2:hover > a[href^="#"][id]:empty, h2:focus > a[href^="#"][id]:empty, h3:hover > a[href^="#"][id]:empty, h3:focus > a[href^="#"][id]:empty, h4:hover > a[href^="#"][id]:empty, h4:focus > a[href^="#"][id]:empty, h5:hover > a[href^="#"][id]:empty, h5:focus > a[href^="#"][id]:empty, h6:hover > a[href^="#"][id]:empty, h6:focus > a[href^="#"][id]:empty{
|
||||
opacity:1;
|
||||
}
|
||||
h1 + p, h1 + details, h2 + p, h2 + details, h3 + p, h3 + details, h4 + p, h4 + details, h5 + p, h5 + details, h6 + p, h6 + details{
|
||||
margin-top:0.5em;
|
||||
}
|
||||
h1 > a[href^="#"][id]:empty, h2 > a[href^="#"][id]:empty, h3 > a[href^="#"][id]:empty, h4 > a[href^="#"][id]:empty, h5 > a[href^="#"][id]:empty, h6 > a[href^="#"][id]:empty{
|
||||
position:absolute;
|
||||
left:-0.65em;
|
||||
opacity:0;
|
||||
text-decoration:none;
|
||||
font-weight:400;
|
||||
line-height:1;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
@media (min-width: 40rem){
|
||||
h1 > a[href^="#"][id]:empty, h2 > a[href^="#"][id]:empty, h3 > a[href^="#"][id]:empty, h4 > a[href^="#"][id]:empty, h5 > a[href^="#"][id]:empty, h6 > a[href^="#"][id]:empty{
|
||||
left:-0.8em;
|
||||
}
|
||||
}
|
||||
h1 > a[href^="#"][id]:empty:target, h1 > a[href^="#"][id]:empty:hover, h1 > a[href^="#"][id]:empty:focus, h2 > a[href^="#"][id]:empty:target, h2 > a[href^="#"][id]:empty:hover, h2 > a[href^="#"][id]:empty:focus, h3 > a[href^="#"][id]:empty:target, h3 > a[href^="#"][id]:empty:hover, h3 > a[href^="#"][id]:empty:focus, h4 > a[href^="#"][id]:empty:target, h4 > a[href^="#"][id]:empty:hover, h4 > a[href^="#"][id]:empty:focus, h5 > a[href^="#"][id]:empty:target, h5 > a[href^="#"][id]:empty:hover, h5 > a[href^="#"][id]:empty:focus, h6 > a[href^="#"][id]:empty:target, h6 > a[href^="#"][id]:empty:hover, h6 > a[href^="#"][id]:empty:focus{
|
||||
opacity:1;
|
||||
box-shadow:none;
|
||||
color:black;
|
||||
}
|
||||
h1 > a[href^="#"][id]:empty:target:focus, h2 > a[href^="#"][id]:empty:target:focus, h3 > a[href^="#"][id]:empty:target:focus, h4 > a[href^="#"][id]:empty:target:focus, h5 > a[href^="#"][id]:empty:target:focus, h6 > a[href^="#"][id]:empty:target:focus{
|
||||
outline:none;
|
||||
}
|
||||
h1 > a[href^="#"][id]:empty::before, h2 > a[href^="#"][id]:empty::before, h3 > a[href^="#"][id]:empty::before, h4 > a[href^="#"][id]:empty::before, h5 > a[href^="#"][id]:empty::before, h6 > a[href^="#"][id]:empty::before{
|
||||
content:"§ ";
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size:2.5em;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size:1.75em;
|
||||
}
|
||||
|
||||
h3{
|
||||
font-size:1.25em;
|
||||
}
|
||||
|
||||
h4{
|
||||
font-size:1.15em;
|
||||
}
|
||||
|
||||
h5{
|
||||
font-size:1em;
|
||||
}
|
||||
|
||||
h6{
|
||||
margin-top:1em;
|
||||
font-size:1em;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
|
||||
article + article{
|
||||
margin-top:4em;
|
||||
}
|
||||
article header p{
|
||||
font-size:0.6em;
|
||||
color:#aaaaaa;
|
||||
}
|
||||
article header p + h1, article header p + h2{
|
||||
margin-top:-0.25em;
|
||||
}
|
||||
article header h1 + p, article header h2 + p{
|
||||
margin-top:0.25em;
|
||||
}
|
||||
article header h1 a, article header h2 a{
|
||||
color:black;
|
||||
}
|
||||
article header h1 a:visited, article header h2 a:visited{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
article header h1 a:visited:hover, article header h2 a:visited:hover{
|
||||
color:#f00000;
|
||||
}
|
||||
article > footer{
|
||||
margin-top:1.5em;
|
||||
font-size:0.85em;
|
||||
}
|
||||
|
||||
a{
|
||||
color:#0064c1;
|
||||
}
|
||||
a:visited{
|
||||
color:#8d39d0;
|
||||
}
|
||||
a:hover, a:active{
|
||||
outline-width:0;
|
||||
}
|
||||
a:hover{
|
||||
color:#f00000;
|
||||
}
|
||||
a abbr{
|
||||
font-size:1em;
|
||||
}
|
||||
|
||||
abbr{
|
||||
margin-right:-0.075em;
|
||||
text-decoration:none;
|
||||
-webkit-hyphens:none;
|
||||
-ms-hyphens:none;
|
||||
hyphens:none;
|
||||
letter-spacing:0.075em;
|
||||
font-size:0.9em;
|
||||
}
|
||||
|
||||
img, picture{
|
||||
display:block;
|
||||
max-width:100%;
|
||||
margin:0 auto;
|
||||
}
|
||||
|
||||
audio, video{
|
||||
width:100%;
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
figure{
|
||||
margin:1em 0 0.5em;
|
||||
padding:0;
|
||||
}
|
||||
figure + p{
|
||||
margin-top:0.5em;
|
||||
}
|
||||
figure figcaption{
|
||||
opacity:0.65;
|
||||
font-size:0.85em;
|
||||
}
|
||||
|
||||
table{
|
||||
display:inline-block;
|
||||
border-spacing:0;
|
||||
border-collapse:collapse;
|
||||
overflow-x:auto;
|
||||
max-width:100%;
|
||||
text-align:left;
|
||||
vertical-align:top;
|
||||
background:linear-gradient(rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%) 0 0, linear-gradient(rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%) 100% 0;
|
||||
background-attachment:scroll, scroll;
|
||||
background-size:1px 100%, 1px 100%;
|
||||
background-repeat:no-repeat, no-repeat;
|
||||
}
|
||||
table caption{
|
||||
font-size:0.9em;
|
||||
background:white;
|
||||
}
|
||||
table td, table th{
|
||||
padding:0.35em 0.75em;
|
||||
vertical-align:top;
|
||||
font-size:0.9em;
|
||||
border:1px solid #f2f2f2;
|
||||
border-top:0;
|
||||
border-left:0;
|
||||
}
|
||||
table td:first-child, table th:first-child{
|
||||
padding-left:0;
|
||||
background-image:linear-gradient(to right, white 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-size:2px 100%;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
table td:last-child, table th:last-child{
|
||||
padding-right:0;
|
||||
border-right:0;
|
||||
background-image:linear-gradient(to left, white 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-position:100% 0;
|
||||
background-size:2px 100%;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
table td:only-child, table th:only-child{
|
||||
background-image:linear-gradient(to right, white 50%, rgba(255, 255, 255, 0) 100%), linear-gradient(to left, white 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-position:0 0, 100% 0;
|
||||
background-size:2px 100%, 2px 100%;
|
||||
background-repeat:no-repeat, no-repeat;
|
||||
}
|
||||
table th{
|
||||
line-height:1.2;
|
||||
}
|
||||
|
||||
form{
|
||||
margin-right:auto;
|
||||
margin-left:auto;
|
||||
}
|
||||
@media (min-width: 40rem){
|
||||
form{
|
||||
max-width:80%;
|
||||
}
|
||||
}
|
||||
form select, form label{
|
||||
display:block;
|
||||
}
|
||||
form label:not(:first-child){
|
||||
margin-top:1em;
|
||||
}
|
||||
form p label{
|
||||
display:inline;
|
||||
}
|
||||
form p label + label{
|
||||
margin-left:1em;
|
||||
}
|
||||
form legend:first-child + label{
|
||||
margin-top:0;
|
||||
}
|
||||
form select, form input[type], form textarea{
|
||||
margin-bottom:1em;
|
||||
}
|
||||
form input[type=checkbox], form input[type=radio]{
|
||||
margin-bottom:0;
|
||||
}
|
||||
|
||||
fieldset{
|
||||
margin:0;
|
||||
padding:0.5em 1em;
|
||||
border:1px solid #aaaaaa;
|
||||
}
|
||||
|
||||
legend{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
|
||||
button{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:inline-block;
|
||||
width:auto;
|
||||
background:#f2f2f2;
|
||||
color:black;
|
||||
cursor:pointer;
|
||||
}
|
||||
button:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
button:not([disabled]):hover{
|
||||
border:1px solid black;
|
||||
}
|
||||
button:active{
|
||||
background-color:#aaaaaa;
|
||||
}
|
||||
button[disabled]{
|
||||
color:#aaaaaa;
|
||||
cursor:not-allowed;
|
||||
}
|
||||
|
||||
select{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:inline-block;
|
||||
width:auto;
|
||||
background:#f2f2f2;
|
||||
color:black;
|
||||
cursor:pointer;
|
||||
padding-right:1.2em;
|
||||
background-position:top 55% right 0.35em;
|
||||
background-size:0.5em;
|
||||
background-repeat:no-repeat;
|
||||
-webkit-appearance:none;
|
||||
-moz-appearance:none;
|
||||
appearance:none;
|
||||
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Cpath fill='rgb(170, 170, 170)' fill-rule='nonzero' d='M1.5 2L3 0H0z'/%3E%3C/svg%3E");
|
||||
}
|
||||
select:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
select:not([disabled]):hover{
|
||||
border:1px solid black;
|
||||
}
|
||||
select:active{
|
||||
background-color:#aaaaaa;
|
||||
}
|
||||
select[disabled]{
|
||||
color:#aaaaaa;
|
||||
cursor:not-allowed;
|
||||
}
|
||||
select:focus, select:hover{
|
||||
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Cpath fill='rgb(0, 0, 0)' fill-rule='nonzero' d='M1.5 2L3 0H0z'/%3E%3C/svg%3E");
|
||||
}
|
||||
|
||||
input[type=text], input[type=password], input[type^=date], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=month], input[type=week], input[type=url]{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:block;
|
||||
width:100%;
|
||||
line-height:calc(2em - 1px * 2 - (.25em - 1px) * 2);
|
||||
-webkit-appearance:none;
|
||||
-moz-appearance:none;
|
||||
appearance:none;
|
||||
}
|
||||
input[type=text]:focus, input[type=password]:focus, input[type^=date]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=time]:focus, input[type=month]:focus, input[type=week]:focus, input[type=url]:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=text]::-moz-placeholder, input[type=password]::-moz-placeholder, input[type^=date]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=number]::-moz-placeholder, input[type=search]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=time]::-moz-placeholder, input[type=month]::-moz-placeholder, input[type=week]::-moz-placeholder, input[type=url]::-moz-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=text]::-webkit-input-placeholder, input[type=password]::-webkit-input-placeholder, input[type^=date]::-webkit-input-placeholder, input[type=email]::-webkit-input-placeholder, input[type=number]::-webkit-input-placeholder, input[type=search]::-webkit-input-placeholder, input[type=tel]::-webkit-input-placeholder, input[type=time]::-webkit-input-placeholder, input[type=month]::-webkit-input-placeholder, input[type=week]::-webkit-input-placeholder, input[type=url]::-webkit-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=text]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder, input[type^=date]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=number]:-ms-input-placeholder, input[type=search]:-ms-input-placeholder, input[type=tel]:-ms-input-placeholder, input[type=time]:-ms-input-placeholder, input[type=month]:-ms-input-placeholder, input[type=week]:-ms-input-placeholder, input[type=url]:-ms-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=submit], input[type=button], input[type=reset]{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:inline-block;
|
||||
width:auto;
|
||||
background:#f2f2f2;
|
||||
color:black;
|
||||
cursor:pointer;
|
||||
-webkit-appearance:none;
|
||||
-moz-appearance:none;
|
||||
appearance:none;
|
||||
}
|
||||
input[type=submit]:focus, input[type=button]:focus, input[type=reset]:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=submit]:not([disabled]):hover, input[type=button]:not([disabled]):hover, input[type=reset]:not([disabled]):hover{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=submit]:active, input[type=button]:active, input[type=reset]:active{
|
||||
background-color:#aaaaaa;
|
||||
}
|
||||
input[type=submit][disabled], input[type=button][disabled], input[type=reset][disabled]{
|
||||
color:#aaaaaa;
|
||||
cursor:not-allowed;
|
||||
}
|
||||
input[type=color]{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:block;
|
||||
width:100%;
|
||||
line-height:calc(2em - 1px * 2 - (.25em - 1px) * 2);
|
||||
-webkit-appearance:none;
|
||||
-moz-appearance:none;
|
||||
appearance:none;
|
||||
width:6em;
|
||||
}
|
||||
input[type=color]:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=color]::-moz-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=color]::-webkit-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=color]:-ms-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
input[type=color]:hover{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=file]{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:inline-block;
|
||||
width:auto;
|
||||
background:#f2f2f2;
|
||||
color:black;
|
||||
cursor:pointer;
|
||||
display:block;
|
||||
width:100%;
|
||||
height:auto;
|
||||
padding:0.75em 0.5em;
|
||||
font-size:12px;
|
||||
line-height:1;
|
||||
}
|
||||
input[type=file]:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=file]:not([disabled]):hover{
|
||||
border:1px solid black;
|
||||
}
|
||||
input[type=file]:active{
|
||||
background-color:#aaaaaa;
|
||||
}
|
||||
input[type=file][disabled]{
|
||||
color:#aaaaaa;
|
||||
cursor:not-allowed;
|
||||
}
|
||||
input[type=checkbox], input[type=radio]{
|
||||
margin:-0.2em 0.75em 0 0;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
textarea{
|
||||
outline:none;
|
||||
box-sizing:border-box;
|
||||
height:2em;
|
||||
margin:0;
|
||||
padding:calc(.25em - 1px) 0.5em;
|
||||
font-family:inherit;
|
||||
font-size:1em;
|
||||
border:1px solid #aaaaaa;
|
||||
border-radius:2px;
|
||||
background:white;
|
||||
color:black;
|
||||
display:block;
|
||||
width:100%;
|
||||
line-height:calc(2em - 1px * 2 - (.25em - 1px) * 2);
|
||||
-webkit-appearance:none;
|
||||
-moz-appearance:none;
|
||||
appearance:none;
|
||||
height:4.5em;
|
||||
resize:vertical;
|
||||
padding-top:0.5em;
|
||||
padding-bottom:0.5em;
|
||||
}
|
||||
textarea:focus{
|
||||
border:1px solid black;
|
||||
}
|
||||
textarea::-moz-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
textarea::-webkit-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
textarea:-ms-input-placeholder{
|
||||
color:#aaaaaa;
|
||||
}
|
||||
|
||||
output{
|
||||
display:block;
|
||||
}
|
||||
|
||||
code, kbd, var, samp{
|
||||
font-family:Consolas, "Lucida Console", Monaco, monospace;
|
||||
font-style:normal;
|
||||
}
|
||||
|
||||
pre{
|
||||
overflow-x:auto;
|
||||
font-size:0.8em;
|
||||
background:linear-gradient(rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%) 0 0, linear-gradient(rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%) 100% 0;
|
||||
background-attachment:scroll, scroll;
|
||||
background-size:1px 100%, 1px 100%;
|
||||
background-repeat:no-repeat, no-repeat;
|
||||
}
|
||||
pre > code{
|
||||
display:inline-block;
|
||||
overflow-x:visible;
|
||||
box-sizing:border-box;
|
||||
min-width:100%;
|
||||
border-right:3px solid white;
|
||||
border-left:1px solid white;
|
||||
}
|
||||
|
||||
hr{
|
||||
height:1px;
|
||||
margin:2em 0;
|
||||
border:0;
|
||||
background:#f2f2f2;
|
||||
}
|
||||
|
||||
details{
|
||||
margin:1em 0;
|
||||
}
|
||||
details[open]{
|
||||
padding-bottom:0.5em;
|
||||
border-bottom:1px solid #f2f2f2;
|
||||
}
|
||||
|
||||
summary{
|
||||
display:inline-block;
|
||||
font-weight:700;
|
||||
border-bottom:1px dashed;
|
||||
cursor:pointer;
|
||||
}
|
||||
summary::-webkit-details-marker{
|
||||
display:none;
|
||||
}
|
||||
|
||||
noscript{
|
||||
color:#d00000;
|
||||
}
|
||||
|
||||
::selection{
|
||||
background:rgba(0, 100, 193, 0.25);
|
||||
}
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,4 @@
|
||||
/* CaiuSS CSS Framework by Ionică Bizău
|
||||
* https://github.com/IonicaBizau/CaiuSS
|
||||
* */
|
||||
@import "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,latin-ext"; html,body{margin:0;background-color:#fff} html,body,button{font-family:"Open Sans",sans-serif} html,body,input,textarea{color:#2c3e50} .container{width:960px;max-width:100%;margin:0 auto} h6{font-size:.5em} h5{font-size:.6em} h4{font-size:.75em} h3{font-size:1em} h2{font-size:1.5em} h1{font-size:3em} .btn{margin-right:3px;margin-top:10px;display:inline-block;white-space:nowrap;padding:8px 20px;border-width:1px;border-style:solid;cursor:pointer;color:#2c3e50;border-radius:4px;font-weight:bold;-webkit-transition:background-color .5s ease-in;-moz-transition:background-color .5s ease-in;-o-transition:background-color .5s ease-in;-ms-transition:background-color .5s ease-in;transition:background-color .5s ease-in;text-decoration:none} .bg-black,.bg-gray,.bg-red,.bg-orange,.bg-green,.bg-blue,.bg-purple{color:#ecf0f1} .btn.bg-black{border-color:#2c3e50} .btn.bg-gray{border-color:#7f8c8d} .btn.bg-red{border-color:#c0392b} .btn.bg-orange{border-color:#d35400} .btn.bg-yellow{border-color:#f39c12} .btn.bg-green{border-color:#27ae60} .btn.bg-blue{border-color:#2980b9} .btn.bg-purple{border-color:#8e44ad} .btn.bg-white{border-color:#bdc3c7} .bg-black{background-color:#34495e} .bg-gray{background-color:#95a5a6} .bg-red{background-color:#e74c3c} .bg-orange{background-color:#d35400} .bg-yellow{background-color:#f1c40f} .bg-green{background-color:#2ecc71} .bg-blue{background-color:#3498db} .bg-purple{background-color:#9b59b6} .bg-white{background-color:#ecf0f1} .btn.bg-black:hover{background-color:#46627f} .btn.bg-gray:hover{background-color:#b1bdbd} .btn.bg-red:hover{background-color:#ed7669} .btn.bg-orange:hover{background-color:#eb9950} .btn.bg-yellow:hover{background-color:#f4d03f} .btn.bg-green:hover{background-color:#54d98c} .btn.bg-blue:hover{background-color:#5faee3} .btn.bg-purple:hover{background-color:#b07cc6} .btn.bg-white:hover{background-color:#fff} .img{background-color:#ecf0f1;border:1px solid #bdc3c7;padding:3px;max-width:100%} .table{border-collapse:collapse;border:1px solid #587ca0} .table td,.table th{border:1px solid #587ca0;padding:5px 12px} .table{border-radius:4px} .form-elm{padding:10px;margin:5px 0;border-radius:4px;border:1px solid #bdc3c7;outline:none} .form-elm:focus{border:1px solid #98afc6} .pad-xs{padding:5px} .pad-s{padding:10px} .pad-l{padding:15px} .pad-xl{padding:20px} .mrg-xs{margin:5px} .mrg-s{margin:10px} .mrg-l{margin:15px} .mrg-xl{margin:20px} .text-center{text-align:center} .text-right{text-align:right} .text-left{text-align:left} .text-justify{text-align:justify} a:not(.btn){color:#2ecc71;font-weight:bold;text-decoration:none;-webkit-transition:color .5s linear;-moz-transition:color .5s linear;-o-transition:color .5s linear;-ms-transition:color .5s linear;transition:color .5s linear} a:not(.btn):hover{color:#fbfefc}
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,998 @@
|
||||
/*! chota.css v0.8.0 | MIT License | github.com/jenil/chota */
|
||||
:root {
|
||||
--bg-color: #ffffff;
|
||||
--bg-secondary-color: #f3f3f6;
|
||||
--color-primary: #14854F;
|
||||
--color-lightGrey: #d2d6dd;
|
||||
--color-grey: #747681;
|
||||
--color-darkGrey: #3f4144;
|
||||
--color-error: #d43939;
|
||||
--color-success: #28bd14;
|
||||
--grid-maxWidth: 120rem;
|
||||
--grid-gutter: 2rem;
|
||||
--font-size: 1.6rem;
|
||||
--font-color: #333333;
|
||||
--font-family-sans: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next",
|
||||
"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
|
||||
"Droid Sans", "Helvetica Neue", sans-serif;
|
||||
--font-family-mono: monaco, "Consolas", "Lucida Console", monospace;
|
||||
}
|
||||
html {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
font-size: 62.5%;
|
||||
line-height: 1.15;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
*, *:before, *:after {
|
||||
-webkit-box-sizing: inherit;
|
||||
box-sizing: inherit;
|
||||
}
|
||||
body {
|
||||
background-color: var(--bg-color);
|
||||
line-height: 1.6;
|
||||
font-size: var(--font-size);
|
||||
color: var(--font-color);
|
||||
font-family: "Segoe UI", "Helvetica Neue", sans-serif; /*fallback*/
|
||||
font-family: var(--font-family-sans);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 500;
|
||||
margin: 0.35em 0 0.7em 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
h2 {
|
||||
font-size: 1.75em;
|
||||
}
|
||||
h3 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
h4 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
h5 {
|
||||
font-size: 1em;
|
||||
}
|
||||
h6 {
|
||||
font-size: 0.85em;
|
||||
}
|
||||
a {
|
||||
color: var(--color-primary);
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover:not(.button) {
|
||||
opacity: 0.75;
|
||||
}
|
||||
button {
|
||||
font-family: inherit;
|
||||
}
|
||||
p {
|
||||
margin-top: 0;
|
||||
}
|
||||
blockquote {
|
||||
background-color: var(--bg-secondary-color);
|
||||
padding: 1.5rem 2rem;
|
||||
border-left: 3px solid var(--color-lightGrey);
|
||||
}
|
||||
dl dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
hr {
|
||||
border: none;
|
||||
background-color: var(--color-lightGrey);
|
||||
height: 1px;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
text-align: left;
|
||||
}
|
||||
table.striped tr:nth-of-type(2n) {
|
||||
background-color: var(--bg-secondary-color);
|
||||
}
|
||||
td,
|
||||
th {
|
||||
vertical-align: middle;
|
||||
padding: 1.2rem 0.4rem;
|
||||
}
|
||||
thead {
|
||||
border-bottom: 2px solid var(--color-lightGrey);
|
||||
}
|
||||
tfoot {
|
||||
border-top: 2px solid var(--color-lightGrey);
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp,
|
||||
tt {
|
||||
font-family: var(--font-family-mono);
|
||||
}
|
||||
code,
|
||||
kbd {
|
||||
padding: 0 0.4rem;
|
||||
font-size: 90%;
|
||||
white-space: pre-wrap;
|
||||
border-radius: 4px;
|
||||
padding: 0.2em 0.4em;
|
||||
background-color: var(--bg-secondary-color);
|
||||
color: var(--color-error);
|
||||
}
|
||||
pre {
|
||||
background-color: var(--bg-secondary-color);
|
||||
font-size: 1em;
|
||||
padding: 1rem;
|
||||
overflow-x: auto;
|
||||
}
|
||||
pre code {
|
||||
background: none;
|
||||
padding: 0;
|
||||
}
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
text-decoration: underline;
|
||||
-webkit-text-decoration: underline dotted;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
fieldset {
|
||||
border: 1px solid var(--color-lightGrey);
|
||||
}
|
||||
iframe {
|
||||
border: 0;
|
||||
}
|
||||
.container {
|
||||
max-width: var(--grid-maxWidth);
|
||||
margin: 0 auto;
|
||||
width: 96%;
|
||||
padding: 0 calc(var(--grid-gutter) / 2);
|
||||
}
|
||||
.row {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-flow: row wrap;
|
||||
flex-flow: row wrap;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
margin-left: calc(var(--grid-gutter) / -2);
|
||||
margin-right: calc(var(--grid-gutter) / -2);
|
||||
}
|
||||
.row.reverse {
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: reverse;
|
||||
-ms-flex-direction: row-reverse;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
.col {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
.col,
|
||||
[class*=" col-"],
|
||||
[class^='col-'] {
|
||||
margin: 0 calc(var(--grid-gutter) / 2) calc(var(--grid-gutter) / 2);
|
||||
}
|
||||
.col-1 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/1)) - var(--grid-gutter));
|
||||
}
|
||||
.col-2 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/2)) - var(--grid-gutter));
|
||||
}
|
||||
.col-3 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/3)) - var(--grid-gutter));
|
||||
}
|
||||
.col-4 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/4)) - var(--grid-gutter));
|
||||
}
|
||||
.col-5 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/5)) - var(--grid-gutter));
|
||||
}
|
||||
.col-6 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/6)) - var(--grid-gutter));
|
||||
}
|
||||
.col-7 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/7)) - var(--grid-gutter));
|
||||
}
|
||||
.col-8 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/8)) - var(--grid-gutter));
|
||||
}
|
||||
.col-9 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/9)) - var(--grid-gutter));
|
||||
}
|
||||
.col-10 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/10)) - var(--grid-gutter));
|
||||
}
|
||||
.col-11 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/11)) - var(--grid-gutter));
|
||||
}
|
||||
.col-12 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/12)) - var(--grid-gutter));
|
||||
}
|
||||
@media screen and (max-width: 599px) {
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.col,
|
||||
[class*="col-"],
|
||||
[class^='col-'] {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 1 100%;
|
||||
flex: 0 1 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 900px) {
|
||||
.col-1-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/1)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-2-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/2)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-3-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/3)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-4-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/4)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-5-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/5)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-6-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/6)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-7-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/7)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-8-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/8)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-9-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/9)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-10-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/10)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-11-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/11)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-12-md {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/12)) - var(--grid-gutter));
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1200px) {
|
||||
.col-1-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/1)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/1)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-2-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/2)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/2)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-3-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/3)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/3)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-4-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/4)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/4)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-5-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/5)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/5)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-6-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/6)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/6)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-7-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/7)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/7)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-8-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/8)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/8)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-9-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/9)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/9)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-10-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/10)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/10)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-11-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/11)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/11)) - var(--grid-gutter));
|
||||
}
|
||||
|
||||
.col-12-lg {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
flex: 0 0 calc((100% / (12/12)) - var(--grid-gutter));
|
||||
max-width: calc((100% / (12/12)) - var(--grid-gutter));
|
||||
}
|
||||
}
|
||||
fieldset {
|
||||
padding: 0.5rem 2rem;
|
||||
}
|
||||
legend {
|
||||
text-transform: uppercase;
|
||||
font-size: 0.8em;
|
||||
letter-spacing: 0.1rem;
|
||||
}
|
||||
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]),
|
||||
select,
|
||||
textarea,
|
||||
textarea[type="text"] {
|
||||
font-family: inherit;
|
||||
padding: 0.8rem 1rem;
|
||||
border-radius: 4px;
|
||||
border: 1px solid var(--color-lightGrey);
|
||||
font-size: 1em;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]):not(:disabled):hover,
|
||||
select:hover,
|
||||
textarea:hover,
|
||||
textarea[type="text"]:hover {
|
||||
border-color: var(--color-grey);
|
||||
}
|
||||
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]):focus,
|
||||
select:focus,
|
||||
textarea:focus,
|
||||
textarea[type="text"]:focus {
|
||||
outline: none;
|
||||
border-color: var(--color-primary);
|
||||
-webkit-box-shadow: 0 0 1px var(--color-primary);
|
||||
box-shadow: 0 0 1px var(--color-primary);
|
||||
}
|
||||
input.error:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]),
|
||||
textarea.error {
|
||||
border-color: var(--color-error);
|
||||
}
|
||||
input.success:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="color"]):not([type="button"]):not([type="reset"]),
|
||||
textarea.success {
|
||||
border-color: var(--color-success);
|
||||
}
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
background: #f3f3f6 no-repeat 100%;
|
||||
background-size: 1ex;
|
||||
background-origin: content-box;
|
||||
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='40' fill='%23555'><polygon points='0,0 60,0 30,40'/></svg>");
|
||||
}
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
}
|
||||
/* BUTTONS */
|
||||
.button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"],
|
||||
button {
|
||||
padding: 1rem 2.5rem;
|
||||
color: var(--color-darkGrey);
|
||||
background: var(--color-lightGrey);
|
||||
border-radius: 4px;
|
||||
border: 1px solid transparent;
|
||||
font-size: var(--font-size);
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
-webkit-transition: opacity 0.2s ease;
|
||||
transition: opacity 0.2s ease;
|
||||
text-decoration: none;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
.grouped {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
}
|
||||
.grouped > *:not(:last-child) {
|
||||
margin-right: 16px;
|
||||
}
|
||||
.grouped.gapless > * {
|
||||
margin: 0 0 0 -1px !important;
|
||||
border-radius:0 !important;
|
||||
}
|
||||
.grouped.gapless > *:first-child {
|
||||
margin: 0 !important;
|
||||
border-radius:4px 0 0 4px !important;
|
||||
}
|
||||
.grouped.gapless > *:last-child {
|
||||
border-radius:0 4px 4px 0 !important;
|
||||
}
|
||||
.button + .button {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
.button:hover,
|
||||
[type="button"]:hover,
|
||||
[type="reset"]:hover,
|
||||
[type="submit"]:hover,
|
||||
button:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
.button:active,
|
||||
[type="button"]:active,
|
||||
[type="reset"]:active,
|
||||
[type="submit"]:active,
|
||||
button:active {
|
||||
-webkit-transform: scale(0.98);
|
||||
transform: scale(0.98);
|
||||
}
|
||||
input:disabled,
|
||||
button:disabled,
|
||||
input:disabled:hover,
|
||||
button:disabled:hover {
|
||||
opacity: 0.4;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.button.primary,
|
||||
.button.secondary,
|
||||
.button.dark,
|
||||
.button.error,
|
||||
.button.success,
|
||||
[type="submit"] {
|
||||
color: #fff;
|
||||
z-index: 1; /* hightlight from other button's border when grouped */
|
||||
background-color: #000;
|
||||
background-color: var(--color-primary);
|
||||
}
|
||||
.button.secondary {
|
||||
background-color: var(--color-grey);
|
||||
}
|
||||
.button.dark {
|
||||
background-color: var(--color-darkGrey);
|
||||
}
|
||||
.button.error {
|
||||
background-color: var(--color-error);
|
||||
}
|
||||
.button.success {
|
||||
background-color: var(--color-success);
|
||||
}
|
||||
.button.outline {
|
||||
background-color: transparent;
|
||||
border-color: var(--color-lightGrey);
|
||||
}
|
||||
.button.outline.primary {
|
||||
border-color: var(--color-primary);
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.button.outline.secondary {
|
||||
border-color: var(--color-grey);
|
||||
color: var(--color-grey);
|
||||
}
|
||||
.button.outline.dark {
|
||||
border-color: var(--color-darkGrey);
|
||||
color: var(--color-darkGrey);
|
||||
}
|
||||
.button.clear {
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.button.icon {
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
.button.icon > img {
|
||||
margin-left: 2px;
|
||||
}
|
||||
.button.icon-only {
|
||||
padding: 1rem;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: #bdbfc4;
|
||||
}
|
||||
::-moz-placeholder {
|
||||
color: #bdbfc4;
|
||||
}
|
||||
:-ms-input-placeholder {
|
||||
color: #bdbfc4;
|
||||
}
|
||||
::-ms-input-placeholder {
|
||||
color: #bdbfc4;
|
||||
}
|
||||
::placeholder {
|
||||
color: #bdbfc4;
|
||||
}
|
||||
.nav {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
min-height: 5rem;
|
||||
-webkit-box-align: stretch;
|
||||
-ms-flex-align: stretch;
|
||||
align-items: stretch;
|
||||
}
|
||||
.nav img {
|
||||
max-height: 3rem;
|
||||
}
|
||||
.nav>.container {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
}
|
||||
.nav-center,
|
||||
.nav-left,
|
||||
.nav-right {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
.nav-left {
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.nav-right {
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.nav-center {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
.nav,
|
||||
.nav>.container {
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.nav-center,
|
||||
.nav-left,
|
||||
.nav-right {
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.nav a,
|
||||
.nav .brand {
|
||||
text-decoration: none;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
padding: 1rem 2rem;
|
||||
color: var(--color-darkGrey);
|
||||
}
|
||||
.nav .active:not(.button) {
|
||||
color: #000; /* fallback */
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.nav .brand {
|
||||
font-size: 1.75em;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.nav .brand img {
|
||||
padding-right: 1rem;
|
||||
}
|
||||
.nav .button {
|
||||
margin: auto 1rem;
|
||||
}
|
||||
.card {
|
||||
padding: 1rem 2rem;
|
||||
border-radius: 4px;
|
||||
background: var(--bg-color);
|
||||
-webkit-box-shadow: 0 1px 3px var(--color-grey);
|
||||
box-shadow: 0 1px 3px var(--color-grey);
|
||||
}
|
||||
.card p:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
.card header > * {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.tabs {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
}
|
||||
.tabs a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.tabs > .dropdown > summary,
|
||||
.tabs > a {
|
||||
padding: 1rem 2rem;
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 1 auto;
|
||||
flex: 0 1 auto;
|
||||
color: var(--color-darkGrey);
|
||||
border-bottom: 2px solid var(--color-lightGrey);
|
||||
text-align: center;
|
||||
}
|
||||
.tabs > a.active,
|
||||
.tabs > a:hover {
|
||||
opacity: 1;
|
||||
border-bottom: 2px solid var(--color-darkGrey);
|
||||
}
|
||||
.tabs > a.active {
|
||||
border-color: var(--color-primary);
|
||||
}
|
||||
.tabs.is-full a {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 1 auto;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.tag {
|
||||
display: inline-block;
|
||||
border: 1px solid var(--color-lightGrey);
|
||||
text-transform: uppercase;
|
||||
color: var(--color-grey);
|
||||
padding: 0.5rem;
|
||||
line-height: 1;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.tag.is-small {
|
||||
padding: 0.4rem;
|
||||
font-size: 0.75em;
|
||||
}
|
||||
.tag.is-large {
|
||||
padding: 0.7rem;
|
||||
font-size: 1.125em;
|
||||
}
|
||||
.tag+.tag {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
details.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
details.dropdown > :last-child {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
/* Colors */
|
||||
.bg-primary {
|
||||
background-color: var(--color-primary) !important;
|
||||
}
|
||||
.bg-light {
|
||||
background-color: var(--color-lightGrey) !important;
|
||||
}
|
||||
.bg-dark {
|
||||
background-color: var(--color-darkGrey) !important;
|
||||
}
|
||||
.bg-grey {
|
||||
background-color: var(--color-grey) !important;
|
||||
}
|
||||
.bg-error {
|
||||
background-color: var(--color-error) !important;
|
||||
}
|
||||
.bg-success {
|
||||
background-color: var(--color-success) !important;
|
||||
}
|
||||
.bd-primary {
|
||||
border: 1px solid var(--color-primary) !important;
|
||||
}
|
||||
.bd-light {
|
||||
border: 1px solid var(--color-lightGrey) !important;
|
||||
}
|
||||
.bd-dark {
|
||||
border: 1px solid var(--color-darkGrey) !important;
|
||||
}
|
||||
.bd-grey {
|
||||
border: 1px solid var(--color-grey) !important;
|
||||
}
|
||||
.bd-error {
|
||||
border: 1px solid var(--color-error) !important;
|
||||
}
|
||||
.bd-success {
|
||||
border: 1px solid var(--color-success) !important;
|
||||
}
|
||||
.text-primary {
|
||||
color: var(--color-primary) !important;
|
||||
}
|
||||
.text-light {
|
||||
color: var(--color-lightGrey) !important;
|
||||
}
|
||||
.text-dark {
|
||||
color: var(--color-darkGrey) !important;
|
||||
}
|
||||
.text-grey {
|
||||
color: var(--color-grey) !important;
|
||||
}
|
||||
.text-error {
|
||||
color: var(--color-error) !important;
|
||||
}
|
||||
.text-success {
|
||||
color: var(--color-success) !important;
|
||||
}
|
||||
.text-white {
|
||||
color: #fff !important;
|
||||
}
|
||||
/* Position & alignment */
|
||||
.pull-right {
|
||||
float: right !important;
|
||||
}
|
||||
.pull-left {
|
||||
float: left !important;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
.text-justify {
|
||||
text-align: justify;
|
||||
}
|
||||
.text-uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.text-lowercase {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
.text-capitalize {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.is-full-screen {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.is-full-width {
|
||||
width: 100% !important;
|
||||
}
|
||||
.is-vertical-align {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
.is-horizontal-align {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.is-center {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.is-right {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: end;
|
||||
-ms-flex-pack: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.is-left {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.is-fixed {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
.is-paddingless {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.is-marginless {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.is-pointer {
|
||||
cursor: pointer !important;
|
||||
}
|
||||
.is-rounded {
|
||||
border-radius: 100%;
|
||||
}
|
||||
.clearfix {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
.is-hidden {
|
||||
display: none !important;
|
||||
}
|
||||
@media screen and (max-width: 599px) {
|
||||
.hide-xs {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 600px) and (max-width: 899px) {
|
||||
.hide-sm {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 900px) and (max-width: 1199px) {
|
||||
.hide-md {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 1200px) {
|
||||
.hide-lg {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
.hide-pr {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
@ -0,0 +1,827 @@
|
||||
@charset "UTF-8";
|
||||
@import url("https://fonts.googleapis.com/css?family=Roboto");
|
||||
html {
|
||||
font-family: Roboto, sans-serif;
|
||||
background-color: #F5F5F5;
|
||||
font-size: 10px;
|
||||
box-sizing: border-box;
|
||||
zoom: 120%;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: inherit;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
a, a[xx] {
|
||||
background-color: transparent;
|
||||
color: #3F51B5;
|
||||
text-weight: bold;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
z-index: 1;
|
||||
}
|
||||
a:active, a[xx]:active {
|
||||
outline: 0;
|
||||
}
|
||||
a:hover, a[xx]:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h1, h1[xx] {
|
||||
margin: 0 5% 2rem;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
|
||||
font-weight: 200;
|
||||
font-size: 4rem;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -1px;
|
||||
margin-top: 50px;
|
||||
text-align: center;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
h2, h2[xx] {
|
||||
margin: 5px 5% 0 5%;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
|
||||
font-weight: 200;
|
||||
font-size: 3rem;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -.05rem;
|
||||
}
|
||||
|
||||
h3, h3[xx] {
|
||||
margin: 5px 5% 0 5%;
|
||||
font-weight: 200;
|
||||
font-size: 2.5rem;
|
||||
line-height: 1.3;
|
||||
letter-spacing: -.05rem;
|
||||
}
|
||||
|
||||
h4, h4[xx] {
|
||||
margin: 5px 5% 0 5%;
|
||||
font-weight: 200;
|
||||
font-size: 2rem;
|
||||
line-height: 1.3;
|
||||
letter-spacing: -.05rem;
|
||||
}
|
||||
|
||||
h5, h5[xx] {
|
||||
margin: 5px 5% 0 5%;
|
||||
font-weight: 200;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.5;
|
||||
letter-spacing: 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h6, h6[xx] {
|
||||
margin: 5px 5% 0 5%;
|
||||
font-weight: 200;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.5;
|
||||
letter-spacing: 0;
|
||||
text-transform: uppercase;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
img, img[xx] {
|
||||
border: 0;
|
||||
margin: 20px 5% 10px 5%;
|
||||
height: auto;
|
||||
max-width: 90%;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
background-color: #3F51B5;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: #3F51B5;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
:after {
|
||||
box-sizing: inherit;
|
||||
position: relative;
|
||||
transition: all .3s ease-in-out;
|
||||
}
|
||||
|
||||
:before {
|
||||
box-sizing: inherit;
|
||||
position: relative;
|
||||
transition: all .3s ease-in-out;
|
||||
}
|
||||
|
||||
:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #000;
|
||||
margin: 0;
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.8;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
form {
|
||||
background-color: #FFF;
|
||||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
border-radius: 2px;
|
||||
margin: 7%;
|
||||
padding: 8%;
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 7%;
|
||||
padding: 8%;
|
||||
width: 86%;
|
||||
background-color: #FFF;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
text-align: left;
|
||||
}
|
||||
table td {
|
||||
height: 3.2em;
|
||||
border-bottom: 1px solid #E0E0E0;
|
||||
padding: 1rem;
|
||||
}
|
||||
table th {
|
||||
height: 4em;
|
||||
border-bottom: 1px solid #E0E0E0;
|
||||
padding: 1rem;
|
||||
font-weight: 700;
|
||||
color: #616161;
|
||||
}
|
||||
table th:before {
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: #F5F5F5;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
table th:hover:before {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
table tbody tr:hover {
|
||||
background: #F5F5F5;
|
||||
}
|
||||
|
||||
card {
|
||||
background: #FFF;
|
||||
display: block;
|
||||
margin: 7%;
|
||||
padding: 2rem;
|
||||
width: 86%;
|
||||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
border-radius: 2px;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
card hr[xx] {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
card:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
card > h5 {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
card > img, card > img[xx] {
|
||||
width: calc(100% + 4rem);
|
||||
max-width: none;
|
||||
margin: 0 0 2rem -2rem;
|
||||
display: block;
|
||||
padding: 0px;
|
||||
margin: 0 0 2rem -2rem;
|
||||
display: block;
|
||||
box-shadow: none;
|
||||
border-radius: 0px;
|
||||
}
|
||||
card > img:first-child, card > img[xx]:first-child {
|
||||
margin: -2rem 0 2rem -2rem;
|
||||
border-radius: 2px 2px 0px 0px;
|
||||
}
|
||||
card > img:last-child, card > img[xx]:last-child {
|
||||
margin: 0 0 -2rem -2rem;
|
||||
border-radius: 0px 0px 2px 2px;
|
||||
}
|
||||
card hr {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
@media (min-width: 900px) {
|
||||
form {
|
||||
padding: 4%;
|
||||
margin: 7% 15% 7% 15%;
|
||||
}
|
||||
|
||||
table {
|
||||
padding: 4%;
|
||||
margin: 7% 15% 7% 15%;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
card {
|
||||
margin: 7% 15% 7% 15%;
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
form {
|
||||
padding: 3%;
|
||||
margin: 7% 25% 7% 25%;
|
||||
}
|
||||
|
||||
table {
|
||||
padding: 2%;
|
||||
margin: 7% 20% 7% 20%;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
card {
|
||||
margin: 7% 20% 7% 20%;
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
@media (max-width: 50rem) {
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
padding-top: 4.4rem;
|
||||
}
|
||||
|
||||
[btn][full] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button[xx][full] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input[type=submit][full] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button[full] {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
p {
|
||||
margin: 0 2% 0 2%;
|
||||
}
|
||||
p:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
p a:not([btn]):before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
opacity: .5;
|
||||
transform: scale3d(1, 0.1, 1);
|
||||
transform-origin: bottom;
|
||||
z-index: -1;
|
||||
}
|
||||
p a:not([btn]):hover:before {
|
||||
color: red;
|
||||
transform: none;
|
||||
}
|
||||
|
||||
button, button[xx] {
|
||||
transition: all .3s ease-in-out;
|
||||
cursor: pointer;
|
||||
color: #FFF;
|
||||
padding: 10px;
|
||||
background: #3F51B5;
|
||||
border: 1px solid #3F51B5;
|
||||
border-radius: 1.5px;
|
||||
box-shadow: 0 0 0 transparent;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
line-height: 1rem;
|
||||
float: none;
|
||||
margin: auto;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
|
||||
}
|
||||
button:before, button[xx]:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
transform: scale3d(1.2, 1.2, 1.2);
|
||||
background: #3F51B5;
|
||||
}
|
||||
button:disabled, button[xx]:disabled {
|
||||
border-color: #9FA8DA;
|
||||
background: #9FA8DA;
|
||||
color: #FFF;
|
||||
cursor: default;
|
||||
}
|
||||
button:not(:disabled):hover, button[xx]:not(:disabled):hover {
|
||||
background: #283593;
|
||||
}
|
||||
button:not(:disabled):hover:active, button[xx]:not(:disabled):hover:active {
|
||||
box-shadow: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
input[type=submit] {
|
||||
cursor: pointer;
|
||||
color: #3F51B5;
|
||||
display: inline-block;
|
||||
padding: 1.4rem 2rem;
|
||||
background-color: #3F51B5;
|
||||
border: 1px solid #3F51B5;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 0 0 transparent;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
line-height: 1rem;
|
||||
margin: 0 1rem 1rem 0;
|
||||
}
|
||||
input[type=submit]:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
transform: scale3d(1.2, 1.2, 1.2);
|
||||
background-color: #3F51B5;
|
||||
}
|
||||
input[type=submit]:disabled {
|
||||
border-color: #BDBDBD;
|
||||
background: #BDBDBD;
|
||||
color: #5C6BC0;
|
||||
cursor: default;
|
||||
}
|
||||
input[type=submit]:not(:disabled):hover {
|
||||
background: #F5F5F5;
|
||||
}
|
||||
input[type=submit]:not(:disabled):hover:active {
|
||||
box-shadow: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
footer {
|
||||
color: #FFF;
|
||||
width: 100%;
|
||||
max-width: 90rem;
|
||||
margin: auto;
|
||||
padding: 2rem;
|
||||
overflow: visible;
|
||||
}
|
||||
footer:before {
|
||||
content: "";
|
||||
background: #3F51B5;
|
||||
width: 102vw;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
label, label[xx] {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-transform: uppercase;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 400;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
label:first-child, label[xx]:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
input {
|
||||
transition: all .3s ease-in-out;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit])[xx] {
|
||||
display: inline-block;
|
||||
background: 0 0;
|
||||
width: 100%;
|
||||
padding: .5rem 0 1rem;
|
||||
margin-bottom: 2rem;
|
||||
border: none;
|
||||
border-bottom: 1px solid #BDBDBD;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
border-radius: 0;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit])[xx]:focus {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit])[xx]:hover {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit]) {
|
||||
display: inline-block;
|
||||
background: 0 0;
|
||||
width: 100%;
|
||||
padding: .5rem 0 1rem;
|
||||
margin-bottom: 2rem;
|
||||
border: none;
|
||||
border-bottom: 1px solid #BDBDBD;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
border-radius: 0;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit]):focus {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
input:not([type=radio]):not([type=checkbox]):not([type=button]):not([type=submit]):hover {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
textarea[xx], textarea {
|
||||
transition: all .3s ease-in-out;
|
||||
display: inline-block;
|
||||
background: 0 0;
|
||||
background-color: #FFF;
|
||||
width: 100%;
|
||||
padding: .5rem 0 1rem;
|
||||
margin-bottom: 2rem;
|
||||
border: none;
|
||||
border-bottom: 1px solid #BDBDBD;
|
||||
border-radius: 0;
|
||||
min-height: 50px;
|
||||
height: 100px;
|
||||
max-height: 250px;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
textarea[xx]:focus, textarea:focus {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
textarea[xx]:hover, textarea:hover {
|
||||
color: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
select {
|
||||
transition: all .3s ease-in-out;
|
||||
padding: .5rem 3rem .5rem 1rem;
|
||||
display: block;
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-bottom: 1px solid #BDBDBD;
|
||||
background: inherit;
|
||||
background-size: 2rem;
|
||||
height: 4rem;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
text-indent: .5rem;
|
||||
margin: .5rem 0 2rem;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
}
|
||||
select:focus {
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
select:hover {
|
||||
border-color: #3F51B5;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
input[type=radio][xx] {
|
||||
z-index: 2;
|
||||
opacity: 0;
|
||||
margin-right: -2rem;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
}
|
||||
input[type=radio][xx] + label {
|
||||
width: auto;
|
||||
text-transform: none;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
input[type=radio][xx] + label:before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border: 1px solid #5C6BC0;
|
||||
background: #FFF;
|
||||
vertical-align: middle;
|
||||
margin-right: 1rem;
|
||||
border-radius: 100%;
|
||||
}
|
||||
input[type=radio][xx] + label:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
left: 2px;
|
||||
top: 4px;
|
||||
transform: scale(0);
|
||||
}
|
||||
input[type=radio][xx]:checked + label:before {
|
||||
background: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
}
|
||||
input[type=radio][xx]:checked + label:after {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
background: #3F51B5;
|
||||
border: 1px solid #FFF;
|
||||
border-radius: 100%;
|
||||
transform: scale(1);
|
||||
top: .5rem;
|
||||
}
|
||||
|
||||
section[xx] {
|
||||
margin: auto;
|
||||
padding: 4rem 2rem;
|
||||
width: 100%;
|
||||
max-width: 90rem;
|
||||
}
|
||||
|
||||
p[xx] {
|
||||
margin: 0 0 2rem;
|
||||
}
|
||||
p[xx]:last-child {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
hr, hr[xx] {
|
||||
background: #BDBDBD;
|
||||
border: none;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
margin: 4rem 0;
|
||||
}
|
||||
|
||||
ul, ul[xx] {
|
||||
transition: all .3s ease-in-out;
|
||||
padding-left: 2rem;
|
||||
margin: 0 0 2rem;
|
||||
list-style: disc;
|
||||
}
|
||||
ul ol, ul[xx] ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
ul ul, ul[xx] ul {
|
||||
margin-bottom: 0;
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
ol, ol[xx] {
|
||||
padding-left: 2rem;
|
||||
margin: 0 0 2rem;
|
||||
list-style: decimal;
|
||||
}
|
||||
ol ol, ol[xx] ol {
|
||||
margin-bottom: 0;
|
||||
list-style: lower-alpha;
|
||||
}
|
||||
ol ul, ol[xx] ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
tr {
|
||||
transition: all .3s ease-in-out;
|
||||
}
|
||||
|
||||
[full] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
[no-margins] {
|
||||
margin: 0%;
|
||||
}
|
||||
|
||||
[fs-xs] {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
[fs-s] {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
[fs-m] {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
[fs-l] {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
[fs-xl] {
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
|
||||
[txt-l] {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
[txt=r] {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
[txt-c] {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
[txt-j] {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
blockquote, blockquote[xx] {
|
||||
margin: 5px 0px 0px 5%;
|
||||
padding: 1rem 2rem;
|
||||
border-left: 4px solid #3F51B5;
|
||||
}
|
||||
|
||||
pre, pre[xx] {
|
||||
margin: 5px 8% 0 8%;
|
||||
padding: 2% 0px 0px 0px;
|
||||
overflow-x: auto;
|
||||
padding-left: -20px !important;
|
||||
font-family: monospace;
|
||||
background: #E0E0E0;
|
||||
border: 1px solid #3F51B5;
|
||||
}
|
||||
|
||||
input[type=checkbox][xx], input[type=checkbox] {
|
||||
z-index: 2;
|
||||
opacity: 0;
|
||||
margin-right: -2rem;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
}
|
||||
input[type=checkbox][xx] + label, input[type=checkbox] + label {
|
||||
width: auto;
|
||||
text-transform: none;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
input[type=checkbox][xx] + label:before, input[type=checkbox] + label:before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border: 1px solid #5C6BC0;
|
||||
background: #FFF;
|
||||
vertical-align: middle;
|
||||
margin-right: 1rem;
|
||||
border-radius: 2px;
|
||||
}
|
||||
input[type=checkbox][xx] + label:after, input[type=checkbox] + label:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
left: 2px;
|
||||
top: 4px;
|
||||
transform: scale(0);
|
||||
border-radius: 100%;
|
||||
background-size: 100%;
|
||||
}
|
||||
input[type=checkbox][xx]:checked + label:before, input[type=checkbox]:checked + label:before {
|
||||
background: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
}
|
||||
input[type=checkbox][xx]:checked + label:after, input[type=checkbox]:checked + label:after {
|
||||
content: "✔";
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
left: 4.5px;
|
||||
top: .2rem;
|
||||
transform: scale(1);
|
||||
}
|
||||
input[type=checkbox][xx]:disabled, input[type=checkbox]:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
input[type=checkbox][xx]:disabled + label:before, input[type=checkbox]:disabled + label:before {
|
||||
background: #9FA8DA;
|
||||
border-color: #9FA8DA;
|
||||
}
|
||||
input[type=checkbox][xx]:disabled + label:after, input[type=checkbox]:disabled + label:after {
|
||||
content: "✔";
|
||||
color: #FFF;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
left: 4.5px;
|
||||
top: .2rem;
|
||||
transform: scale(1);
|
||||
}
|
||||
input[type=checkbox][xx]:disabled:not([checked]) + label:before, input[type=checkbox]:disabled:not([checked]) + label:before {
|
||||
background: #E0E0E0;
|
||||
border-color: #E0E0E0;
|
||||
}
|
||||
input[type=checkbox][xx]:disabled:not([checked]) + label:after, input[type=checkbox]:disabled:not([checked]) + label:after {
|
||||
content: "";
|
||||
visibility: visible;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
input[type=radio] {
|
||||
z-index: 2;
|
||||
opacity: 0;
|
||||
margin-right: -2rem;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
}
|
||||
input[type=radio] + label {
|
||||
width: auto;
|
||||
text-transform: none;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
input[type=radio] + label:before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border: 1px solid #5C6BC0;
|
||||
background: #FFF;
|
||||
vertical-align: middle;
|
||||
margin-right: 1rem;
|
||||
border-radius: 100%;
|
||||
}
|
||||
input[type=radio] + label:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
pointer-events: none;
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
left: 2px;
|
||||
top: 4px;
|
||||
transform: scale(0);
|
||||
}
|
||||
input[type=radio]:checked + label:before {
|
||||
background: #3F51B5;
|
||||
border-color: #3F51B5;
|
||||
}
|
||||
input[type=radio]:checked + label:after {
|
||||
transform: scale(1);
|
||||
top: .5rem;
|
||||
}
|
||||
|
||||
section {
|
||||
margin: auto;
|
||||
padding: 4rem 2rem;
|
||||
width: 100%;
|
||||
max-width: 90rem;
|
||||
}
|
@ -0,0 +1,983 @@
|
||||
/*!
|
||||
* Comet v1.2.0
|
||||
* https://github.com/marcbruederlin/comet
|
||||
*
|
||||
* Copyright (c) 2017 Marc Bruederlin
|
||||
* Licensed under the MIT license
|
||||
*/
|
||||
/*********************************************************
|
||||
Colors
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Typography
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Layout
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Responsive
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Core
|
||||
*********************************************************/
|
||||
/* normalize.css v4.2.0 | MIT License | github.com/necolas/normalize.css */
|
||||
/**
|
||||
* 1. Change the default font family in all browsers (opinionated).
|
||||
* 2. Correct the line height in all browsers.
|
||||
* 3. Prevent adjustments of font size after orientation changes in IE and iOS.
|
||||
*/
|
||||
/* Document
|
||||
========================================================================== */
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
/* 1 */
|
||||
line-height: 1.15;
|
||||
/* 2 */
|
||||
-ms-text-size-adjust: 100%;
|
||||
/* 3 */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
/* 3 */ }
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
/**
|
||||
* Remove the margin in all browsers (opinionated).
|
||||
*/
|
||||
body {
|
||||
margin: 0; }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section {
|
||||
display: block; }
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0; }
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in IE.
|
||||
*/
|
||||
figcaption,
|
||||
figure,
|
||||
main {
|
||||
/* 1 */
|
||||
display: block; }
|
||||
|
||||
/**
|
||||
* Add the correct margin in IE 8.
|
||||
*/
|
||||
figure {
|
||||
margin: 1em 40px; }
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
/* 1 */
|
||||
height: 0;
|
||||
/* 1 */
|
||||
overflow: visible;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
pre {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
/**
|
||||
* 1. Remove the gray background on active links in IE 10.
|
||||
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
|
||||
*/
|
||||
a {
|
||||
background-color: transparent;
|
||||
/* 1 */
|
||||
-webkit-text-decoration-skip: objects;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the outline on focused links when they are also active or hovered
|
||||
* in all browsers (opinionated).
|
||||
*/
|
||||
a:active,
|
||||
a:hover {
|
||||
outline-width: 0; }
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Firefox 39-.
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
/* 1 */
|
||||
text-decoration: underline;
|
||||
/* 2 */
|
||||
text-decoration: underline dotted;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit; }
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder; }
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct font style in Android 4.3-.
|
||||
*/
|
||||
dfn {
|
||||
font-style: italic; }
|
||||
|
||||
/**
|
||||
* Add the correct background and color in IE 9-.
|
||||
*/
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000; }
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
small {
|
||||
font-size: 80%; }
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline; }
|
||||
|
||||
sub {
|
||||
bottom: -0.25em; }
|
||||
|
||||
sup {
|
||||
top: -0.5em; }
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
audio,
|
||||
video {
|
||||
display: inline-block; }
|
||||
|
||||
/**
|
||||
* Add the correct display in iOS 4-7.
|
||||
*/
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0; }
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10-.
|
||||
*/
|
||||
img {
|
||||
border-style: none; }
|
||||
|
||||
/**
|
||||
* Hide the overflow in IE.
|
||||
*/
|
||||
svg:not(:root) {
|
||||
overflow: hidden; }
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
/**
|
||||
* 1. Change font properties to `inherit` in all browsers (opinionated).
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font: inherit;
|
||||
/* 1 */
|
||||
margin: 0;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Restore the font weight unset by the previous rule.
|
||||
*/
|
||||
optgroup {
|
||||
font-weight: bold; }
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
button,
|
||||
input {
|
||||
/* 1 */
|
||||
overflow: visible; }
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
button,
|
||||
select {
|
||||
/* 1 */
|
||||
text-transform: none; }
|
||||
|
||||
/**
|
||||
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||
* controls in Android 4.
|
||||
* 2. Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
button,
|
||||
html [type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0; }
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText; }
|
||||
|
||||
/**
|
||||
* Change the border, margin, and padding in all browsers (opinionated).
|
||||
*/
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em; }
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
legend {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
color: inherit;
|
||||
/* 2 */
|
||||
display: table;
|
||||
/* 1 */
|
||||
max-width: 100%;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 3 */
|
||||
white-space: normal;
|
||||
/* 1 */ }
|
||||
|
||||
/**
|
||||
* 1. Add the correct display in IE 9-.
|
||||
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
progress {
|
||||
display: inline-block;
|
||||
/* 1 */
|
||||
vertical-align: baseline;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE.
|
||||
*/
|
||||
textarea {
|
||||
overflow: auto; }
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10-.
|
||||
* 2. Remove the padding in IE 10-.
|
||||
*/
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto; }
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
/* 1 */
|
||||
outline-offset: -2px;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
|
||||
*/
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none; }
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
/* 1 */
|
||||
font: inherit;
|
||||
/* 2 */ }
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
/*
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in Edge, IE, and Firefox.
|
||||
*/
|
||||
details,
|
||||
menu {
|
||||
display: block; }
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
summary {
|
||||
display: list-item; }
|
||||
|
||||
/* Scripting
|
||||
========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
canvas {
|
||||
display: inline-block; }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
template {
|
||||
display: none; }
|
||||
|
||||
/* Hidden
|
||||
========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 10-.
|
||||
*/
|
||||
[hidden] {
|
||||
display: none; }
|
||||
|
||||
/*********************************************************
|
||||
Base
|
||||
*********************************************************/
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
font-family: "Source Sans Pro", sans-serif;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.6;
|
||||
color: #626979;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
|
||||
*,
|
||||
*:after,
|
||||
*:before {
|
||||
box-sizing: inherit; }
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 0 2rem; }
|
||||
|
||||
/*********************************************************
|
||||
Print
|
||||
*********************************************************/
|
||||
@media print {
|
||||
body {
|
||||
-webkit-print-color-adjust: exact; }
|
||||
a[href^="http://"]:after,
|
||||
a[href^="https://"]:after,
|
||||
a[href^="www."]:after {
|
||||
content: " (" attr(href) ")"; }
|
||||
a[href^="#"]:after {
|
||||
display: none; } }
|
||||
|
||||
/*********************************************************
|
||||
Functions
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Components
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Blockquotes
|
||||
*********************************************************/
|
||||
.blockquote {
|
||||
margin: 3rem 0;
|
||||
padding: 1rem 3rem; }
|
||||
.blockquote > p {
|
||||
margin: 0; }
|
||||
.blockquote > .blockquote__footer {
|
||||
margin-top: .3rem;
|
||||
color: #979daa; }
|
||||
.blockquote--highlight {
|
||||
border-left: 0.2rem solid #19e2b5; }
|
||||
|
||||
/*********************************************************
|
||||
Buttons
|
||||
*********************************************************/
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: 0 2rem;
|
||||
font-family: inherit;
|
||||
font-size: 1.04167rem;
|
||||
font-weight: 700;
|
||||
line-height: 4rem;
|
||||
letter-spacing: .05rem;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
color: #fff;
|
||||
background-color: #19e2b5;
|
||||
border: 0.2rem solid #19e2b5;
|
||||
border-radius: .4rem;
|
||||
cursor: pointer; }
|
||||
.button:disabled {
|
||||
opacity: 0.8;
|
||||
cursor: not-allowed; }
|
||||
.button:disabled:hover {
|
||||
background-color: #19e2b5;
|
||||
border-color: #19e2b5; }
|
||||
.button:hover, .button:focus, .button:active {
|
||||
color: #fff;
|
||||
background-color: #0f866b;
|
||||
border-color: #0f866b;
|
||||
outline: none; }
|
||||
.button--small {
|
||||
padding: 0 1rem;
|
||||
font-size: 0.86806rem;
|
||||
line-height: 3rem; }
|
||||
.button--large {
|
||||
font-size: 1.5rem;
|
||||
line-height: 6rem; }
|
||||
.button--outline {
|
||||
color: #19e2b5;
|
||||
background-color: transparent; }
|
||||
.button--outline:disabled:hover {
|
||||
color: #19e2b5;
|
||||
background-color: transparent; }
|
||||
.button--outline:hover {
|
||||
color: #0f866b;
|
||||
background-color: transparent; }
|
||||
.button--clear {
|
||||
color: #19e2b5;
|
||||
background-color: transparent;
|
||||
border-color: transparent; }
|
||||
.button--clear:disabled:hover {
|
||||
color: #19e2b5;
|
||||
background-color: transparent;
|
||||
border-color: transparent; }
|
||||
.button--clear:hover {
|
||||
color: #0f866b;
|
||||
background-color: transparent;
|
||||
border-color: transparent; }
|
||||
|
||||
/*********************************************************
|
||||
Codes
|
||||
*********************************************************/
|
||||
.code {
|
||||
font-family: "Monaco", monospace;
|
||||
font-size: 1.25rem; }
|
||||
.code--background {
|
||||
padding: .5rem 1rem;
|
||||
background: rgba(0, 0, 0, 0.05); }
|
||||
.code--highlight {
|
||||
padding: .5rem 1rem;
|
||||
border-left: 0.2rem solid #19e2b5; }
|
||||
|
||||
/*********************************************************
|
||||
Forms
|
||||
*********************************************************/
|
||||
fieldset {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none; }
|
||||
|
||||
label,
|
||||
.form > .form__label {
|
||||
display: block;
|
||||
margin-bottom: .2rem;
|
||||
font-weight: 600; }
|
||||
|
||||
input[type='email'],
|
||||
input[type='number'],
|
||||
input[type='password'],
|
||||
input[type='search'],
|
||||
input[type='tel'],
|
||||
input[type='text'],
|
||||
input[type='url'],
|
||||
textarea {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-bottom: 2.3rem;
|
||||
padding: 1rem 1.3rem;
|
||||
font-family: inherit;
|
||||
color: #626979;
|
||||
border: 0.2rem solid #cbccd0;
|
||||
border-radius: .4rem;
|
||||
outline: none; }
|
||||
input[type='email']:focus, input[type='email']:active,
|
||||
input[type='number']:focus,
|
||||
input[type='number']:active,
|
||||
input[type='password']:focus,
|
||||
input[type='password']:active,
|
||||
input[type='search']:focus,
|
||||
input[type='search']:active,
|
||||
input[type='tel']:focus,
|
||||
input[type='tel']:active,
|
||||
input[type='text']:focus,
|
||||
input[type='text']:active,
|
||||
input[type='url']:focus,
|
||||
input[type='url']:active,
|
||||
textarea:focus,
|
||||
textarea:active {
|
||||
border-color: #19e2b5; }
|
||||
|
||||
textarea {
|
||||
max-width: 100%; }
|
||||
|
||||
.form__input--success {
|
||||
border-color: #4cb77a !important; }
|
||||
|
||||
.form__input--error {
|
||||
border-color: #e25c48 !important; }
|
||||
|
||||
/*********************************************************
|
||||
Grid
|
||||
*********************************************************/
|
||||
.grid {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
width: auto;
|
||||
-ms-flex-flow: row wrap;
|
||||
flex-flow: row wrap;
|
||||
margin-left: -1rem;
|
||||
margin-right: -1rem;
|
||||
box-sizing: border-box; }
|
||||
.grid--reverse {
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: reverse;
|
||||
-ms-flex-direction: row-reverse;
|
||||
flex-direction: row-reverse; }
|
||||
.grid--gapless {
|
||||
margin: 0; }
|
||||
.grid--gapless .grid__col {
|
||||
padding: 0 !important; }
|
||||
.grid .grid__col {
|
||||
position: relative;
|
||||
padding: 0 1rem 1rem; }
|
||||
.grid .grid__col--12 {
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%;
|
||||
max-width: 100%; }
|
||||
.grid .grid__col--11 {
|
||||
-ms-flex-preferred-size: 91.66666667%;
|
||||
flex-basis: 91.66666667%;
|
||||
max-width: 91.66666667%; }
|
||||
.grid .grid__col--10 {
|
||||
-ms-flex-preferred-size: 83.33333333%;
|
||||
flex-basis: 83.33333333%;
|
||||
max-width: 83.33333333%; }
|
||||
.grid .grid__col--9 {
|
||||
-ms-flex-preferred-size: 75%;
|
||||
flex-basis: 75%;
|
||||
max-width: 75%; }
|
||||
.grid .grid__col--8 {
|
||||
-ms-flex-preferred-size: 66.66666667%;
|
||||
flex-basis: 66.66666667%;
|
||||
max-width: 66.66666667%; }
|
||||
.grid .grid__col--7 {
|
||||
-ms-flex-preferred-size: 58.33333333%;
|
||||
flex-basis: 58.33333333%;
|
||||
max-width: 58.33333333%; }
|
||||
.grid .grid__col--6 {
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%;
|
||||
max-width: 50%; }
|
||||
.grid .grid__col--5 {
|
||||
-ms-flex-preferred-size: 41.66666667%;
|
||||
flex-basis: 41.66666667%;
|
||||
max-width: 41.66666667%; }
|
||||
.grid .grid__col--4 {
|
||||
-ms-flex-preferred-size: 33.33333333%;
|
||||
flex-basis: 33.33333333%;
|
||||
max-width: 33.33333333%; }
|
||||
.grid .grid__col--3 {
|
||||
-ms-flex-preferred-size: 25%;
|
||||
flex-basis: 25%;
|
||||
max-width: 25%; }
|
||||
.grid .grid__col--2 {
|
||||
-ms-flex-preferred-size: 16.66666667%;
|
||||
flex-basis: 16.66666667%;
|
||||
max-width: 16.66666667%; }
|
||||
.grid .grid__col--1 {
|
||||
-ms-flex-preferred-size: 8.33333333%;
|
||||
flex-basis: 8.33333333%;
|
||||
max-width: 8.33333333%; }
|
||||
|
||||
@media (max-width: 425px) {
|
||||
.grid .grid__col--s-12 {
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%;
|
||||
max-width: 100%; }
|
||||
.grid .grid__col--s-11 {
|
||||
-ms-flex-preferred-size: 91.66666667%;
|
||||
flex-basis: 91.66666667%;
|
||||
max-width: 91.66666667%; }
|
||||
.grid .grid__col--s-10 {
|
||||
-ms-flex-preferred-size: 83.33333333%;
|
||||
flex-basis: 83.33333333%;
|
||||
max-width: 83.33333333%; }
|
||||
.grid .grid__col--s-9 {
|
||||
-ms-flex-preferred-size: 75%;
|
||||
flex-basis: 75%;
|
||||
max-width: 75%; }
|
||||
.grid .grid__col--s-8 {
|
||||
-ms-flex-preferred-size: 66.66666667%;
|
||||
flex-basis: 66.66666667%;
|
||||
max-width: 66.66666667%; }
|
||||
.grid .grid__col--s-7 {
|
||||
-ms-flex-preferred-size: 58.33333333%;
|
||||
flex-basis: 58.33333333%;
|
||||
max-width: 58.33333333%; }
|
||||
.grid .grid__col--s-6 {
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%;
|
||||
max-width: 50%; }
|
||||
.grid .grid__col--s-5 {
|
||||
-ms-flex-preferred-size: 41.66666667%;
|
||||
flex-basis: 41.66666667%;
|
||||
max-width: 41.66666667%; }
|
||||
.grid .grid__col--s-4 {
|
||||
-ms-flex-preferred-size: 33.33333333%;
|
||||
flex-basis: 33.33333333%;
|
||||
max-width: 33.33333333%; }
|
||||
.grid .grid__col--s-3 {
|
||||
-ms-flex-preferred-size: 25%;
|
||||
flex-basis: 25%;
|
||||
max-width: 25%; }
|
||||
.grid .grid__col--s-2 {
|
||||
-ms-flex-preferred-size: 16.66666667%;
|
||||
flex-basis: 16.66666667%;
|
||||
max-width: 16.66666667%; }
|
||||
.grid .grid__col--s-1 {
|
||||
-ms-flex-preferred-size: 8.33333333%;
|
||||
flex-basis: 8.33333333%;
|
||||
max-width: 8.33333333%; } }
|
||||
|
||||
@media (min-width: 426px) and (max-width: 768px) {
|
||||
.grid .grid__col--m-12 {
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%;
|
||||
max-width: 100%; }
|
||||
.grid .grid__col--m-11 {
|
||||
-ms-flex-preferred-size: 91.66666667%;
|
||||
flex-basis: 91.66666667%;
|
||||
max-width: 91.66666667%; }
|
||||
.grid .grid__col--m-10 {
|
||||
-ms-flex-preferred-size: 83.33333333%;
|
||||
flex-basis: 83.33333333%;
|
||||
max-width: 83.33333333%; }
|
||||
.grid .grid__col--m-9 {
|
||||
-ms-flex-preferred-size: 75%;
|
||||
flex-basis: 75%;
|
||||
max-width: 75%; }
|
||||
.grid .grid__col--m-8 {
|
||||
-ms-flex-preferred-size: 66.66666667%;
|
||||
flex-basis: 66.66666667%;
|
||||
max-width: 66.66666667%; }
|
||||
.grid .grid__col--m-7 {
|
||||
-ms-flex-preferred-size: 58.33333333%;
|
||||
flex-basis: 58.33333333%;
|
||||
max-width: 58.33333333%; }
|
||||
.grid .grid__col--m-6 {
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%;
|
||||
max-width: 50%; }
|
||||
.grid .grid__col--m-5 {
|
||||
-ms-flex-preferred-size: 41.66666667%;
|
||||
flex-basis: 41.66666667%;
|
||||
max-width: 41.66666667%; }
|
||||
.grid .grid__col--m-4 {
|
||||
-ms-flex-preferred-size: 33.33333333%;
|
||||
flex-basis: 33.33333333%;
|
||||
max-width: 33.33333333%; }
|
||||
.grid .grid__col--m-3 {
|
||||
-ms-flex-preferred-size: 25%;
|
||||
flex-basis: 25%;
|
||||
max-width: 25%; }
|
||||
.grid .grid__col--m-2 {
|
||||
-ms-flex-preferred-size: 16.66666667%;
|
||||
flex-basis: 16.66666667%;
|
||||
max-width: 16.66666667%; }
|
||||
.grid .grid__col--m-1 {
|
||||
-ms-flex-preferred-size: 8.33333333%;
|
||||
flex-basis: 8.33333333%;
|
||||
max-width: 8.33333333%; } }
|
||||
|
||||
/*********************************************************
|
||||
Links
|
||||
*********************************************************/
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #19e2b5;
|
||||
border-bottom: 0.2rem solid rgba(25, 226, 181, 0.35); }
|
||||
a:hover {
|
||||
color: #0f866b;
|
||||
border-bottom-color: #0f866b; }
|
||||
|
||||
/*********************************************************
|
||||
Lists
|
||||
*********************************************************/
|
||||
.list {
|
||||
margin: 3rem 0; }
|
||||
.list--inline > li {
|
||||
float: left;
|
||||
margin-right: 5rem; }
|
||||
.list--inline > li:last-of-type {
|
||||
margin-right: 0; }
|
||||
.list--unstyled {
|
||||
padding: 0;
|
||||
list-style: none; }
|
||||
|
||||
dl dt {
|
||||
font-weight: 600; }
|
||||
|
||||
dl dd {
|
||||
margin: 0; }
|
||||
|
||||
/*********************************************************
|
||||
Media
|
||||
*********************************************************/
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto; }
|
||||
|
||||
/*********************************************************
|
||||
Misc
|
||||
*********************************************************/
|
||||
.hr {
|
||||
margin: 3.5rem 0;
|
||||
width: 100%;
|
||||
height: .1rem;
|
||||
background-color: rgba(98, 105, 121, 0.25);
|
||||
border: none; }
|
||||
.hr--small {
|
||||
width: 30%; }
|
||||
|
||||
/*********************************************************
|
||||
Tables
|
||||
*********************************************************/
|
||||
.table {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
border-collapse: collapse; }
|
||||
.table th {
|
||||
padding: .8rem;
|
||||
font-weight: 600;
|
||||
border-bottom: 0.2rem solid rgba(98, 105, 121, 0.25);
|
||||
vertical-align: bottom; }
|
||||
.table td {
|
||||
padding: .8rem;
|
||||
border-top: 1px solid rgba(98, 105, 121, 0.25); }
|
||||
.table--striped tbody tr:nth-of-type(odd) {
|
||||
background-color: rgba(0, 0, 0, 0.03); }
|
||||
.table--hover tbody tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.06); }
|
||||
|
||||
/*********************************************************
|
||||
Typography
|
||||
*********************************************************/
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 7rem 0 4rem 0;
|
||||
font-weight: 300;
|
||||
line-height: 1.2;
|
||||
color: #000; }
|
||||
|
||||
h1 {
|
||||
font-size: 4.47898rem; }
|
||||
|
||||
h2 {
|
||||
font-size: 3.73248rem; }
|
||||
|
||||
h3 {
|
||||
font-size: 3.1104rem; }
|
||||
|
||||
h4 {
|
||||
font-size: 2.592rem; }
|
||||
|
||||
h5 {
|
||||
font-size: 2.16rem; }
|
||||
|
||||
h6 {
|
||||
font-size: 1.5rem; }
|
||||
|
||||
p {
|
||||
margin: 0 0 3rem 0; }
|
||||
|
||||
abbr,
|
||||
abbr[title] {
|
||||
text-decoration: none;
|
||||
border-bottom: .1rem dotted #d4d4d4;
|
||||
cursor: help; }
|
||||
|
||||
/*********************************************************
|
||||
Utilities
|
||||
*********************************************************/
|
||||
/*********************************************************
|
||||
Text utility
|
||||
*********************************************************/
|
||||
.utility__text--left {
|
||||
text-align: left; }
|
||||
|
||||
.utility__text--right {
|
||||
text-align: right; }
|
||||
|
||||
.utility__text--center {
|
||||
text-align: center; }
|
||||
|
||||
.utility__text--highlight {
|
||||
padding: .25rem;
|
||||
color: #000;
|
||||
background-color: #fdf72e; }
|
||||
|
||||
.utility__text--loud {
|
||||
font-weight: 700;
|
||||
color: #343841; }
|
||||
|
||||
.utility__text--quiet {
|
||||
color: #979daa; }
|
||||
|
||||
/*********************************************************
|
||||
Position utility
|
||||
*********************************************************/
|
||||
.utility__pos--center {
|
||||
margin-left: auto;
|
||||
margin-right: auto; }
|
||||
|
||||
.utility__pos--left {
|
||||
margin-left: 0;
|
||||
margin-right: auto; }
|
||||
|
||||
.utility__pos--right {
|
||||
margin-left: auto;
|
||||
margin-right: 0; }
|
||||
|
||||
.utility__pos--center-center {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%); }
|
||||
|
||||
/*********************************************************
|
||||
Float utility
|
||||
*********************************************************/
|
||||
.utility__float--left {
|
||||
float: left; }
|
||||
|
||||
.utility__float--right {
|
||||
float: right; }
|
||||
|
||||
.utility__clearfix, .list--inline {
|
||||
*zoom: 1; }
|
||||
.utility__clearfix:before, .list--inline:before, .utility__clearfix:after, .list--inline:after {
|
||||
content: " ";
|
||||
display: table; }
|
||||
.utility__clearfix:after, .list--inline:after {
|
||||
clear: both; }
|
||||
|
||||
/*********************************************************
|
||||
Hidden utility
|
||||
*********************************************************/
|
||||
.utility__hidden--s, .utility__hidden--m, .utility__hidden--l {
|
||||
display: initial;
|
||||
visibility: visible; }
|
||||
|
||||
@media (min-width: 769px) {
|
||||
.utility__hidden--m.utility__hidden--l,
|
||||
.utility__hidden--l.utility__hidden--s,
|
||||
.utility__hidden--l {
|
||||
display: none; } }
|
||||
|
||||
@media (max-width: 425px) {
|
||||
.utility__hidden--l.utility__hidden--s,
|
||||
.utility__hidden--s {
|
||||
display: none; } }
|
||||
|
||||
@media (min-width: 426px) and (max-width: 768px) {
|
||||
.utility__hidden--m.utility__hidden--l,
|
||||
.utility__hidden--m {
|
||||
display: none; } }
|
@ -0,0 +1,281 @@
|
||||
/*! concrete.css v1.3.0 | MIT License | github.com/louismerlin/concrete.css/ */
|
||||
|
||||
/* The Basics */
|
||||
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 2rem;
|
||||
font-weight: 400;
|
||||
background: white;
|
||||
color: #121212;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
*, ::after, ::before {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #121212;
|
||||
}
|
||||
|
||||
blockquote, dl, figure, form, ol, p, pre, table, ul {
|
||||
margin-bottom: 2.2rem;
|
||||
}
|
||||
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* A Cool Container */
|
||||
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
max-width: 66rem;
|
||||
padding: 0 1rem;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* The Button */
|
||||
|
||||
.button {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
button,
|
||||
.button,
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
border-radius: 0;
|
||||
background: white;
|
||||
line-height: 2.2rem;
|
||||
font-size: 1.6rem;
|
||||
color: #121212;
|
||||
border: 0.3rem solid #121212;
|
||||
padding: 0.4rem 1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button.filled,
|
||||
.button.filled,
|
||||
input[type="button"].filled,
|
||||
input[type="reset"].filled,
|
||||
input[type="submit"].filled {
|
||||
color: white;
|
||||
background: #121212;
|
||||
}
|
||||
|
||||
.button,
|
||||
button,
|
||||
dd,
|
||||
dt,
|
||||
li,
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
margin-bottom: 1.0rem;
|
||||
}
|
||||
|
||||
/* The List */
|
||||
|
||||
ul {
|
||||
list-style: square;
|
||||
}
|
||||
|
||||
/* The Form */
|
||||
|
||||
fieldset {
|
||||
border-width: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
label, legend {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
input[type="email"],
|
||||
input[type="number"],
|
||||
input[type="password"],
|
||||
input[type="search"],
|
||||
input[type="tel"],
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
textarea,
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
border: 0.1rem solid #121212;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
box-sizing: inherit;
|
||||
padding: .6rem 1.0rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
fieldset, input, select, textarea {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
/* The Table */
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td, th {
|
||||
padding: 0.6rem 0;
|
||||
}
|
||||
|
||||
td {
|
||||
border-bottom: 0.1rem solid #121212;
|
||||
}
|
||||
|
||||
th {
|
||||
border-bottom: 0.3rem solid #121212;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* The Blockquote and the Code */
|
||||
|
||||
blockquote, pre {
|
||||
border-left: 0.3rem solid #121212;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
padding: 1rem 1.5rem;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
pre {
|
||||
border: 0.1rem dotted #121212;
|
||||
border-left: 0.3rem solid #121212;
|
||||
}
|
||||
|
||||
pre > code {
|
||||
padding: 1rem 1.4rem;
|
||||
font-size: 1.6rem;
|
||||
white-space: pre;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* The Progress Bar */
|
||||
|
||||
progress {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
height: 1rem;
|
||||
border: 0.1rem solid #121212;
|
||||
background: white;
|
||||
color: #121212;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
progress::-webkit-progress-bar {
|
||||
background-color: white;
|
||||
}
|
||||
progress::-webkit-progress-value {
|
||||
background-color: #121212;
|
||||
}
|
||||
progress::-moz-progress-bar {
|
||||
background-color: #121212;
|
||||
}
|
||||
progress::-ms-fill {
|
||||
background-color: #121212;
|
||||
}
|
||||
|
||||
/* The Break Line */
|
||||
|
||||
hr {
|
||||
border: 0.2rem solid #121212;
|
||||
border-bottom-width: 0.1rem;
|
||||
}
|
||||
|
||||
/* Dark Mode */
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background: #121212;
|
||||
color: white;
|
||||
}
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
button,
|
||||
.button,
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
background: #121212;
|
||||
color: white;
|
||||
border-color: white;
|
||||
}
|
||||
button.filled,
|
||||
.button.filled,
|
||||
input[type="button"].filled,
|
||||
input[type="reset"].filled,
|
||||
input[type="submit"].filled {
|
||||
color: #121212;
|
||||
background: white;
|
||||
}
|
||||
input[type="email"],
|
||||
input[type="number"],
|
||||
input[type="password"],
|
||||
input[type="search"],
|
||||
input[type="tel"],
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
textarea,
|
||||
select {
|
||||
color: white;
|
||||
border-color: white;
|
||||
}
|
||||
td {
|
||||
border-bottom-color: white;
|
||||
}
|
||||
th {
|
||||
border-bottom-color: white;
|
||||
}
|
||||
blockquote, pre {
|
||||
border-left-color: white;
|
||||
}
|
||||
pre {
|
||||
border-color: white;
|
||||
border-left-color: white;
|
||||
}
|
||||
progress {
|
||||
border-color: white;
|
||||
background: #121212;
|
||||
color: white;
|
||||
}
|
||||
progress::-webkit-progress-bar {
|
||||
background-color: #121212;
|
||||
}
|
||||
progress::-webkit-progress-value {
|
||||
background-color: white;
|
||||
}
|
||||
progress::-moz-progress-bar {
|
||||
background-color: white;
|
||||
}
|
||||
progress::-ms-fill {
|
||||
background-color: white;
|
||||
}
|
||||
hr {
|
||||
border-color: white;
|
||||
}
|
||||
}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,35 @@
|
||||
/*
|
||||
FLUIDITY v0.1.0
|
||||
@mrmrs - http://mrmrs.cc
|
||||
MIT
|
||||
*/
|
||||
/*
|
||||
|
||||
Responsive Utilities
|
||||
|
||||
*/
|
||||
img, canvas, iframe, video, svg, select, textarea {
|
||||
max-width: 100%; }
|
||||
|
||||
/* Wrap tables or pre elements in a div with this class */
|
||||
.overflow-container {
|
||||
overflow-x: scroll; }
|
||||
|
||||
/*
|
||||
Aspect ratios for media objects i.e canvas, iframe, video, svg etc.
|
||||
Defaults to 16x9
|
||||
*/
|
||||
.aspect-ratio {
|
||||
height: 0;
|
||||
padding-top: 56.25%;
|
||||
position: relative; }
|
||||
|
||||
.aspect-ratio--object {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 100; }
|
@ -0,0 +1,800 @@
|
||||
/**
|
||||
* furtive - A forward-thinking, CSS micro-framework. Minimal by design.
|
||||
* @author John Otander <johnotander@gmail.com> (http://johnotander.com/)
|
||||
* @version v2.4.0
|
||||
* @link https://github.com/johnotander/furtive
|
||||
* @license MIT
|
||||
*/
|
||||
|
||||
/*! excerpts from normalize.css v3.0.1 | MIT License | git.io/normalize */
|
||||
/**
|
||||
* Remove default margin.
|
||||
*/
|
||||
body {
|
||||
margin: 0; }
|
||||
|
||||
/* HTML5 display definitions
|
||||
========================================================================== */
|
||||
/**
|
||||
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
|
||||
* Correct `block` display not defined for `main` in IE 11.
|
||||
*/
|
||||
aside,
|
||||
details,
|
||||
main,
|
||||
summary {
|
||||
display: block; }
|
||||
|
||||
/**
|
||||
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
*/
|
||||
template {
|
||||
display: none; }
|
||||
|
||||
/* Links
|
||||
========================================================================== */
|
||||
/**
|
||||
* Improve readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0; }
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
/**
|
||||
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
*/
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted; }
|
||||
|
||||
/**
|
||||
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold; }
|
||||
|
||||
/**
|
||||
* Address styling not present in Safari and Chrome.
|
||||
*/
|
||||
dfn {
|
||||
font-style: italic; }
|
||||
|
||||
/**
|
||||
* Address variable `h1` font-size and margin within `section` and `article`
|
||||
* contexts in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0; }
|
||||
|
||||
/**
|
||||
* Address inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
small {
|
||||
font-size: 80%; }
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline; }
|
||||
|
||||
sup {
|
||||
top: -0.5em; }
|
||||
|
||||
sub {
|
||||
bottom: -0.25em; }
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
/**
|
||||
* Correct overflow not hidden in IE 9/10/11.
|
||||
*/
|
||||
svg:not(:root) {
|
||||
overflow: hidden; }
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
/**
|
||||
* Address margin not present in IE 8/9 and Safari.
|
||||
*/
|
||||
figure {
|
||||
margin: 1em 40px; }
|
||||
|
||||
/**
|
||||
* Address differences between Firefox and other browsers.
|
||||
*/
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
height: 0; }
|
||||
|
||||
/**
|
||||
* Contain overflow in all browsers.
|
||||
*/
|
||||
pre {
|
||||
overflow: auto; }
|
||||
|
||||
/**
|
||||
* Address odd `em`-unit font size rendering in all browsers.
|
||||
*/
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em; }
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
/**
|
||||
* Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
* styling of `select`, unless a `border` property is set.
|
||||
*/
|
||||
/**
|
||||
* 1. Correct color not being inherited.
|
||||
* Known issue: affects color of disabled elements.
|
||||
* 2. Correct font properties not being inherited.
|
||||
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit;
|
||||
/* 1 */
|
||||
font: inherit;
|
||||
/* 2 */
|
||||
margin: 0;
|
||||
/* 3 */ }
|
||||
|
||||
/**
|
||||
* Address `overflow` set to `hidden` in IE 8/9/10/11.
|
||||
*/
|
||||
button {
|
||||
overflow: visible; }
|
||||
|
||||
/**
|
||||
* Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
* All other form control elements do not inherit `text-transform` values.
|
||||
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||
* Correct `select` style inheritance in Firefox.
|
||||
*/
|
||||
button,
|
||||
select {
|
||||
text-transform: none; }
|
||||
|
||||
/**
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Correct inability to style clickable `input` types in iOS.
|
||||
* 3. Improve usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
*/
|
||||
button,
|
||||
html input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
/* 2 */
|
||||
cursor: pointer;
|
||||
/* 3 */ }
|
||||
|
||||
/**
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default; }
|
||||
|
||||
/**
|
||||
* Remove inner padding and border in Firefox 4+.
|
||||
*/
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0; }
|
||||
|
||||
/**
|
||||
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
input {
|
||||
line-height: normal; }
|
||||
|
||||
/**
|
||||
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
* `font-size` values of the `input`, it causes the cursor style of the
|
||||
* decrement button to change from `default` to `text`.
|
||||
*/
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto; }
|
||||
|
||||
/**
|
||||
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
/* 1 */
|
||||
/* 2 */
|
||||
box-sizing: content-box; }
|
||||
|
||||
/**
|
||||
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
* Safari (but not Chrome) clips the cancel button when the search input has
|
||||
* padding (and `textfield` appearance).
|
||||
*/
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none; }
|
||||
|
||||
/**
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em; }
|
||||
|
||||
/**
|
||||
* 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
*/
|
||||
legend {
|
||||
border: 0;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove default vertical scrollbar in IE 8/9/10/11.
|
||||
*/
|
||||
textarea {
|
||||
overflow: auto; }
|
||||
|
||||
/**
|
||||
* Don't inherit the `font-weight` (applied by a rule above).
|
||||
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
*/
|
||||
optgroup {
|
||||
font-weight: bold; }
|
||||
|
||||
/* Tables
|
||||
========================================================================== */
|
||||
/**
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0; }
|
||||
|
||||
.grd {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem; }
|
||||
|
||||
.grd-row {
|
||||
box-sizing: border-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
max-width: 100%; }
|
||||
|
||||
.grd-row-col-1-6 {
|
||||
max-width: 16.6666666667%;
|
||||
-ms-flex-preferred-size: 16.6666666667%;
|
||||
flex-basis: 16.6666666667%; }
|
||||
|
||||
.grd-row-col-2-6 {
|
||||
max-width: 33.3333333333%;
|
||||
-ms-flex-preferred-size: 33.3333333333%;
|
||||
flex-basis: 33.3333333333%; }
|
||||
|
||||
.grd-row-col-3-6 {
|
||||
max-width: 50%;
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%; }
|
||||
|
||||
.grd-row-col-4-6 {
|
||||
max-width: 66.6666666667%;
|
||||
-ms-flex-preferred-size: 66.6666666667%;
|
||||
flex-basis: 66.6666666667%; }
|
||||
|
||||
.grd-row-col-5-6 {
|
||||
max-width: 83.3333333333%;
|
||||
-ms-flex-preferred-size: 83.3333333333%;
|
||||
flex-basis: 83.3333333333%; }
|
||||
|
||||
.grd-row-col-6 {
|
||||
max-width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; }
|
||||
|
||||
.grd-row-col-1-6, .grd-row-col-1-6--sm, .grd-row-col-1-6--md, .grd-row-col-1-6--lg, .grd-row-col-2-6, .grd-row-col-2-6--sm, .grd-row-col-2-6--md, .grd-row-col-2-6--lg, .grd-row-col-3-6, .grd-row-col-3-6--sm, .grd-row-col-3-6--md, .grd-row-col-3-6--lg, .grd-row-col-4-6, .grd-row-col-4-6--sm, .grd-row-col-4-6--md, .grd-row-col-4-6--lg, .grd-row-col-5-6, .grd-row-col-5-6--sm, .grd-row-col-5-6--md, .grd-row-col-5-6--lg, .grd-row-col-6, .grd-row-col-6--sm, .grd-row-col-6--md, .grd-row-col-6--lg {
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box; }
|
||||
|
||||
.grd-row-col-1-6--sm, .grd-row-col-1-6--md, .grd-row-col-1-6--lg, .grd-row-col-2-6--sm, .grd-row-col-2-6--md, .grd-row-col-2-6--lg, .grd-row-col-3-6--sm, .grd-row-col-3-6--md, .grd-row-col-3-6--lg, .grd-row-col-4-6--sm, .grd-row-col-4-6--md, .grd-row-col-4-6--lg, .grd-row-col-5-6--sm, .grd-row-col-5-6--md, .grd-row-col-5-6--lg, .grd-row-col-6--sm, .grd-row-col-6--md, .grd-row-col-6--lg {
|
||||
max-width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; }
|
||||
|
||||
@media screen and (min-width: 32rem) {
|
||||
.grd-row-col-1-6--sm {
|
||||
max-width: 16.6666666667%;
|
||||
-ms-flex-preferred-size: 16.6666666667%;
|
||||
flex-basis: 16.6666666667%; }
|
||||
.grd-row-col-2-6--sm {
|
||||
max-width: 33.3333333333%;
|
||||
-ms-flex-preferred-size: 33.3333333333%;
|
||||
flex-basis: 33.3333333333%; }
|
||||
.grd-row-col-3-6--sm {
|
||||
max-width: 50%;
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%; }
|
||||
.grd-row-col-4-6--sm {
|
||||
max-width: 66.6666666667%;
|
||||
-ms-flex-preferred-size: 66.6666666667%;
|
||||
flex-basis: 66.6666666667%; }
|
||||
.grd-row-col-5-6--sm {
|
||||
max-width: 83.3333333333%;
|
||||
-ms-flex-preferred-size: 83.3333333333%;
|
||||
flex-basis: 83.3333333333%; }
|
||||
.grd-row-col-6--sm {
|
||||
max-width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; } }
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
.grd-row-col-1-6--md {
|
||||
max-width: 16.6666666667%;
|
||||
-ms-flex-preferred-size: 16.6666666667%;
|
||||
flex-basis: 16.6666666667%; }
|
||||
.grd-row-col-2-6--md {
|
||||
max-width: 33.3333333333%;
|
||||
-ms-flex-preferred-size: 33.3333333333%;
|
||||
flex-basis: 33.3333333333%; }
|
||||
.grd-row-col-3-6--md {
|
||||
max-width: 50%;
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%; }
|
||||
.grd-row-col-4-6--md {
|
||||
max-width: 66.6666666667%;
|
||||
-ms-flex-preferred-size: 66.6666666667%;
|
||||
flex-basis: 66.6666666667%; }
|
||||
.grd-row-col-5-6--md {
|
||||
max-width: 83.3333333333%;
|
||||
-ms-flex-preferred-size: 83.3333333333%;
|
||||
flex-basis: 83.3333333333%; }
|
||||
.grd-row-col-6--md {
|
||||
max-width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; } }
|
||||
|
||||
@media screen and (min-width: 64rem) {
|
||||
.grd-row-col-1-6--lg {
|
||||
max-width: 16.6666666667%;
|
||||
-ms-flex-preferred-size: 16.6666666667%;
|
||||
flex-basis: 16.6666666667%; }
|
||||
.grd-row-col-2-6--lg {
|
||||
max-width: 33.3333333333%;
|
||||
-ms-flex-preferred-size: 33.3333333333%;
|
||||
flex-basis: 33.3333333333%; }
|
||||
.grd-row-col-3-6--lg {
|
||||
max-width: 50%;
|
||||
-ms-flex-preferred-size: 50%;
|
||||
flex-basis: 50%; }
|
||||
.grd-row-col-4-6--lg {
|
||||
max-width: 66.6666666667%;
|
||||
-ms-flex-preferred-size: 66.6666666667%;
|
||||
flex-basis: 66.6666666667%; }
|
||||
.grd-row-col-5-6--lg {
|
||||
max-width: 83.3333333333%;
|
||||
-ms-flex-preferred-size: 83.3333333333%;
|
||||
flex-basis: 83.3333333333%; }
|
||||
.grd-row-col-6--lg {
|
||||
max-width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; } }
|
||||
|
||||
*, *::after, *::before {
|
||||
box-sizing: border-box; }
|
||||
|
||||
.measure {
|
||||
max-width: 48rem;
|
||||
margin: 0 auto; }
|
||||
|
||||
a {
|
||||
color: #3498db; }
|
||||
a:hover, a:focus, a:active {
|
||||
color: #217dbb; }
|
||||
|
||||
.bg--red {
|
||||
background-color: #e74c3c; }
|
||||
|
||||
.bg--orange {
|
||||
background-color: #f39c12; }
|
||||
|
||||
.bg--blue {
|
||||
background-color: #3498db; }
|
||||
|
||||
.bg--green {
|
||||
background-color: #25ba84; }
|
||||
|
||||
.bg--white {
|
||||
background-color: #fff; }
|
||||
|
||||
.bg--light-gray {
|
||||
background-color: rgba(216, 216, 216, 0.99); }
|
||||
|
||||
.bg--mid-gray {
|
||||
background-color: rgba(144, 144, 144, 0.99); }
|
||||
|
||||
.bg--dark-gray {
|
||||
background-color: rgba(72, 72, 72, 0.99); }
|
||||
|
||||
.bg--off-white {
|
||||
background-color: rgba(250, 250, 250, 0.99); }
|
||||
|
||||
.fnt--red {
|
||||
color: #e74c3c; }
|
||||
|
||||
.fnt--orange {
|
||||
color: #f39c12; }
|
||||
|
||||
.fnt--blue {
|
||||
color: #3498db; }
|
||||
|
||||
.fnt--green {
|
||||
color: #25ba84; }
|
||||
|
||||
.fnt--white {
|
||||
color: #fff; }
|
||||
|
||||
.fnt--light-gray {
|
||||
color: rgba(216, 216, 216, 0.99); }
|
||||
|
||||
.fnt--mid-gray {
|
||||
color: rgba(144, 144, 144, 0.99); }
|
||||
|
||||
.fnt--dark-gray {
|
||||
color: rgba(72, 72, 72, 0.99); }
|
||||
|
||||
.fnt--off-white {
|
||||
color: rgba(250, 250, 250, 0.99); }
|
||||
|
||||
.m0 {
|
||||
margin: 0; }
|
||||
|
||||
.mx0 {
|
||||
margin-left: 0;
|
||||
margin-right: 0; }
|
||||
|
||||
.my0 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0; }
|
||||
|
||||
.m1 {
|
||||
margin: 1rem; }
|
||||
|
||||
.mx1 {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem; }
|
||||
|
||||
.my1 {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem; }
|
||||
|
||||
.m2 {
|
||||
margin: 2rem; }
|
||||
|
||||
.mx2 {
|
||||
margin-left: 2rem;
|
||||
margin-right: 2rem; }
|
||||
|
||||
.my2 {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem; }
|
||||
|
||||
.p0 {
|
||||
padding: 0; }
|
||||
|
||||
.px0 {
|
||||
padding-left: 0;
|
||||
padding-right: 0; }
|
||||
|
||||
.py0 {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0; }
|
||||
|
||||
.p1 {
|
||||
padding: 1rem; }
|
||||
|
||||
.px1 {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem; }
|
||||
|
||||
.py1 {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem; }
|
||||
|
||||
.p2 {
|
||||
padding: 2rem; }
|
||||
|
||||
.px2 {
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem; }
|
||||
|
||||
.py2 {
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 2rem; }
|
||||
|
||||
html {
|
||||
font-size: 12px; }
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px; } }
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px; } }
|
||||
|
||||
body {
|
||||
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-weight: 400;
|
||||
line-height: 1.85;
|
||||
color: #333; }
|
||||
|
||||
p,
|
||||
.p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem; }
|
||||
|
||||
h1,
|
||||
.h1,
|
||||
h2,
|
||||
.h2,
|
||||
h3,
|
||||
.h3,
|
||||
h4,
|
||||
.h4 {
|
||||
margin: 1.414rem 0 0.5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42; }
|
||||
|
||||
h1,
|
||||
.h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem; }
|
||||
|
||||
h2,
|
||||
.h2 {
|
||||
font-size: 2.827rem; }
|
||||
|
||||
h3,
|
||||
.h3 {
|
||||
font-size: 1.999rem; }
|
||||
|
||||
h4,
|
||||
.h4 {
|
||||
font-size: 1.414rem; }
|
||||
|
||||
h5,
|
||||
.h5,
|
||||
table th {
|
||||
font-size: 1.121rem; }
|
||||
|
||||
h6,
|
||||
.h6 {
|
||||
font-size: .88rem; }
|
||||
|
||||
small,
|
||||
.small,
|
||||
.btn--s {
|
||||
font-size: 0.707em; }
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: "Monaco", "Lucida Console", Courier, monospace; }
|
||||
|
||||
.italic {
|
||||
font-style: italic; }
|
||||
|
||||
.thin {
|
||||
font-weight: 100; }
|
||||
|
||||
.bold {
|
||||
font-weight: bold; }
|
||||
|
||||
.caps, table th {
|
||||
font-variant: small-caps; }
|
||||
|
||||
.justify {
|
||||
text-align: justify; }
|
||||
|
||||
.ellipsis {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden; }
|
||||
|
||||
.muted {
|
||||
opacity: .7; }
|
||||
|
||||
.clearfix:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both; }
|
||||
|
||||
.flt--left {
|
||||
float: left; }
|
||||
|
||||
.flt--right {
|
||||
float: right; }
|
||||
|
||||
.flt--none {
|
||||
float: none; }
|
||||
|
||||
.center {
|
||||
margin: auto auto; }
|
||||
|
||||
.txt--center {
|
||||
text-align: center; }
|
||||
|
||||
.txt--right {
|
||||
text-align: right; }
|
||||
|
||||
.txt--left, table th {
|
||||
text-align: left; }
|
||||
|
||||
.oflow-y--scroll {
|
||||
overflow-y: scroll; }
|
||||
|
||||
.w100,
|
||||
.w100--s {
|
||||
width: 100%;
|
||||
display: block; }
|
||||
|
||||
@media screen and (min-width: 32rem) {
|
||||
.w100--s {
|
||||
width: auto;
|
||||
display: inline-block; } }
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%; }
|
||||
|
||||
.brdr--rounded, .btn, .btn--link, .btn--blue, .btn--green, .btn--gray, .btn--red {
|
||||
border-radius: 3px; }
|
||||
|
||||
.brdr--light-gray {
|
||||
border: thin solid rgba(216, 216, 216, 0.99); }
|
||||
|
||||
.brdr--mid-gray {
|
||||
border: thin solid rgba(144, 144, 144, 0.99); }
|
||||
|
||||
.brdr--dark-gray {
|
||||
border: thin solid rgba(72, 72, 72, 0.99); }
|
||||
|
||||
.brdr--off-white {
|
||||
border: thin solid rgba(250, 250, 250, 0.99); }
|
||||
|
||||
.btn, .btn--link, .btn--blue, .btn--green, .btn--gray, .btn--red {
|
||||
padding: 0.5rem 1rem;
|
||||
border: 2px solid #ccc;
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
background: transparent; }
|
||||
|
||||
.btn:hover, .btn:focus, .btn:active {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
color: black; }
|
||||
|
||||
.btn--link {
|
||||
border-color: transparent;
|
||||
color: #3498db; }
|
||||
.btn--link:hover {
|
||||
background-color: transparent;
|
||||
color: #1d6fa5; }
|
||||
|
||||
.btn--blue {
|
||||
border-color: #2791d9;
|
||||
background-color: #3498db;
|
||||
color: #fff; }
|
||||
.btn--blue:hover, .btn--blue:focus, .btn--blue:active {
|
||||
color: #fff;
|
||||
background-color: #217dbb; }
|
||||
|
||||
.btn--green {
|
||||
border-color: #22a978;
|
||||
background-color: #25ba84;
|
||||
color: #fff; }
|
||||
.btn--green:hover, .btn--green:focus, .btn--green:active {
|
||||
color: #fff;
|
||||
background-color: #1d8f66; }
|
||||
|
||||
.btn--gray {
|
||||
border-color: rgba(59, 59, 59, 0.99);
|
||||
background-color: rgba(72, 72, 72, 0.99);
|
||||
color: #fff; }
|
||||
.btn--gray:hover, .btn--gray:focus, .btn--gray:active {
|
||||
color: #fff;
|
||||
background-color: rgba(47, 47, 47, 0.99); }
|
||||
|
||||
.btn--red {
|
||||
border-color: #e43725;
|
||||
background-color: #e74c3c;
|
||||
color: #fff; }
|
||||
.btn--red:hover, .btn--red:focus, .btn--red:active {
|
||||
color: #fff;
|
||||
background-color: #d62c1a; }
|
||||
|
||||
.btn--s {
|
||||
padding: 0.5rem; }
|
||||
|
||||
.list--unstyled {
|
||||
list-style-type: none; }
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
padding: .5rem;
|
||||
margin-bottom: .5rem;
|
||||
display: block;
|
||||
width: 100%;
|
||||
box-shadow: none;
|
||||
border: thin solid rgba(216, 216, 216, 0.99); }
|
||||
|
||||
input[type="submit"] {
|
||||
margin-top: .85rem; }
|
||||
|
||||
input[type="checkbox"] {
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
width: auto; }
|
||||
|
||||
.media {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: start;
|
||||
align-items: flex-start; }
|
||||
|
||||
.media .media-figure {
|
||||
margin-right: 1em; }
|
||||
|
||||
.media .media-body {
|
||||
-ms-flex: 1 0 0;
|
||||
flex: 1 0 0; }
|
||||
|
||||
table > thead {
|
||||
border-bottom: thin solid rgba(250, 250, 250, 0.99); }
|
||||
|
||||
table th,
|
||||
table td {
|
||||
padding: .25rem;
|
||||
word-wrap: normal;
|
||||
line-height: 1; }
|
@ -0,0 +1,502 @@
|
||||
@import 'https://fonts.googleapis.com/css?family=Fira+Mono|Noto+Serif|Noto+Sans:300,400,500';
|
||||
|
||||
:root {
|
||||
--font-header: "Noto Sans", "Arial", "Helvetica", sans-serif;
|
||||
--font-main: "Noto Serif", "Arial", "Helvetica", sans-serif;
|
||||
--font-mono: "Menlo", "Fira Mono", monospace;
|
||||
|
||||
--font-size: 16px;
|
||||
|
||||
/* Primary ysed for hero gradient and links */
|
||||
--colorscheme-accent-one: #6FC0AA;
|
||||
--colorscheme-accent-two: #4A73A1;
|
||||
|
||||
/* Background color and the general colors of borders
|
||||
* or hovered elements */
|
||||
--colorscheme-bg-light: #FDFDFD;
|
||||
--colorscheme-bg-dark: #E6E6E6;
|
||||
|
||||
/* Normal text vs Header text vs Pre */
|
||||
--colorscheme-fg-dark: #132A44;
|
||||
--colorscheme-fg-light: #475F7B;
|
||||
--colorscheme-fg-code: #666666;
|
||||
|
||||
--hero-gradient: radial-gradient(circle, var(--colorscheme-accent-one), var(--colorscheme-accent-two));
|
||||
--hero-height: 84vh;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: var(--font-main);
|
||||
font-size: var(--font-size);
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--colorscheme-bg-light);
|
||||
color: var(--colorscheme-fg-light);
|
||||
margin: 0 auto;
|
||||
max-width: 800px;
|
||||
line-height: 2;
|
||||
padding: 4em;
|
||||
}
|
||||
|
||||
/* Header theme */
|
||||
body > header {
|
||||
min-height: var(--hero-height);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
line-height: 1.5;
|
||||
background: var(--hero-gradient);
|
||||
border-bottom: 1px solid var(--background-color-darkest);
|
||||
padding: 4em 1em;
|
||||
}
|
||||
|
||||
body > header > * {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
body > header > img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
object-fit: cover;
|
||||
opacity: 0.75;
|
||||
transform: translate3d(0, 0, 0);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
body > header > h1,
|
||||
body > header > h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
body > header > h1 {
|
||||
position: relative;
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
body > header > h2 {
|
||||
margin: 0;
|
||||
position: relative;
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
body > header > nav {
|
||||
position: absolute;
|
||||
top: 2rem;
|
||||
right: 2.5rem;
|
||||
}
|
||||
|
||||
body > header > nav a {
|
||||
color: var(--colorscheme-fg-dark);
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
|
||||
body > header + * {
|
||||
margin-top: var(--hero-height);
|
||||
}
|
||||
|
||||
body > header + nav:before {
|
||||
content: "Navigation: ";
|
||||
padding-right: 1em;
|
||||
}
|
||||
|
||||
body > header + nav {
|
||||
margin-top: calc(var(--hero-height) - 1em);
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
body > header + nav a {
|
||||
padding: 0.25em;
|
||||
margin: 0 0.5em;
|
||||
}
|
||||
|
||||
/* Generic styling */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
th,
|
||||
caption,
|
||||
strong {
|
||||
color: var(--colorscheme-fg-dark);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
th,
|
||||
caption {
|
||||
margin: 1rem 0 0.5rem 0;
|
||||
font-family: var(--font-header);
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.025em
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.2rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.15rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
caption,
|
||||
th {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
h1 + h1,
|
||||
h1 + h2,
|
||||
h1 + h3,
|
||||
h1 + h4,
|
||||
h1 + h5,
|
||||
h1 + h6,
|
||||
h2 + h1,
|
||||
h2 + h2,
|
||||
h2 + h3,
|
||||
h2 + h4,
|
||||
h2 + h5,
|
||||
h2 + h6,
|
||||
h3 + h1,
|
||||
h3 + h2,
|
||||
h3 + h3,
|
||||
h3 + h4,
|
||||
h3 + h5,
|
||||
h3 + h6,
|
||||
h4 + h1,
|
||||
h4 + h2,
|
||||
h4 + h3,
|
||||
h4 + h4,
|
||||
h4 + h5,
|
||||
h4 + h6,
|
||||
h5 + h1,
|
||||
h5 + h2,
|
||||
h5 + h3,
|
||||
h5 + h4,
|
||||
h5 + h5,
|
||||
h5 + h6,
|
||||
h6 + h1,
|
||||
h6 + h2,
|
||||
h6 + h3,
|
||||
h6 + h4,
|
||||
h6 + h5,
|
||||
h6 + h6 {
|
||||
margin-top: -0.5rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
b, strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
em, i {
|
||||
font-style: oblique;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0.75em 0;
|
||||
}
|
||||
|
||||
code,
|
||||
pre {
|
||||
font-family: "Fira Mono", monospace;
|
||||
color: var(--colorscheme-fg-code);
|
||||
background-color: var(--colorscheme-bg-dark);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 1em;
|
||||
margin: 0.5em 0;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0.15em 0.25em;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
height: 1px;
|
||||
background: var(--colorscheme-bg-dark);
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--colorscheme-accent-one);
|
||||
text-decoration: none;
|
||||
padding: 0 0.1em;
|
||||
height: 1.25em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--colorscheme-accent-two);
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
text-align: justify;
|
||||
margin: 2rem 0 2rem 0;
|
||||
}
|
||||
|
||||
tr {
|
||||
border-bottom: 1px solid var(--colorscheme-bg-dark);
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: var(--colorscheme-bg-dark);
|
||||
}
|
||||
|
||||
td, th {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
th {
|
||||
text-transform: uppercase;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: square;
|
||||
}
|
||||
|
||||
ul > ul,
|
||||
ol > ol,
|
||||
ul > ol,
|
||||
ol > ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: plain;
|
||||
}
|
||||
|
||||
li {
|
||||
padding-left: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
small,
|
||||
sub,
|
||||
sup {
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-style: italic;
|
||||
margin: 0.5em 1.5em 0.75em 1.5em;
|
||||
padding-left: 0.75em;
|
||||
padding-bottom: 0.25em;
|
||||
border-left: 0.25em solid var(--colorscheme-fg-dark);
|
||||
}
|
||||
|
||||
/* Form Element stuff */
|
||||
fieldset {
|
||||
border: 1px solid var(--colorscheme-bg-dark);
|
||||
padding: 0.5rem 1.5rem;
|
||||
}
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
input, select, button {
|
||||
font-family: var(--font-main);
|
||||
font-size: 1em;
|
||||
margin: 0 0 1rem 0;
|
||||
padding: 0.25rem;
|
||||
color: var(--colorscheme-fg-light);
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="url"],
|
||||
input[type="tel"],
|
||||
input[type="number"],
|
||||
input[type="color"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
input[type="search"] {
|
||||
display: block;
|
||||
background-color: inherit;
|
||||
border: none;
|
||||
border-bottom: 1px solid var(--colorscheme-bg-dark);
|
||||
transition: 0.5s ease-in-out border-bottom;
|
||||
}
|
||||
|
||||
input[type="text"]:focus,
|
||||
input[type="url"]:focus,
|
||||
input[type="tel"]:focus,
|
||||
input[type="number"]:focus,
|
||||
input[type="color"]:focus,
|
||||
input[type="email"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="search"]:focus {
|
||||
border-bottom: 1px solid var(--colorscheme-fg-light);
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
button {
|
||||
display: inline-block;
|
||||
padding: 0.5rem;
|
||||
margin: 0.25rem;
|
||||
border: 1px solid var(--colorscheme-bg-dark);
|
||||
background-color: var(--colorscheme-bg-light);
|
||||
cursor: pointer;
|
||||
transition: 0.5s ease-in-out border-color;
|
||||
}
|
||||
|
||||
input[type="submit"]:hover,
|
||||
input[type="button"]:hover,
|
||||
input[type="reset"]:hover,
|
||||
button:hover {
|
||||
border: 1px solid var(--colorscheme-fg-dark);
|
||||
}
|
||||
|
||||
select {
|
||||
display: block;
|
||||
border: 1px solid var(--colorscheme-bg-dark);
|
||||
padding: 0.25rem 0.5rem;
|
||||
background-color: var(--colorscheme-bg-light);
|
||||
transition: 0.5s ease-in-out border-color;
|
||||
}
|
||||
|
||||
select:hover {
|
||||
border: 1px solid var(--colorscheme-fg-dark);
|
||||
}
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
margin-left: 0.5rem;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-family: var(--font-main);
|
||||
border: 1px solid var(--colorscheme-bg-dark);
|
||||
padding: 0.5rem;
|
||||
min-height: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
textarea[disabled],
|
||||
select[disabled],
|
||||
input[disabled],
|
||||
button[disabled],
|
||||
input[disabled]::placeholder,
|
||||
textarea[disabled]::placeholder {
|
||||
color: #AAAAAA;
|
||||
cursor: not-allowed;
|
||||
opacity: 0.5;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
/* Media Queries */
|
||||
@media (max-width: 50em) {
|
||||
:root {
|
||||
--hero-height: 90vh;
|
||||
--font-size: 12px;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 1.5em;
|
||||
}
|
||||
|
||||
body > header + nav {
|
||||
margin-top: calc(var(--hero-height));
|
||||
}
|
||||
|
||||
body > header + nav:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
table, table * {
|
||||
display: block;
|
||||
}
|
||||
|
||||
tr {
|
||||
border: none;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: initial;
|
||||
}
|
||||
|
||||
th {
|
||||
display: none;
|
||||
}
|
||||
|
||||
td {
|
||||
border-bottom: 1px solid var(--colorscheme-bg-dark);
|
||||
}
|
||||
|
||||
td:hover {
|
||||
background-color: var(--colorscheme-bg-dark);
|
||||
}
|
||||
|
||||
td[data-label] {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
td[data-label]:before {
|
||||
content: attr(data-label);
|
||||
float: left;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
@ -0,0 +1 @@
|
||||
body{box-sizing:border-box;min-width:200px;max-width:980px;margin:0 auto;padding:45px;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;line-height:1.5;color:#24292e;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;font-size:16px;line-height:1.5;word-wrap:break-word}details{display:block}summary{display:list-item}a{background-color:initial}a:active,a:hover{outline-width:0}strong{font-weight:inherit;font-weight:bolder}h1{font-size:2em;margin:.67em 0}img{border-style:none}code,kbd,pre{font-family:monospace,monospace;font-size:1em}hr{box-sizing:initial;height:0;overflow:visible}input{font:inherit;margin:0}input{overflow:visible}[type=checkbox]{box-sizing:border-box;padding:0}*{box-sizing:border-box}input{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#0366d6;text-decoration:none}a:hover{text-decoration:underline}strong{font-weight:600}hr{height:0;margin:15px 0;overflow:hidden;background:0 0;border:0;border-bottom:1px solid #dfe2e5}hr:after,hr:before{display:table;content:""}hr:after{clear:both}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}details summary{cursor:pointer}kbd{display:inline-block;padding:3px 5px;font:11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;line-height:10px;color:#444d56;vertical-align:middle;background-color:#fafbfc;border:1px solid #d1d5da;border-radius:3px;box-shadow:inset 0 -1px 0 #d1d5da}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0}h1{font-size:32px}h1,h2{font-weight:600}h2{font-size:24px}h3{font-size:20px}h3,h4{font-weight:600}h4{font-size:16px}h5{font-size:14px}h5,h6{font-weight:600}h6{font-size:12px}p{margin-top:0;margin-bottom:10px}blockquote{margin:0}ol,ul{padding-left:0;margin-top:0;margin-bottom:0}ol ol,ul ol{list-style-type:lower-roman}ol ol ol,ol ul ol,ul ol ol,ul ul ol{list-style-type:lower-alpha}dd{margin-left:0}code,pre{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px}pre{margin-top:0;margin-bottom:0}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;appearance:none}hr{border-bottom-color:#eee}kbd{display:inline-block;padding:3px 5px;font:11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;line-height:10px;color:#444d56;vertical-align:middle;background-color:#fafbfc;border:1px solid #d1d5da;border-radius:3px;box-shadow:inset 0 -1px 0 #d1d5da}body:after,body:before{display:table;content:""}body:after{clear:both}body>:first-child{margin-top:0!important}body>:last-child{margin-bottom:0!important}a:not([href]){color:inherit;text-decoration:none}blockquote,details,dl,ol,p,pre,table,ul{margin-top:0;margin-bottom:16px}hr{height:.25em;padding:0;margin:24px 0;background-color:#e1e4e8;border:0}blockquote{padding:0 1em;color:#6a737d;border-left:.25em solid #dfe2e5}blockquote>:first-child{margin-top:0}blockquote>:last-child{margin-bottom:0}h1,h2,h3,h4,h5,h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}h1{font-size:2em}h1,h2{padding-bottom:.3em;border-bottom:1px solid #eaecef}h2{font-size:1.5em}h3{font-size:1.25em}h4{font-size:1em}h5{font-size:.875em}h6{font-size:.85em;color:#6a737d}ol,ul{padding-left:2em}ol ol,ol ul,ul ol,ul ul{margin-top:0;margin-bottom:0}li{word-wrap:break-all}li>p{margin-top:16px}li+li{margin-top:.25em}dl{padding:0}dl dt{padding:0;margin-top:16px;font-size:1em;font-style:italic;font-weight:600}dl dd{padding:0 16px;margin-bottom:16px}table{display:block;width:100%;overflow:auto}table th{font-weight:600}table td,table th{padding:6px 13px;border:1px solid #dfe2e5}table tr{background-color:#fff;border-top:1px solid #c6cbd1}table tr:nth-child(2n){background-color:#f6f8fa}img{max-width:100%;box-sizing:initial;background-color:#fff}img[align=right]{padding-left:20px}img[align=left]{padding-right:20px}code{padding:.2em .4em;margin:0;font-size:85%;background-color:rgba(27,31,35,.05);border-radius:3px}pre{word-wrap:normal}pre>code{padding:0;margin:0;font-size:100%;word-break:normal;white-space:pre;background:0 0;border:0}pre code{display:inline;max-width:auto;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:initial;border:0}
|
File diff suppressed because one or more lines are too long
@ -0,0 +1,858 @@
|
||||
/*! modern-normalize v0.6.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
|
||||
|
||||
/*
|
||||
Document
|
||||
========
|
||||
*/
|
||||
|
||||
/**
|
||||
Use a better box model (opinionated).
|
||||
*/
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/**
|
||||
Use a more readable tab size (opinionated).
|
||||
*/
|
||||
|
||||
:root {
|
||||
-moz-tab-size: 4;
|
||||
tab-size: 4;
|
||||
}
|
||||
|
||||
/**
|
||||
1. Correct the line height in all browsers.
|
||||
2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Sections
|
||||
========
|
||||
*/
|
||||
|
||||
/**
|
||||
Remove the margin in all browsers.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
|
||||
*/
|
||||
|
||||
body {
|
||||
font-family:
|
||||
system-ui,
|
||||
-apple-system, /* Firefox supports this but not yet `system-ui` */
|
||||
'Segoe UI',
|
||||
Roboto,
|
||||
Helvetica,
|
||||
Arial,
|
||||
sans-serif,
|
||||
'Apple Color Emoji',
|
||||
'Segoe UI Emoji';
|
||||
}
|
||||
|
||||
/*
|
||||
Grouping content
|
||||
================
|
||||
*/
|
||||
|
||||
/**
|
||||
Add the correct height in Firefox.
|
||||
*/
|
||||
|
||||
hr {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
Text-level semantics
|
||||
====================
|
||||
*/
|
||||
|
||||
/**
|
||||
Add the correct text decoration in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
/**
|
||||
Add the correct font weight in Edge and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
|
||||
2. Correct the odd 'em' font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp,
|
||||
pre {
|
||||
font-family:
|
||||
SFMono-Regular,
|
||||
Consolas,
|
||||
'Liberation Mono',
|
||||
Menlo,
|
||||
monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/*
|
||||
Forms
|
||||
=====
|
||||
*/
|
||||
|
||||
/**
|
||||
1. Change the font styles in all browsers.
|
||||
2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
Remove the inheritance of text transform in Edge and Firefox.
|
||||
1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type='button'],
|
||||
[type='reset'],
|
||||
[type='submit'] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/**
|
||||
Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type='button']::-moz-focus-inner,
|
||||
[type='reset']::-moz-focus-inner,
|
||||
[type='submit']::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type='button']:-moz-focusring,
|
||||
[type='reset']:-moz-focusring,
|
||||
[type='submit']:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em;
|
||||
}
|
||||
|
||||
/**
|
||||
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
Add the correct vertical alignment in Chrome and Firefox.
|
||||
*/
|
||||
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/**
|
||||
Correct the cursor style of increment and decrement buttons in Safari.
|
||||
*/
|
||||
|
||||
[type='number']::-webkit-inner-spin-button,
|
||||
[type='number']::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
1. Correct the odd appearance in Chrome and Safari.
|
||||
2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type='search'] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type='search']::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
1. Correct the inability to style clickable types in iOS and Safari.
|
||||
2. Change font properties to 'inherit' in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
Interactive
|
||||
===========
|
||||
*/
|
||||
|
||||
/*
|
||||
Add the correct display in Chrome and Safari.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
button,
|
||||
summary,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"],
|
||||
[type="color"],
|
||||
[type="file"],
|
||||
label > [type="checkbox"]:not(:disabled),
|
||||
label > [type="radio"]:not(:disabled) {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
[readonly] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/* stylelint-disable selector-no-qualifying-type */
|
||||
:disabled,
|
||||
[type="checkbox"][id]:disabled + label[for],
|
||||
[type="radio"][id]:disabled + label[for] {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
/* stylelint-enable */
|
||||
|
||||
abbr {
|
||||
cursor: help;
|
||||
}
|
||||
[href^="mailto:"]::before,
|
||||
[href^="sms:"]::before {
|
||||
content: "✉ ";
|
||||
}
|
||||
|
||||
[href^="tel:"]::before,
|
||||
[href^="callto:"]::before,
|
||||
[href^="skype:"]::before {
|
||||
content: "✆ ";
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
body {
|
||||
max-width: 768px;
|
||||
}
|
||||
}
|
||||
body {
|
||||
margin: 0.5rem auto;
|
||||
width: calc(100% - 1rem);
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
table {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
pre code {
|
||||
display: inline-block;
|
||||
min-width: 100%;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
kbd {
|
||||
padding: 0.5rem;
|
||||
min-width: 2.25rem;
|
||||
min-height: 2rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 0.25rem;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
kbd kbd {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
min-width: unset;
|
||||
min-height: unset;
|
||||
}
|
||||
|
||||
kbd kbd:not(:first-child) {
|
||||
padding-left: 0.25rem;
|
||||
}
|
||||
|
||||
kbd kbd:not(:last-child) {
|
||||
padding-right: 0.25rem;
|
||||
}
|
||||
|
||||
iframe {
|
||||
border: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
dialog {
|
||||
border: none;
|
||||
overflow-y: auto;
|
||||
max-height: calc(100% - 1rem);
|
||||
}
|
||||
|
||||
audio,
|
||||
video,
|
||||
embed,
|
||||
object {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
meter,
|
||||
progress {
|
||||
height: 2.25rem;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input:not([type="button"]):not([type="checkbox"]):not([type="image"]):not([type="radio"]):not([type="reset"]):not([type="submit"]) {
|
||||
height: 2.25rem;
|
||||
}
|
||||
|
||||
input:not([type="button"]):not([type="checkbox"]):not([type="image"]):not([type="radio"]):not([type="reset"]):not([type="submit"]):not([type="color"]),
|
||||
output {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"],
|
||||
input:not([type="checkbox"]):not([type="image"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="date"]):not([type="datetime-local"]):not([type="time"]):not([type="month"]):not([type="week"]) {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
[type="date"],
|
||||
[type="datetime-local"],
|
||||
[type="time"],
|
||||
[type="month"],
|
||||
[type="week"] {
|
||||
/* 0.4rem is a hack for mobile Chrome */
|
||||
padding: 0.4rem 0.5rem;
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height: 8em;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
select {
|
||||
min-height: 2.25rem;
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
/* "padding: 0.5rem;" messes up the height of selects */
|
||||
padding: 0.45rem 0.5rem;
|
||||
}
|
||||
|
||||
summary {
|
||||
min-height: 2.25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
[type="image"] {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
[type="color"] {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
padding: 0.75rem;
|
||||
}
|
||||
|
||||
label > [type="color"] {
|
||||
margin-left: 0.25rem;
|
||||
}
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
margin-top: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
legend + label {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
[type="checkbox"] + label,
|
||||
[type="radio"] + label {
|
||||
display: inline-flex;
|
||||
vertical-align: text-bottom;
|
||||
width: unset;
|
||||
}
|
||||
|
||||
fieldset > label:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
label > [type="checkbox"],
|
||||
label > [type="radio"] {
|
||||
margin-right: 0.25rem;
|
||||
min-height: 1rem;
|
||||
}
|
||||
|
||||
[type="file"] {
|
||||
/* Works in Chrome (but poorly), doesn't work in Firefox */
|
||||
padding-top: 0.35rem;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
padding: 1rem 2rem;
|
||||
}
|
||||
|
||||
blockquote > p:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
blockquote > p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
body > header,
|
||||
body > footer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
figure > figcaption {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-universal */
|
||||
figure > * {
|
||||
text-align: initial;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
nav ul {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
nav ul li {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
nav > ul > li {
|
||||
padding: 0.5rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
nav ul li a {
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
nav ul li ul {
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
z-index: 1;
|
||||
background-color: var(--background-color);
|
||||
border-radius: var(--border-radius);
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
margin-left: calc(-0.5rem - var(--border-width));
|
||||
margin-top: 0.5rem;
|
||||
padding: 0.25rem 0.5rem;
|
||||
min-width: calc(100% + var(--border-width) * 2);
|
||||
}
|
||||
|
||||
nav ul li ul li {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-compound-selectors, selector-max-type */
|
||||
nav ul li ul li ul {
|
||||
min-width: calc(100% + 1rem + var(--border-width) * 2);
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
nav :focus ~ ul,
|
||||
nav :focus ~ ul ul,
|
||||
nav ul ul:focus-within,
|
||||
nav ul li:hover ul {
|
||||
left: initial;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-universal */
|
||||
nav li > *:not(ul):not(:only-child) {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-universal */
|
||||
nav li > *:not(ul):not(:only-child)::after {
|
||||
content: " ▾";
|
||||
}
|
||||
}
|
||||
|
||||
@media not all and (hover: hover) {
|
||||
nav {
|
||||
padding-top: 2rem;
|
||||
border-radius: var(--border-radius);
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
background-image: url('data:image/svg+xml;utf8,<svg height="32px" id="Layer_1" style="enable-background:new 0 0 32 32;" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M4,10h24c1.104,0,2-0.896,2-2s-0.896-2-2-2H4C2.896,6,2,6.896,2,8S2.896,10,4,10z M28,14H4c-1.104,0-2,0.896-2,2 s0.896,2,2,2h24c1.104,0,2-0.896,2-2S29.104,14,28,14z M28,22H4c-1.104,0-2,0.896-2,2s0.896,2,2,2h24c1.104,0,2-0.896,2-2 S29.104,22,28,22z"/></svg>');
|
||||
background-repeat: no-repeat;
|
||||
background-position: top;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-universal */
|
||||
nav > * {
|
||||
display: none;
|
||||
}
|
||||
|
||||
nav:hover > ul {
|
||||
display: inherit;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-max-universal */
|
||||
nav:hover > *:not(ul) {
|
||||
display: unset;
|
||||
}
|
||||
}
|
||||
:root {
|
||||
--border-color: #dbdbdb;
|
||||
--border-hover-color: #b5b5b5;
|
||||
--background-color: #fff;
|
||||
--highlighted-background-color: #f5f5f5;
|
||||
--text-color: #000;
|
||||
--danger-color: #ff3860;
|
||||
--danger-hover-color: #f7375d;
|
||||
--success-color: #23d160;
|
||||
--success-hover-color: #22c65b;
|
||||
--danger-text-background-color: #ffe7ec;
|
||||
--success-text-background-color: #e4faec;
|
||||
--border-radius: 0.25rem;
|
||||
--border-width: 1px;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
fieldset {
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
[type="image"]:hover:not(:disabled) {
|
||||
filter: brightness(95%);
|
||||
}
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"],
|
||||
[type="color"] {
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
background: var(--background-color);
|
||||
color: var(--text-color);
|
||||
}
|
||||
|
||||
[type="reset"] {
|
||||
background-color: var(--danger-color);
|
||||
border-color: transparent;
|
||||
color: var(--background-color);
|
||||
}
|
||||
|
||||
[type="submit"],
|
||||
button:not([type]) {
|
||||
background-color: var(--success-color);
|
||||
border-color: transparent;
|
||||
color: var(--background-color);
|
||||
}
|
||||
|
||||
button:hover:not(:disabled),
|
||||
[type="button"]:hover:not(:disabled),
|
||||
[type="reset"]:hover:not(:disabled),
|
||||
[type="submit"]:hover:not(:disabled),
|
||||
[type="color"]:hover:not(:disabled) {
|
||||
border-color: var(--border-hover-color);
|
||||
}
|
||||
|
||||
[type="reset"]:hover:not(:disabled) {
|
||||
border-color: transparent;
|
||||
background-color: var(--danger-hover-color);
|
||||
}
|
||||
|
||||
[type="submit"]:hover:not(:disabled),
|
||||
button:not([type]):hover:not(:disabled) {
|
||||
border-color: transparent;
|
||||
background-color: var(--success-hover-color);
|
||||
}
|
||||
|
||||
input:not([type="button"]):not([type="checkbox"]):not([type="color"]):not([type="image"]):not([type="radio"]):not([type="reset"]):not([type="submit"]):not([type="file"]):not(:invalid),
|
||||
textarea,
|
||||
select,
|
||||
fieldset {
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
}
|
||||
|
||||
select:not(:disabled),
|
||||
[type="date"]:not(:disabled),
|
||||
[type="datetime-local"]:not(:disabled),
|
||||
[type="time"]:not(:disabled),
|
||||
[type="month"]:not(:disabled),
|
||||
[type="week"]:not(:disabled) {
|
||||
background: var(--background-color);
|
||||
}
|
||||
|
||||
input:not([type="button"]):not([type="checkbox"]):not([type="color"]):not([type="image"]):not([type="radio"]):not([type="reset"]):not([type="submit"]):not([type="file"]):hover:not(:disabled):not(:invalid),
|
||||
textarea:hover:not(:disabled),
|
||||
select:hover:not(:disabled) {
|
||||
border-color: var(--border-hover-color);
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
caption {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
thead {
|
||||
border-bottom: calc(var(--border-width) * 2) solid var(--border-color);
|
||||
}
|
||||
|
||||
tfoot {
|
||||
border-top: calc(var(--border-width) * 2) solid var(--border-color);
|
||||
}
|
||||
|
||||
thead > tr:not(:first-child),
|
||||
tbody > tr:not(:first-child),
|
||||
tfoot > tr:not(:first-child) {
|
||||
border-top: var(--border-width) solid var(--border-color);
|
||||
}
|
||||
|
||||
thead > tr:nth-child(even),
|
||||
tbody > tr:nth-child(even),
|
||||
tfoot > tr:nth-child(even) {
|
||||
background-color: var(--highlighted-background-color);
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: var(--highlighted-background-color);
|
||||
}
|
||||
|
||||
kbd {
|
||||
background-color: var(--highlighted-background-color);
|
||||
border: var(--border-width) solid var(--border-hover-color);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: inset 0 0.2rem 0 var(--background-color),
|
||||
inset 0 0 0 0.2rem var(--background-color);
|
||||
}
|
||||
|
||||
kbd kbd {
|
||||
border: unset;
|
||||
box-shadow: unset;
|
||||
}
|
||||
|
||||
dialog {
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-no-qualifying-type */
|
||||
details[open],
|
||||
details:not([open]) summary {
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-no-qualifying-type */
|
||||
details[open] {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-no-qualifying-type */
|
||||
details[open] summary {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
details:not([open]) summary:hover {
|
||||
border-color: var(--border-hover-color);
|
||||
}
|
||||
|
||||
del {
|
||||
background-color: var(--danger-text-background-color);
|
||||
}
|
||||
|
||||
ins {
|
||||
background-color: var(--success-text-background-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 0.5rem solid var(--border-color);
|
||||
background-color: var(--highlighted-background-color);
|
||||
}
|
||||
|
||||
body > footer {
|
||||
border-top: var(--border-width) solid var(--border-color);
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-width: var(--border-width) 0 0;
|
||||
border-style: solid;
|
||||
border-color: var(--border-color);
|
||||
}
|
||||
|
||||
/* stylelint-disable selector-no-qualifying-type */
|
||||
:disabled,
|
||||
[type="checkbox"][id]:disabled + label[for],
|
||||
[type="radio"][id]:disabled + label[for] {
|
||||
opacity: 0.5;
|
||||
}
|
||||
/* stylelint-enable */
|
||||
|
||||
:invalid:not(form) {
|
||||
border-color: var(--danger-color);
|
||||
outline-color: var(--danger-color);
|
||||
border-width: var(--border-width);
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
:disabled :disabled {
|
||||
opacity: unset;
|
||||
}
|
||||
|
||||
:invalid:not(form):hover:not(:disabled) {
|
||||
border-color: var(--danger-hover-color);
|
||||
}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,12 @@
|
||||
/*
|
||||
hyp 0.1.0
|
||||
Copyright 2016 Krzysztof Kraszewski
|
||||
Free to use under MIT licence.
|
||||
*/
|
||||
@import url(https://fonts.googleapis.com/css?family=Roboto);@import url(https://fonts.googleapis.com/css?family=Oswald);html{font-size:65%}body{font-family:Roboto,sans-serif;font-size:16px;line-height:1.5;margin:0;padding:0;width:100%}
|
||||
h1,h2,h3,h4,h5,h6{font-family:Oswald,sans-serif;font-weight:500}a{color:inherit;text-decoration:none;border-bottom:2px solid #ff7c5c;font-weight:600;transition:.3s}a:hover{background-color:#ff7c5c;color:#fff}.small{font-size:12px}.large{font-size:20px}
|
||||
.container{max-width:950px;margin:0 auto;padding:10px 20px}.row{display:flex;flex-direction:row;justify-content:flex-start;margin:1%;min-height:40px;width:100%;max-width:100%}.row-center{display:flex;flex-direction:row;justify-content:center;min-height:50px}.row [class*=c-]{min-height:20px}.row [class*=c-]:not([class*=o-]){margin-left:1%}.row [class*=c-]:first-child:not([class*=o-]){margin-left:0}.row .c-1{width:8.33333333333%}.row .c-2{width:16.6666667%}.row .c-3{width:25%}.row .c-4{width:33.3333333333%}.row .c-5{width:41.6666666667%}.row .c-6{width:50%}.row .c-7{width:58.3333333333%}.row .c-8{width:66.6666666667%}.row .c-9{width:75%}.row .c-10{width:83.3333333333%}.row .c-11{width:91.6666666667%}.row .c-12{width:100%}.row .o-1{margin-left:8.33333333333%}.row .o-2{margin-left:16.6666667%}.row .o-3{margin-left:25%}.row .o-4{margin-left:33.3333333333%}.row .o-5{margin-left:41.6666666667%}.row .o-6{margin-left:50%}.row .o-7{margin-left:58.3333333333%}.row .o-8{margin-left:66.6666666667%}.row .o-9{margin-left:75%}.row .o-10{margin-left:83.3333333333%}.row .o-11{margin-left:91.6666666667%}.row .o-12{margin-left:100%}@media screen and (max-width:768px){.row,.row-center{flex-wrap:wrap;margin:0}.row [class*=" c-"],.row [class^=c-]{margin:1%;flex:0 0 100%}}
|
||||
input[type=text],input[type=password],input[type=number],textarea{border:1px solid #636363;border-radius:5px;padding:8px 15px;outline:0;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;transition:.5s}input[type=text]:focus,input[type=password]:focus,input[type=number]:focus,textarea:focus{border:1px solid #2DC7FF}
|
||||
button{font-weight:700;outline:0;padding:10px;text-transform:uppercase;background-color:#2a2a2a;border:1px solid #636363;border-radius:5px;color:#fff;-webkit-transition:.3s;-moz-transition:.3s;-ms-transition:.3s;-o-transition:.3s;transition:.3s}button:hover:not([disabled]){background-color:#fff;color:#2a2a2a;cursor:pointer}button:disabled{background-color:#3a3a3a;cursor:not-allowed;transition:none}.btn-light{background-color:#fff;border:2px solid #2a2a2a;border-radius:5px;color:#000;transition:.3s}.btn-light:hover:not([disabled]){background-color:#2a2a2a;border:2px solid #fff;color:#fff}.btn-light:disabled{background-color:#e3e3e3;cursor:not-allowed;transition:none}.stretch{display:block;width:100%}
|
||||
.pull-left{float:left}.pull-right{float:right}.full{width:100%;height:100vh}.center-vh-parent{position:relative}.center-vh{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
|
||||
pre>code{background-color:#e3e3e3;border:1px solid #D7D7D7;border-radius:5px;font-family:monospace;font-size:12px;padding:20px 10px}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,922 @@
|
||||
@charset "UTF-8";
|
||||
/*!----------------------------------------------------------------
|
||||
- Koochak
|
||||
- A minimal & lightweight CSS framework
|
||||
- Version: 0.10.2
|
||||
- https://github.com/peyman3d/koochak
|
||||
-
|
||||
- Copyright © Peyman Eskandari 2018
|
||||
- Licensed under the MIT License.
|
||||
-----------------------------------------------------------------*/
|
||||
/* http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License: none (public domain)
|
||||
*/
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
font: inherit;
|
||||
font-size: 100%;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
vertical-align: baseline;
|
||||
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before,
|
||||
blockquote:after,
|
||||
q:before,
|
||||
q:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
line-height: 1.15;
|
||||
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-ms-overflow-style: scrollbar;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
-webkit-box-sizing: inherit;
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
line-height: 1.6;
|
||||
|
||||
margin: 0;
|
||||
|
||||
color: #2f3542;
|
||||
background-color: #ffffff;
|
||||
|
||||
direction: ltr;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
a {
|
||||
-webkit-transition: .2s all ease-in-out;
|
||||
-o-transition: .2s all ease-in-out;
|
||||
transition: .2s all ease-in-out;
|
||||
text-decoration: none;
|
||||
|
||||
color: #3742fa;
|
||||
background-color: transparent;
|
||||
|
||||
-webkit-text-decoration-skip: objects;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
|
||||
color: #2f3542;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: inherit;
|
||||
font-weight: 500;
|
||||
line-height: 1.5;
|
||||
|
||||
margin: 0 0 10px;
|
||||
|
||||
color: #2f3542;
|
||||
}
|
||||
h1 small,
|
||||
h2 small,
|
||||
h3 small,
|
||||
h4 small,
|
||||
h5 small,
|
||||
h6 small {
|
||||
font-size: 85%;
|
||||
font-weight: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: inherit;
|
||||
font-weight: normal;
|
||||
|
||||
margin: 0 0 10px 0;
|
||||
|
||||
color: #2f3542;
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: 1px 3px;
|
||||
|
||||
color: #2f3542;
|
||||
background: #fbffeb;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: "Courier New", monospace;
|
||||
font-size: 100%;
|
||||
|
||||
padding: 3px 5px;
|
||||
|
||||
color: #ffffff;
|
||||
border-radius: 3px;
|
||||
background: #333333;
|
||||
|
||||
direction: ltr !important;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
margin-bottom: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
ol li,
|
||||
ul li {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: inline-block;
|
||||
|
||||
width: 100%;
|
||||
margin: 20px 0;
|
||||
|
||||
border: 0;
|
||||
border-top: 1px solid #e1e4ec;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
max-width: 1200px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
max-width: 720px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
max-width: 960px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
max-width: 1140px;
|
||||
}
|
||||
}
|
||||
|
||||
.row {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.row {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.col {
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.col {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.col-1 {
|
||||
max-width: 8.33333%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 8.33333%;
|
||||
flex: 0 0 8.33333%;
|
||||
}
|
||||
|
||||
.col-2 {
|
||||
max-width: 16.66667%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 16.66667%;
|
||||
flex: 0 0 16.66667%;
|
||||
}
|
||||
|
||||
.col-3 {
|
||||
max-width: 25%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 25%;
|
||||
flex: 0 0 25%;
|
||||
}
|
||||
|
||||
.col-4 {
|
||||
max-width: 33.33333%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 33.33333%;
|
||||
flex: 0 0 33.33333%;
|
||||
}
|
||||
|
||||
.col-5 {
|
||||
max-width: 41.66667%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 41.66667%;
|
||||
flex: 0 0 41.66667%;
|
||||
}
|
||||
|
||||
.col-6 {
|
||||
max-width: 50%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 50%;
|
||||
flex: 0 0 50%;
|
||||
}
|
||||
|
||||
.col-7 {
|
||||
max-width: 58.33333%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 58.33333%;
|
||||
flex: 0 0 58.33333%;
|
||||
}
|
||||
|
||||
.col-8 {
|
||||
max-width: 66.66667%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 66.66667%;
|
||||
flex: 0 0 66.66667%;
|
||||
}
|
||||
|
||||
.col-9 {
|
||||
max-width: 75%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 75%;
|
||||
flex: 0 0 75%;
|
||||
}
|
||||
|
||||
.col-10 {
|
||||
max-width: 83.33333%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 83.33333%;
|
||||
flex: 0 0 83.33333%;
|
||||
}
|
||||
|
||||
.col-11 {
|
||||
max-width: 91.66667%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 91.66667%;
|
||||
flex: 0 0 91.66667%;
|
||||
}
|
||||
|
||||
.col-12 {
|
||||
max-width: 100%;
|
||||
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 100%;
|
||||
flex: 0 0 100%;
|
||||
}
|
||||
|
||||
.col-1,
|
||||
.col-2,
|
||||
.col-3,
|
||||
.col-4,
|
||||
.col-5,
|
||||
.col-6,
|
||||
.col-7,
|
||||
.col-8,
|
||||
.col-9,
|
||||
.col-10,
|
||||
.col-11,
|
||||
.col-12 {
|
||||
padding-right: 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.col-1,
|
||||
.col-2,
|
||||
.col-3,
|
||||
.col-4,
|
||||
.col-5,
|
||||
.col-6,
|
||||
.col-7,
|
||||
.col-8,
|
||||
.col-9,
|
||||
.col-10,
|
||||
.col-11,
|
||||
.col-12 {
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
|
||||
.button,
|
||||
button,
|
||||
button[type=submit],
|
||||
button[type=reset],
|
||||
button[type=button] {
|
||||
font-family: inherit;
|
||||
font-size: .8125rem;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
line-height: 1.1;
|
||||
|
||||
display: inline-block;
|
||||
|
||||
height: 36px;
|
||||
padding: .625rem 1rem;
|
||||
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-transition: .3s all ease-in-out;
|
||||
-o-transition: .3s all ease-in-out;
|
||||
transition: .3s all ease-in-out;
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
text-decoration: none;
|
||||
text-transform: none;
|
||||
|
||||
color: #ffffff;
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
outline: 0;
|
||||
background: #3742fa;
|
||||
-webkit-box-shadow: 0 1px 1px rgba(90, 90, 90, .1);
|
||||
box-shadow: 0 1px 1px rgba(90, 90, 90, .1);
|
||||
text-shadow: none;
|
||||
|
||||
will-change: "";
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
.button:hover,
|
||||
button:hover,
|
||||
button[type=submit]:hover,
|
||||
button[type=reset]:hover,
|
||||
button[type=button]:hover {
|
||||
background: #0612df;
|
||||
}
|
||||
.button:active,
|
||||
button:active,
|
||||
button[type=submit]:active,
|
||||
button[type=reset]:active,
|
||||
button[type=button]:active {
|
||||
-webkit-box-shadow: inset rgba(0, 0, 0, .125) 0 3px 5px, 0 2px 2px transparent;
|
||||
box-shadow: inset rgba(0, 0, 0, .125) 0 3px 5px, 0 2px 2px transparent;
|
||||
}
|
||||
.button:focus,
|
||||
button:focus,
|
||||
button[type=submit]:focus,
|
||||
button[type=reset]:focus,
|
||||
button[type=button]:focus {
|
||||
outline: 0;
|
||||
}
|
||||
.button:disabled,
|
||||
button:disabled,
|
||||
button[type=submit]:disabled,
|
||||
button[type=reset]:disabled,
|
||||
button[type=button]:disabled {
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
|
||||
opacity: .6;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.button.alt,
|
||||
button.alt,
|
||||
button[type=submit].alt,
|
||||
button[type=reset].alt,
|
||||
button[type=button].alt {
|
||||
color: #3742fa;
|
||||
border: 1px solid #3742fa;
|
||||
background: none;
|
||||
}
|
||||
.button.alt:hover,
|
||||
button.alt:hover,
|
||||
button[type=submit].alt:hover,
|
||||
button[type=reset].alt:hover,
|
||||
button[type=button].alt:hover {
|
||||
color: #ffffff;
|
||||
background: #3742fa;
|
||||
}
|
||||
.button.block,
|
||||
button.block,
|
||||
button[type=submit].block,
|
||||
button[type=reset].block,
|
||||
button[type=button].block {
|
||||
width: 100%;
|
||||
}
|
||||
.button.small,
|
||||
button.small,
|
||||
button[type=submit].small,
|
||||
button[type=reset].small,
|
||||
button[type=button].small {
|
||||
font-size: .6875rem;
|
||||
font-weight: normal;
|
||||
|
||||
height: 24px;
|
||||
padding: .3125rem .5rem;
|
||||
}
|
||||
.button.large,
|
||||
button.large,
|
||||
button[type=submit].large,
|
||||
button[type=reset].large,
|
||||
button[type=button].large {
|
||||
font-size: 1rem;
|
||||
line-height: 1;
|
||||
|
||||
height: 46px;
|
||||
padding: .875rem 1.375rem;
|
||||
}
|
||||
|
||||
.alert {
|
||||
position: relative;
|
||||
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
padding: .875rem 1.125rem;
|
||||
|
||||
border: 1px solid #f1f2f6;
|
||||
border-left: 4px solid #3742fa;
|
||||
border-radius: 3px;
|
||||
background: #ffffff;
|
||||
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
|
||||
}
|
||||
.alert p {
|
||||
color: inherit;
|
||||
}
|
||||
.alert p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.alert.success {
|
||||
color: #23ad5c;
|
||||
border-left-color: #2ed573;
|
||||
}
|
||||
.alert.error {
|
||||
color: #ff4757;
|
||||
border-left-color: #ff4757;
|
||||
}
|
||||
.alert.danger {
|
||||
color: #e89500;
|
||||
border-left-color: #ffa502;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
margin-bottom: 10px;
|
||||
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
|
||||
border-radius: 0;
|
||||
background: #ffffff;
|
||||
}
|
||||
table thead,
|
||||
table tfoot {
|
||||
background: #fafafa;
|
||||
}
|
||||
table thead td,
|
||||
table thead th,
|
||||
table tfoot td,
|
||||
table tfoot th {
|
||||
color: #2f3542;
|
||||
border-top: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
table thead {
|
||||
border-bottom: 1px solid #e8e9f0;
|
||||
}
|
||||
table tfoot {
|
||||
border-top: 1px solid #e8e9f0;
|
||||
}
|
||||
table td,
|
||||
table th {
|
||||
font-size: .875rem;
|
||||
|
||||
padding: 10px 8px;
|
||||
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
|
||||
border-bottom: 1px solid #e8e9f0;
|
||||
}
|
||||
table th {
|
||||
font-weight: bold;
|
||||
|
||||
color: #2f3542;
|
||||
}
|
||||
table.bordered {
|
||||
border: 1px solid #e8e9f0;
|
||||
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, .05);
|
||||
}
|
||||
table.bordered td,
|
||||
table.bordered th {
|
||||
border: 1px solid #e8e9f0;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: .875rem;
|
||||
font-weight: normal;
|
||||
|
||||
display: block;
|
||||
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px;
|
||||
|
||||
color: #2f3542;
|
||||
}
|
||||
|
||||
input[type=text],
|
||||
input[type=email],
|
||||
input[type=file],
|
||||
input[type=number],
|
||||
input[type=password],
|
||||
input[type=tel],
|
||||
input[type=url],
|
||||
input[type=search] {
|
||||
font-family: inherit;
|
||||
font-size: .8125rem;
|
||||
font-weight: normal;
|
||||
line-height: inherit;
|
||||
|
||||
position: relative;
|
||||
|
||||
display: block;
|
||||
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 36px;
|
||||
margin: 0;
|
||||
margin-bottom: 10px;
|
||||
padding: .5rem .5rem;
|
||||
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
transition: all .2s ease-in-out;
|
||||
|
||||
color: #555555;
|
||||
border: 1px solid #e8e9f0;
|
||||
border-radius: 3px;
|
||||
outline: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
input[type=text]:hover,
|
||||
input[type=email]:hover,
|
||||
input[type=file]:hover,
|
||||
input[type=number]:hover,
|
||||
input[type=password]:hover,
|
||||
input[type=tel]:hover,
|
||||
input[type=url]:hover,
|
||||
input[type=search]:hover {
|
||||
border-color: #c9cddc;
|
||||
}
|
||||
input[type=text]:focus,
|
||||
input[type=email]:focus,
|
||||
input[type=file]:focus,
|
||||
input[type=number]:focus,
|
||||
input[type=password]:focus,
|
||||
input[type=tel]:focus,
|
||||
input[type=url]:focus,
|
||||
input[type=search]:focus {
|
||||
color: #000000;
|
||||
border-color: #3742fa;
|
||||
}
|
||||
input[type=text]:disabled,
|
||||
input[type=email]:disabled,
|
||||
input[type=file]:disabled,
|
||||
input[type=number]:disabled,
|
||||
input[type=password]:disabled,
|
||||
input[type=tel]:disabled,
|
||||
input[type=url]:disabled,
|
||||
input[type=search]:disabled {
|
||||
cursor: not-allowed;
|
||||
|
||||
opacity: .7;
|
||||
border-color: #dddddd;
|
||||
background: #eeeeee;
|
||||
}
|
||||
input[type=text].success,
|
||||
input[type=email].success,
|
||||
input[type=file].success,
|
||||
input[type=number].success,
|
||||
input[type=password].success,
|
||||
input[type=tel].success,
|
||||
input[type=url].success,
|
||||
input[type=search].success {
|
||||
border-color: #2ed573;
|
||||
background: #edfbf3;
|
||||
}
|
||||
input[type=text].error,
|
||||
input[type=email].error,
|
||||
input[type=file].error,
|
||||
input[type=number].error,
|
||||
input[type=password].error,
|
||||
input[type=tel].error,
|
||||
input[type=url].error,
|
||||
input[type=search].error {
|
||||
border-color: #ff4757;
|
||||
background: white;
|
||||
}
|
||||
input[type=text].warning,
|
||||
input[type=email].warning,
|
||||
input[type=file].warning,
|
||||
input[type=number].warning,
|
||||
input[type=password].warning,
|
||||
input[type=tel].warning,
|
||||
input[type=url].warning,
|
||||
input[type=search].warning {
|
||||
border-color: #ffa502;
|
||||
background: #fff7e8;
|
||||
}
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
display: inline;
|
||||
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
font-size: 0;
|
||||
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
clear: both;
|
||||
|
||||
height: 0;
|
||||
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.d-n {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.d-i {
|
||||
display: inline !important;
|
||||
}
|
||||
|
||||
.d-b {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.d-ib {
|
||||
display: inline-block !important;
|
||||
}
|
||||
|
||||
.d-t {
|
||||
display: table !important;
|
||||
}
|
||||
|
||||
.d-tc {
|
||||
display: table-cell !important;
|
||||
}
|
||||
|
||||
.d-f {
|
||||
display: -webkit-box !important;
|
||||
display: -ms-flexbox !important;
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.d-if {
|
||||
display: -webkit-inline-box !important;
|
||||
display: -ms-inline-flexbox !important;
|
||||
display: inline-flex !important;
|
||||
}
|
||||
|
||||
.d-li {
|
||||
display: list-item !important;
|
||||
}
|
||||
|
||||
.v-v {
|
||||
visibility: visible !important;
|
||||
}
|
||||
|
||||
.v-h {
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
.f-l {
|
||||
float: left !important;
|
||||
}
|
||||
|
||||
.f-r {
|
||||
float: right !important;
|
||||
}
|
||||
|
||||
.f-n {
|
||||
float: none !important;
|
||||
}
|
||||
|
||||
.dir-rtl {
|
||||
direction: rtl !important;
|
||||
}
|
||||
|
||||
.dir-ltr {
|
||||
direction: ltr !important;
|
||||
}
|
||||
|
||||
.ta-l {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.ta-r {
|
||||
text-align: right !important;
|
||||
}
|
||||
|
||||
.ta-c {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.ta-j {
|
||||
text-align: justify !important;
|
||||
}
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,503 @@
|
||||
/**
|
||||
* Lemon v1.0.0 (https://appalaszynski.github.io/lemon/))
|
||||
* Copyright (c) 2018 appalaszynski (https://github.com/appalaszynski)
|
||||
* Licensed under MIT (https://github.com/appalaszynski/lemon/blob/master/LICENSE)
|
||||
*/
|
||||
/**
|
||||
* Responsive Breakpoint Manager
|
||||
*
|
||||
* 0px - 600px: Small
|
||||
* 600px - 900px: Medium
|
||||
* 900px - 1100px: Large
|
||||
* 1800px - 2699px: Huge
|
||||
* 2800px - more: Extra
|
||||
*/
|
||||
/**
|
||||
* Basic reset of font-size, box-sizing, margin and padding.
|
||||
*
|
||||
* 1. Thanks to this declaration You can easily build layout based on rem unit.
|
||||
* The rem unit is relative to the font-size of the root element html.
|
||||
* By default html element font size is 16px, but px-to-percent function converts it to 10px.
|
||||
* Therefore from now 1rem is equal to 10px.
|
||||
*/
|
||||
html {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
font-size: 62.5%;
|
||||
/* 1 */
|
||||
}
|
||||
|
||||
@media (max-width: 56.25em) {
|
||||
html {
|
||||
font-size: 56.25%;
|
||||
}
|
||||
}
|
||||
|
||||
*,
|
||||
*::after,
|
||||
*::before {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-box-sizing: inherit;
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
max-width: 120rem;
|
||||
padding: 0 2rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.container.medium {
|
||||
max-width: 100rem;
|
||||
}
|
||||
|
||||
.container.small {
|
||||
max-width: 80rem;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
@media (max-width: 56.25em) {
|
||||
.row {
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.column {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1 1 auto;
|
||||
flex: 1 1 auto;
|
||||
padding: 0 1.0rem;
|
||||
}
|
||||
|
||||
.column.column-50 {
|
||||
-webkit-box-flex: 0;
|
||||
-ms-flex: 0 0 50%;
|
||||
flex: 0 0 50%;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
content: ' ';
|
||||
display: table;
|
||||
}
|
||||
|
||||
.float-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.float-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.mb {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
html {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #363c41;
|
||||
font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 300;
|
||||
line-height: 1.6;
|
||||
letter-spacing: 0.01rem;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 300;
|
||||
margin-bottom: 2.0rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 4.6rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 3.6rem;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 2.8rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 2.2rem;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.8rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.btn,
|
||||
.btn:link,
|
||||
.btn:visited,
|
||||
button,
|
||||
input[type='button'],
|
||||
input[type='reset'],
|
||||
input[type='submit'] {
|
||||
background-color: #dbbb2b;
|
||||
border: 0.1rem solid #dbbb2b;
|
||||
border-radius: 0.4rem;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.1rem;
|
||||
line-height: 3.8rem;
|
||||
padding: 0 3rem;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
vertical-align: middle;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.btn:focus, .btn:hover,
|
||||
.btn:link:focus,
|
||||
.btn:link:hover,
|
||||
.btn:visited:focus,
|
||||
.btn:visited:hover,
|
||||
button:focus,
|
||||
button:hover,
|
||||
input[type='button']:focus,
|
||||
input[type='button']:hover,
|
||||
input[type='reset']:focus,
|
||||
input[type='reset']:hover,
|
||||
input[type='submit']:focus,
|
||||
input[type='submit']:hover {
|
||||
background-color: #b4991f;
|
||||
border: 0.1rem solid #b4991f;
|
||||
outline: 0;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn:disabled,
|
||||
.btn:link:disabled,
|
||||
.btn:visited:disabled,
|
||||
button:disabled,
|
||||
input[type='button']:disabled,
|
||||
input[type='reset']:disabled,
|
||||
input[type='submit']:disabled {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.btn:disabled:focus, .btn:disabled:hover,
|
||||
.btn:link:disabled:focus,
|
||||
.btn:link:disabled:hover,
|
||||
.btn:visited:disabled:focus,
|
||||
.btn:visited:disabled:hover,
|
||||
button:disabled:focus,
|
||||
button:disabled:hover,
|
||||
input[type='button']:disabled:focus,
|
||||
input[type='button']:disabled:hover,
|
||||
input[type='reset']:disabled:focus,
|
||||
input[type='reset']:disabled:hover,
|
||||
input[type='submit']:disabled:focus,
|
||||
input[type='submit']:disabled:hover {
|
||||
background-color: #dbbb2b;
|
||||
border-color: #dbbb2b;
|
||||
}
|
||||
|
||||
.btn.outline,
|
||||
.btn:link.outline,
|
||||
.btn:visited.outline,
|
||||
button.outline,
|
||||
input[type='button'].outline,
|
||||
input[type='reset'].outline,
|
||||
input[type='submit'].outline {
|
||||
background-color: transparent;
|
||||
color: #dbbb2b;
|
||||
}
|
||||
|
||||
.btn.outline:focus, .btn.outline:hover,
|
||||
.btn:link.outline:focus,
|
||||
.btn:link.outline:hover,
|
||||
.btn:visited.outline:focus,
|
||||
.btn:visited.outline:hover,
|
||||
button.outline:focus,
|
||||
button.outline:hover,
|
||||
input[type='button'].outline:focus,
|
||||
input[type='button'].outline:hover,
|
||||
input[type='reset'].outline:focus,
|
||||
input[type='reset'].outline:hover,
|
||||
input[type='submit'].outline:focus,
|
||||
input[type='submit'].outline:hover {
|
||||
color: #b4991f;
|
||||
}
|
||||
|
||||
.btn.outline:disabled:focus, .btn.outline:disabled:hover,
|
||||
.btn:link.outline:disabled:focus,
|
||||
.btn:link.outline:disabled:hover,
|
||||
.btn:visited.outline:disabled:focus,
|
||||
.btn:visited.outline:disabled:hover,
|
||||
button.outline:disabled:focus,
|
||||
button.outline:disabled:hover,
|
||||
input[type='button'].outline:disabled:focus,
|
||||
input[type='button'].outline:disabled:hover,
|
||||
input[type='reset'].outline:disabled:focus,
|
||||
input[type='reset'].outline:disabled:hover,
|
||||
input[type='submit'].outline:disabled:focus,
|
||||
input[type='submit'].outline:disabled:hover {
|
||||
background-color: inherit;
|
||||
border-color: inherit;
|
||||
color: #dbbb2b;
|
||||
}
|
||||
|
||||
.btn.btn-full,
|
||||
.btn:link.btn-full,
|
||||
.btn:visited.btn-full,
|
||||
button.btn-full,
|
||||
input[type='button'].btn-full,
|
||||
input[type='reset'].btn-full,
|
||||
input[type='submit'].btn-full {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
code {
|
||||
background-color: #f6f6f6;
|
||||
padding: 0.2rem 0.5rem 0.2rem 0.5rem;
|
||||
font-size: 120%;
|
||||
border-radius: 0.4rem;
|
||||
margin: 0 0.2rem;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #f6f6f6;
|
||||
overflow-y: scroll;
|
||||
padding: 1rem;
|
||||
border-bottom: 0.4rem solid #dbbb2b;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
pre > code {
|
||||
padding: 0;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 0.4rem solid #dbbb2b;
|
||||
padding: 1rem 2rem;
|
||||
background-color: #f6f6f6;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
blockquote *:last-of-type {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
blockquote cite {
|
||||
display: block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 3rem 0;
|
||||
border: 0;
|
||||
border-top: 0.1rem solid #dbbb2b;
|
||||
}
|
||||
|
||||
a,
|
||||
a:link,
|
||||
a:visited {
|
||||
color: #dbbb2b;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover, a:focus, a:active,
|
||||
a:link:hover,
|
||||
a:link:focus,
|
||||
a:link:active,
|
||||
a:visited:hover,
|
||||
a:visited:focus,
|
||||
a:visited:active {
|
||||
color: #b4991f;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
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='month'],
|
||||
input[type='week'],
|
||||
input[type='datetime'],
|
||||
input[type='datetime-local'],
|
||||
input:not([type]),
|
||||
textarea,
|
||||
select {
|
||||
width: 100%;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
border: 0.1rem solid #363c41;
|
||||
font-size: 1.6rem;
|
||||
border-radius: .4rem;
|
||||
-webkit-box-sizing: inherit;
|
||||
box-sizing: inherit;
|
||||
height: 3.8rem;
|
||||
padding: .6rem 1.0rem;
|
||||
margin-bottom: 1.5rem;
|
||||
color: #363c41;
|
||||
}
|
||||
|
||||
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='month']:focus,
|
||||
input[type='week']:focus,
|
||||
input[type='datetime']:focus,
|
||||
input[type='datetime-local']:focus,
|
||||
input:not([type]):focus,
|
||||
textarea:focus,
|
||||
select:focus {
|
||||
border-color: #dbbb2b;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height: 6.5rem;
|
||||
}
|
||||
|
||||
label,
|
||||
legend {
|
||||
display: block;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
input[type='checkbox'],
|
||||
input[type='radio'] {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
select {
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAJCAYAAAA/33wPAAAAvklEQVQoFY2QMQqEMBBFv7ERa/EMXkGw11K8QbDXzuN4BHv7QO6ifUgj7v4UAdlVM8Uwf+b9YZJISnlqrfEUZVlinucnBGKaJgghbiHOyLyFKIoCbdvecpyReYvo/Ma2bajrGtbaC58kCdZ1RZ7nl/4/4d5EsO/7nzl7IUtodBexMMagaRrs+06JLMvcNWmaOv2W/C/TMAyD58dxROgSmvxFFMdxoOs6lliWBXEcuzokXRbRoJRyvqqqQvye+QDMDz1D6yuj9wAAAABJRU5ErkJggg==) right center no-repeat;
|
||||
}
|
||||
|
||||
.label-inline {
|
||||
display: inline-block;
|
||||
font-weight: normal;
|
||||
margin-left: .5rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder,
|
||||
::-moz-placeholder,
|
||||
:-moz-placeholder,
|
||||
:-ms-input-placeholder {
|
||||
color: #363c41;
|
||||
}
|
||||
|
||||
dl,
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
margin-top: 0;
|
||||
padding-left: 0;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
dl dl,
|
||||
dl ol,
|
||||
dl ul,
|
||||
ol dl,
|
||||
ol ol,
|
||||
ol ul,
|
||||
ul dl,
|
||||
ul ol,
|
||||
ul ul {
|
||||
margin: 0 0 0 1.5rem;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: decimal inside;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: circle inside;
|
||||
}
|
||||
|
||||
dd {
|
||||
-webkit-margin-start: 40px;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
text-align: left;
|
||||
border-bottom: 0.1rem solid #dbbb2b;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
thead th {
|
||||
border-bottom: 2px solid #dbbb2b;
|
||||
}
|
@ -0,0 +1,126 @@
|
||||
/*
|
||||
* Lit v0.1
|
||||
* Primary Color set to: #FA0
|
||||
* Font set to: Nunito
|
||||
*/
|
||||
|
||||
:root {
|
||||
--font: nunito;
|
||||
--primary-color: #fa0;
|
||||
--light: #eee;
|
||||
}
|
||||
|
||||
* + *{
|
||||
box-sizing: border-box;
|
||||
margin: .5em 0;
|
||||
}
|
||||
|
||||
@media(min-width:35em) {
|
||||
.col {
|
||||
display: table-cell;
|
||||
}
|
||||
.\31 {
|
||||
width: 5%;
|
||||
}
|
||||
.\33 {
|
||||
width: 22%;
|
||||
}
|
||||
.\34 {
|
||||
width: 30%;
|
||||
}
|
||||
.\35 {
|
||||
width: 40%;
|
||||
}
|
||||
.\32 {
|
||||
width: 15%;
|
||||
}
|
||||
.row {
|
||||
display: table;
|
||||
border-spacing: 1em 0;
|
||||
}
|
||||
}
|
||||
|
||||
.w-100,
|
||||
.row {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card:focus,
|
||||
hr {
|
||||
outline: 0;
|
||||
border: solid var(--primary-color);
|
||||
}
|
||||
|
||||
.card,
|
||||
pre {
|
||||
padding: 1em;
|
||||
border: solid var(--light);
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.btn:hover {
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
.c {
|
||||
max-width: 60em;
|
||||
padding: 1em;
|
||||
margin: auto;
|
||||
font: 1em/1.6 var(--font);
|
||||
}
|
||||
|
||||
h6 {
|
||||
font: 300 1em var(--font);
|
||||
}
|
||||
|
||||
h5 {
|
||||
font: 300 1.2em var(--font);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font: 300 2em var(--font);
|
||||
}
|
||||
|
||||
h4 {
|
||||
font: 300 1.5em var(--font);
|
||||
}
|
||||
|
||||
h2 {
|
||||
font: 300 2.2em var(--font);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font: 300 2.5em var(--font);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn.primary {
|
||||
color: white;
|
||||
background: var(--primary-color);
|
||||
border: solid var(--primary-color);
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 1em;
|
||||
text-align: left;
|
||||
border-bottom: solid var(--light);
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 1em;
|
||||
letter-spacing: .1em;
|
||||
text-transform: uppercase;
|
||||
background: white;
|
||||
border: solid;
|
||||
font: .7em var(--font);
|
||||
cursor:pointer;
|
||||
}
|
File diff suppressed because one or more lines are too long
@ -0,0 +1,199 @@
|
||||
.markdown {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.markdown,
|
||||
.markdown h1,
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6,
|
||||
.markdown pre,
|
||||
.markdown code,
|
||||
.markdown blockquote,
|
||||
.markdown em,
|
||||
.markdown strong,
|
||||
.markdown code {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-family: consolas, monaco, courier, "courier new", monospace;
|
||||
color: #333333;
|
||||
}
|
||||
.markdown h1,
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6,
|
||||
.markdown pre,
|
||||
.markdown code,
|
||||
.markdown blockquote,
|
||||
.markdown ol,
|
||||
.markdown ul,
|
||||
.markdown li,
|
||||
.markdown p,
|
||||
.markdown section,
|
||||
.markdown header,
|
||||
.markdown footer {
|
||||
float: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.markdown h1,
|
||||
.markdown p,
|
||||
.markdown ul,
|
||||
.markdown ol,
|
||||
.markdown pre,
|
||||
.markdown blockquote {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.markdown h1 {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
display: table-cell;
|
||||
padding: 20px 0 40px;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.markdown h1:after {
|
||||
content: "====================================================================================================";
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
left: 0;
|
||||
}
|
||||
.markdown h1 + * {
|
||||
margin-top: 0;
|
||||
}
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6 {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.markdown h2:before,
|
||||
.markdown h3:before,
|
||||
.markdown h4:before,
|
||||
.markdown h5:before,
|
||||
.markdown h6:before {
|
||||
content: "## ";
|
||||
display: inline;
|
||||
}
|
||||
.markdown h3:before {
|
||||
content: "### ";
|
||||
}
|
||||
.markdown h4:before {
|
||||
content: "#### ";
|
||||
}
|
||||
.markdown h5:before {
|
||||
content: "##### ";
|
||||
}
|
||||
.markdown h6:before {
|
||||
content: "###### ";
|
||||
}
|
||||
.markdown li {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding-left: 34px;
|
||||
padding-left: 4ch;
|
||||
}
|
||||
.markdown li:after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.markdown ul > li:after {
|
||||
content: "*";
|
||||
}
|
||||
.markdown ol {
|
||||
counter-reset: ol;
|
||||
}
|
||||
.markdown ol > li:after {
|
||||
content: counter(ol) ".";
|
||||
counter-increment: ol;
|
||||
}
|
||||
.markdown pre {
|
||||
margin-left: 34px;
|
||||
margin-left: 4ch;
|
||||
}
|
||||
.markdown blockquote {
|
||||
position: relative;
|
||||
padding-left: 17px;
|
||||
padding-left: 2ch;
|
||||
overflow: hidden;
|
||||
}
|
||||
.markdown blockquote:after {
|
||||
content: ">\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>";
|
||||
white-space: pre;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
.markdown strong:before,
|
||||
.markdown strong:after {
|
||||
content: "__";
|
||||
display: inline;
|
||||
}
|
||||
.markdown em:before,
|
||||
.markdown em:after {
|
||||
content: "*";
|
||||
display: inline;
|
||||
}
|
||||
.markdown a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.markdown a:before {
|
||||
content: "[";
|
||||
display: inline;
|
||||
color: #333333;
|
||||
}
|
||||
.markdown a:after {
|
||||
content: "](" attr(href) ")";
|
||||
display: inline;
|
||||
color: #333333;
|
||||
}
|
||||
.markdown code {
|
||||
font-weight: 100;
|
||||
}
|
||||
.markdown code:before,
|
||||
.markdown code:after {
|
||||
content: "`";
|
||||
display: inline;
|
||||
}
|
||||
.markdown pre code:before,
|
||||
.markdown pre code:after {
|
||||
content: none;
|
||||
}
|
||||
.markdown hr {
|
||||
position: relative;
|
||||
height: 20px;
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
overflow: hidden;
|
||||
border: 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.markdown hr:after {
|
||||
content: "----------------------------------------------------------------------------------------------------";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
width: 100%;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
@-moz-document url-prefix() {
|
||||
.markdown h1 {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.markdown-ones ol > li:after {
|
||||
content: "1.";
|
||||
}
|
@ -0,0 +1,927 @@
|
||||
/*! sanitize.css v7.0.3 | CC0 License | github.com/csstools/sanitize.css */
|
||||
/* Document
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* 1. Remove repeating backgrounds in all browsers (opinionated).
|
||||
* 2. Add border box sizing in all browsers (opinionated).
|
||||
*/
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
background-repeat: no-repeat;
|
||||
/* 1 */
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* 1. Add text decoration inheritance in all browsers (opinionated).
|
||||
* 2. Add vertical alignment inheritance in all browsers (opinionated).
|
||||
*/
|
||||
::before,
|
||||
::after {
|
||||
text-decoration: inherit;
|
||||
/* 1 */
|
||||
vertical-align: inherit;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* 1. Use the default cursor in all browsers (opinionated).
|
||||
* 2. Use the default user interface font in all browsers (opinionated).
|
||||
* 3. Correct the line height in all browsers.
|
||||
* 4. Use a 4-space tab width in all browsers (opinionated).
|
||||
* 5. Prevent adjustments of font size after orientation changes in
|
||||
* IE on Windows Phone and in iOS.
|
||||
* 6. Breaks words to prevent overflow in all browsers (opinionated).
|
||||
*/
|
||||
html {
|
||||
cursor: default;
|
||||
/* 1 */
|
||||
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
||||
/* 2 */
|
||||
line-height: 1.15;
|
||||
/* 3 */
|
||||
-moz-tab-size: 4;
|
||||
/* 4 */
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
/* 4 */
|
||||
-ms-text-size-adjust: 100%;
|
||||
/* 5 */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
/* 5 */
|
||||
word-break: break-word;
|
||||
/* 6 */ }
|
||||
|
||||
/* Sections
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Remove the margin in all browsers (opinionated).
|
||||
*/
|
||||
body {
|
||||
margin: 0; }
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0; }
|
||||
|
||||
/* Grouping content
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* 1. Add the correct sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
hr {
|
||||
height: 0;
|
||||
/* 1 */
|
||||
overflow: visible;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
main {
|
||||
display: block; }
|
||||
|
||||
/**
|
||||
* Remove the list style on navigation lists in all browsers (opinionated).
|
||||
*/
|
||||
nav ol,
|
||||
nav ul {
|
||||
list-style: none; }
|
||||
|
||||
/**
|
||||
* 1. Use the default monospace user interface font
|
||||
* in all browsers (opinionated).
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
pre {
|
||||
font-family: Menlo, Consolas, Roboto Mono, Ubuntu Monospace, Noto Mono, Oxygen Mono, Liberation Mono, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/* Text-level semantics
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
a {
|
||||
background-color: transparent; }
|
||||
|
||||
/**
|
||||
* Add the correct text decoration in Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
abbr[title] {
|
||||
text-decoration: underline;
|
||||
-webkit-text-decoration: underline dotted;
|
||||
text-decoration: underline dotted; }
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder; }
|
||||
|
||||
/**
|
||||
* 1. Use the default monospace user interface font
|
||||
* in all browsers (opinionated).
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: Menlo, Consolas, Roboto Mono, Ubuntu Monospace, Noto Mono, Oxygen Mono, Liberation Mono, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
small {
|
||||
font-size: 80%; }
|
||||
|
||||
/*
|
||||
* Remove the text shadow on text selections in Firefox 61- (opinionated).
|
||||
* 1. Restore the coloring undone by defining the text shadow
|
||||
* in all browsers (opinionated).
|
||||
*/
|
||||
::-moz-selection {
|
||||
background-color: #b3d4fc;
|
||||
/* 1 */
|
||||
color: #000;
|
||||
/* 1 */
|
||||
text-shadow: none; }
|
||||
|
||||
::selection {
|
||||
background-color: #b3d4fc;
|
||||
/* 1 */
|
||||
color: #000;
|
||||
/* 1 */
|
||||
text-shadow: none; }
|
||||
|
||||
/* Embedded content
|
||||
* ========================================================================== */
|
||||
/*
|
||||
* Change the alignment on media elements in all browers (opinionated).
|
||||
*/
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle; }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
audio,
|
||||
video {
|
||||
display: inline-block; }
|
||||
|
||||
/**
|
||||
* Add the correct display in iOS 4-7.
|
||||
*/
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0; }
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10-.
|
||||
*/
|
||||
img {
|
||||
border-style: none; }
|
||||
|
||||
/**
|
||||
* Change the fill color to match the text color in all browsers (opinionated).
|
||||
*/
|
||||
svg:not([fill]) {
|
||||
fill: currentColor; }
|
||||
|
||||
/**
|
||||
* Hide the overflow in IE.
|
||||
*/
|
||||
svg:not(:root) {
|
||||
overflow: hidden; }
|
||||
|
||||
/* Tabular data
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Collapse border spacing in all browsers (opinionated).
|
||||
*/
|
||||
table {
|
||||
border-collapse: collapse; }
|
||||
|
||||
/* Forms
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Inherit styling in all browsers (opinionated).
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit; }
|
||||
|
||||
/**
|
||||
* Remove the margin in Safari.
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
select {
|
||||
margin: 0; }
|
||||
|
||||
/**
|
||||
* 1. Show the overflow in IE.
|
||||
* 2. Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
*/
|
||||
button {
|
||||
overflow: visible;
|
||||
/* 1 */
|
||||
text-transform: none;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; }
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em; }
|
||||
|
||||
/**
|
||||
* Show the overflow in Edge and IE.
|
||||
*/
|
||||
input {
|
||||
overflow: visible; }
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
*/
|
||||
legend {
|
||||
color: inherit;
|
||||
/* 2 */
|
||||
display: table;
|
||||
/* 1 */
|
||||
max-width: 100%;
|
||||
/* 1 */
|
||||
white-space: normal;
|
||||
/* 1 */ }
|
||||
|
||||
/**
|
||||
* 1. Add the correct display in Edge and IE.
|
||||
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
progress {
|
||||
display: inline-block;
|
||||
/* 1 */
|
||||
vertical-align: baseline;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
select {
|
||||
text-transform: none; }
|
||||
|
||||
/**
|
||||
* 1. Remove the margin in Firefox and Safari.
|
||||
* 2. Remove the default vertical scrollbar in IE.
|
||||
* 3. Change the resize direction on textareas in all browsers (opinionated).
|
||||
*/
|
||||
textarea {
|
||||
margin: 0;
|
||||
/* 1 */
|
||||
overflow: auto;
|
||||
/* 2 */
|
||||
resize: vertical;
|
||||
/* 3 */ }
|
||||
|
||||
/**
|
||||
* Remove the padding in IE 10-.
|
||||
*/
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
padding: 0; }
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
/* 1 */
|
||||
outline-offset: -2px;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Safari.
|
||||
*/
|
||||
::-webkit-inner-spin-button,
|
||||
::-webkit-outer-spin-button {
|
||||
height: auto; }
|
||||
|
||||
/**
|
||||
* Correct the text style of placeholders in Chrome, Edge, and Safari.
|
||||
*/
|
||||
::-webkit-input-placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.54; }
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
::-webkit-search-decoration {
|
||||
-webkit-appearance: none; }
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
/* 1 */
|
||||
font: inherit;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding of focus outlines in Firefox.
|
||||
*/
|
||||
::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0; }
|
||||
|
||||
/**
|
||||
* Restore the focus outline styles unset by the previous rule in Firefox.
|
||||
*/
|
||||
:-moz-focusring {
|
||||
outline: 1px dotted ButtonText; }
|
||||
|
||||
/* Interactive
|
||||
* ========================================================================== */
|
||||
/*
|
||||
* Add the correct display in Edge and IE.
|
||||
*/
|
||||
details {
|
||||
display: block; }
|
||||
|
||||
/*
|
||||
* Add the correct styles in Edge, IE, and Safari.
|
||||
*/
|
||||
dialog {
|
||||
background-color: white;
|
||||
border: solid;
|
||||
color: black;
|
||||
display: block;
|
||||
height: -moz-fit-content;
|
||||
height: -webkit-fit-content;
|
||||
height: fit-content;
|
||||
left: 0;
|
||||
margin: auto;
|
||||
padding: 1em;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: -moz-fit-content;
|
||||
width: -webkit-fit-content;
|
||||
width: fit-content; }
|
||||
|
||||
dialog:not([open]) {
|
||||
display: none; }
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
summary {
|
||||
display: list-item; }
|
||||
|
||||
/* Scripting
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
canvas {
|
||||
display: inline-block; }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
template {
|
||||
display: none; }
|
||||
|
||||
/* User interaction
|
||||
* ========================================================================== */
|
||||
/*
|
||||
* 1. Remove the tapping delay in IE 10.
|
||||
* 2. Remove the tapping delay on clickable elements
|
||||
in all browsers (opinionated).
|
||||
*/
|
||||
a,
|
||||
area,
|
||||
button,
|
||||
input,
|
||||
label,
|
||||
select,
|
||||
summary,
|
||||
textarea,
|
||||
[tabindex] {
|
||||
-ms-touch-action: manipulation;
|
||||
/* 1 */
|
||||
touch-action: manipulation;
|
||||
/* 2 */ }
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10-.
|
||||
*/
|
||||
[hidden] {
|
||||
display: none; }
|
||||
|
||||
/* Accessibility
|
||||
* ========================================================================== */
|
||||
/**
|
||||
* Change the cursor on busy elements in all browsers (opinionated).
|
||||
*/
|
||||
[aria-busy="true"] {
|
||||
cursor: progress; }
|
||||
|
||||
/*
|
||||
* Change the cursor on control elements in all browsers (opinionated).
|
||||
*/
|
||||
[aria-controls] {
|
||||
cursor: pointer; }
|
||||
|
||||
/*
|
||||
* Change the cursor on disabled, not-editable, or otherwise
|
||||
* inoperable elements in all browsers (opinionated).
|
||||
*/
|
||||
[aria-disabled="true"],
|
||||
[disabled] {
|
||||
cursor: not-allowed; }
|
||||
|
||||
/*
|
||||
* Change the display on visually hidden accessible elements
|
||||
* in all browsers (opinionated).
|
||||
*/
|
||||
[aria-hidden="false"][hidden]:not(:focus) {
|
||||
clip: rect(0, 0, 0, 0);
|
||||
display: inherit;
|
||||
position: absolute; }
|
||||
|
||||
/*! Marx v3.0.6 - The classless CSS reset (perfect for Communists) | MIT License | https://github.com/mblode/marx */
|
||||
main,
|
||||
header,
|
||||
footer,
|
||||
article,
|
||||
section,
|
||||
aside,
|
||||
details,
|
||||
summary {
|
||||
margin: 0 auto;
|
||||
margin-bottom: 16px;
|
||||
width: 100%; }
|
||||
|
||||
main {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 768px;
|
||||
padding: 0 16px 16px; }
|
||||
|
||||
footer {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
padding: 16px 0;
|
||||
text-align: center; }
|
||||
footer p {
|
||||
margin-bottom: 0; }
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
display: block;
|
||||
margin-top: 16px;
|
||||
margin-bottom: 16px;
|
||||
width: 100%;
|
||||
-webkit-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
overflow: visible; }
|
||||
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
vertical-align: baseline; }
|
||||
|
||||
@media screen and (max-width: 400px) {
|
||||
article,
|
||||
section,
|
||||
aside {
|
||||
clear: both;
|
||||
display: block;
|
||||
max-width: 100%; }
|
||||
img {
|
||||
margin-right: 16px; } }
|
||||
|
||||
embed,
|
||||
iframe,
|
||||
video {
|
||||
border: 0; }
|
||||
|
||||
body {
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
font-size: 16px;
|
||||
line-height: 1.5; }
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
margin-bottom: 16px; }
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: inherit;
|
||||
font-family: inherit;
|
||||
line-height: 1.2;
|
||||
font-weight: 500; }
|
||||
|
||||
h1 {
|
||||
font-size: 40px;
|
||||
margin: 20px 0 16px; }
|
||||
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
margin: 20px 0 16px; }
|
||||
|
||||
h3 {
|
||||
font-size: 28px;
|
||||
margin: 16px 0 4px; }
|
||||
|
||||
h4 {
|
||||
font-size: 24px;
|
||||
margin: 16px 0 4px; }
|
||||
|
||||
h5 {
|
||||
font-size: 20px;
|
||||
margin: 16px 0 4px; }
|
||||
|
||||
h6 {
|
||||
font-size: 16px;
|
||||
margin: 16px 0 4px; }
|
||||
|
||||
small {
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
vertical-align: bottom; }
|
||||
|
||||
pre {
|
||||
background: #f7f7f9;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
display: block;
|
||||
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
font-size: 16px;
|
||||
margin: 16px 0;
|
||||
padding: 16px;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: break-word; }
|
||||
|
||||
code {
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
font-size: 16px;
|
||||
line-height: inherit;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
vertical-align: baseline;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word; }
|
||||
|
||||
a {
|
||||
color: #007bff;
|
||||
text-decoration: none;
|
||||
background-color: transparent; }
|
||||
a:hover, a:focus {
|
||||
color: #0062cc;
|
||||
text-decoration: underline; }
|
||||
|
||||
dl {
|
||||
margin-bottom: 16px; }
|
||||
|
||||
dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin-bottom: 8px;
|
||||
padding-left: 40px;
|
||||
vertical-align: baseline; }
|
||||
|
||||
blockquote {
|
||||
border-left: 2px solid rgba(0, 0, 0, 0.8);
|
||||
font-family: Georgia, Times, "Times New Roman", serif;
|
||||
font-style: italic;
|
||||
margin: 16px 0;
|
||||
padding-left: 16px; }
|
||||
|
||||
figcaption {
|
||||
font-family: Georgia, Times, "Times New Roman", serif; }
|
||||
|
||||
u {
|
||||
text-decoration: underline; }
|
||||
|
||||
s {
|
||||
text-decoration: line-through; }
|
||||
|
||||
sup {
|
||||
font-size: 14px;
|
||||
vertical-align: super; }
|
||||
|
||||
sub {
|
||||
font-size: 14px;
|
||||
vertical-align: sub; }
|
||||
|
||||
mark {
|
||||
background: #ffeb3b; }
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="email"],
|
||||
input[type="url"],
|
||||
input[type="date"],
|
||||
input[type="month"],
|
||||
input[type="time"],
|
||||
input[type="datetime"],
|
||||
input[type="datetime-local"],
|
||||
input[type="week"],
|
||||
input[type="number"],
|
||||
input[type="search"],
|
||||
input[type="tel"],
|
||||
select,
|
||||
textarea {
|
||||
background: #fff;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||
border-radius: 4px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 8px 16px;
|
||||
line-height: 1.5;
|
||||
-webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; }
|
||||
|
||||
input[type="color"] {
|
||||
background: #fff;
|
||||
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||
border-radius: 4px;
|
||||
display: inline-block;
|
||||
vertical-align: middle; }
|
||||
|
||||
input:not([type]) {
|
||||
-webkit-appearance: none;
|
||||
background: #fff;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||
border-radius: 4px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 8px 16px;
|
||||
line-height: 1.5;
|
||||
-webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
text-align: left; }
|
||||
|
||||
input[type="text"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="email"]:focus,
|
||||
input[type="url"]:focus,
|
||||
input[type="date"]:focus,
|
||||
input[type="month"]:focus,
|
||||
input[type="time"]:focus,
|
||||
input[type="datetime"]:focus,
|
||||
input[type="datetime-local"]:focus,
|
||||
input[type="week"]:focus,
|
||||
input[type="number"]:focus,
|
||||
input[type="search"]:focus,
|
||||
input[type="tel"]:focus,
|
||||
input[type="color"]:focus,
|
||||
select:focus,
|
||||
textarea:focus {
|
||||
background-color: #fff;
|
||||
border-color: #80bdff;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
|
||||
|
||||
input:not([type]):focus {
|
||||
background-color: #fff;
|
||||
border-color: #80bdff;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
|
||||
|
||||
input[type="file"]:focus,
|
||||
input[type="radio"]:focus,
|
||||
input[type="checkbox"]:focus {
|
||||
outline: 1px thin rgba(0, 0, 0, 0.12); }
|
||||
|
||||
input[type="text"][disabled],
|
||||
input[type="password"][disabled],
|
||||
input[type="email"][disabled],
|
||||
input[type="url"][disabled],
|
||||
input[type="date"][disabled],
|
||||
input[type="month"][disabled],
|
||||
input[type="time"][disabled],
|
||||
input[type="datetime"][disabled],
|
||||
input[type="datetime-local"][disabled],
|
||||
input[type="week"][disabled],
|
||||
input[type="number"][disabled],
|
||||
input[type="search"][disabled],
|
||||
input[type="tel"][disabled],
|
||||
input[type="color"][disabled],
|
||||
select[disabled],
|
||||
textarea[disabled] {
|
||||
background-color: rgba(0, 0, 0, 0.12);
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
cursor: not-allowed;
|
||||
opacity: 1; }
|
||||
|
||||
input:not([type])[disabled] {
|
||||
background-color: rgba(0, 0, 0, 0.12);
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
cursor: not-allowed;
|
||||
opacity: 1; }
|
||||
|
||||
input[readonly],
|
||||
select[readonly],
|
||||
textarea[readonly] {
|
||||
border-color: rgba(0, 0, 0, 0.12);
|
||||
color: rgba(0, 0, 0, 0.54); }
|
||||
|
||||
input:focus:invalid,
|
||||
textarea:focus:invalid,
|
||||
select:focus:invalid {
|
||||
border-color: #ea1c0d;
|
||||
color: #f44336; }
|
||||
|
||||
input[type="file"]:focus:invalid:focus,
|
||||
input[type="radio"]:focus:invalid:focus,
|
||||
input[type="checkbox"]:focus:invalid:focus {
|
||||
outline-color: #f44336; }
|
||||
|
||||
select {
|
||||
border: 1px solid rgba(0, 0, 0, 0.12);
|
||||
vertical-align: sub; }
|
||||
|
||||
select:not([size]):not([multiple]) {
|
||||
height: -webkit-calc(2.25rem + 2px);
|
||||
height: calc(2.25rem + 2px); }
|
||||
|
||||
select[multiple] {
|
||||
height: auto; }
|
||||
|
||||
label {
|
||||
display: inline-block;
|
||||
line-height: 2; }
|
||||
|
||||
fieldset {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 8px 0; }
|
||||
|
||||
legend {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
padding: 8px 0;
|
||||
width: 100%; }
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
resize: vertical; }
|
||||
|
||||
input[type=checkbox],
|
||||
input[type=radio] {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
display: inline; }
|
||||
|
||||
input[type=submit],
|
||||
input[type=reset],
|
||||
input[type=button],
|
||||
button {
|
||||
background-color: #007bff;
|
||||
border: #007bff;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
padding: 8px 16px;
|
||||
display: inline-block;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
border: 1px solid transparent;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
-webkit-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
|
||||
transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out; }
|
||||
|
||||
input[type=submit]::-moz-focus-inner,
|
||||
input[type=reset]::-moz-focus-inner,
|
||||
input[type=button]::-moz-focus-inner,
|
||||
button::-moz-focus-inner {
|
||||
padding: 0; }
|
||||
|
||||
input[type=submit]:hover,
|
||||
input[type=reset]:hover,
|
||||
input[type=button]:hover,
|
||||
button:hover {
|
||||
background-color: #0069d9;
|
||||
border-color: #0062cc;
|
||||
color: #fff; }
|
||||
|
||||
input[type=submit]:not(:disabled):active,
|
||||
input[type=reset]:not(:disabled):active,
|
||||
input[type=button]:not(:disabled):active,
|
||||
button:not(:disabled):active {
|
||||
background-color: #0062cc;
|
||||
border-color: #005cbf;
|
||||
color: #fff; }
|
||||
|
||||
input[type=submit]:focus,
|
||||
input[type=reset]:focus,
|
||||
input[type=button]:focus,
|
||||
button:focus {
|
||||
outline: 0;
|
||||
-webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5); }
|
||||
|
||||
input[type=submit]:disabled,
|
||||
input[type=reset]:disabled,
|
||||
input[type=button]:disabled,
|
||||
button:disabled {
|
||||
opacity: .65;
|
||||
cursor: not-allowed;
|
||||
background-color: #007bff;
|
||||
border-color: #007bff;
|
||||
color: #fff; }
|
||||
|
||||
table {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
margin-bottom: 16px; }
|
||||
|
||||
caption {
|
||||
padding: 8px 0; }
|
||||
|
||||
thead th {
|
||||
border: 0;
|
||||
border-bottom: 2px solid rgba(0, 0, 0, 0.12);
|
||||
text-align: left; }
|
||||
|
||||
tr {
|
||||
margin-bottom: 8px; }
|
||||
|
||||
th,
|
||||
td {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
padding: 16px;
|
||||
vertical-align: inherit; }
|
||||
|
||||
tfoot tr {
|
||||
text-align: left; }
|
||||
|
||||
tfoot td {
|
||||
color: rgba(0, 0, 0, 0.54);
|
||||
font-size: 8px;
|
||||
font-style: italic;
|
||||
padding: 16px 4px; }
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,190 @@
|
||||
/*! mercury.css v1.0 | MIT License | https://github.com/wmeredith/MercuryCSS */
|
||||
html {
|
||||
font-family: "Georgia", serif;
|
||||
font-size: 62.5%; }
|
||||
|
||||
body {
|
||||
background-color: #FBFBFB;
|
||||
color: #222;
|
||||
font-size: 1.618rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.325;
|
||||
margin: auto;
|
||||
max-width: 90%;
|
||||
padding: 1.325;
|
||||
width: 42em; }
|
||||
|
||||
h1, h2, h3, h4, h5, th, h6 {
|
||||
hyphens: auto;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
-ms-word-break: break-all;
|
||||
word-break: break-word;
|
||||
-ms-hyphens: auto;
|
||||
-moz-hyphens: auto;
|
||||
-webkit-hyphens: auto;
|
||||
font-family: "Verdana", sans-serif;
|
||||
font-weight: 600;
|
||||
letter-spacing: .05em;
|
||||
line-height: 1.325;
|
||||
margin: .66em 0 0; }
|
||||
|
||||
h1 {
|
||||
font-size: 4.98703rem; }
|
||||
|
||||
h2 {
|
||||
font-size: 3.7638rem; }
|
||||
|
||||
h3 {
|
||||
font-size: 2.8406rem; }
|
||||
|
||||
h4 {
|
||||
font-size: 2.14385rem; }
|
||||
|
||||
h5, th {
|
||||
font-size: 1.618rem; }
|
||||
|
||||
h6 {
|
||||
font-size: 1.22113rem; }
|
||||
|
||||
small, sub, sup, caption {
|
||||
font-size: 1.22113rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0; }
|
||||
|
||||
a {
|
||||
border-bottom: 1px dotted #1F5AFF;
|
||||
color: #1F5AFF;
|
||||
text-decoration: none; }
|
||||
a:hover {
|
||||
border-bottom: 1px solid #1F5AFF; }
|
||||
a:visited {
|
||||
border-bottom: 1px dotted #9D32FF;
|
||||
color: #9D32FF; }
|
||||
|
||||
p, fieldset {
|
||||
margin-bottom: 1.325em; }
|
||||
|
||||
b, strong {
|
||||
font-weight: 600; }
|
||||
|
||||
i, em {
|
||||
font-style: italic; }
|
||||
|
||||
ul, ol {
|
||||
padding-left: 2.65em; }
|
||||
ul ul, ul ol, ol ul, ol ol {
|
||||
padding-bottom: 0;
|
||||
padding-top: 0.6625em; }
|
||||
|
||||
li {
|
||||
margin-bottom: 0.6625em; }
|
||||
|
||||
blockquote {
|
||||
border-left: 1px solid #919191;
|
||||
margin-bottom: 1.325em;
|
||||
margin-left: 0.6625em;
|
||||
padding-left: 1.325em; }
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-top: 1px solid #919191; }
|
||||
|
||||
pre {
|
||||
background-color: #eaeaea;
|
||||
color: #000;
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
padding: 1.325em; }
|
||||
|
||||
code {
|
||||
color: #000;
|
||||
white-space: pre-wrap; }
|
||||
|
||||
pre > code {
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
white-space: pre; }
|
||||
|
||||
img {
|
||||
max-width: 100%; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
text-align: justify;
|
||||
width: 100%; }
|
||||
|
||||
th {
|
||||
border-bottom: 1px solid #919191;
|
||||
font-family: "Verdana", sans-serif;
|
||||
padding: 0.6625em 0.6625em; }
|
||||
|
||||
td {
|
||||
padding: 0.44167em 0.6625em; }
|
||||
|
||||
tbody tr {
|
||||
border-bottom: 1px solid #d5d5d5; }
|
||||
tbody tr:last-of-type {
|
||||
border: 0; }
|
||||
|
||||
input, textarea {
|
||||
border: 1px solid #222; }
|
||||
input:focus, textarea:focus {
|
||||
border: 1px solid #1F5AFF; }
|
||||
|
||||
textarea {
|
||||
width: 100%; }
|
||||
|
||||
textarea, select, input[type] {
|
||||
color: #222;
|
||||
padding: 0.44167em;
|
||||
margin-bottom: 0.6625em;
|
||||
background-color: #FFF;
|
||||
border: 1px solid #eaeaea;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0;
|
||||
box-sizing: border-box; }
|
||||
textarea:focus, select:focus, input[type]:focus {
|
||||
border: 1px solid #1F5AFF;
|
||||
outline: 0; }
|
||||
|
||||
input:invalid {
|
||||
border: 1px solid #FC2B07;
|
||||
outline: 0; }
|
||||
|
||||
label, legend, fieldset {
|
||||
display: block; }
|
||||
|
||||
label {
|
||||
margin-bottom: 0.33125em; }
|
||||
|
||||
fieldset {
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 3px -1px rgba(34, 34, 34, 0.1); }
|
||||
|
||||
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
|
||||
background-color: #4878ff;
|
||||
border: 1px solid #0446ff;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 3px 4px -2px rgba(34, 34, 34, 0.5);
|
||||
box-sizing: border-box;
|
||||
color: #FFF;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
padding: 0.44167em 0.6625em;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap; }
|
||||
.button:focus, .button:hover, button:focus, button:hover, input[type="submit"]:focus, input[type="submit"]:hover, input[type="reset"]:focus, input[type="reset"]:hover, input[type="button"]:focus, input[type="button"]:hover {
|
||||
background-color: #2d64ff;
|
||||
border-color: #0032bf;
|
||||
outline: 0; }
|
||||
.button[disabled], button[disabled], input[type="submit"][disabled], input[type="reset"][disabled], input[type="button"][disabled] {
|
||||
box-shadow: none;
|
||||
cursor: default;
|
||||
opacity: .5; }
|
||||
.button[disabled]:hover, button[disabled]:hover, input[type="submit"][disabled]:hover, input[type="reset"][disabled]:hover, input[type="button"][disabled]:hover {
|
||||
background-color: #4878ff;
|
||||
border-color: #1f5aff;
|
||||
cursor: default; }
|
@ -0,0 +1,614 @@
|
||||
/*!
|
||||
* Milligram v1.3.0
|
||||
* https://milligram.github.io
|
||||
*
|
||||
* Copyright (c) 2018 CJ Patoilo
|
||||
* Licensed under the MIT license
|
||||
*/
|
||||
|
||||
*,
|
||||
*:after,
|
||||
*:before {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
font-size: 62.5%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #606c76;
|
||||
font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
|
||||
font-size: 1.6em;
|
||||
font-weight: 300;
|
||||
letter-spacing: .01em;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 0.3rem solid #d1d1d1;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
padding: 1rem 1.5rem;
|
||||
}
|
||||
|
||||
blockquote *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.button,
|
||||
button,
|
||||
input[type='button'],
|
||||
input[type='reset'],
|
||||
input[type='submit'] {
|
||||
background-color: #9b4dca;
|
||||
border: 0.1rem solid #9b4dca;
|
||||
border-radius: .4rem;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
height: 3.8rem;
|
||||
letter-spacing: .1rem;
|
||||
line-height: 3.8rem;
|
||||
padding: 0 3.0rem;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.button:focus, .button:hover,
|
||||
button:focus,
|
||||
button:hover,
|
||||
input[type='button']:focus,
|
||||
input[type='button']:hover,
|
||||
input[type='reset']:focus,
|
||||
input[type='reset']:hover,
|
||||
input[type='submit']:focus,
|
||||
input[type='submit']:hover {
|
||||
background-color: #606c76;
|
||||
border-color: #606c76;
|
||||
color: #fff;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.button[disabled],
|
||||
button[disabled],
|
||||
input[type='button'][disabled],
|
||||
input[type='reset'][disabled],
|
||||
input[type='submit'][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.button[disabled]:focus, .button[disabled]:hover,
|
||||
button[disabled]:focus,
|
||||
button[disabled]:hover,
|
||||
input[type='button'][disabled]:focus,
|
||||
input[type='button'][disabled]:hover,
|
||||
input[type='reset'][disabled]:focus,
|
||||
input[type='reset'][disabled]:hover,
|
||||
input[type='submit'][disabled]:focus,
|
||||
input[type='submit'][disabled]:hover {
|
||||
background-color: #9b4dca;
|
||||
border-color: #9b4dca;
|
||||
}
|
||||
|
||||
.button.button-outline,
|
||||
button.button-outline,
|
||||
input[type='button'].button-outline,
|
||||
input[type='reset'].button-outline,
|
||||
input[type='submit'].button-outline {
|
||||
background-color: transparent;
|
||||
color: #9b4dca;
|
||||
}
|
||||
|
||||
.button.button-outline:focus, .button.button-outline:hover,
|
||||
button.button-outline:focus,
|
||||
button.button-outline:hover,
|
||||
input[type='button'].button-outline:focus,
|
||||
input[type='button'].button-outline:hover,
|
||||
input[type='reset'].button-outline:focus,
|
||||
input[type='reset'].button-outline:hover,
|
||||
input[type='submit'].button-outline:focus,
|
||||
input[type='submit'].button-outline:hover {
|
||||
background-color: transparent;
|
||||
border-color: #606c76;
|
||||
color: #606c76;
|
||||
}
|
||||
|
||||
.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
|
||||
button.button-outline[disabled]:focus,
|
||||
button.button-outline[disabled]:hover,
|
||||
input[type='button'].button-outline[disabled]:focus,
|
||||
input[type='button'].button-outline[disabled]:hover,
|
||||
input[type='reset'].button-outline[disabled]:focus,
|
||||
input[type='reset'].button-outline[disabled]:hover,
|
||||
input[type='submit'].button-outline[disabled]:focus,
|
||||
input[type='submit'].button-outline[disabled]:hover {
|
||||
border-color: inherit;
|
||||
color: #9b4dca;
|
||||
}
|
||||
|
||||
.button.button-clear,
|
||||
button.button-clear,
|
||||
input[type='button'].button-clear,
|
||||
input[type='reset'].button-clear,
|
||||
input[type='submit'].button-clear {
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
color: #9b4dca;
|
||||
}
|
||||
|
||||
.button.button-clear:focus, .button.button-clear:hover,
|
||||
button.button-clear:focus,
|
||||
button.button-clear:hover,
|
||||
input[type='button'].button-clear:focus,
|
||||
input[type='button'].button-clear:hover,
|
||||
input[type='reset'].button-clear:focus,
|
||||
input[type='reset'].button-clear:hover,
|
||||
input[type='submit'].button-clear:focus,
|
||||
input[type='submit'].button-clear:hover {
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
color: #606c76;
|
||||
}
|
||||
|
||||
.button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover,
|
||||
button.button-clear[disabled]:focus,
|
||||
button.button-clear[disabled]:hover,
|
||||
input[type='button'].button-clear[disabled]:focus,
|
||||
input[type='button'].button-clear[disabled]:hover,
|
||||
input[type='reset'].button-clear[disabled]:focus,
|
||||
input[type='reset'].button-clear[disabled]:hover,
|
||||
input[type='submit'].button-clear[disabled]:focus,
|
||||
input[type='submit'].button-clear[disabled]:hover {
|
||||
color: #9b4dca;
|
||||
}
|
||||
|
||||
code {
|
||||
background: #f4f5f6;
|
||||
border-radius: .4rem;
|
||||
font-size: 86%;
|
||||
margin: 0 .2rem;
|
||||
padding: .2rem .5rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
pre {
|
||||
background: #f4f5f6;
|
||||
border-left: 0.3rem solid #9b4dca;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
pre > code {
|
||||
border-radius: 0;
|
||||
display: block;
|
||||
padding: 1rem 1.5rem;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-top: 0.1rem solid #f4f5f6;
|
||||
margin: 3.0rem 0;
|
||||
}
|
||||
|
||||
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='month'],
|
||||
input[type='week'],
|
||||
input[type='datetime'],
|
||||
input[type='datetime-local'],
|
||||
input:not([type]),
|
||||
textarea,
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
background-color: transparent;
|
||||
border: 0.1rem solid #d1d1d1;
|
||||
border-radius: .4rem;
|
||||
box-shadow: none;
|
||||
box-sizing: inherit;
|
||||
height: 3.8rem;
|
||||
padding: .6rem 1.0rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
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='month']:focus,
|
||||
input[type='week']:focus,
|
||||
input[type='datetime']:focus,
|
||||
input[type='datetime-local']:focus,
|
||||
input:not([type]):focus,
|
||||
textarea:focus,
|
||||
select:focus {
|
||||
border-color: #9b4dca;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
select {
|
||||
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat;
|
||||
padding-right: 3.0rem;
|
||||
}
|
||||
|
||||
select:focus {
|
||||
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%239b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>');
|
||||
}
|
||||
|
||||
textarea {
|
||||
min-height: 6.5rem;
|
||||
}
|
||||
|
||||
label,
|
||||
legend {
|
||||
display: block;
|
||||
font-size: 1.6rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border-width: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
input[type='checkbox'],
|
||||
input[type='radio'] {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.label-inline {
|
||||
display: inline-block;
|
||||
font-weight: normal;
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
max-width: 112.0rem;
|
||||
padding: 0 2.0rem;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.row.row-no-padding {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.row.row-no-padding > .column {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.row.row-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.row.row-top {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.row.row-bottom {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.row.row-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.row.row-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.row.row-baseline {
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.row .column {
|
||||
display: block;
|
||||
flex: 1 1 auto;
|
||||
margin-left: 0;
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-10 {
|
||||
margin-left: 10%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-20 {
|
||||
margin-left: 20%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-25 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-33, .row .column.column-offset-34 {
|
||||
margin-left: 33.3333%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-50 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-66, .row .column.column-offset-67 {
|
||||
margin-left: 66.6666%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-75 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-80 {
|
||||
margin-left: 80%;
|
||||
}
|
||||
|
||||
.row .column.column-offset-90 {
|
||||
margin-left: 90%;
|
||||
}
|
||||
|
||||
.row .column.column-10 {
|
||||
flex: 0 0 10%;
|
||||
max-width: 10%;
|
||||
}
|
||||
|
||||
.row .column.column-20 {
|
||||
flex: 0 0 20%;
|
||||
max-width: 20%;
|
||||
}
|
||||
|
||||
.row .column.column-25 {
|
||||
flex: 0 0 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
|
||||
.row .column.column-33, .row .column.column-34 {
|
||||
flex: 0 0 33.3333%;
|
||||
max-width: 33.3333%;
|
||||
}
|
||||
|
||||
.row .column.column-40 {
|
||||
flex: 0 0 40%;
|
||||
max-width: 40%;
|
||||
}
|
||||
|
||||
.row .column.column-50 {
|
||||
flex: 0 0 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.row .column.column-60 {
|
||||
flex: 0 0 60%;
|
||||
max-width: 60%;
|
||||
}
|
||||
|
||||
.row .column.column-66, .row .column.column-67 {
|
||||
flex: 0 0 66.6666%;
|
||||
max-width: 66.6666%;
|
||||
}
|
||||
|
||||
.row .column.column-75 {
|
||||
flex: 0 0 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
|
||||
.row .column.column-80 {
|
||||
flex: 0 0 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
.row .column.column-90 {
|
||||
flex: 0 0 90%;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.row .column .column-top {
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.row .column .column-bottom {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.row .column .column-center {
|
||||
-ms-grid-row-align: center;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
@media (min-width: 40rem) {
|
||||
.row {
|
||||
flex-direction: row;
|
||||
margin-left: -1.0rem;
|
||||
width: calc(100% + 2.0rem);
|
||||
}
|
||||
.row .column {
|
||||
margin-bottom: inherit;
|
||||
padding: 0 1.0rem;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: #9b4dca;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:focus, a:hover {
|
||||
color: #606c76;
|
||||
}
|
||||
|
||||
dl,
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
margin-top: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
dl dl,
|
||||
dl ol,
|
||||
dl ul,
|
||||
ol dl,
|
||||
ol ol,
|
||||
ol ul,
|
||||
ul dl,
|
||||
ul ol,
|
||||
ul ul {
|
||||
font-size: 90%;
|
||||
margin: 1.5rem 0 1.5rem 3.0rem;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: decimal inside;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: circle inside;
|
||||
}
|
||||
|
||||
.button,
|
||||
button,
|
||||
dd,
|
||||
dt,
|
||||
li {
|
||||
margin-bottom: 1.0rem;
|
||||
}
|
||||
|
||||
fieldset,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
dl,
|
||||
figure,
|
||||
form,
|
||||
ol,
|
||||
p,
|
||||
pre,
|
||||
table,
|
||||
ul {
|
||||
margin-bottom: 2.5rem;
|
||||
}
|
||||
|
||||
table {
|
||||
border-spacing: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
border-bottom: 0.1rem solid #e1e1e1;
|
||||
padding: 1.2rem 1.5rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
td:first-child,
|
||||
th:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
td:last-child,
|
||||
th:last-child {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 300;
|
||||
letter-spacing: -.1rem;
|
||||
margin-bottom: 2.0rem;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 4.6rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 3.6rem;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 2.8rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 2.2rem;
|
||||
letter-spacing: -.08rem;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.8rem;
|
||||
letter-spacing: -.05rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1.6rem;
|
||||
letter-spacing: 0;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
content: ' ';
|
||||
display: table;
|
||||
}
|
||||
|
||||
.float-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.float-right {
|
||||
float: right;
|
||||
}
|
@ -0,0 +1 @@
|
||||
/* Copyright 2014 Owen Versteeg; MIT licensed */body,textarea,input,select{background:0;border-radius:0;font:16px sans-serif;margin:0}.smooth{transition:all .2s}.btn,.nav a{text-decoration:none}.container{margin:0 20px;width:auto}label>*{display:inline}form>*{display:block;margin-bottom:10px}.btn{background:#999;border-radius:6px;border:0;color:#fff;cursor:pointer;display:inline-block;margin:2px 0;padding:12px 30px 14px}.btn:hover{background:#888}.btn:active,.btn:focus{background:#777}.btn-a{background:#0ae}.btn-a:hover{background:#09d}.btn-a:active,.btn-a:focus{background:#08b}.btn-b{background:#3c5}.btn-b:hover{background:#2b4}.btn-b:active,.btn-b:focus{background:#2a4}.btn-c{background:#d33}.btn-c:hover{background:#c22}.btn-c:active,.btn-c:focus{background:#b22}.btn-sm{border-radius:4px;padding:10px 14px 11px}.row{margin:1% 0;overflow:auto}.col{float:left}.table,.c12{width:100%}.c11{width:91.66%}.c10{width:83.33%}.c9{width:75%}.c8{width:66.66%}.c7{width:58.33%}.c6{width:50%}.c5{width:41.66%}.c4{width:33.33%}.c3{width:25%}.c2{width:16.66%}.c1{width:8.33%}h1{font-size:3em}.btn,h2{font-size:2em}.ico{font:33px Arial Unicode MS,Lucida Sans Unicode}.addon,.btn-sm,.nav,textarea,input,select{outline:0;font-size:14px}textarea,input,select{padding:8px;border:1px solid #ccc}textarea:focus,input:focus,select:focus{border-color:#5ab}textarea,input[type=text]{-webkit-appearance:none;width:13em}.addon{padding:8px 12px;box-shadow:0 0 0 1px #ccc}.nav,.nav .current,.nav a:hover{background:#000;color:#fff}.nav{height:24px;padding:11px 0 15px}.nav a{color:#aaa;padding-right:1em;position:relative;top:-1px}.nav .pagename{font-size:22px;top:1px}.btn.btn-close{background:#000;float:right;font-size:25px;margin:-54px 7px;display:none}@media(min-width:1310px){.container{margin:auto;width:1270px}}@media(max-width:870px){.row .col{width:100%}}@media(max-width:500px){.btn.btn-close{display:block}.nav{overflow:hidden}.pagename{margin-top:-11px}.nav:active,.nav:focus{height:auto}.nav div:before{background:#000;border-bottom:10px double;border-top:3px solid;content:'';float:right;height:4px;position:relative;right:3px;top:14px;width:20px}.nav a{padding:.5em 0;display:block;width:50%}}.table th,.table td{padding:.5em;text-align:left}.table tbody>:nth-child(2n-1){background:#ddd}.msg{padding:1.5em;background:#def;border-left:5px solid #59d}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,840 @@
|
||||
/*! mobi.css v3.1.1 http://getmobicss.com */
|
||||
|
||||
html {
|
||||
-moz-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
box-sizing: border-box;
|
||||
text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
*,
|
||||
:after,
|
||||
:before {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body,
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: -apple-system,BlinkMacSystemFont,Hiragino Sans GB,Roboto,Segoe UI,Microsoft Yahei,微软雅黑,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,Arial,STHeiti,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin: 1.875rem 0 0;
|
||||
}
|
||||
|
||||
address,
|
||||
blockquote,
|
||||
dl,
|
||||
figure,
|
||||
hr,
|
||||
ol,
|
||||
p,
|
||||
pre,
|
||||
table,
|
||||
ul {
|
||||
margin: 0.9375rem 0 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.625rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.375rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a {
|
||||
-webkit-text-decoration-skip: objects;
|
||||
color: #267fd9;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
b,
|
||||
dt,
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
background-color: #f2f2f2;
|
||||
font-size: 85%;
|
||||
padding: 0.2em 0.3em;
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
background-color: #f2f2f2;
|
||||
line-height: 1.2;
|
||||
overflow: auto;
|
||||
padding: 0.9375rem;
|
||||
}
|
||||
|
||||
pre,
|
||||
pre code {
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
pre code {
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 5px solid #ddd;
|
||||
color: #777;
|
||||
padding-left: 0.9375rem;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
padding-left: 1.875rem;
|
||||
}
|
||||
|
||||
dd,
|
||||
dt,
|
||||
ol ol,
|
||||
ol ul,
|
||||
ul ol,
|
||||
ul ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
|
||||
small,
|
||||
sub,
|
||||
sup {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
sub,
|
||||
sup {
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -.2em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -.4em;
|
||||
}
|
||||
|
||||
address,
|
||||
time {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #333;
|
||||
padding: 0 0.2em;
|
||||
}
|
||||
|
||||
rt {
|
||||
font-size: 60%;
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
-webkit-text-decoration: underline dotted;
|
||||
border-bottom: 0;
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
audio,
|
||||
img,
|
||||
video {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
color: #777;
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
[role=button] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
[role=button],
|
||||
a,
|
||||
area,
|
||||
button,
|
||||
input,
|
||||
label,
|
||||
select,
|
||||
summary,
|
||||
textarea {
|
||||
-ms-touch-action: manipulation;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
::-webkit-file-upload-button,
|
||||
[type=reset],
|
||||
[type=submit],
|
||||
button,
|
||||
html [type=button] {
|
||||
-webkit-appearance: button;
|
||||
appearance: button;
|
||||
}
|
||||
|
||||
[type=search] {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #ddd;
|
||||
margin: 0.9375rem 0 0;
|
||||
padding: 0 0.9375rem 0.9375rem;
|
||||
}
|
||||
|
||||
legend {
|
||||
padding: 0 0.2em;
|
||||
}
|
||||
|
||||
optgroup {
|
||||
color: #777;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
option {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
progress {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.container,
|
||||
.container-fluid,
|
||||
.container-wider {
|
||||
-ms-flex-positive: 1;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
padding: 0 0.9375rem 0.9375rem;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 50rem;
|
||||
}
|
||||
|
||||
.container-wider {
|
||||
max-width: 75rem;
|
||||
}
|
||||
|
||||
.flex-bottom,
|
||||
.flex-center,
|
||||
.flex-left,
|
||||
.flex-middle,
|
||||
.flex-right,
|
||||
.flex-top,
|
||||
.flex-vertical {
|
||||
-ms-flex-flow: row nowrap;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-flex-flow: row nowrap;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
|
||||
.flex-bottom,
|
||||
.flex-center,
|
||||
.flex-left,
|
||||
.flex-middle,
|
||||
.flex-right,
|
||||
.flex-top,
|
||||
.flex-vertical.flex-bottom,
|
||||
.flex-vertical.flex-center,
|
||||
.flex-vertical.flex-left,
|
||||
.flex-vertical.flex-middle,
|
||||
.flex-vertical.flex-right,
|
||||
.flex-vertical.flex-top {
|
||||
-ms-flex-align: stretch;
|
||||
-ms-flex-pack: start;
|
||||
-webkit-align-items: stretch;
|
||||
-webkit-box-align: stretch;
|
||||
-webkit-box-pack: start;
|
||||
-webkit-justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.flex-center,
|
||||
.flex-vertical.flex-middle {
|
||||
-ms-flex-pack: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-right,
|
||||
.flex-vertical.flex-bottom {
|
||||
-ms-flex-pack: end;
|
||||
-webkit-box-pack: end;
|
||||
-webkit-justify-content: flex-end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.flex-top,
|
||||
.flex-vertical.flex-left {
|
||||
-ms-flex-align: start;
|
||||
-webkit-align-items: flex-start;
|
||||
-webkit-box-align: start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.flex-middle,
|
||||
.flex-vertical.flex-center {
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flex-bottom,
|
||||
.flex-vertical.flex-right {
|
||||
-ms-flex-align: end;
|
||||
-webkit-align-items: flex-end;
|
||||
-webkit-box-align: end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.units-gap {
|
||||
margin-left: -.46875rem;
|
||||
margin-right: -.46875rem;
|
||||
}
|
||||
|
||||
.units-gap > .unit,
|
||||
.units-gap > .unit-0,
|
||||
.units-gap > .unit-1,
|
||||
.units-gap > .unit-1-2,
|
||||
.units-gap > .unit-1-3,
|
||||
.units-gap > .unit-1-4,
|
||||
.units-gap > .unit-1-on-mobile,
|
||||
.units-gap > .unit-2-3,
|
||||
.units-gap > .unit-3-4 {
|
||||
padding-left: 0.46875rem;
|
||||
padding-right: 0.46875rem;
|
||||
}
|
||||
|
||||
.units-gap-big {
|
||||
margin-left: -.9375rem;
|
||||
margin-right: -.9375rem;
|
||||
}
|
||||
|
||||
.units-gap-big > .unit,
|
||||
.units-gap-big > .unit-0,
|
||||
.units-gap-big > .unit-1,
|
||||
.units-gap-big > .unit-1-2,
|
||||
.units-gap-big > .unit-1-3,
|
||||
.units-gap-big > .unit-1-4,
|
||||
.units-gap-big > .unit-1-on-mobile,
|
||||
.units-gap-big > .unit-2-3,
|
||||
.units-gap-big > .unit-3-4 {
|
||||
padding-left: 0.9375rem;
|
||||
padding-right: 0.9375rem;
|
||||
}
|
||||
|
||||
.unit {
|
||||
-ms-flex-positive: 1;
|
||||
-ms-flex-preferred-size: 0;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-basis: 0;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.unit-1,
|
||||
.unit-1-2,
|
||||
.unit-1-3,
|
||||
.unit-1-4,
|
||||
.unit-1-on-mobile,
|
||||
.unit-2-3,
|
||||
.unit-3-4 {
|
||||
-ms-flex-negative: 0;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.unit-1 {
|
||||
-ms-flex-preferred-size: 100%;
|
||||
-webkit-flex-basis: 100%;
|
||||
flex-basis: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.unit-1-2 {
|
||||
-ms-flex-preferred-size: 50%;
|
||||
-webkit-flex-basis: 50%;
|
||||
flex-basis: 50%;
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.unit-1-3 {
|
||||
-ms-flex-preferred-size: 33.33%;
|
||||
-webkit-flex-basis: 33.33%;
|
||||
flex-basis: 33.33%;
|
||||
max-width: 33.33%;
|
||||
}
|
||||
|
||||
.unit-2-3 {
|
||||
-ms-flex-preferred-size: 66.67%;
|
||||
-webkit-flex-basis: 66.67%;
|
||||
flex-basis: 66.67%;
|
||||
max-width: 66.67%;
|
||||
}
|
||||
|
||||
.unit-1-4 {
|
||||
-ms-flex-preferred-size: 25%;
|
||||
-webkit-flex-basis: 25%;
|
||||
flex-basis: 25%;
|
||||
max-width: 25%;
|
||||
}
|
||||
|
||||
.unit-3-4 {
|
||||
-ms-flex-preferred-size: 75%;
|
||||
-webkit-flex-basis: 75%;
|
||||
flex-basis: 75%;
|
||||
max-width: 75%;
|
||||
}
|
||||
|
||||
.flex-vertical {
|
||||
-ms-flex-direction: column;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit,
|
||||
.flex-vertical > .unit-0,
|
||||
.flex-vertical > .unit-1,
|
||||
.flex-vertical > .unit-1-2,
|
||||
.flex-vertical > .unit-1-3,
|
||||
.flex-vertical > .unit-1-4,
|
||||
.flex-vertical > .unit-1-on-mobile,
|
||||
.flex-vertical > .unit-2-3,
|
||||
.flex-vertical > .unit-3-4 {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-1 {
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-1-2 {
|
||||
max-height: 50%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-1-3 {
|
||||
max-height: 33.33%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-2-3 {
|
||||
max-height: 66.67%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-1-4 {
|
||||
max-height: 25%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-3-4 {
|
||||
max-height: 75%;
|
||||
}
|
||||
|
||||
.flex-wrap {
|
||||
-ms-flex-wrap: wrap;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.unit-1-on-mobile {
|
||||
-ms-flex-preferred-size: 100%;
|
||||
-webkit-flex-basis: 100%;
|
||||
flex-basis: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.flex-vertical > .unit-1-on-mobile {
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.top-gap-big {
|
||||
margin-top: 1.875rem !important;
|
||||
}
|
||||
|
||||
.top-gap {
|
||||
margin-top: 0.9375rem !important;
|
||||
}
|
||||
|
||||
.top-gap-0 {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.hide-on-mobile {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.show-on-mobile {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
background-color: #fff;
|
||||
border: 0;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table caption {
|
||||
caption-side: bottom;
|
||||
color: #777;
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
.table caption,
|
||||
.table td,
|
||||
.table th {
|
||||
padding: 0.3125rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.table td,
|
||||
.table th {
|
||||
border: 0;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.table th {
|
||||
background-color: #f2f2f2;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.btn {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 0.1875rem;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Hiragino Sans GB,Roboto,Segoe UI,Microsoft Yahei,微软雅黑,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,Arial,STHeiti,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
|
||||
font-size: 1rem;
|
||||
line-height: 1.25;
|
||||
margin: 0.9375rem 0 0;
|
||||
padding: 0.3125rem 0.625rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn:active,
|
||||
.btn:hover {
|
||||
background-color: #f2f2f2;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn[disabled] {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #267fd9;
|
||||
border-color: #267fd9;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-primary:active,
|
||||
.btn-primary:hover {
|
||||
background-color: #2273c3;
|
||||
}
|
||||
|
||||
.btn-primary[disabled] {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background-color: #db5757;
|
||||
border-color: #db5757;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.btn-danger:active,
|
||||
.btn-danger:hover {
|
||||
background-color: #d74242;
|
||||
}
|
||||
|
||||
.btn-danger[disabled] {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.btn-block {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.form label {
|
||||
border: 1px solid transparent;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
line-height: 1.25;
|
||||
margin-top: 0.9375rem;
|
||||
padding-bottom: 0.3125rem;
|
||||
padding-top: 0.3125rem;
|
||||
}
|
||||
|
||||
.form [type=email],
|
||||
.form [type=number],
|
||||
.form [type=password],
|
||||
.form [type=search],
|
||||
.form [type=tel],
|
||||
.form [type=text],
|
||||
.form [type=url],
|
||||
.form select,
|
||||
.form textarea {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 0.1875rem;
|
||||
color: #333;
|
||||
display: block;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Hiragino Sans GB,Roboto,Segoe UI,Microsoft Yahei,微软雅黑,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,Arial,STHeiti,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
|
||||
font-size: 1rem;
|
||||
line-height: 1.25;
|
||||
margin: 0.9375rem 0 0;
|
||||
padding: 0.3125rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form [type=email]:focus,
|
||||
.form [type=number]:focus,
|
||||
.form [type=password]:focus,
|
||||
.form [type=search]:focus,
|
||||
.form [type=tel]:focus,
|
||||
.form [type=text]:focus,
|
||||
.form [type=url]:focus,
|
||||
.form select:focus,
|
||||
.form textarea:focus {
|
||||
border-color: #267fd9;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.form [type=date],
|
||||
.form [type=datetime-local],
|
||||
.form [type=month],
|
||||
.form [type=time],
|
||||
.form [type=week] {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 0.1875rem;
|
||||
color: #333;
|
||||
display: block;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Hiragino Sans GB,Roboto,Segoe UI,Microsoft Yahei,微软雅黑,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,Arial,STHeiti,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
|
||||
font-size: 1rem;
|
||||
line-height: 1.25;
|
||||
margin: 0.9375rem 0 0;
|
||||
padding: 0.3125rem;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.form [type=date]:focus,
|
||||
.form [type=datetime-local]:focus,
|
||||
.form [type=month]:focus,
|
||||
.form [type=time]:focus,
|
||||
.form [type=week]:focus {
|
||||
border-color: #267fd9;
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.form [type=checkbox],
|
||||
.form [type=radio] {
|
||||
cursor: pointer;
|
||||
margin: 0 0.3125rem 0 0;
|
||||
}
|
||||
|
||||
.form select {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.form [type=file],
|
||||
.form [type=range] {
|
||||
border-bottom: 1px solid transparent;
|
||||
border-top: 1px solid transparent;
|
||||
line-height: 1.25;
|
||||
padding-bottom: 0.3125rem;
|
||||
padding-top: 0.3125rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form [type=color],
|
||||
.form [type=file],
|
||||
.form [type=image],
|
||||
.form [type=range] {
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
margin: 0.9375rem 0 0;
|
||||
}
|
||||
|
||||
.form [disabled] {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.form [readonly] {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.text-muted {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.text-primary {
|
||||
color: #267fd9;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #db5757;
|
||||
}
|
||||
|
||||
a.text-danger,
|
||||
a.text-muted,
|
||||
a.text-primary {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.text-small {
|
||||
font-size: 85%;
|
||||
}
|
@ -0,0 +1,219 @@
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
background: transparent !important;
|
||||
color: #000 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: Menlo, Monaco, "Courier New", monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: .5rem;
|
||||
line-height: 1.25;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #3498db;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2980b9;
|
||||
}
|
||||
|
||||
.modest-no-decoration {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.85;
|
||||
}
|
||||
|
||||
p,
|
||||
.modest-p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
.modest-h1,
|
||||
h2,
|
||||
.modest-h2,
|
||||
h3,
|
||||
.modest-h3,
|
||||
h4,
|
||||
.modest-h4 {
|
||||
margin: 1.414rem 0 .5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42;
|
||||
}
|
||||
|
||||
h1,
|
||||
.modest-h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
.modest-h2 {
|
||||
font-size: 2.827rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
.modest-h3 {
|
||||
font-size: 1.999rem;
|
||||
}
|
||||
|
||||
h4,
|
||||
.modest-h4 {
|
||||
font-size: 1.414rem;
|
||||
}
|
||||
|
||||
h5,
|
||||
.modest-h5 {
|
||||
font-size: 1.121rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
.modest-h6 {
|
||||
font-size: .88rem;
|
||||
}
|
||||
|
||||
small,
|
||||
.modest-small {
|
||||
font-size: .707em;
|
||||
}
|
||||
|
||||
/* https://github.com/mrmrs/fluidity */
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700);
|
||||
|
||||
@import url(http://fonts.googleapis.com/css?family=Arimo:700,700italic);
|
||||
|
||||
html {
|
||||
font-size: 18px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #444;
|
||||
font-family: 'Open Sans Condensed', sans-serif;
|
||||
font-weight: 300;
|
||||
margin: 0 auto;
|
||||
max-width: 48rem;
|
||||
line-height: 1.45;
|
||||
padding: .25rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: Arimo, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
border-bottom: 2px solid #fafafa;
|
||||
margin-bottom: 1.15rem;
|
||||
padding-bottom: .5rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 8px solid #fafafa;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
background-color: #fafafa;
|
||||
}
|
File diff suppressed because one or more lines are too long
@ -0,0 +1,128 @@
|
||||
/*
|
||||
| The mu framework v0.3.1
|
||||
| BafS 2016-2018
|
||||
*/
|
||||
*, *:after, *:before {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font: 18px/1.6 Georgia, "Times New Roman", Times, serif;
|
||||
margin: 40px auto;
|
||||
max-width: 760px;
|
||||
color: #444;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5 {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #07c;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #059;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
margin: 25px 0;
|
||||
}
|
||||
|
||||
table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
text-align: left;
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
|
||||
td, th, hr {
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
button, select {
|
||||
background: #ddd;
|
||||
border: 0;
|
||||
padding: 9px 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
input, table {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
input, td, th {
|
||||
padding: 5px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
code, pre, button:hover {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 8px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
textarea {
|
||||
border-color: #ccc;
|
||||
}
|
||||
|
||||
/*
|
||||
| GRID
|
||||
*/
|
||||
.row {
|
||||
display: block;
|
||||
width: auto;
|
||||
min-height: 1px;
|
||||
}
|
||||
|
||||
.row:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.row .c {
|
||||
float: left;
|
||||
}
|
||||
|
||||
table, .g2, .g3, .g3-2, .m2, .m3, .m3-2 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/*
|
||||
| Media queries
|
||||
| Responsive grid, mobile first
|
||||
*/
|
||||
@media (min-width: 768px) {
|
||||
.g2 {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.m2 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
|
||||
.g3 {
|
||||
width: 33.33%;
|
||||
}
|
||||
|
||||
.g3-2 {
|
||||
width: 66.66%;
|
||||
}
|
||||
|
||||
.m3 {
|
||||
margin-left: 33.33%;
|
||||
}
|
||||
|
||||
.m3-2 {
|
||||
margin-left: 66.66%;
|
||||
}
|
||||
}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,448 @@
|
||||
/* MVP.css v1.6.2 - https://github.com/andybrewer/mvp */
|
||||
|
||||
:root {
|
||||
--border-radius: 5px;
|
||||
--box-shadow: 2px 2px 10px;
|
||||
--color: #118bee;
|
||||
--color-accent: #118bee15;
|
||||
--color-bg: #fff;
|
||||
--color-bg-secondary: #e9e9e9;
|
||||
--color-secondary: #920de9;
|
||||
--color-secondary-accent: #920de90b;
|
||||
--color-shadow: #f4f4f4;
|
||||
--color-text: #000;
|
||||
--color-text-secondary: #999;
|
||||
--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
|
||||
--hover-brightness: 1.2;
|
||||
--justify-important: center;
|
||||
--justify-normal: left;
|
||||
--line-height: 1.5;
|
||||
--width-card: 285px;
|
||||
--width-card-medium: 460px;
|
||||
--width-card-wide: 800px;
|
||||
--width-content: 1080px;
|
||||
}
|
||||
|
||||
/*
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--color: #0097fc;
|
||||
--color-accent: #0097fc4f;
|
||||
--color-bg: #333;
|
||||
--color-bg-secondary: #555;
|
||||
--color-secondary: #e20de9;
|
||||
--color-secondary-accent: #e20de94f;
|
||||
--color-shadow: #bbbbbb20;
|
||||
--color-text: #f7f7f7;
|
||||
--color-text-secondary: #aaa;
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
/* Layout */
|
||||
article aside {
|
||||
background: var(--color-secondary-accent);
|
||||
border-left: 4px solid var(--color-secondary);
|
||||
padding: 0.01rem 0.8rem;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--color-bg);
|
||||
color: var(--color-text);
|
||||
font-family: var(--font-family);
|
||||
line-height: var(--line-height);
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
footer,
|
||||
header,
|
||||
main {
|
||||
margin: 0 auto;
|
||||
max-width: var(--width-content);
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: var(--color-bg-secondary);
|
||||
border: none;
|
||||
height: 1px;
|
||||
margin: 4rem 0;
|
||||
}
|
||||
|
||||
section {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: var(--justify-important);
|
||||
}
|
||||
|
||||
section aside {
|
||||
border: 1px solid var(--color-bg-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow) var(--color-shadow);
|
||||
margin: 1rem;
|
||||
padding: 1.25rem;
|
||||
width: var(--width-card);
|
||||
}
|
||||
|
||||
section aside:hover {
|
||||
box-shadow: var(--box-shadow) var(--color-bg-secondary);
|
||||
}
|
||||
|
||||
section aside img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Headers */
|
||||
article header,
|
||||
div header,
|
||||
main header {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: var(--justify-important);
|
||||
}
|
||||
|
||||
header a b,
|
||||
header a em,
|
||||
header a i,
|
||||
header a strong {
|
||||
margin-left: 0.5rem;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
header nav img {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
section header {
|
||||
padding-top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Nav */
|
||||
nav {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-weight: bold;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 7rem;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
nav ul li {
|
||||
display: inline-block;
|
||||
margin: 0 0.5rem;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* Nav Dropdown */
|
||||
nav ul li:hover ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
nav ul li ul {
|
||||
background: var(--color-bg);
|
||||
border: 1px solid var(--color-bg-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow) var(--color-shadow);
|
||||
display: none;
|
||||
height: auto;
|
||||
left: -2px;
|
||||
padding: .5rem 1rem;
|
||||
position: absolute;
|
||||
top: 1.7rem;
|
||||
white-space: nowrap;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
nav ul li ul li,
|
||||
nav ul li ul li a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Typography */
|
||||
code,
|
||||
samp {
|
||||
background-color: var(--color-accent);
|
||||
border-radius: var(--border-radius);
|
||||
color: var(--color-text);
|
||||
display: inline-block;
|
||||
margin: 0 0.1rem;
|
||||
padding: 0 0.5rem;
|
||||
}
|
||||
|
||||
details {
|
||||
margin: 1.3rem 0;
|
||||
}
|
||||
|
||||
details summary {
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
line-height: var(--line-height);
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: 0.1rem;
|
||||
}
|
||||
|
||||
ol li,
|
||||
ul li {
|
||||
padding: 0.2rem 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0.75rem 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
margin: 1rem 0;
|
||||
max-width: var(--width-card-wide);
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
pre code,
|
||||
pre samp {
|
||||
display: block;
|
||||
max-width: var(--width-card-wide);
|
||||
padding: 0.5rem 2rem;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
small {
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
sup {
|
||||
background-color: var(--color-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
color: var(--color-bg);
|
||||
font-size: xx-small;
|
||||
font-weight: bold;
|
||||
margin: 0.2rem;
|
||||
padding: 0.2rem 0.3rem;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
/* Links */
|
||||
a {
|
||||
color: var(--color-secondary);
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
filter: brightness(var(--hover-brightness));
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a b,
|
||||
a em,
|
||||
a i,
|
||||
a strong,
|
||||
button {
|
||||
border-radius: var(--border-radius);
|
||||
display: inline-block;
|
||||
font-size: medium;
|
||||
font-weight: bold;
|
||||
line-height: var(--line-height);
|
||||
margin: 0.5rem 0;
|
||||
padding: 1rem 2rem;
|
||||
}
|
||||
|
||||
button {
|
||||
font-family: var(--font-family);
|
||||
}
|
||||
|
||||
button:hover {
|
||||
cursor: pointer;
|
||||
filter: brightness(var(--hover-brightness));
|
||||
}
|
||||
|
||||
a b,
|
||||
a strong,
|
||||
button {
|
||||
background-color: var(--color);
|
||||
border: 2px solid var(--color);
|
||||
color: var(--color-bg);
|
||||
}
|
||||
|
||||
a em,
|
||||
a i {
|
||||
border: 2px solid var(--color);
|
||||
border-radius: var(--border-radius);
|
||||
color: var(--color);
|
||||
display: inline-block;
|
||||
padding: 1rem 2rem;
|
||||
}
|
||||
|
||||
/* Images */
|
||||
figure {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
figure img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
figure figcaption {
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
/* Forms */
|
||||
|
||||
button:disabled,
|
||||
input:disabled {
|
||||
background: var(--color-bg-secondary);
|
||||
border-color: var(--color-bg-secondary);
|
||||
color: var(--color-text-secondary);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
button[disabled]:hover {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
form {
|
||||
border: 1px solid var(--color-bg-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
box-shadow: var(--box-shadow) var(--color-shadow);
|
||||
display: block;
|
||||
max-width: var(--width-card-wide);
|
||||
min-width: var(--width-card);
|
||||
padding: 1.5rem;
|
||||
text-align: var(--justify-normal);
|
||||
}
|
||||
|
||||
form header {
|
||||
margin: 1.5rem 0;
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
|
||||
input,
|
||||
label,
|
||||
select,
|
||||
textarea {
|
||||
display: block;
|
||||
font-size: inherit;
|
||||
max-width: var(--width-card-wide);
|
||||
}
|
||||
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
input[type="checkbox"]+label,
|
||||
input[type="radio"]+label {
|
||||
display: inline-block;
|
||||
font-weight: normal;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
border: 1px solid var(--color-bg-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
margin-bottom: 1rem;
|
||||
padding: 0.4rem 0.8rem;
|
||||
}
|
||||
|
||||
input[readonly],
|
||||
textarea[readonly] {
|
||||
background-color: var(--color-bg-secondary);
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
table {
|
||||
border: 1px solid var(--color-bg-secondary);
|
||||
border-radius: var(--border-radius);
|
||||
border-spacing: 0;
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
overflow-x: auto;
|
||||
padding: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
table td,
|
||||
table th,
|
||||
table tr {
|
||||
padding: 0.4rem 0.8rem;
|
||||
text-align: var(--justify-important);
|
||||
}
|
||||
|
||||
table thead {
|
||||
background-color: var(--color);
|
||||
border-collapse: collapse;
|
||||
border-radius: var(--border-radius);
|
||||
color: var(--color-bg);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table thead th:first-child {
|
||||
border-top-left-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
table thead th:last-child {
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
table thead th:first-child,
|
||||
table tr td:first-child {
|
||||
text-align: var(--justify-normal);
|
||||
}
|
||||
|
||||
table tr:nth-child(even) {
|
||||
background-color: var(--color-accent);
|
||||
}
|
||||
|
||||
/* Quotes */
|
||||
blockquote {
|
||||
display: block;
|
||||
font-size: x-large;
|
||||
line-height: var(--line-height);
|
||||
margin: 1rem auto;
|
||||
max-width: var(--width-card-medium);
|
||||
padding: 1.5rem 1rem;
|
||||
text-align: var(--justify-important);
|
||||
}
|
||||
|
||||
blockquote footer {
|
||||
color: var(--color-text-secondary);
|
||||
display: block;
|
||||
font-size: small;
|
||||
line-height: var(--line-height);
|
||||
padding: 1.5rem 0;
|
||||
}
|
@ -0,0 +1,432 @@
|
||||
:root {
|
||||
--nc-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
--nc-font-mono: Consolas, monaco, 'Ubuntu Mono', 'Liberation Mono', 'Courier New', Courier, monospace;
|
||||
--nc-tx-1: #000000;
|
||||
--nc-tx-2: #1A1A1A;
|
||||
--nc-bg-1: #FFFFFF;
|
||||
--nc-bg-2: #F6F8FA;
|
||||
--nc-bg-3: #E5E7EB;
|
||||
--nc-lk-1: #0070F3;
|
||||
--nc-lk-2: #0366D6;
|
||||
--nc-lk-tx: #FFFFFF;
|
||||
--nc-ac-1: #79FFE1;
|
||||
--nc-ac-tx: #0C4047;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--nc-tx-1: #ffffff;
|
||||
--nc-tx-2: #eeeeee;
|
||||
--nc-bg-1: #000000;
|
||||
--nc-bg-2: #111111;
|
||||
--nc-bg-3: #222222;
|
||||
--nc-lk-1: #3291FF;
|
||||
--nc-lk-2: #0070F3;
|
||||
--nc-lk-tx: #FFFFFF;
|
||||
--nc-ac-1: #7928CA;
|
||||
--nc-ac-tx: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
/* Reset margins and padding */
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
address,
|
||||
area,
|
||||
article,
|
||||
aside,
|
||||
audio,
|
||||
blockquote,
|
||||
datalist,
|
||||
details,
|
||||
dl,
|
||||
fieldset,
|
||||
figure,
|
||||
form,
|
||||
input,
|
||||
iframe,
|
||||
img,
|
||||
meter,
|
||||
nav,
|
||||
ol,
|
||||
optgroup,
|
||||
option,
|
||||
output,
|
||||
p,
|
||||
pre,
|
||||
progress,
|
||||
ruby,
|
||||
section,
|
||||
table,
|
||||
textarea,
|
||||
ul,
|
||||
video {
|
||||
/* Margins for most elements */
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
html,input,select,button {
|
||||
/* Set body font family and some finicky elements */
|
||||
font-family: var(--nc-font-sans);
|
||||
}
|
||||
|
||||
body {
|
||||
/* Center body in page */
|
||||
margin: 0 auto;
|
||||
max-width: 750px;
|
||||
padding: 2rem;
|
||||
border-radius: 6px;
|
||||
overflow-x: hidden;
|
||||
word-break: break-word;
|
||||
overflow-wrap: break-word;
|
||||
background: var(--nc-bg-1);
|
||||
|
||||
/* Main body text */
|
||||
color: var(--nc-tx-2);
|
||||
font-size: 1.03rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
::selection {
|
||||
/* Set background color for selected text */
|
||||
background: var(--nc-ac-1);
|
||||
color: var(--nc-ac-tx);
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
line-height: 1;
|
||||
color: var(--nc-tx-1);
|
||||
padding-top: .875rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3 {
|
||||
color: var(--nc-tx-1);
|
||||
padding-bottom: 2px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid var(--nc-bg-2);
|
||||
}
|
||||
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.85rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.55rem;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--nc-lk-1);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--nc-lk-2);
|
||||
}
|
||||
|
||||
abbr:hover {
|
||||
/* Set the '?' cursor while hovering an abbreviation */
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
padding: 1.5rem;
|
||||
background: var(--nc-bg-2);
|
||||
border-left: 5px solid var(--nc-bg-3);
|
||||
}
|
||||
|
||||
abbr {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
blockquote *:last-child {
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
background: var(--nc-bg-2);
|
||||
border-bottom: 1px solid var(--nc-bg-3);
|
||||
padding: 2rem 1.5rem;
|
||||
|
||||
/* This sets the right and left margins to cancel out the body's margins. It's width is still the same, but the background stretches across the page's width. */
|
||||
|
||||
margin: -2rem calc(0px - (50vw - 50%)) 2rem;
|
||||
|
||||
/* Shorthand for:
|
||||
|
||||
margin-top: -2rem;
|
||||
margin-bottom: 2rem;
|
||||
|
||||
margin-left: calc(0px - (50vw - 50%));
|
||||
margin-right: calc(0px - (50vw - 50%)); */
|
||||
|
||||
padding-left: calc(50vw - 50%);
|
||||
padding-right: calc(50vw - 50%);
|
||||
}
|
||||
|
||||
header h1,
|
||||
header h2,
|
||||
header h3 {
|
||||
padding-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
header > *:first-child {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
header > *:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
a button,
|
||||
button,
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
input[type="button"] {
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 6px 12px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background: var(--nc-lk-1);
|
||||
color: var(--nc-lk-tx);
|
||||
border: 0;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
color: var(--nc-lk-tx);
|
||||
}
|
||||
|
||||
a button[disabled],
|
||||
button[disabled],
|
||||
input[type="submit"][disabled],
|
||||
input[type="reset"][disabled],
|
||||
input[type="button"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
|
||||
/* Set the [X] cursor while hovering a disabled link */
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.button:focus,
|
||||
.button:hover,
|
||||
button:focus,
|
||||
button:hover,
|
||||
input[type="submit"]:focus,
|
||||
input[type="submit"]:hover,
|
||||
input[type="reset"]:focus,
|
||||
input[type="reset"]:hover,
|
||||
input[type="button"]:focus,
|
||||
input[type="button"]:hover {
|
||||
background: var(--nc-lk-2);
|
||||
}
|
||||
|
||||
code,
|
||||
pre,
|
||||
kbd,
|
||||
samp {
|
||||
/* Set the font family for monospaced elements */
|
||||
font-family: var(--nc-font-mono);
|
||||
}
|
||||
|
||||
code,
|
||||
samp,
|
||||
kbd,
|
||||
pre {
|
||||
/* The main preformatted style. This is changed slightly across different cases. */
|
||||
background: var(--nc-bg-2);
|
||||
border: 1px solid var(--nc-bg-3);
|
||||
border-radius: 4px;
|
||||
padding: 3px 6px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
kbd {
|
||||
/* Makes the kbd element look like a keyboard key */
|
||||
border-bottom: 3px solid var(--nc-bg-3);
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 1rem 1.4rem;
|
||||
max-width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
pre code {
|
||||
/* When <code> is in a <pre>, reset it's formatting to blend in */
|
||||
background: inherit;
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
code pre {
|
||||
/* When <pre> is in a <code>, reset it's formatting to blend in */
|
||||
display: inline;
|
||||
background: inherit;
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
details {
|
||||
/* Make the <details> look more "clickable" */
|
||||
padding: .6rem 1rem;
|
||||
background: var(--nc-bg-2);
|
||||
border: 1px solid var(--nc-bg-3);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
summary {
|
||||
/* Makes the <summary> look more like a "clickable" link with the pointer cursor */
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
details[open] {
|
||||
/* Adjust the <details> padding while open */
|
||||
padding-bottom: .75rem;
|
||||
}
|
||||
|
||||
details[open] summary {
|
||||
/* Adjust the <details> padding while open */
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
details[open]>*:last-child {
|
||||
/* Resets the bottom margin of the last element in the <details> while <details> is opened. This prevents double margins/paddings. */
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dd::before {
|
||||
/* Add an arrow to data table definitions */
|
||||
content: '→ ';
|
||||
}
|
||||
|
||||
hr {
|
||||
/* Reset the border of the <hr> separator, then set a better line */
|
||||
border: 0;
|
||||
border-bottom: 1px solid var(--nc-bg-3);
|
||||
margin: 1rem auto;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
margin-top: 1rem;
|
||||
padding: 2rem;
|
||||
border: 1px solid var(--nc-bg-3);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
legend {
|
||||
padding: auto .5rem;
|
||||
}
|
||||
|
||||
table {
|
||||
/* border-collapse sets the table's elements to share borders, rather than floating as separate "boxes". */
|
||||
border-collapse: collapse;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
border: 1px solid var(--nc-bg-3);
|
||||
text-align: left;
|
||||
padding: .5rem;
|
||||
}
|
||||
|
||||
th {
|
||||
background: var(--nc-bg-2);
|
||||
}
|
||||
|
||||
tr:nth-child(even) {
|
||||
/* Set every other cell slightly darker. Improves readability. */
|
||||
background: var(--nc-bg-2);
|
||||
}
|
||||
|
||||
table caption {
|
||||
font-weight: bold;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
textarea {
|
||||
/* Don't let the <textarea> extend off the screen naturally or when dragged by the user */
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
/* Replace the browser default padding */
|
||||
padding-left: 2rem;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-top: .4rem;
|
||||
}
|
||||
|
||||
ul ul,
|
||||
ol ul,
|
||||
ul ol,
|
||||
ol ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: 3px 6px;
|
||||
background: var(--nc-ac-1);
|
||||
color: var(--nc-ac-tx);
|
||||
}
|
||||
|
||||
textarea,
|
||||
select,
|
||||
input {
|
||||
padding: 6px 12px;
|
||||
margin-bottom: .5rem;
|
||||
background: var(--nc-bg-2);
|
||||
color: var(--nc-tx-2);
|
||||
border: 1px solid var(--nc-bg-3);
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
@ -0,0 +1,553 @@
|
||||
/*! sanitize.css v5.0.0 | CC0 License | github.com/jonathantneal/sanitize.css */
|
||||
*,
|
||||
::after,
|
||||
::before {
|
||||
background-repeat: no-repeat;
|
||||
box-sizing: inherit
|
||||
}
|
||||
::after,
|
||||
::before {
|
||||
text-decoration: inherit;
|
||||
vertical-align: inherit
|
||||
}
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
cursor: default;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%
|
||||
}
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section {
|
||||
display: block
|
||||
}
|
||||
body {
|
||||
margin: 0
|
||||
}
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: .67em 0
|
||||
}
|
||||
figcaption,
|
||||
figure,
|
||||
main {
|
||||
display: block
|
||||
}
|
||||
figure {
|
||||
margin: 1em 40px
|
||||
}
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
overflow: visible
|
||||
}
|
||||
nav ol,
|
||||
nav ul {
|
||||
list-style: none
|
||||
}
|
||||
pre {
|
||||
font-family: monospace,monospace;
|
||||
font-size: 1em
|
||||
}
|
||||
a {
|
||||
background-color: transparent;
|
||||
-webkit-text-decoration-skip: objects
|
||||
}
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace,monospace;
|
||||
font-size: 1em
|
||||
}
|
||||
dfn {
|
||||
font-style: italic
|
||||
}
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000
|
||||
}
|
||||
small {
|
||||
font-size: 80%
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline
|
||||
}
|
||||
sub {
|
||||
bottom: -.25em
|
||||
}
|
||||
sup {
|
||||
top: -.5em
|
||||
}
|
||||
::-moz-selection {
|
||||
background-color: #b3d4fc;
|
||||
color: #000;
|
||||
text-shadow: none
|
||||
}
|
||||
::selection {
|
||||
background-color: #b3d4fc;
|
||||
color: #000;
|
||||
text-shadow: none
|
||||
}
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle
|
||||
}
|
||||
audio,
|
||||
video {
|
||||
display: inline-block
|
||||
}
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0
|
||||
}
|
||||
img {
|
||||
border-style: none
|
||||
}
|
||||
svg {
|
||||
fill: currentColor
|
||||
}
|
||||
svg:not(:root) {
|
||||
overflow: hidden
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse
|
||||
}
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
margin: 0
|
||||
}
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit
|
||||
}
|
||||
button,
|
||||
input {
|
||||
overflow: visible
|
||||
}
|
||||
button,
|
||||
select {
|
||||
text-transform: none
|
||||
}
|
||||
[type=reset],
|
||||
[type=submit],
|
||||
button,
|
||||
html [type=button] {
|
||||
-webkit-appearance: button
|
||||
}
|
||||
[type=button]::-moz-focus-inner,
|
||||
[type=reset]::-moz-focus-inner,
|
||||
[type=submit]::-moz-focus-inner,
|
||||
button::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0
|
||||
}
|
||||
[type=button]:-moz-focusring,
|
||||
[type=reset]:-moz-focusring,
|
||||
[type=submit]:-moz-focusring,
|
||||
button:-moz-focusring {
|
||||
outline: 1px dotted ButtonText
|
||||
}
|
||||
legend {
|
||||
box-sizing: border-box;
|
||||
color: inherit;
|
||||
display: table;
|
||||
max-width: 100%;
|
||||
padding: 0;
|
||||
white-space: normal
|
||||
}
|
||||
progress {
|
||||
display: inline-block;
|
||||
vertical-align: baseline
|
||||
}
|
||||
textarea {
|
||||
overflow: auto;
|
||||
resize: vertical
|
||||
}
|
||||
[type=checkbox],
|
||||
[type=radio] {
|
||||
box-sizing: border-box;
|
||||
padding: 0
|
||||
}
|
||||
[type=number]::-webkit-inner-spin-button,
|
||||
[type=number]::-webkit-outer-spin-button {
|
||||
height: auto
|
||||
}
|
||||
[type=search] {
|
||||
-webkit-appearance: textfield;
|
||||
outline-offset: -2px
|
||||
}
|
||||
[type=search]::-webkit-search-cancel-button,
|
||||
[type=search]::-webkit-search-decoration {
|
||||
-webkit-appearance: none
|
||||
}
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
font: inherit
|
||||
}
|
||||
details,
|
||||
menu {
|
||||
display: block
|
||||
}
|
||||
summary {
|
||||
display: list-item
|
||||
}
|
||||
canvas {
|
||||
display: inline-block
|
||||
}
|
||||
template {
|
||||
display: none
|
||||
}
|
||||
[tabindex],
|
||||
a,
|
||||
area,
|
||||
button,
|
||||
input,
|
||||
label,
|
||||
select,
|
||||
summary,
|
||||
textarea {
|
||||
-ms-touch-action: manipulation;
|
||||
touch-action: manipulation
|
||||
}
|
||||
[hidden] {
|
||||
display: none
|
||||
}
|
||||
[aria-busy=true] {
|
||||
cursor: progress
|
||||
}
|
||||
[aria-controls] {
|
||||
cursor: pointer
|
||||
}
|
||||
[aria-hidden=false][hidden]:not(:focus) {
|
||||
clip: rect(0,0,0,0);
|
||||
display: inherit;
|
||||
position: absolute
|
||||
}
|
||||
[aria-disabled] {
|
||||
cursor: default
|
||||
}
|
||||
/*! no-class.css v1.0.0 | MIT License | https://github.com/davidpaulsson/no-class */
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
-webkit-font-kerning: normal;
|
||||
font-kerning: normal;
|
||||
font-synthesis: none;
|
||||
text-rendering: optimizeLegibility
|
||||
}
|
||||
body {
|
||||
font-family: HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
|
||||
font-weight: 300;
|
||||
line-height: 1.6;
|
||||
font-size: 16px;
|
||||
font-size: 1.6rem
|
||||
}
|
||||
h1 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 36px;
|
||||
font-size: 3.6rem
|
||||
}
|
||||
h2 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 30px;
|
||||
font-size: 3rem
|
||||
}
|
||||
h3 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 24px;
|
||||
font-size: 2.4rem
|
||||
}
|
||||
h4 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 20px;
|
||||
font-size: 2rem
|
||||
}
|
||||
h5 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 16px;
|
||||
font-size: 1.6rem
|
||||
}
|
||||
h6 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
font-size: 14px;
|
||||
font-size: 1.4rem
|
||||
}
|
||||
p {
|
||||
margin-bottom: 1em
|
||||
}
|
||||
code {
|
||||
font-family: Consolas,Monaco,'Andale Mono',monospace;
|
||||
font-size: 80%;
|
||||
vertical-align: baseline
|
||||
}
|
||||
pre {
|
||||
overflow: auto;
|
||||
margin: .5em 0;
|
||||
padding: 0 1em!important;
|
||||
background: #f5f2f0
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline
|
||||
}
|
||||
sup {
|
||||
top: -.5em
|
||||
}
|
||||
sub {
|
||||
bottom: -.25em
|
||||
}
|
||||
cite {
|
||||
font-style: italic
|
||||
}
|
||||
abbr,
|
||||
acronym {
|
||||
cursor: help;
|
||||
border-bottom: .1em dotted
|
||||
}
|
||||
blockquote,
|
||||
q {
|
||||
margin-bottom: 1em;
|
||||
padding-left: 1em;
|
||||
quotes: none;
|
||||
border-left: 3px solid rgba(0,0,0,.1)
|
||||
}
|
||||
ol,
|
||||
ul {
|
||||
margin-bottom: 1em;
|
||||
padding-left: 1.5em
|
||||
}
|
||||
ol ol,
|
||||
ol ul,
|
||||
ul ol,
|
||||
ul ul {
|
||||
margin-bottom: 0
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #3498db;
|
||||
border-bottom: 1px solid #3498db
|
||||
}
|
||||
a:hover {
|
||||
cursor: pointer;
|
||||
color: #217dbb;
|
||||
border-bottom: 0
|
||||
}
|
||||
::-moz-selection {
|
||||
color: #000;
|
||||
background: rgba(0,0,0,.1);
|
||||
text-shadow: none
|
||||
}
|
||||
::selection {
|
||||
color: #000;
|
||||
background: rgba(0,0,0,.1);
|
||||
text-shadow: none
|
||||
}
|
||||
table {
|
||||
width: 100%
|
||||
}
|
||||
td,
|
||||
th {
|
||||
padding: .25em;
|
||||
text-align: left
|
||||
}
|
||||
td:first-child,
|
||||
th:first-child {
|
||||
padding-left: 0
|
||||
}
|
||||
td:last-child,
|
||||
th:last-child {
|
||||
padding-right: 0
|
||||
}
|
||||
tbody tr:nth-of-type(odd) {
|
||||
background-color: #f7f7f7
|
||||
}
|
||||
[colspan] {
|
||||
text-align: center
|
||||
}
|
||||
[colspan='1'] {
|
||||
text-align: left
|
||||
}
|
||||
[rowspan] {
|
||||
vertical-align: middle
|
||||
}
|
||||
[rowspan='1'] {
|
||||
vertical-align: top
|
||||
}
|
||||
hr {
|
||||
height: 1px;
|
||||
margin: 1em 0;
|
||||
border: none;
|
||||
background-color: #ddd
|
||||
}
|
||||
fieldset {
|
||||
min-width: 0;
|
||||
margin: 0;
|
||||
padding: 1em;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px
|
||||
}
|
||||
fieldset legend {
|
||||
font-weight: 700;
|
||||
line-height: inherit;
|
||||
display: block;
|
||||
padding: 0 .5em;
|
||||
border: 0;
|
||||
background-color: #fff;
|
||||
font-size: 16px;
|
||||
font-size: 1.6rem
|
||||
}
|
||||
label {
|
||||
font-weight: 700;
|
||||
display: inline-block;
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
margin-bottom: 5px
|
||||
}
|
||||
input,
|
||||
textarea {
|
||||
width: 100%;
|
||||
margin-bottom: 1em;
|
||||
padding: .25em .5em;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px
|
||||
}
|
||||
input:hover,
|
||||
textarea:hover {
|
||||
border: 1px solid #c4c4c4
|
||||
}
|
||||
input:focus,
|
||||
textarea:focus {
|
||||
border: 1px solid #3498db;
|
||||
outline: 0
|
||||
}
|
||||
button {
|
||||
font-weight: 700;
|
||||
line-height: 1.4;
|
||||
display: inline-block;
|
||||
padding: .25em .55em;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
border: 1px solid #d5d5d5;
|
||||
border-radius: 4px;
|
||||
background-color: #eee;
|
||||
background-image: linear-gradient(#fcfcfc,#eee);
|
||||
background-repeat: no-repeat;
|
||||
text-shadow: 0 1px 0 #fff
|
||||
}
|
||||
button:hover {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
border: 1px solid #ccc;
|
||||
background-color: #ddd;
|
||||
background-image: linear-gradient(#eee,#ddd)
|
||||
}
|
||||
button:focus {
|
||||
text-decoration: none;
|
||||
border-color: #3498db;
|
||||
outline: 0
|
||||
}
|
||||
button:active {
|
||||
border-color: #b5b5b5;
|
||||
background-color: #dcdcdc;
|
||||
background-image: none;
|
||||
box-shadow: inset 0 2px 4px rgba(0,0,0,.15)
|
||||
}
|
||||
button:disabled {
|
||||
color: #999;
|
||||
background-color: #efefef;
|
||||
background-image: none
|
||||
}
|
||||
button:disabled:hover {
|
||||
cursor: not-allowed
|
||||
}
|
||||
aside {
|
||||
background-color: #eee;
|
||||
padding: 0 .5em;
|
||||
border-radius: 4px
|
||||
}
|
||||
main {
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
padding: 20px
|
||||
}
|
||||
header ul {
|
||||
padding-left: 0;
|
||||
list-style-type: none
|
||||
}
|
||||
header li {
|
||||
text-align: center;
|
||||
border-bottom: 1px solid #ddd
|
||||
}
|
||||
@media (min-width:40em) {
|
||||
header li {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
border-bottom: none
|
||||
}
|
||||
header li:first-child a {
|
||||
padding-left: 0
|
||||
}
|
||||
header li:last-child a {
|
||||
padding-right: 0
|
||||
}
|
||||
}
|
||||
header li a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: .25em .5em;
|
||||
border-bottom: none
|
||||
}
|
@ -0,0 +1,349 @@
|
||||
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||
|
||||
/* Document
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Correct the line height in all browsers.
|
||||
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin in all browsers.
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the `main` element consistently in IE.
|
||||
*/
|
||||
|
||||
main {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; /* 1 */
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Chrome 57-
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Change the font styles in all browsers.
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: inherit; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE 10+.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10.
|
||||
* 2. Remove the padding in IE 10.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||
*/
|
||||
|
||||
details {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Misc
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10+.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
@ -0,0 +1,637 @@
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
menu,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
button {
|
||||
overflow: visible;
|
||||
}
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
button,
|
||||
html input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
cursor: pointer;
|
||||
}
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
input {
|
||||
line-height: normal;
|
||||
}
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
}
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
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-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
legend {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
font-size: 14px;
|
||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
line-height: 1.4;
|
||||
}
|
||||
* {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
ul {
|
||||
padding-left: 20px;
|
||||
font-weight: 300;
|
||||
}
|
||||
button,
|
||||
input {
|
||||
outline: none;
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
::-moz-input-placeholder {
|
||||
color: #777;
|
||||
}
|
||||
.container {
|
||||
padding: 0 4%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.row {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
nav:after,
|
||||
.container:after,
|
||||
.row:after,
|
||||
.sidebar:after,
|
||||
.button-group:after {
|
||||
display: block;
|
||||
content: '.';
|
||||
clear: both;
|
||||
height: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
.col-sm-3,
|
||||
.col-sm-6,
|
||||
.col-sm-9 {
|
||||
float: left;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
position: relative;
|
||||
}
|
||||
.col-sm-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-sm-9 {
|
||||
width: 75%;
|
||||
}
|
||||
nav.nav {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
nav.nav h1.oh-brand {
|
||||
margin: 0;
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
float: left;
|
||||
}
|
||||
nav.nav h1.oh-brand a {
|
||||
display: block;
|
||||
padding: 0 15px;
|
||||
color: #3090e4;
|
||||
}
|
||||
nav.nav .oh-menu {
|
||||
margin: 0;
|
||||
padding-left: 0;
|
||||
list-style: none;
|
||||
float: left;
|
||||
}
|
||||
nav.nav .oh-menu li {
|
||||
float: left;
|
||||
}
|
||||
nav.nav .oh-menu li a {
|
||||
color: #777;
|
||||
padding: 0 10px;
|
||||
display: block;
|
||||
-webkit-transition: background 0.2s ease;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
nav.nav .oh-menu li a:hover {
|
||||
color: #333;
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
nav.nav.nav-inverse {
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
nav.nav.nav-inverse h1.oh-brand {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
nav.nav.nav-inverse a {
|
||||
height: 47px;
|
||||
line-height: 47px;
|
||||
}
|
||||
nav.nav.nav-inverse .oh-menu li a:hover {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
nav.nav-footer {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
padding: 20px 0 0 0;
|
||||
margin: 20px 0 0 0;
|
||||
border-top: 1px solid #eee;
|
||||
z-index: 9999;
|
||||
}
|
||||
nav.nav-footer .oh-sitename {
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
}
|
||||
nav.nav-footer .oh-copy {
|
||||
margin-top: 5px;
|
||||
font-size: 13px;
|
||||
color: #ccc;
|
||||
}
|
||||
nav.nav-footer a {
|
||||
color: #ccc;
|
||||
}
|
||||
nav.nav-footer a:hover {
|
||||
color: #3090e4;
|
||||
}
|
||||
.oh-search {
|
||||
float: left;
|
||||
}
|
||||
.oh-search .oh-search-input {
|
||||
display: inline-block;
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: #777;
|
||||
padding: 0 10px;
|
||||
-webkit-transition: background 0.2s ease;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
.oh-search .oh-search-input:focus {
|
||||
background: #fff;
|
||||
}
|
||||
.nav-inverse .oh-search .oh-search-input {
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
}
|
||||
.block {
|
||||
padding: 10px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
.white {
|
||||
color: #fff !important;
|
||||
border-color: #fff !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.white-bg {
|
||||
color: #333 !important;
|
||||
border-color: #e7e7e7 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.white-bg:hover {
|
||||
background-color: #f7f7f7 !important;
|
||||
}
|
||||
.gray {
|
||||
color: #f5f5f5 !important;
|
||||
border-color: #f5f5f5 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.gray-bg {
|
||||
color: #333 !important;
|
||||
background-color: #f5f5f5 !important;
|
||||
border-color: #e7e7e7 !important;
|
||||
}
|
||||
.light-purple {
|
||||
color: #ebcef5 !important;
|
||||
border-color: #ebcef5 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.light-purple-bg {
|
||||
color: #fff !important;
|
||||
background-color: #ebcef5 !important;
|
||||
border-color: #ebcef5 !important;
|
||||
}
|
||||
.yellow {
|
||||
color: #ffe900 !important;
|
||||
border-color: #ffe900 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.yellow-bg {
|
||||
color: #fff !important;
|
||||
background-color: #ffe900 !important;
|
||||
border-color: #ffe900 !important;
|
||||
}
|
||||
.black {
|
||||
color: #000 !important;
|
||||
border-color: #000 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.black-bg {
|
||||
color: #fff !important;
|
||||
background-color: #000 !important;
|
||||
border-color: #000 !important;
|
||||
}
|
||||
.blue {
|
||||
color: #3f729b !important;
|
||||
border-color: #3f729b !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.blue-bg {
|
||||
color: #fff !important;
|
||||
background-color: #3f729b !important;
|
||||
border-color: #3f729b !important;
|
||||
}
|
||||
.green {
|
||||
color: #009990 !important;
|
||||
border-color: #009990 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.green-bg {
|
||||
color: #fff !important;
|
||||
background-color: #009990 !important;
|
||||
border-color: #009990 !important;
|
||||
}
|
||||
.orange {
|
||||
color: #ff9610 !important;
|
||||
border-color: #ff9610 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.orange-bg {
|
||||
color: #fff !important;
|
||||
background-color: #ff9610 !important;
|
||||
border-color: #ff9610 !important;
|
||||
}
|
||||
.brown {
|
||||
color: #c28955 !important;
|
||||
border-color: #c28955 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.brown-bg {
|
||||
color: #fff !important;
|
||||
background-color: #c28955 !important;
|
||||
border-color: #c28955 !important;
|
||||
}
|
||||
.pink {
|
||||
color: #ff82a6 !important;
|
||||
border-color: #ff82a6 !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.pink-bg {
|
||||
color: #fff !important;
|
||||
background-color: #ff82a6 !important;
|
||||
border-color: #ff82a6 !important;
|
||||
}
|
||||
.red {
|
||||
color: #d9534f !important;
|
||||
border-color: #d9534f !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.red-bg {
|
||||
color: #fff !important;
|
||||
background-color: #d9534f !important;
|
||||
border-color: #d9534f !important;
|
||||
}
|
||||
.light-green {
|
||||
color: #f1504d !important;
|
||||
border-color: #f1504d !important;
|
||||
background-color: #fff !important;
|
||||
}
|
||||
.light-green-bg {
|
||||
color: #fff !important;
|
||||
background-color: #46b491 !important;
|
||||
border-color: #46b491 !important;
|
||||
}
|
||||
code {
|
||||
background: #eee;
|
||||
padding: 3px 5px;
|
||||
border-radius: 2px;
|
||||
font-weight: 300;
|
||||
font-size: 13px;
|
||||
}
|
||||
pre {
|
||||
background: #eee;
|
||||
padding: 10px;
|
||||
}
|
||||
pre code {
|
||||
padding: 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 36px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 18px;
|
||||
}
|
||||
h5 {
|
||||
font-size: 14px;
|
||||
}
|
||||
.oh-button {
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
border: 1px solid transparent;
|
||||
white-space: nowrap;
|
||||
padding: 6px 12px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.button-default {
|
||||
color: #333;
|
||||
background-color: #f5f5f5;
|
||||
border-color: #e7e7e7;
|
||||
}
|
||||
.button-default:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
.button-green {
|
||||
color: #fff;
|
||||
background-color: #69db9b;
|
||||
border-color: #69db9b;
|
||||
}
|
||||
.button-green:hover {
|
||||
background-color: #40d180;
|
||||
border-color: #2ebf6e;
|
||||
}
|
||||
.button-red {
|
||||
color: #fff;
|
||||
background-color: #d9534f;
|
||||
border-color: #d43f3a;
|
||||
}
|
||||
.button-red:hover {
|
||||
background-color: #c9302c;
|
||||
border-color: #ac2925;
|
||||
}
|
||||
.button-blue {
|
||||
color: #fff;
|
||||
background-color: #1f8dd6;
|
||||
border-color: #1f8dd6;
|
||||
}
|
||||
.button-blue:hover {
|
||||
background-color: #0078e7;
|
||||
border-color: #0078e7;
|
||||
}
|
||||
.button-colorful {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.button-colorful:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.button-large {
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.button-small {
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.button-mini {
|
||||
padding: 1px 5px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.button-group .oh-button {
|
||||
float: left;
|
||||
}
|
||||
.button-group .oh-button+.oh-button {
|
||||
margin-left: -1px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.button-group .oh-button:first-child {
|
||||
border-radius: 2px 0 0 2px;
|
||||
}
|
||||
.button-group .oh-button:last-child {
|
||||
border-radius: 0 2px 2px 0;
|
||||
}
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
.dropdown .dropdown-sep {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
}
|
||||
.dropdown:hover .dropdown-menu {
|
||||
display: block;
|
||||
}
|
||||
.dropdown .dropdown-menu {
|
||||
padding: 5px 0;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 44px;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
z-index: 99999;
|
||||
-webkit-box-shadow: 0 10px 40px rgba(0,0,0,0.06);
|
||||
box-shadow: 0 10px 40px rgba(0,0,0,0.06);
|
||||
}
|
||||
.dropdown .dropdown-menu li a {
|
||||
display: block;
|
||||
padding: 8px 15px;
|
||||
}
|
||||
.dropdown .dropdown-menu li a:hover {
|
||||
color: #262626;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.dropdown .dropdown-menu:before,
|
||||
.dropdown .dropdown-menu:after {
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 16px;
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-bottom: 8px solid #fff;
|
||||
border-right: 8px solid transparent;
|
||||
border-left: 8px solid transparent;
|
||||
}
|
||||
.dropdown .dropdown-menu:before {
|
||||
top: -9px;
|
||||
border-bottom-color: rgba(0,0,0,0.1);
|
||||
}
|
||||
.state {
|
||||
display: inline-block;
|
||||
}
|
||||
[class*="state-"] {
|
||||
color: #fff;
|
||||
}
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,202 @@
|
||||
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: Menlo, Monaco, "Courier New", monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: .5rem;
|
||||
line-height: 1.25;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
background: transparent !important;
|
||||
color: #000 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #01ff70;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2ecc40;
|
||||
}
|
||||
|
||||
.retro-no-decoration {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.85;
|
||||
}
|
||||
|
||||
p,
|
||||
.retro-p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
.retro-h1,
|
||||
h2,
|
||||
.retro-h2,
|
||||
h3,
|
||||
.retro-h3,
|
||||
h4,
|
||||
.retro-h4 {
|
||||
margin: 1.414rem 0 .5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42;
|
||||
}
|
||||
|
||||
h1,
|
||||
.retro-h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
.retro-h2 {
|
||||
font-size: 2.827rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
.retro-h3 {
|
||||
font-size: 1.999rem;
|
||||
}
|
||||
|
||||
h4,
|
||||
.retro-h4 {
|
||||
font-size: 1.414rem;
|
||||
}
|
||||
|
||||
h5,
|
||||
.retro-h5 {
|
||||
font-size: 1.121rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
.retro-h6 {
|
||||
font-size: .88rem;
|
||||
}
|
||||
|
||||
small,
|
||||
.retro-small {
|
||||
font-size: .707em;
|
||||
}
|
||||
|
||||
/* https://github.com/mrmrs/fluidity */
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: #222;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #fafafa;
|
||||
font-family: "Courier New";
|
||||
line-height: 1.45;
|
||||
margin: 6rem auto 1rem;
|
||||
max-width: 48rem;
|
||||
padding: .25rem;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: 3px solid #01ff70;
|
||||
padding-left: 1rem;
|
||||
}
|
@ -0,0 +1,178 @@
|
||||
/* Sakura.css v1.2.0
|
||||
* ================
|
||||
* Minimal css theme.
|
||||
* Project: https://github.com/oxalorg/sakura/
|
||||
*/
|
||||
/* Body */
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; }
|
||||
|
||||
body {
|
||||
font-size: 1.8rem;
|
||||
line-height: 1.618;
|
||||
max-width: 38em;
|
||||
margin: auto;
|
||||
color: #4a4a4a;
|
||||
background-color: #f9f9f9;
|
||||
padding: 13px; }
|
||||
|
||||
@media (max-width: 684px) {
|
||||
body {
|
||||
font-size: 1.53rem; } }
|
||||
|
||||
@media (max-width: 382px) {
|
||||
body {
|
||||
font-size: 1.35rem; } }
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
line-height: 1.1;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
|
||||
font-weight: 700;
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 1.5rem;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
-ms-word-break: break-all;
|
||||
word-break: break-word;
|
||||
-ms-hyphens: auto;
|
||||
-moz-hyphens: auto;
|
||||
-webkit-hyphens: auto;
|
||||
hyphens: auto; }
|
||||
|
||||
h1 {
|
||||
font-size: 2.35em; }
|
||||
|
||||
h2 {
|
||||
font-size: 2.00em; }
|
||||
|
||||
h3 {
|
||||
font-size: 1.75em; }
|
||||
|
||||
h4 {
|
||||
font-size: 1.5em; }
|
||||
|
||||
h5 {
|
||||
font-size: 1.25em; }
|
||||
|
||||
h6 {
|
||||
font-size: 1em; }
|
||||
|
||||
p {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
small, sub, sup {
|
||||
font-size: 75%; }
|
||||
|
||||
hr {
|
||||
border-color: #2c8898; }
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #2c8898; }
|
||||
a:hover {
|
||||
color: #982c61;
|
||||
border-bottom: 2px solid #4a4a4a; }
|
||||
|
||||
ul {
|
||||
padding-left: 1.4em;
|
||||
margin-top: 0px;
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
li {
|
||||
margin-bottom: 0.4em; }
|
||||
|
||||
blockquote {
|
||||
font-style: italic;
|
||||
margin-left: 1.5em;
|
||||
padding-left: 1em;
|
||||
border-left: 3px solid #2c8898; }
|
||||
|
||||
img {
|
||||
height: auto;
|
||||
max-width: 100%;
|
||||
margin-top: 0px;
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
/* Pre and Code */
|
||||
pre {
|
||||
background-color: #f1f1f1;
|
||||
display: block;
|
||||
padding: 1em;
|
||||
overflow-x: auto;
|
||||
margin-top: 0px;
|
||||
margin-bottom: 2.5rem; }
|
||||
|
||||
code {
|
||||
font-size: 0.9em;
|
||||
padding: 0 0.5em;
|
||||
background-color: #f1f1f1;
|
||||
white-space: pre-wrap; }
|
||||
|
||||
pre > code {
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
white-space: pre; }
|
||||
|
||||
/* Tables */
|
||||
table {
|
||||
text-align: justify;
|
||||
width: 100%;
|
||||
border-collapse: collapse; }
|
||||
|
||||
td, th {
|
||||
padding: 0.5em;
|
||||
border-bottom: 1px solid #f1f1f1; }
|
||||
|
||||
/* Buttons, forms and input */
|
||||
input, textarea {
|
||||
border: 1px solid #4a4a4a; }
|
||||
input:focus, textarea:focus {
|
||||
border: 1px solid #2c8898; }
|
||||
|
||||
textarea {
|
||||
width: 100%; }
|
||||
|
||||
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
background-color: #2c8898;
|
||||
color: #f9f9f9;
|
||||
border-radius: 1px;
|
||||
border: 1px solid #2c8898;
|
||||
cursor: pointer;
|
||||
box-sizing: border-box; }
|
||||
.button[disabled], button[disabled], input[type="submit"][disabled], input[type="reset"][disabled], input[type="button"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5; }
|
||||
.button:focus, .button:hover, button:focus, button:hover, input[type="submit"]:focus, input[type="submit"]:hover, input[type="reset"]:focus, input[type="reset"]:hover, input[type="button"]:focus, input[type="button"]:hover {
|
||||
background-color: #982c61;
|
||||
border-color: #982c61;
|
||||
color: #f9f9f9;
|
||||
outline: 0; }
|
||||
|
||||
textarea, select, input[type] {
|
||||
color: #4a4a4a;
|
||||
padding: 6px 10px;
|
||||
/* The 6px vertically centers text on FF, ignored by Webkit */
|
||||
margin-bottom: 10px;
|
||||
background-color: #f1f1f1;
|
||||
border: 1px solid #f1f1f1;
|
||||
border-radius: 4px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box; }
|
||||
textarea:focus, select:focus, input[type]:focus {
|
||||
border: 1px solid #2c8898;
|
||||
outline: 0; }
|
||||
|
||||
input[type="checkbox"]:focus {
|
||||
outline: 1px dotted #2c8898; }
|
||||
|
||||
label, legend, fieldset {
|
||||
display: block;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: 600; }
|
@ -0,0 +1,566 @@
|
||||
/* Document
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Add border box sizing in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add text decoration inheritance in all browsers (opinionated).
|
||||
* 2. Add vertical alignment inheritance in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
::before,
|
||||
::after {
|
||||
text-decoration: inherit; /* 1 */
|
||||
vertical-align: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Use the default cursor in all browsers (opinionated).
|
||||
* 2. Change the line height in all browsers (opinionated).
|
||||
* 3. Use a 4-space tab width in all browsers (opinionated).
|
||||
* 4. Remove the grey highlight on links in iOS (opinionated).
|
||||
* 5. Prevent adjustments of font size after orientation changes in
|
||||
* IE on Windows Phone and in iOS.
|
||||
* 6. Breaks words to prevent overflow in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
html {
|
||||
cursor: default; /* 1 */
|
||||
line-height: 1.5; /* 2 */
|
||||
-moz-tab-size: 4; /* 3 */
|
||||
tab-size: 4; /* 3 */
|
||||
-webkit-tap-highlight-color: transparent /* 4 */;
|
||||
-ms-text-size-adjust: 100%; /* 5 */
|
||||
-webkit-text-size-adjust: 100%; /* 5 */
|
||||
word-break: break-word; /* 6 */
|
||||
}
|
||||
|
||||
/* Sections
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Edge, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin on nested lists in Chrome, Edge, IE, and Safari.
|
||||
*/
|
||||
|
||||
dl dl,
|
||||
dl ol,
|
||||
dl ul,
|
||||
ol dl,
|
||||
ul dl {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the margin on nested lists in Edge 18- and IE.
|
||||
*/
|
||||
|
||||
ol ol,
|
||||
ol ul,
|
||||
ul ol,
|
||||
ul ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct sizing in Firefox.
|
||||
* 2. Show the overflow in Edge 18- and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
|
||||
main {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the list style on navigation lists in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
nav ol,
|
||||
nav ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the gray background on active links in IE 10.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct text decoration in Edge 18-, IE, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
* ========================================================================== */
|
||||
|
||||
/*
|
||||
* Change the alignment on media elements in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
iframe,
|
||||
img,
|
||||
svg,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
audio,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in iOS 4-7.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the border on iframes in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
iframe {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the border on images within links in IE 10-.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Change the fill color to match the text color in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
svg:not([fill]) {
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
/**
|
||||
* Hide the overflow in IE.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Tabular data
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Collapse border spacing in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin on controls in Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
select {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Show the overflow in IE.
|
||||
* 2. Remove the inheritance of text transform in Edge 18-, Firefox, and IE.
|
||||
*/
|
||||
|
||||
button {
|
||||
overflow: visible; /* 1 */
|
||||
text-transform: none; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the inability to style buttons in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
[type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Change the inconsistent appearance in all browsers (opinionated).
|
||||
* 2. Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #a0a0a0; /* 1 */
|
||||
padding: 0.35em 0.75em 0.625em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in Edge 18- and IE.
|
||||
*/
|
||||
|
||||
input {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge 18- and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
*/
|
||||
|
||||
legend {
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct display in Edge 18- and IE.
|
||||
* 2. Add the correct vertical alignment in Chrome, Edge, and Firefox.
|
||||
*/
|
||||
|
||||
progress {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Remove the margin in Firefox and Safari.
|
||||
* 2. Remove the default vertical scrollbar in IE.
|
||||
* 3. Change the resize direction in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
textarea {
|
||||
margin: 0; /* 1 */
|
||||
overflow: auto; /* 2 */
|
||||
resize: vertical; /* 3 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the padding in IE 10-.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome, Edge, and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-inner-spin-button,
|
||||
::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the text style of placeholders in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: inherit;
|
||||
opacity: 0.54;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner padding in Chrome, Edge, and Safari on macOS.
|
||||
*/
|
||||
|
||||
::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style upload buttons in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding of focus outlines in Firefox.
|
||||
*/
|
||||
|
||||
::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus outline styles unset by the previous rule in Firefox.
|
||||
*/
|
||||
|
||||
:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the additional :invalid styles in Firefox.
|
||||
*/
|
||||
|
||||
:-moz-ui-invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
* ========================================================================== */
|
||||
|
||||
/*
|
||||
* Add the correct display in Edge 18- and IE.
|
||||
*/
|
||||
|
||||
details {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct styles in Edge 18-, IE, and Safari.
|
||||
*/
|
||||
|
||||
dialog {
|
||||
background-color: white;
|
||||
border: solid;
|
||||
color: black;
|
||||
display: block;
|
||||
height: -moz-fit-content;
|
||||
height: -webkit-fit-content;
|
||||
height: fit-content;
|
||||
left: 0;
|
||||
margin: auto;
|
||||
padding: 1em;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: -moz-fit-content;
|
||||
width: -webkit-fit-content;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
dialog:not([open]) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Scripting
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
canvas {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* User interaction
|
||||
* ========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Remove the tapping delay in IE 10.
|
||||
* 2. Remove the tapping delay on clickable elements
|
||||
in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
a,
|
||||
area,
|
||||
button,
|
||||
input,
|
||||
label,
|
||||
select,
|
||||
summary,
|
||||
textarea,
|
||||
[tabindex] {
|
||||
-ms-touch-action: manipulation; /* 1 */
|
||||
touch-action: manipulation; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10-.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Accessibility
|
||||
* ========================================================================== */
|
||||
|
||||
/**
|
||||
* Change the cursor on busy elements in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
[aria-busy="true"] {
|
||||
cursor: progress;
|
||||
}
|
||||
|
||||
/*
|
||||
* Change the cursor on control elements in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
[aria-controls] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
* Change the cursor on disabled, not-editable, or otherwise
|
||||
* inoperable elements in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
[aria-disabled="true"],
|
||||
[disabled] {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/*
|
||||
* Change the display on visually hidden accessible elements
|
||||
* in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
[aria-hidden="false"][hidden] {
|
||||
display: initial;
|
||||
}
|
||||
|
||||
[aria-hidden="false"][hidden]:not(:focus) {
|
||||
clip: rect(0, 0, 0, 0);
|
||||
position: absolute;
|
||||
}
|
@ -0,0 +1,167 @@
|
||||
/*!
|
||||
* Codify.css 1.0.0 (https://github.com/zdroid/codify.css)
|
||||
* Licensed under the MIT License.
|
||||
*/
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
line-height: 1.2;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
main {
|
||||
display: block;
|
||||
}
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
-webkit-text-decoration-skip: objects;
|
||||
background: transparent;
|
||||
}
|
||||
hr {
|
||||
height: 0;
|
||||
box-sizing: content-box;
|
||||
overflow: visible;
|
||||
}
|
||||
h1 {
|
||||
margin: .67em 0;
|
||||
font-size: 2em;
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
position: relative;
|
||||
font-size: 80%;
|
||||
line-height: 0;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
sup {
|
||||
top: -.25em;
|
||||
}
|
||||
sub {
|
||||
bottom: -.5em;
|
||||
}
|
||||
abbr[title] {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
blockquote:before,
|
||||
blockquote:after {
|
||||
content: "";
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
pre {
|
||||
overflow: auto;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border: 0;
|
||||
}
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
margin: 0;
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
fieldset {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
}
|
||||
legend {
|
||||
display: table;
|
||||
max-width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
white-space: normal;
|
||||
border: 0;
|
||||
}
|
||||
[type="search"] {
|
||||
box-sizing: border-box;
|
||||
-webkit-appearance: textfield;
|
||||
}
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
button,
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border-style: none;
|
||||
}
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 4px 0 0;
|
||||
line-height: normal;
|
||||
}
|
||||
textarea {
|
||||
vertical-align: top;
|
||||
}
|
||||
button,
|
||||
input {
|
||||
overflow: visible;
|
||||
}
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,489 @@
|
||||
/* skeleton-plus <https://github.com/oldaniel/skeleton-plus> , Copyright 2018, Daniel Oltmanns <daniel@thedcdesigns.com> */
|
||||
@import url("https://fonts.googleapis.com/css?family=Lato:400,700");
|
||||
/*
|
||||
Define some variables we will need
|
||||
*/
|
||||
/*
|
||||
Do the imports
|
||||
*/
|
||||
* {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-weight: 400;
|
||||
color: #212121;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
word-wrap: break-word; }
|
||||
|
||||
nav {
|
||||
margin: 20px auto;
|
||||
max-width: 960px;
|
||||
width: 95%; }
|
||||
nav label {
|
||||
font-weight: bold; }
|
||||
nav ul {
|
||||
list-style: none;
|
||||
float: right; }
|
||||
nav ul li {
|
||||
margin: 0 15px; }
|
||||
nav * {
|
||||
display: inline-block; }
|
||||
@media screen and (max-width: 640px) {
|
||||
nav {
|
||||
text-align: center; }
|
||||
nav > * {
|
||||
display: block; }
|
||||
nav ul {
|
||||
float: none;
|
||||
margin-top: 15px; } }
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
width: 95%;
|
||||
margin: 0 auto; }
|
||||
|
||||
.grid-flex {
|
||||
display: -webkit-box;
|
||||
display: flex; }
|
||||
|
||||
.row:after {
|
||||
content: '';
|
||||
display: table;
|
||||
clear: both; }
|
||||
|
||||
.flex-1 {
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1; }
|
||||
|
||||
.flex-2 {
|
||||
-webkit-box-flex: 2;
|
||||
flex: 2; }
|
||||
|
||||
.flex-3 {
|
||||
-webkit-box-flex: 3;
|
||||
flex: 3; }
|
||||
|
||||
.flex-4 {
|
||||
-webkit-box-flex: 4;
|
||||
flex: 4; }
|
||||
|
||||
.flex-5 {
|
||||
-webkit-box-flex: 5;
|
||||
flex: 5; }
|
||||
|
||||
.flex-6 {
|
||||
-webkit-box-flex: 6;
|
||||
flex: 6; }
|
||||
|
||||
.flex-7 {
|
||||
-webkit-box-flex: 7;
|
||||
flex: 7; }
|
||||
|
||||
.flex-8 {
|
||||
-webkit-box-flex: 8;
|
||||
flex: 8; }
|
||||
|
||||
.flex-9 {
|
||||
-webkit-box-flex: 9;
|
||||
flex: 9; }
|
||||
|
||||
.flex-10 {
|
||||
-webkit-box-flex: 10;
|
||||
flex: 10; }
|
||||
|
||||
/* Old grid system */
|
||||
.one.column, .one.columns {
|
||||
width: 7.33333%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.two.columns {
|
||||
width: 15.66667%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.three.columns {
|
||||
width: 24%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.four.columns {
|
||||
width: 32.33333%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.five.columns {
|
||||
width: 40.66667%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.six.columns {
|
||||
width: 49%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.seven.columns {
|
||||
width: 57.33333%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.eight.columns {
|
||||
width: 65.66667%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.nine.columns {
|
||||
width: 74%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.ten.columns {
|
||||
width: 82.33333%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.eleven.columns {
|
||||
width: 90.66667%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
.twelve.columns {
|
||||
width: 99%;
|
||||
display: inline-block;
|
||||
margin: 0 .5%;
|
||||
float: left; }
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.columns.desktop, .column.desktop {
|
||||
display: block !important;
|
||||
width: 99% !important; } }
|
||||
|
||||
@media screen and (min-width: 750px) {
|
||||
.columns.mobile, .column.mobile {
|
||||
display: block !important;
|
||||
width: 99% !important; } }
|
||||
|
||||
button {
|
||||
display: inline-block;
|
||||
padding: 8px 30px;
|
||||
margin: 5px 0;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
border: none;
|
||||
outline: none;
|
||||
border-radius: 2px;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
background-color: #212121;
|
||||
transition: 0.2s ease-in-out; }
|
||||
button:hover, button:disabled {
|
||||
background-color: #878787; }
|
||||
button:active {
|
||||
background-color: black; }
|
||||
button.success {
|
||||
background-color: #2be379;
|
||||
transition: 0.2s ease-in-out; }
|
||||
button.success:hover, button.success:disabled {
|
||||
background-color: #6feca4; }
|
||||
button.success:active {
|
||||
background-color: #17ab55; }
|
||||
button.error {
|
||||
background-color: #f14735;
|
||||
transition: 0.2s ease-in-out; }
|
||||
button.error:hover, button.error:disabled {
|
||||
background-color: #f6887d; }
|
||||
button.error:active {
|
||||
background-color: #cb200e; }
|
||||
button.warning {
|
||||
background-color: #ffb930;
|
||||
transition: 0.2s ease-in-out; }
|
||||
button.warning:hover, button.warning:disabled {
|
||||
background-color: #ffd37d; }
|
||||
button.warning:active {
|
||||
background-color: #e39600; }
|
||||
button.btn-shadow {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); }
|
||||
button.btn-shadow:hover {
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
|
||||
button.btn-shadow:active {
|
||||
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }
|
||||
|
||||
input, textarea, select {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 5px;
|
||||
margin: 5px 0;
|
||||
border: 1px solid #e0e0e0;
|
||||
outline: none;
|
||||
border-radius: 2px;
|
||||
background-color: #ffffff; }
|
||||
input:hover, textarea:hover, select:hover {
|
||||
border-color: #6e6e6e; }
|
||||
input:focus, textarea:focus, select:focus {
|
||||
border-color: #212121; }
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
min-height: 60px; }
|
||||
|
||||
b, strong {
|
||||
font-weight: 700; }
|
||||
|
||||
a {
|
||||
text-decoration: underline;
|
||||
cursor: pointer; }
|
||||
a:hover {
|
||||
color: #6e6e6e; }
|
||||
a.none {
|
||||
text-decoration: none; }
|
||||
|
||||
h1 {
|
||||
font-size: 3rem; }
|
||||
|
||||
h2 {
|
||||
font-size: 2.6rem; }
|
||||
|
||||
h3 {
|
||||
font-size: 2.2rem; }
|
||||
|
||||
h4 {
|
||||
font-size: 1.8rem; }
|
||||
|
||||
h5 {
|
||||
font-size: 1.6rem; }
|
||||
|
||||
h6 {
|
||||
font-size: 1.4rem; }
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin-bottom: 10px;
|
||||
font-weight: bold; }
|
||||
|
||||
small {
|
||||
font-size: .8rem; }
|
||||
|
||||
p {
|
||||
margin: 15px 0; }
|
||||
|
||||
.text-left {
|
||||
text-align: left; }
|
||||
|
||||
.text-center {
|
||||
text-align: center; }
|
||||
|
||||
.text-right {
|
||||
text-align: right; }
|
||||
|
||||
.text-muted, .text-muted * {
|
||||
color: #616161; }
|
||||
|
||||
.text-success, .text-success * {
|
||||
color: #2be379; }
|
||||
|
||||
.text-error, .text-error * {
|
||||
color: #f14735; }
|
||||
|
||||
.text-warning, .text-warning * {
|
||||
color: #ffb930; }
|
||||
|
||||
.text-inverted, .text-inverted * {
|
||||
color: #ffffff; }
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin-top: .5em; }
|
||||
@media screen and (max-width: 750px) {
|
||||
table {
|
||||
overflow-x: auto;
|
||||
display: block; } }
|
||||
table td, table th {
|
||||
padding: 12px 15px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #e0e0e0; }
|
||||
|
||||
ul ul {
|
||||
margin-left: 15px; }
|
||||
|
||||
ul.inner, ul .inner {
|
||||
list-style-position: inside; }
|
||||
|
||||
ul.outer, ul .outer {
|
||||
list-style-position: outside; }
|
||||
|
||||
/**
|
||||
* Thanks to Chris Bracco for this tooltip from https://codepen.io/cbracco/pen/qzukg
|
||||
*/
|
||||
/* Add this attribute to the element that needs a tooltip */
|
||||
[data-tooltip] {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
cursor: pointer; }
|
||||
|
||||
/* Hide the tooltip content by default */
|
||||
[data-tooltip]:before,
|
||||
[data-tooltip]:after {
|
||||
visibility: hidden;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
opacity: 0;
|
||||
pointer-events: none; }
|
||||
|
||||
/* Position tooltip above the element */
|
||||
[data-tooltip]:before {
|
||||
position: absolute;
|
||||
bottom: 150%;
|
||||
left: 50%;
|
||||
margin-bottom: 5px;
|
||||
margin-left: -80px;
|
||||
padding: 7px;
|
||||
width: 160px;
|
||||
border-radius: 3px;
|
||||
background-color: #000;
|
||||
background-color: rgba(51, 51, 51, 0.9);
|
||||
color: #fff;
|
||||
content: attr(data-tooltip);
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
line-height: 1.2; }
|
||||
|
||||
/* Triangle hack to make tooltip look like a speech bubble */
|
||||
[data-tooltip]:after {
|
||||
position: absolute;
|
||||
bottom: 150%;
|
||||
left: 50%;
|
||||
margin-left: -5px;
|
||||
width: 0;
|
||||
border-top: 5px solid #000;
|
||||
border-top: 5px solid rgba(51, 51, 51, 0.9);
|
||||
border-right: 5px solid transparent;
|
||||
border-left: 5px solid transparent;
|
||||
content: " ";
|
||||
font-size: 0;
|
||||
line-height: 0; }
|
||||
|
||||
/* Show tooltip content on hover */
|
||||
[data-tooltip]:hover:before,
|
||||
[data-tooltip]:hover:after {
|
||||
visibility: visible;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
|
||||
opacity: 1; }
|
||||
|
||||
.card {
|
||||
margin: 15px;
|
||||
border-radius: 1px;
|
||||
border: 0.5px solid #e0e0e0; }
|
||||
.card img {
|
||||
width: 100%;
|
||||
display: block;
|
||||
border-radius: 1px 1px 0 0; }
|
||||
.card .content {
|
||||
padding: 10px; }
|
||||
.card .footer {
|
||||
border-top: 1px solid #e0e0e0;
|
||||
padding: 5px 15px;
|
||||
text-align: right; }
|
||||
.card.card-shadow {
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
border: none; }
|
||||
|
||||
hr {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 1px;
|
||||
width: 60%;
|
||||
background-color: #e0e0e0; }
|
||||
|
||||
.bg-success {
|
||||
background-color: #2be379; }
|
||||
|
||||
.bg-warning {
|
||||
background-color: #ffb930; }
|
||||
|
||||
.bg-error {
|
||||
background-color: #f14735; }
|
||||
|
||||
.bg-success-bright {
|
||||
background-color: #b2f5ce; }
|
||||
|
||||
.bg-warning-bright {
|
||||
background-color: #ffedc9; }
|
||||
|
||||
.bg-error-bright {
|
||||
background-color: #fbc9c4; }
|
||||
|
||||
code {
|
||||
background-color: #e0e0e0;
|
||||
display: inline-block;
|
||||
padding: 4px 8px;
|
||||
font-family: monospace;
|
||||
overflow-x: auto; }
|
||||
|
||||
pre > code {
|
||||
display: block;
|
||||
white-space: pre; }
|
||||
|
||||
.cover {
|
||||
min-height: 60vh;
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
justify-content: center; }
|
||||
.cover > div {
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1; }
|
||||
|
||||
.progress {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
margin: 5px;
|
||||
background-color: #e0e0e0; }
|
||||
.progress .bar {
|
||||
transition: width .5s ease-in-out;
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
max-width: 100%; }
|
||||
|
||||
img {
|
||||
display: block;
|
||||
width: 100%; }
|
||||
|
||||
.pagination {
|
||||
display: -webkit-box;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding: 15px; }
|
||||
.pagination * {
|
||||
text-decoration: none; }
|
||||
.pagination > * {
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1;
|
||||
padding: 3px; }
|
||||
.pagination > *:hover {
|
||||
background-color: #ededed;
|
||||
transition: .3s background-color ease-in-out; }
|
||||
.pagination > *:hover, .pagination > *:hover * {
|
||||
color: #212121; }
|
||||
.pagination .action {
|
||||
-webkit-box-flex: .5;
|
||||
flex: .5; }
|
||||
.pagination.no-flex {
|
||||
display: block; }
|
||||
.pagination.no-flex > * {
|
||||
display: inline-block;
|
||||
margin: 0 10px; }
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,225 @@
|
||||
@media print {
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
background: transparent !important;
|
||||
color: #000 !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
a[href^="#"]:after,
|
||||
a[href^="javascript:"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre,
|
||||
blockquote {
|
||||
border: 1px solid #999;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
thead {
|
||||
display: table-header-group;
|
||||
}
|
||||
|
||||
tr,
|
||||
img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
p,
|
||||
h2,
|
||||
h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2,
|
||||
h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 32rem) and (max-width: 48rem) {
|
||||
html {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 48rem) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.85;
|
||||
}
|
||||
|
||||
p,
|
||||
.splendor-p {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
.splendor-h1,
|
||||
h2,
|
||||
.splendor-h2,
|
||||
h3,
|
||||
.splendor-h3,
|
||||
h4,
|
||||
.splendor-h4 {
|
||||
margin: 1.414rem 0 .5rem;
|
||||
font-weight: inherit;
|
||||
line-height: 1.42;
|
||||
}
|
||||
|
||||
h1,
|
||||
.splendor-h1 {
|
||||
margin-top: 0;
|
||||
font-size: 3.998rem;
|
||||
}
|
||||
|
||||
h2,
|
||||
.splendor-h2 {
|
||||
font-size: 2.827rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
.splendor-h3 {
|
||||
font-size: 1.999rem;
|
||||
}
|
||||
|
||||
h4,
|
||||
.splendor-h4 {
|
||||
font-size: 1.414rem;
|
||||
}
|
||||
|
||||
h5,
|
||||
.splendor-h5 {
|
||||
font-size: 1.121rem;
|
||||
}
|
||||
|
||||
h6,
|
||||
.splendor-h6 {
|
||||
font-size: .88rem;
|
||||
}
|
||||
|
||||
small,
|
||||
.splendor-small {
|
||||
font-size: .707em;
|
||||
}
|
||||
|
||||
/* https://github.com/mrmrs/fluidity */
|
||||
|
||||
img,
|
||||
canvas,
|
||||
iframe,
|
||||
video,
|
||||
svg,
|
||||
select,
|
||||
textarea {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@import url(http://fonts.googleapis.com/css?family=Merriweather:300italic,300);
|
||||
|
||||
html {
|
||||
font-size: 18px;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #444;
|
||||
font-family: 'Merriweather', Georgia, serif;
|
||||
margin: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* === A bit of a gross hack so we can have bleeding divs/blockquotes. */
|
||||
|
||||
p,
|
||||
*:not(div):not(img):not(body):not(html):not(li):not(blockquote):not(p) {
|
||||
margin: 1rem auto 1rem;
|
||||
max-width: 36rem;
|
||||
padding: .25rem;
|
||||
}
|
||||
|
||||
div {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
blockquote p {
|
||||
font-size: 1.5rem;
|
||||
font-style: italic;
|
||||
margin: 1rem auto 1rem;
|
||||
max-width: 48rem;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
/* Counteract the specificity of the gross *:not() chain. */
|
||||
|
||||
h1 {
|
||||
padding: 4rem 0 !important;
|
||||
}
|
||||
|
||||
/* === End gross hack */
|
||||
|
||||
p {
|
||||
color: #555;
|
||||
height: auto;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
font-family: Menlo, Monaco, "Courier New", monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
background-color: #fafafa;
|
||||
font-size: .8rem;
|
||||
overflow-x: scroll;
|
||||
padding: 1.125em;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: #3498db;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
a:focus,
|
||||
a:active {
|
||||
color: #2980b9;
|
||||
}
|
@ -0,0 +1,510 @@
|
||||
/*! style.css v1.0.0 | ISC License | https://github.com/ungoldman/style.css */
|
||||
html {
|
||||
color: #303030;
|
||||
background-color: white;
|
||||
box-sizing: border-box;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "avenir next", avenir, "segoe ui", "fira sans", roboto, noto, "droid sans", "liberation sans", "lucida grande", "helvetica neue", helvetica, "franklin gothic medium", "century gothic", cantarell, oxygen, ubuntu, sans-serif;
|
||||
font-size: calc(14px + 0.25vw);
|
||||
line-height: 1.55;
|
||||
-webkit-font-kerning: normal;
|
||||
font-kerning: normal;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-feature-settings: "kern", "liga" 1, "calt" 0;
|
||||
font-feature-settings: "kern", "liga" 1, "calt" 0;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section,
|
||||
figcaption,
|
||||
figure,
|
||||
main {
|
||||
display: block;
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
p,
|
||||
blockquote,
|
||||
ul,
|
||||
ol,
|
||||
dl,
|
||||
table,
|
||||
pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 500;
|
||||
line-height: 1.25em;
|
||||
margin-bottom: 1.25rem;
|
||||
margin-top: 2rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
h1 small,
|
||||
h2 small,
|
||||
h3 small,
|
||||
h4 small,
|
||||
h5 small,
|
||||
h6 small {
|
||||
color: #777;
|
||||
font-size: 0.7em;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h1 code,
|
||||
h2 code,
|
||||
h3 code,
|
||||
h4 code,
|
||||
h5 code,
|
||||
h6 code {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.75em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2.25em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.75em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 1.15em;
|
||||
color: #575757;
|
||||
}
|
||||
|
||||
p {
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
a {
|
||||
background-color: transparent;
|
||||
-webkit-text-decoration-skip: objects;
|
||||
color: #0074d9;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:active, a:hover {
|
||||
outline-width: 0;
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
a:active, a:focus, a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
padding: 0;
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
ul ol,
|
||||
ol ol {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
|
||||
ul ul,
|
||||
ul ol,
|
||||
ol ul,
|
||||
ol ol {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
ul ul ol,
|
||||
ul ol ol,
|
||||
ol ul ol,
|
||||
ol ol ol {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
|
||||
li > p {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 0 0 1rem;
|
||||
padding: 0 1rem;
|
||||
color: #7d7d7d;
|
||||
border-left: 4px solid #d6d6d6;
|
||||
}
|
||||
|
||||
blockquote > :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
blockquote > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
code,
|
||||
pre,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: menlo, inconsolata, consolas, "fira mono", "noto mono", "droid sans mono", "liberation mono", "dejavu sans mono", "ubuntu mono", monaco, "courier new", monospace;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
background-color: #f7f7f7;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
word-wrap: normal;
|
||||
padding: 1em;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
pre code {
|
||||
background: transparent;
|
||||
display: inline;
|
||||
padding: 0;
|
||||
line-height: inherit;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
pre code::before, pre code::after {
|
||||
content: normal;
|
||||
}
|
||||
|
||||
pre > code {
|
||||
border: 0;
|
||||
font-size: 1em;
|
||||
white-space: pre;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0.2em 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
code::before, code::after {
|
||||
letter-spacing: -0.2em;
|
||||
content: '\00a0';
|
||||
}
|
||||
|
||||
kbd {
|
||||
background-color: #e6e6e6;
|
||||
background-image: linear-gradient(#fafafa, #e6e6e6);
|
||||
background-repeat: repeat-x;
|
||||
border: 1px solid #d6d6d6;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 0 #d6d6d6;
|
||||
color: #303030;
|
||||
display: inline-block;
|
||||
line-height: 0.95em;
|
||||
margin: 0 1px;
|
||||
padding: 5px 5px 1px;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
word-break: normal;
|
||||
word-break: keep-all;
|
||||
}
|
||||
|
||||
table th,
|
||||
table td {
|
||||
padding: 6px 13px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
table th {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
table tr {
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #ccc;
|
||||
}
|
||||
|
||||
table tr:nth-child(2n) {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
overflow: visible;
|
||||
background: transparent;
|
||||
height: 4px;
|
||||
padding: 0;
|
||||
margin: 1em 0;
|
||||
background-color: #e7e7e7;
|
||||
border: 0 none;
|
||||
}
|
||||
|
||||
hr::before {
|
||||
display: table;
|
||||
content: '';
|
||||
}
|
||||
|
||||
hr::after {
|
||||
display: table;
|
||||
clear: both;
|
||||
content: '';
|
||||
}
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
border: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
figure img {
|
||||
background: white;
|
||||
border: 1px solid #c7c7c7;
|
||||
padding: 0.25em;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-style: italic;
|
||||
font-size: 0.75em;
|
||||
font-weight: 200;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
text-decoration: underline;
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
dl {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
dl dt {
|
||||
padding: 0;
|
||||
margin-top: 1em;
|
||||
font-size: 1em;
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
dl dd {
|
||||
padding: 0 1em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
audio,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
input {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: sans-serif;
|
||||
font-size: 100%;
|
||||
line-height: 1.15;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button,
|
||||
input {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
button,
|
||||
html [type="button"],
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
}
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
legend {
|
||||
color: inherit;
|
||||
display: table;
|
||||
max-width: 100%;
|
||||
padding: 0;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
progress {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
details,
|
||||
menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
canvas {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
@ -0,0 +1,278 @@
|
||||
/*! stylize.css v1.0.0 | License MIT | https://github.com/vasanthv/stylize.css */
|
||||
:root{
|
||||
--text: #333333;
|
||||
--text-med: #888888;
|
||||
--text-light: #cccccc;
|
||||
--text-lighter: #eeeeee;
|
||||
--blue: #3498db;
|
||||
--dark-blue: #2980b9;
|
||||
--yellow: #ffeaa7;
|
||||
--red: #c0392b;
|
||||
--border-radius: 3px;
|
||||
}
|
||||
|
||||
body{
|
||||
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; /* To use the system default font. */
|
||||
line-height: 1.5;
|
||||
font-size: 1em;
|
||||
color:var(--text);
|
||||
margin: 10px;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
/* Headings */
|
||||
h1{
|
||||
font-size: 2em; /* h1 inside section is treated different in some browsers */
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
h2{
|
||||
font-size: 1.5em;
|
||||
margin: 0.83em 0;
|
||||
}
|
||||
h3{
|
||||
font-size: 1.17em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
h4{
|
||||
font-size: 1em;
|
||||
margin: 1.17em 0;
|
||||
}
|
||||
h5{
|
||||
font-size: 0.83em;
|
||||
margin: 1.5em 0;
|
||||
}
|
||||
h6{
|
||||
font-size: 0.67em;
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
||||
/* Links */
|
||||
a{
|
||||
color:var(--blue);
|
||||
background-color: transparent;
|
||||
}
|
||||
a:visited{
|
||||
color:var(--dark-blue);
|
||||
}
|
||||
|
||||
/* Navigation Links*/
|
||||
nav{
|
||||
background-color: var(--text-lighter);
|
||||
padding: 1em;
|
||||
margin:-10px;
|
||||
}
|
||||
nav a{
|
||||
padding:0.5em;
|
||||
border-radius: var(--border-radius);
|
||||
text-decoration: none;
|
||||
}
|
||||
nav a:hover{
|
||||
background-color: var(--text-light);
|
||||
color: var(--text)
|
||||
}
|
||||
|
||||
/* Horizontal Line */
|
||||
hr{
|
||||
border: 1px solid var(--text-med);
|
||||
border-bottom: 0px;
|
||||
height:0px;
|
||||
}
|
||||
|
||||
/* Text formatting tags */
|
||||
p{
|
||||
margin:1em 0;
|
||||
}
|
||||
mark{
|
||||
background-color: var(--yellow);
|
||||
color:#333333;
|
||||
}
|
||||
small{
|
||||
font-size: 80%;
|
||||
}
|
||||
sub,
|
||||
sup{
|
||||
font-size: 75%;
|
||||
}
|
||||
|
||||
/* Quotation and Citation tags*/
|
||||
blockquote{
|
||||
border-left: 4px solid var(--text-light);
|
||||
margin:1em 0;
|
||||
padding:0.6em 1em;
|
||||
}
|
||||
pre{
|
||||
font-family: monospace;
|
||||
border:1px solid var(--text-light);
|
||||
background-color: var(--text-lighter);
|
||||
padding: 0.8em;
|
||||
border-radius: var(--border-radius);
|
||||
font-size: 1em;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
samp{
|
||||
font-family: monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
code,
|
||||
kbd{
|
||||
border-radius: var(--border-radius);
|
||||
padding:0px 2px;
|
||||
}
|
||||
code{
|
||||
border:1px solid var(--text-light);
|
||||
background-color: var(--text-lighter);
|
||||
color:var(--red);
|
||||
}
|
||||
kbd{
|
||||
border:1px solid var(--text);
|
||||
background-color: var(--text);
|
||||
color:var(--text-lighter);
|
||||
}
|
||||
|
||||
/* List items */
|
||||
ul, ol{
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
/* Form elements */
|
||||
|
||||
fieldset{
|
||||
border: 1px solid var(--text);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
select {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance : none;
|
||||
appearance : none;
|
||||
background: transparent;
|
||||
background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M00h24v24H0z' fill='none'/></svg>");
|
||||
background-repeat: no-repeat;
|
||||
background-position-x: 100%;
|
||||
background-position-y: 50%;
|
||||
}
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea,
|
||||
a[role="button"] {
|
||||
font-family: inherit;
|
||||
font-size: 100%;
|
||||
line-height: 1.5;
|
||||
margin: 0;
|
||||
padding: 0.33em;
|
||||
border: 1px solid var(--text-light);
|
||||
border-radius: var(--border-radius);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
input[type="checkbox"],
|
||||
input[type="radio"]{
|
||||
border:none;
|
||||
border:0;
|
||||
}
|
||||
|
||||
button,
|
||||
input[type="button"],
|
||||
input[type="submit"],
|
||||
a[role="button"] {
|
||||
padding: 0.33em 0.66em;
|
||||
cursor: pointer;
|
||||
background-color: var(--text-lighter);
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
}
|
||||
button:hover,
|
||||
input[type="button"]:hover,
|
||||
input[type="submit"]:hover,
|
||||
a[role="button"]:hover {
|
||||
background-color: var(--text-light);
|
||||
}
|
||||
a[role="button"]{
|
||||
padding:0.5em 0.66em;
|
||||
}
|
||||
button:disabled,
|
||||
input[type="button"]:disabled,
|
||||
input[type="submit"]:disabled,
|
||||
a[role="button"]:disabled {
|
||||
background-color: var(--text-lighter);
|
||||
color: var(--text-light);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
/* Progress Bar */
|
||||
|
||||
progress[value] {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
vertical-align: middle;
|
||||
border: none;
|
||||
width: 15em;
|
||||
height: 0.75em;
|
||||
background-color: var(--text-light);
|
||||
color: var(--blue);
|
||||
}
|
||||
progress[value]::-webkit-progress-bar {
|
||||
background-color: var(--text-light);
|
||||
}
|
||||
progress[value]::-webkit-progress-value{
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
/* Table Elements */
|
||||
table{
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table,
|
||||
table th,
|
||||
table td {
|
||||
border-bottom: 1px solid var(--text-light);
|
||||
padding:0.33em 0.66em;
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
}
|
||||
table[border="1"],
|
||||
table[border="1"] th,
|
||||
table[border="1"] td {
|
||||
border: 1px solid var(--text-light);
|
||||
}
|
||||
|
||||
/* Utility classes */
|
||||
.left{
|
||||
float: left;
|
||||
}
|
||||
.right{
|
||||
float: right;
|
||||
}
|
||||
.center{
|
||||
text-align: center;
|
||||
}
|
||||
.clear{
|
||||
clear: both;
|
||||
}
|
||||
.hide{
|
||||
display: none;
|
||||
}
|
||||
.spacer{
|
||||
display: block;
|
||||
height:1em;
|
||||
border:none;
|
||||
clear: both;
|
||||
}
|
||||
.wrap{
|
||||
width: 100%;
|
||||
max-width: 40em;
|
||||
margin: auto;
|
||||
}
|
||||
.reset{
|
||||
font: inherit;
|
||||
font-size: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
ol.reset, ul.reset {
|
||||
list-style: none;
|
||||
}
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,141 @@
|
||||
/* Reset */
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Variables */
|
||||
:root {
|
||||
--desktop-font-size: 1.3rem/1.5;
|
||||
--mobile-font-size: 1.1rem/1.4;
|
||||
--text-color: #2d2d2d;
|
||||
--link-color: blue;
|
||||
--primary-color: lightsteelblue;
|
||||
--secondary-color: aliceblue;
|
||||
--tertiary-color: whitesmoke;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* Typography */
|
||||
body {
|
||||
color: var(--text-color);
|
||||
font: var(--desktop-font-size) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto, Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol";
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6,p,blockquote,dl,img,figure {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
h1,h2,h3,h4,h5,h6 { font-weight: bold; }
|
||||
h1 { font-size: 200%; }
|
||||
h2 { font-size: 150%; }
|
||||
h3 { font-size: 120%; }
|
||||
h4,h5,h6 { font-size: 100%; }
|
||||
h5, h6 { text-transform: uppercase; }
|
||||
|
||||
header h1 { border-bottom: 1px solid; }
|
||||
|
||||
p { margin: 2rem 0; }
|
||||
|
||||
a,a:visited { color: var(--link-color); }
|
||||
|
||||
strong, time, b { font-weight: bold; }
|
||||
em, dfn, i { font-style: italic; }
|
||||
sub { font-size: 60%; vertical-align: bottom; }
|
||||
small { font-size: 80%; }
|
||||
|
||||
blockquote, q {
|
||||
background: var(--secondary-color);
|
||||
border-left: 10px solid var(--primary-color);
|
||||
font-family: "Georgia", serif;
|
||||
padding: 1rem;
|
||||
}
|
||||
blockquote p:first-child { margin-top: 0; }
|
||||
cite {
|
||||
font-family: "Georgia", serif;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
kbd,code,samp,pre,var { font-family: monospace; font-weight: bold; }
|
||||
code, pre {
|
||||
background: var(--tertiary-color);
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
code pre , pre code { padding: 0; }
|
||||
|
||||
|
||||
|
||||
/* Elements */
|
||||
hr {
|
||||
background: var(--text-color);
|
||||
border: 0;
|
||||
height: 1px;
|
||||
margin: 4rem 0;
|
||||
}
|
||||
|
||||
img { max-width: 100%; }
|
||||
|
||||
figure {
|
||||
border: 1px solid var(--primary-color);
|
||||
display: inline-block;
|
||||
padding: 1rem;
|
||||
width: auto;
|
||||
}
|
||||
figure img { margin: 0; }
|
||||
figure figcaption { font-size: 80%; }
|
||||
|
||||
ul, ol { margin: 2rem 0; padding: 0 0 0 4rem; }
|
||||
|
||||
dl dd { padding-left: 2rem; }
|
||||
|
||||
table {
|
||||
border: 1px solid var(--primary-color);
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
table caption { margin: 2rem 0; }
|
||||
table thead { text-align: center; }
|
||||
table tbody { text-align: right; }
|
||||
table tr { border-bottom: 1px solid var(--primary-color); }
|
||||
table tbody tr:nth-child(even) { background: var(--tertiary-color); }
|
||||
table th { background: var(--secondary-color); font-weight: bold; }
|
||||
table th, table td { padding: 1rem; }
|
||||
table th:not(last-of-type), table td:not(last-of-type) { border-right: 1px solid var(--primary-color); }
|
||||
|
||||
input { border: 1px solid var(--text-color); padding: 0.8rem; }
|
||||
input:focus, input:active { background-color: var(--secondary-color); border-color: var(--link-color); }
|
||||
|
||||
|
||||
|
||||
/* Mobile Styling */
|
||||
@media screen and (max-width: 50rem) {
|
||||
body {
|
||||
font: var(--mobile-font-size) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto, Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol"
|
||||
}
|
||||
table { table-layout: auto; }
|
||||
}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,571 @@
|
||||
/**
|
||||
* Light-themed version:
|
||||
* uses light theme by default but switches to dark theme
|
||||
* if a system-wide theme preference is set on the user's device.
|
||||
*
|
||||
* Variables will remain uncompiled so the theme can update dynamically
|
||||
* at runtime in the browser.
|
||||
*/
|
||||
|
||||
:root {
|
||||
--background-body: #ffffff;
|
||||
--background: #efefef;
|
||||
--background-alt: #f7f7f7;
|
||||
|
||||
--selection: #9e9e9e;
|
||||
|
||||
--text-main: #363636;
|
||||
--text-bright: #000000;
|
||||
--text-muted: #999999;
|
||||
|
||||
--links: #0076d1;
|
||||
--focus: #0096bfab;
|
||||
--border: #dbdbdb;
|
||||
--code: #000000;
|
||||
|
||||
--animation-duration: 0.1s;
|
||||
--button-hover: #dddddd;
|
||||
|
||||
--scrollbar-thumb: rgb(213, 213, 213);
|
||||
--scrollbar-thumb-hover: rgb(196, 196, 196);
|
||||
|
||||
--form-placeholder: #949494;
|
||||
--form-text: #000000;
|
||||
|
||||
--variable: #39a33c;
|
||||
--highlight: #ffff00;
|
||||
|
||||
--select-arrow: url("data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='62.5' width='116.9' fill='%23161f27'%3E %3Cpath d='M115.3,1.6 C113.7,0 111.1,0 109.5,1.6 L58.5,52.7 L7.4,1.6 C5.8,0 3.2,0 1.6,1.6 C0,3.2 0,5.8 1.6,7.4 L55.5,61.3 C56.3,62.1 57.3,62.5 58.4,62.5 C59.4,62.5 60.5,62.1 61.3,61.3 L115.2,7.4 C116.9,5.8 116.9,3.2 115.3,1.6Z'/%3E %3C/svg%3E");
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--background-body: #202b38;
|
||||
--background: #161f27;
|
||||
--background-alt: #1a242f;
|
||||
|
||||
--selection: #161f27;
|
||||
|
||||
--text-main: #dbdbdb;
|
||||
--text-bright: #ffffff;
|
||||
--text-muted: #717880;
|
||||
|
||||
--links: #41adff;
|
||||
--focus: #0096bfab;
|
||||
--border: #dbdbdb;
|
||||
--code: #ffbe85;
|
||||
|
||||
--animation-duration: 0.1s;
|
||||
--button-hover: #324759;
|
||||
|
||||
--scrollbar-thumb: var(--button-hover);
|
||||
--scrollbar-thumb-hover: rgb(20, 20, 20);
|
||||
|
||||
--form-placeholder: #a9a9a9;
|
||||
--form-text: #ffffff;
|
||||
|
||||
--variable: #d941e2;
|
||||
--highlight: #efdb43;
|
||||
|
||||
--select-arrow: url("data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' height='62.5' width='116.9' fill='%23efefef'%3E %3Cpath d='M115.3,1.6 C113.7,0 111.1,0 109.5,1.6 L58.5,52.7 L7.4,1.6 C5.8,0 3.2,0 1.6,1.6 C0,3.2 0,5.8 1.6,7.4 L55.5,61.3 C56.3,62.1 57.3,62.5 58.4,62.5 C59.4,62.5 60.5,62.1 61.3,61.3 L115.2,7.4 C116.9,5.8 116.9,3.2 115.3,1.6Z'/%3E %3C/svg%3E");
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
|
||||
line-height: 1.4;
|
||||
|
||||
max-width: 800px;
|
||||
margin: 20px auto;
|
||||
padding: 0 10px;
|
||||
|
||||
color: var(--text-main);
|
||||
background: var(--background-body);
|
||||
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
button, input, textarea {
|
||||
transition: background-color var(--animation-duration) linear,
|
||||
border-color var(--animation-duration) linear,
|
||||
color var(--animation-duration) linear,
|
||||
box-shadow var(--animation-duration) linear,
|
||||
transform var(--animation-duration) ease;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.2em;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
strong {
|
||||
color: var(--text-bright);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
b,
|
||||
strong,
|
||||
th {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
q:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
q:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
blockquote , q{
|
||||
border-left: 4px solid var(--focus);
|
||||
margin: 1.5em 0em;
|
||||
padding: 0.5em 1em;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
blockquote > footer {
|
||||
font-style: normal;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
blockquote cite {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
address {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
a[href^='mailto']::before {
|
||||
content: '📧 ';
|
||||
}
|
||||
|
||||
a[href^='tel']::before {
|
||||
content: '📞 ';
|
||||
}
|
||||
|
||||
a[href^='sms']::before {
|
||||
content: '💬 ';
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: var(--highlight);
|
||||
border-radius: 2px;
|
||||
padding: 0px 2px 0px 2px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
button, select,
|
||||
input[type='submit'],
|
||||
input[type='button'],
|
||||
input[type='checkbox'],
|
||||
input[type='range'],
|
||||
input[type='radio'] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input:not([type='checkbox']):not([type='radio']),
|
||||
select {
|
||||
display: block;
|
||||
}
|
||||
|
||||
input,
|
||||
button,
|
||||
textarea,
|
||||
select {
|
||||
color: var(--form-text);
|
||||
background-color: var(--background);
|
||||
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
|
||||
margin-right: 6px;
|
||||
margin-bottom: 6px;
|
||||
padding: 10px;
|
||||
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
button,
|
||||
textarea {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
textarea {
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
select {
|
||||
background: var(--background) var(--select-arrow) calc(100% - 12px) 50% / 12px no-repeat;
|
||||
padding-right: 35px;
|
||||
}
|
||||
|
||||
select::-ms-expand {
|
||||
display: none;
|
||||
}
|
||||
|
||||
select[multiple] {
|
||||
padding-right: 10px;
|
||||
background-image: none;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
button,
|
||||
input[type='submit'],
|
||||
input[type='button'] {
|
||||
padding-right: 30px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
button:hover,
|
||||
input[type='submit']:hover,
|
||||
input[type='button']:hover {
|
||||
background: var(--button-hover);
|
||||
}
|
||||
|
||||
input:focus,
|
||||
select:focus,
|
||||
button:focus,
|
||||
textarea:focus {
|
||||
box-shadow: 0 0 0 2px var(--focus);
|
||||
}
|
||||
|
||||
input[type='checkbox'],
|
||||
input[type='radio'] {
|
||||
position: relative;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
input[type='radio'] {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
input[type='checkbox']:checked,
|
||||
input[type='radio']:checked {
|
||||
background: var(--button-hover);
|
||||
}
|
||||
|
||||
input[type='checkbox']:checked::before,
|
||||
input[type='radio']:checked::before {
|
||||
content: '•';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
input[type='checkbox']:checked::before {
|
||||
content: '✔';
|
||||
transform: translateY(-50%) translateY(0.5px) translateX(-6px);
|
||||
}
|
||||
|
||||
input[type='checkbox']:active,
|
||||
input[type='radio']:active,
|
||||
input[type='submit']:active,
|
||||
input[type='button']:active,
|
||||
input[type='range']:active,
|
||||
button:active {
|
||||
transform: translateY(2px);
|
||||
}
|
||||
|
||||
input:disabled,
|
||||
select:disabled,
|
||||
button:disabled,
|
||||
textarea:disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: var(--form-placeholder);
|
||||
}
|
||||
|
||||
::-moz-placeholder {
|
||||
color: var(--form-placeholder);
|
||||
}
|
||||
|
||||
::-ms-input-placeholder {
|
||||
color: var(--form-placeholder);
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
color: var(--form-placeholder);
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 1px var(--focus) solid;
|
||||
border-radius: 6px;
|
||||
margin: 0;
|
||||
margin-bottom: 6px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
legend {
|
||||
font-size: 0.9em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
input[type='range'] {
|
||||
margin: 10px 0;
|
||||
padding: 10px 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
input[type='range']:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input[type='range']::-webkit-slider-runnable-track {
|
||||
width: 100%;
|
||||
height: 9.5px;
|
||||
transition: 0.2s;
|
||||
background: var(--background);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
input[type='range']::-webkit-slider-thumb {
|
||||
box-shadow: 0px 1px 1px #000000, 0px 0px 1px #0d0d0d;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
background: var(--border);
|
||||
-webkit-appearance: none;
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
input[type='range']:focus::-webkit-slider-runnable-track {
|
||||
background: var(--background);
|
||||
}
|
||||
|
||||
input[type='range']::-moz-range-track {
|
||||
width: 100%;
|
||||
height: 9.5px;
|
||||
transition: 0.2s;
|
||||
background: var(--background);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
input[type='range']::-moz-range-thumb {
|
||||
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
background: var(--border);
|
||||
}
|
||||
|
||||
input[type='range']::-ms-track {
|
||||
width: 100%;
|
||||
height: 9.5px;
|
||||
background: transparent;
|
||||
border-color: transparent;
|
||||
border-width: 16px 0;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
input[type='range']::-ms-fill-lower {
|
||||
background: var(--background);
|
||||
border: 0.2px solid #010101;
|
||||
border-radius: 3px;
|
||||
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
|
||||
}
|
||||
|
||||
input[type='range']::-ms-fill-upper {
|
||||
background: var(--background);
|
||||
border: 0.2px solid #010101;
|
||||
border-radius: 3px;
|
||||
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
|
||||
}
|
||||
|
||||
input[type='range']::-ms-thumb {
|
||||
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
|
||||
border: 1px solid #000000;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 50%;
|
||||
background: var(--border);
|
||||
}
|
||||
|
||||
input[type='range']:focus::-ms-fill-lower {
|
||||
background: var(--background);
|
||||
}
|
||||
|
||||
input[type='range']:focus::-ms-fill-upper {
|
||||
background: var(--background);
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: var(--links);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
code, samp, time {
|
||||
background: var(--background);
|
||||
color: var(--code);
|
||||
padding: 2.5px 5px;
|
||||
border-radius: 6px;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
pre > code {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
var {
|
||||
color: var(--variable);
|
||||
font-style: normal;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
kbd {
|
||||
background: var(--background);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 2px;
|
||||
color: var(--text-main);
|
||||
padding: 2px 4px 2px 4px;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: none;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 6px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
thead {
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
tfoot {
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
|
||||
tbody tr:nth-child(even) {
|
||||
background-color: var(--background-alt);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--background);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--scrollbar-thumb);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: var(--scrollbar-thumb-hover);
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
background-color: var(--selection);
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: var(--selection);
|
||||
}
|
||||
|
||||
details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
background-color: var(--background-alt);
|
||||
padding: 10px 10px 0;
|
||||
margin: 1em 0;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
details[open] {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
details > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
details[open] summary {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
background-color: var(--background);
|
||||
padding: 10px;
|
||||
margin: -10px -10px 0;
|
||||
}
|
||||
|
||||
details > :not(summary) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
summary::-webkit-details-marker {
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
footer {
|
||||
border-top: 1px solid var(--background);
|
||||
padding-top: 10px;
|
||||
font-size: 0.8em;
|
||||
color: var(--text-muted);
|
||||
}
|
@ -0,0 +1,516 @@
|
||||
/**
|
||||
* Wing v1.0.0-beta
|
||||
* Copyright 2016-2018 Kabir Shah
|
||||
* Released under the MIT License
|
||||
* http://usewing.ml
|
||||
*/
|
||||
|
||||
/*=============================
|
||||
Base Styles
|
||||
=============================*/
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
line-height: 1.6;
|
||||
color: #111;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
font-family: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
}
|
||||
/*=============================
|
||||
Grid
|
||||
=============================*/
|
||||
.container {
|
||||
width: 80%;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.row {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.row:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.row .col {
|
||||
flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
}
|
||||
.row .col-1 {
|
||||
width: 8.333333333333332%;
|
||||
}
|
||||
.row .col-2 {
|
||||
width: 16.666666666666664%;
|
||||
}
|
||||
.row .col-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.row .col-4 {
|
||||
width: 33.33333333333333%;
|
||||
}
|
||||
.row .col-5 {
|
||||
width: 41.66666666666667%;
|
||||
}
|
||||
.row .col-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.row .col-7 {
|
||||
width: 58.333333333333336%;
|
||||
}
|
||||
.row .col-8 {
|
||||
width: 66.66666666666666%;
|
||||
}
|
||||
.row .col-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.row .col-10 {
|
||||
width: 83.33333333333334%;
|
||||
}
|
||||
.row .col-11 {
|
||||
width: 91.66666666666666%;
|
||||
}
|
||||
.row .col-12 {
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.row .col,
|
||||
.row [class^='col-'],
|
||||
.row [class*=" col-"] {
|
||||
flex-grow: 0;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
}
|
||||
/*=============================
|
||||
Typography
|
||||
=============================*/
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next", "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 500;
|
||||
}
|
||||
h1 {
|
||||
font-size: 37.009px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
h2 {
|
||||
font-size: 32.182px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
h3 {
|
||||
font-size: 27.984px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
h4 {
|
||||
font-size: 24.334px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
h5 {
|
||||
font-size: 21.16px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
h6 {
|
||||
font-size: 18.4px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
h1 {
|
||||
font-size: 33.311px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 29.479px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 26.088px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 23.086px;
|
||||
}
|
||||
h5 {
|
||||
font-size: 20.43px;
|
||||
}
|
||||
h6 {
|
||||
font-size: 18.08px;
|
||||
}
|
||||
}
|
||||
/*=============================
|
||||
Form
|
||||
=============================*/
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
input[type=email],
|
||||
input[type=search],
|
||||
input[type=number],
|
||||
input[type=file],
|
||||
input[type=tel],
|
||||
input[type=url],
|
||||
select,
|
||||
textarea {
|
||||
height: 45px;
|
||||
width: 100%;
|
||||
margin-bottom: 16px;
|
||||
padding: 16px;
|
||||
font-size: 16px;
|
||||
background: #f5f5f5;
|
||||
border: 1px solid #a7a7a7;
|
||||
border-radius: 2px;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
input[type=text]:hover,
|
||||
input[type=password]:hover,
|
||||
input[type=email]:hover,
|
||||
input[type=search]:hover,
|
||||
input[type=number]:hover,
|
||||
input[type=file]:hover,
|
||||
input[type=tel]:hover,
|
||||
input[type=url]:hover,
|
||||
select:hover,
|
||||
textarea:hover {
|
||||
border-color: #111;
|
||||
}
|
||||
input[type=text]:focus,
|
||||
input[type=password]:focus,
|
||||
input[type=email]:focus,
|
||||
input[type=search]:focus,
|
||||
input[type=number]:focus,
|
||||
input[type=file]:focus,
|
||||
input[type=tel]:focus,
|
||||
input[type=url]:focus,
|
||||
select:focus,
|
||||
textarea:focus {
|
||||
outline: none;
|
||||
border-color: #0062ff;
|
||||
}
|
||||
textarea {
|
||||
min-height: 70px;
|
||||
}
|
||||
/*=============================
|
||||
Button
|
||||
=============================*/
|
||||
button,
|
||||
.button,
|
||||
[type=submit] {
|
||||
height: 45px;
|
||||
margin-bottom: 16px;
|
||||
padding: 10px 30px;
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
color: #f5f5f5;
|
||||
font-size: 16px;
|
||||
background: #111;
|
||||
border: 1px solid #111;
|
||||
border-radius: 2px;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
button:hover,
|
||||
.button:hover,
|
||||
[type=submit]:hover,
|
||||
button:focus,
|
||||
.button:focus,
|
||||
[type=submit]:focus {
|
||||
opacity: 0.9;
|
||||
}
|
||||
button:active,
|
||||
.button:active,
|
||||
[type=submit]:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
button[disabled],
|
||||
.button[disabled],
|
||||
[type=submit][disabled] {
|
||||
opacity: 0.8;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
button.outline,
|
||||
.button.outline,
|
||||
[type=submit].outline {
|
||||
color: #111;
|
||||
background: none;
|
||||
}
|
||||
button.outline:hover,
|
||||
.button.outline:hover,
|
||||
[type=submit].outline:hover,
|
||||
button.outline:focus,
|
||||
.button.outline:focus,
|
||||
[type=submit].outline:focus {
|
||||
color: #f5f5f5;
|
||||
background: #111;
|
||||
}
|
||||
/*=============================
|
||||
Link
|
||||
=============================*/
|
||||
a {
|
||||
color: #0062ff;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
a:hover {
|
||||
cursor: pointer;
|
||||
color: #111;
|
||||
}
|
||||
/*=============================
|
||||
List
|
||||
=============================*/
|
||||
ul,
|
||||
ol {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
padding-left: 0;
|
||||
list-style-position: inside;
|
||||
}
|
||||
ul li,
|
||||
ol li {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
ul li:last-child,
|
||||
ol li:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
ul ul,
|
||||
ol ul,
|
||||
ul ol,
|
||||
ol ol {
|
||||
margin-left: 16px;
|
||||
}
|
||||
/*=============================
|
||||
Image
|
||||
=============================*/
|
||||
img {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
/*=============================
|
||||
Box
|
||||
=============================*/
|
||||
.box {
|
||||
margin-bottom: 16px;
|
||||
padding-top: 16px;
|
||||
padding-right: 16px;
|
||||
padding-left: 16px;
|
||||
border: 1px solid #a7a7a7;
|
||||
border-radius: 2px;
|
||||
}
|
||||
/*=============================
|
||||
Navigation
|
||||
=============================*/
|
||||
.nav {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-top: 16px;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
.nav .nav-item {
|
||||
margin-right: 16px;
|
||||
}
|
||||
.nav .nav-item:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
/*=============================
|
||||
Card
|
||||
=============================*/
|
||||
.card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 16px;
|
||||
border: 1px solid #a7a7a7;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.card .card-content {
|
||||
margin: 0;
|
||||
padding: 16px;
|
||||
}
|
||||
.card .card-image {
|
||||
display: block;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
}
|
||||
/*=============================
|
||||
Code
|
||||
=============================*/
|
||||
pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
pre code {
|
||||
display: block;
|
||||
padding: 16px;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
code {
|
||||
padding: 2px;
|
||||
white-space: nowrap;
|
||||
background: #e7e7e7;
|
||||
border: 1px solid #d7d7d7;
|
||||
border-radius: 2px;
|
||||
font-family: "Consolas", "Monaco", "Menlo", monospace;
|
||||
}
|
||||
/*=============================
|
||||
Divider
|
||||
=============================*/
|
||||
hr {
|
||||
border-width: 0.5px;
|
||||
border-color: #a7a7a7;
|
||||
}
|
||||
/*=============================
|
||||
Utilities
|
||||
=============================*/
|
||||
.position-relative {
|
||||
position: relative;
|
||||
}
|
||||
.position-absolute {
|
||||
position: absolute;
|
||||
}
|
||||
.position-fixed {
|
||||
position: fixed;
|
||||
}
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
.size-full-height {
|
||||
min-height: 100vh;
|
||||
}
|
||||
.size-full-width {
|
||||
width: 100%;
|
||||
}
|
||||
.size-full {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
.justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.align-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
.align-center {
|
||||
align-items: center;
|
||||
}
|
||||
.align-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
.direction-vertical {
|
||||
flex-direction: column;
|
||||
}
|
||||
.direction-horizontal {
|
||||
flex-direction: row;
|
||||
}
|
||||
.center {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.border-black {
|
||||
border: 1px solid #111;
|
||||
}
|
||||
.border-gray {
|
||||
border: 1px solid #a7a7a7;
|
||||
}
|
||||
.border-white {
|
||||
border: 1px solid #f5f5f5;
|
||||
}
|
||||
.border-blue {
|
||||
border: 1px solid #0062ff;
|
||||
}
|
||||
.border-red {
|
||||
border: 1px solid #ff1500;
|
||||
}
|
||||
.border-yellow {
|
||||
border: 1px solid #ffbf00;
|
||||
}
|
||||
.border-green {
|
||||
border: 1px solid #00b30f;
|
||||
}
|
||||
.border-rounded {
|
||||
border-radius: 2px;
|
||||
}
|
||||
.border-circle {
|
||||
border-radius: 2px;
|
||||
}
|
||||
.color-black {
|
||||
color: #111;
|
||||
}
|
||||
.color-gray {
|
||||
color: #a7a7a7;
|
||||
}
|
||||
.color-white {
|
||||
color: #f5f5f5;
|
||||
}
|
||||
.color-blue {
|
||||
color: #0062ff;
|
||||
}
|
||||
.color-red {
|
||||
color: #ff1500;
|
||||
}
|
||||
.color-yellow {
|
||||
color: #ffbf00;
|
||||
}
|
||||
.color-green {
|
||||
color: #00b30f;
|
||||
}
|
||||
.background-black {
|
||||
background-color: #111;
|
||||
}
|
||||
.background-gray {
|
||||
background-color: #a7a7a7;
|
||||
}
|
||||
.background-white {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.background-blue {
|
||||
background-color: #0062ff;
|
||||
}
|
||||
.background-red {
|
||||
background-color: #ff1500;
|
||||
}
|
||||
.background-yellow {
|
||||
background-color: #ffbf00;
|
||||
}
|
||||
.background-green {
|
||||
background-color: #00b30f;
|
||||
}
|
@ -0,0 +1,180 @@
|
||||
/*!
|
||||
* Writ v1.0.4
|
||||
*
|
||||
* Copyright © 2015, Curtis McEnroe <curtis@cmcenroe.me>
|
||||
*
|
||||
* https://cmcenroe.me/writ/LICENSE (ISC)
|
||||
*/
|
||||
|
||||
/* Fonts, sizes & vertical rhythm */
|
||||
|
||||
html {
|
||||
font-family: Palatino, Georgia, Lucida Bright, Book Antiqua, serif;
|
||||
font-size: 16px;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
code, pre, samp, kbd {
|
||||
font-family: Consolas, Liberation Mono, Menlo, Courier, monospace;
|
||||
font-size: 0.833rem;
|
||||
}
|
||||
|
||||
kbd { font-weight: bold; }
|
||||
h1, h2, h3, h4, h5, h6, th { font-weight: normal; }
|
||||
|
||||
/* Minor third */
|
||||
h1 { font-size: 2.488em; }
|
||||
h2 { font-size: 2.074em; }
|
||||
h3 { font-size: 1.728em; }
|
||||
h4 { font-size: 1.44em; }
|
||||
h5 { font-size: 1.2em; }
|
||||
h6 { font-size: 1em; }
|
||||
small { font-size: 0.833em; }
|
||||
|
||||
h1, h2, h3 { line-height: 3rem; }
|
||||
|
||||
p, ul, ol, dl, table, blockquote, pre, h1, h2, h3, h4, h5, h6 {
|
||||
margin: 1.5rem 0 0;
|
||||
}
|
||||
ul ul, ol ol, ul ol, ol ul { margin: 0; }
|
||||
|
||||
hr {
|
||||
margin: 0;
|
||||
border: none;
|
||||
padding: 1.5rem 0 0;
|
||||
}
|
||||
|
||||
/* Accounting for borders */
|
||||
table {
|
||||
line-height: calc(1.5rem - 1px);
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
pre {
|
||||
margin-top: calc(1.5rem - 1px);
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
/* Colors */
|
||||
|
||||
body { color: #222; }
|
||||
code, pre, samp, kbd { color: #111; }
|
||||
a, header nav a:visited, a code { color: #00e; }
|
||||
a:visited, a:visited code { color: #60b; }
|
||||
mark { color: inherit; }
|
||||
|
||||
code, pre, samp, thead, tfoot { background-color: rgba(0, 0, 0, 0.05); }
|
||||
mark { background-color: #fe0; }
|
||||
|
||||
main aside, blockquote, ins { border: solid rgba(0, 0, 0, 0.05); }
|
||||
pre, code, samp { border: solid rgba(0, 0, 0, 0.1); }
|
||||
th, td { border: solid #dbdbdb; }
|
||||
|
||||
/* Layout */
|
||||
|
||||
body { margin: 1.5rem 1ch; }
|
||||
|
||||
body > header { text-align: center; }
|
||||
|
||||
main, body > footer {
|
||||
display: block; /* Just in case */
|
||||
max-width: 78ch;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
main figure, main aside {
|
||||
float: right;
|
||||
margin: 1.5rem 0 0 1ch;
|
||||
}
|
||||
|
||||
main aside {
|
||||
max-width: 26ch;
|
||||
border-width: 0 0 0 0.5ch;
|
||||
padding: 0 0 0 0.5ch;
|
||||
}
|
||||
|
||||
/* Copy blocks */
|
||||
|
||||
blockquote {
|
||||
margin-right: 3ch;
|
||||
margin-left: 1.5ch;
|
||||
border-width: 0 0 0 0.5ch;
|
||||
padding: 0 0 0 1ch;
|
||||
}
|
||||
|
||||
pre {
|
||||
border-width: 1px;
|
||||
border-radius: 2px;
|
||||
padding: 0 0.5ch;
|
||||
overflow-x: auto;
|
||||
}
|
||||
pre code {
|
||||
border: none;
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
img { max-width: 100%; }
|
||||
|
||||
/* Lists */
|
||||
|
||||
ul, ol, dd { padding: 0 0 0 3ch; }
|
||||
dd { margin: 0; }
|
||||
|
||||
ul > li { list-style-type: disc; }
|
||||
li ul > li { list-style-type: circle; }
|
||||
li li ul > li { list-style-type: square; }
|
||||
|
||||
ol > li { list-style-type: decimal; }
|
||||
li ol > li { list-style-type: lower-roman; }
|
||||
li li ol > li { list-style-type: lower-alpha; }
|
||||
|
||||
nav ul {
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
nav ul li {
|
||||
display: inline;
|
||||
padding-left: 1ch;
|
||||
white-space: nowrap;
|
||||
}
|
||||
nav ul li:first-child { padding-left: 0; }
|
||||
|
||||
/* Tables */
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
th, td {
|
||||
border-width: 1px;
|
||||
padding: 0 0.5ch;
|
||||
}
|
||||
|
||||
/* Copy inline */
|
||||
|
||||
a { text-decoration: none; }
|
||||
|
||||
sup, sub {
|
||||
font-size: 0.75em;
|
||||
line-height: 1em;
|
||||
}
|
||||
|
||||
ins {
|
||||
border-width: 1px;
|
||||
padding: 1px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
code, samp {
|
||||
border-width: 1px;
|
||||
border-radius: 2px;
|
||||
padding: 0.1em 0.2em;
|
||||
white-space: nowrap;
|
||||
}
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue