13 height: device-height;
20 $font-family: 'Droid Sans', 'Lucida Bright', Georgia, 'Hoefler Text', 'Baskerville Old Face', Garamond, 'Times New Roman', serif;
21 $font-family-mono: 'Droid Sans Mono', 'Lucida Console', 'Lucida Sans Typewriter', monaco, 'Bitstream Vera Sans Mono', monospace;
22 $font-family-header: Yellowtail, 'Brush Script MT', cursive;
23 $base-font-pct: 1.45*100%;
32 @import "_include-media";
36 $base03: rgb( 0, 43, 54);
37 $base02: rgb( 7, 54, 66);
38 $base04: rgb( 38, 66, 78);
39 $base01: rgb( 88, 110, 117);
40 $base00: rgb(101, 123, 131);
41 $base0: rgb(131, 148, 150);
42 $base1: rgb(147, 161, 161);
43 $base2: rgb(238, 232, 213);
44 $base3: rgb(253, 246, 227);
45 $yellow: rgb(181, 137, 0);
46 $orange: rgb(255, 137, 0);
47 $red: rgb(220, 43, 39);
48 $magenta: rgb(211, 54, 130);
49 $violet: rgb(108, 113, 196);
50 $blue: rgb( 38, 139, 210);
51 $cyan: rgb( 42, 161, 152);
52 $green: rgb( 58, 226, 92);
53 $black: rgb( 0, 0, 0);
55 // for highlight below
57 //$base01: rgb(159,159,159);
61 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 {
66 vertical-align: baseline;
67 -moz-box-sizing: border-box;
68 -webkit-box-sizing: border-box;
69 box-sizing: border-box;
72 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
101 background-color: $base03;
104 size: $base-font-pct;
105 size: $base-font-rel;
106 family: $font-family;
107 variant-ligatures: common-ligatures;
110 smoothing: antialiased;
112 text-rendering: optimizeLegibility;
120 @each $hlev, $fspx, $fsrel in (h1, 17, 2.7),
133 text-decoration: none;
134 padding-bottom: 0.125em;
136 border-color: $base02;
138 &:active, &:visited {
139 border-color: $base02;
140 text-decoration: none;
141 padding-bottom: 0.125em;
145 background-color: $base02;
146 border-color: $base02;
151 border-bottom: 0.0625em solid $base01;
157 &:visited, &:active {
162 background-color: $base02;
163 border-color: $base02;
174 padding: 0 0 1.125em 1.875em;
175 padding: 0 0 1.5vw 1.7vmax;
213 background-color: $base04;
219 margin: 0 0 0.625em 0;
237 size: (0.85 * $base-font-rel)em;
243 vertical-align: super;
252 margin: 1.375em 1.375em;
254 border-left: 0.125em solid $black;
256 size: 1.2 * $base-font-rel;
260 line-height: 1.5 * $base-font-rel;
266 letter-spacing: 0.0625em;
267 border-bottom: 0.0625em dashed;
274 // While the BC is the same as the one in body, and as such inherited,
275 // not setting it here means the scrolling content is visible behind header.
276 // Setting it --> it hides the scrolling content.
277 background-color: $base03;
279 family: $font-family-header;
303 @include media('all', "height<=500px") {
306 margin-left: initial;
308 @include media('all', '<tablet' ) {
311 margin-left: initial;
317 margin: 3.125em auto 1.25em auto;
320 top: 0.062em solid $base02;
323 @include media('all', '<tablet' ) {
329 display: inline-block;
331 display: inline-block;
341 @include media('all', '<tablet' ) {
348 @include media('all', "height<=500px") {
374 background-color: $base02;
381 @include media('all', '<tablet') {
409 size: 1.24 * $base-font-pct;
410 size: 1.8 * $base-font-rel;
427 margin: 0 auto 1em auto;
432 size: 0.9 * $base-font-pct;
433 size: 0.9 * $base-font-rel;
447 margin: 0 0 1em 1 * $base-font-rel;
453 margin: 0 auto 1em auto;